platform/lms-adm-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: render signup terms and privacy policy as Markdown

Browse Source
This commit is contained in:
chyoo
2026-09-08 15:26:56 +09:00
parent a88c82fd96
commit 57923d7463
3 changed files with 1483 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+1469 -2
View File
File diff suppressed because it is too large Load Diff
package.json
+2
View File
@@ -17,7 +17,9 @@
"monaco-editor": "^0.56.0",
"react": "^19.1.0",
"react-dom": "^19.1.0",
"react-markdown": "^10.1.0",
"react-router-dom": "^7.18.0",
"remark-gfm": "^4.0.1",
"socket.io-client": "^4.8.3",
"tailwindcss": "^4.3.0",
"vite": "^6.3.5"
src/pages/login/LoginPage.tsx
+12 -1
View File
@@ -1,5 +1,7 @@
import { useEffect, useState, type FormEvent } from 'react';
import { CheckCircle2, Eye, EyeOff } from 'lucide-react';
import ReactMarkdown from 'react-markdown';
import remarkGfm from 'remark-gfm';
import { BrandMark } from '../../components/BrandMark';
import { loginInstructor } from '../../lib/auth';
import type { AuthSession } from '../../types/auth';
@@ -325,7 +327,16 @@ function InstructorSignupForm({ onCancel, onComplete }: InstructorSignupFormProp
{termModal ? <div className="fixed inset-0 z-50 flex items-center justify-center bg-[#111827]/45 px-4 backdrop-blur-sm" role="dialog" aria-modal="true" aria-label={termModal.title}>
<div className="flex max-h-[78vh] w-full max-w-2xl flex-col overflow-hidden rounded-lg border border-[#d8dde8] bg-white shadow-2xl">
<div className="flex items-center justify-between border-b border-[#e3e7ef] px-5 py-4"><h3 className="text-[15px] font-extrabold text-[#303747]">{termModal.title}</h3><button className="text-[20px] leading-none text-[#64748b] hover:text-[#111827]" type="button" onClick={() => setTermModal(null)} aria-label="닫기">×</button></div>
<div className="overflow-y-auto whitespace-pre-wrap px-5 py-4 text-[13px] leading-6 text-[#4b5563]">{termModal.loading ? '불러오는 중...' : termModal.body}</div>
<div className="min-h-0 overflow-y-auto px-5 py-4 text-[13px] leading-6 text-[#4b5563]">
{termModal.loading ? '불러오는 중...' : (
<div className="break-words [overflow-wrap:anywhere] [&_h1]:mb-4 [&_h1]:text-xl [&_h1]:font-bold [&_h2]:mb-3 [&_h2]:mt-6 [&_h2]:text-lg [&_h2]:font-bold [&_h3]:mb-2 [&_h3]:mt-4 [&_h3]:text-base [&_h3]:font-bold [&_p]:my-3 [&_ul]:my-3 [&_ul]:list-disc [&_ul]:pl-5 [&_ol]:my-3 [&_ol]:list-decimal [&_ol]:pl-5 [&_li]:my-1 [&_blockquote]:border-l-4 [&_blockquote]:border-[#d8dde8] [&_blockquote]:pl-4 [&_hr]:my-5 [&_hr]:border-[#d8dde8] [&_a]:text-[#2563eb] [&_a]:underline [&_pre]:overflow-x-auto [&_pre]:rounded [&_pre]:bg-[#f1f5f9] [&_pre]:p-3 [&_th]:border [&_th]:border-[#d8dde8] [&_th]:bg-[#f1f5f9] [&_th]:px-3 [&_th]:py-2 [&_td]:border [&_td]:border-[#d8dde8] [&_td]:px-3 [&_td]:py-2">
<ReactMarkdown remarkPlugins={[remarkGfm]} skipHtml components={{
a: ({ node: _node, ...props }) => <a {...props} target="_blank" rel="noopener noreferrer" />,
table: ({ node: _node, ...props }) => <div className="my-3 overflow-x-auto"><table {...props} className="w-full border-collapse text-left" /></div>,
}}>{termModal.body}</ReactMarkdown>
</div>
)}
</div>
</div>
</div> : null}
</>