feat: add LMS web client

2026-07-15 13:41:00 +09:00
commit 05ff2644e8
308 changed files with 487923 additions and 0 deletions
@@ -0,0 +1,51 @@
+import { X } from 'lucide-react'
+import type React from 'react'
+
+type InstructorStudioNoticeModalProps = {
+  sidebarCollapsed: boolean
+  onClose: () => void
+}
+
+export default function InstructorStudioNoticeModal({
+  sidebarCollapsed,
+  onClose
+}: InstructorStudioNoticeModalProps): React.JSX.Element {
+  return (
+    <div
+      className={[
+        'fixed bottom-0 right-0 top-[38px] z-[70] grid place-items-center bg-[#080a10]/40 p-6 backdrop-blur-[3px]',
+        sidebarCollapsed ? 'left-[68px]' : 'left-[240px]'
+      ].join(' ')}
+    >
+      <section className="w-full max-w-[430px] overflow-hidden rounded-xl border border-[#dfe3ed] bg-white shadow-[0_28px_80px_rgba(8,10,16,0.30)]">
+        <header className="flex items-start justify-between gap-4 border-b border-[#e5e8ef] px-6 pb-4 pt-5">
+          <div>
+            <span className="text-[12px] font-medium text-[#6f4df6]">개발 스튜디오</span>
+            <h2 className="mt-1 text-[21px] font-bold leading-tight text-[#111520]">강사 계정은 이용할 수 없습니다</h2>
+          </div>
+          <button
+            type="button"
+            aria-label="닫기"
+            onClick={onClose}
+            className="grid h-8 w-8 shrink-0 cursor-pointer place-items-center rounded-md text-[#697386] transition hover:bg-[#f0f2f7] hover:text-[#111520]"
+          >
+            <X size={17} />
+          </button>
+        </header>
+
+        <div className="px-6 py-5">
+          <p className="text-[14px] font-medium leading-relaxed text-[#4f596b]">
+            개발 스튜디오는 수강생 실습용 화면입니다. 강사 계정은 강사포털에서 수강생 관리, 채팅, 학습 진행 현황을 확인해 주세요.
+          </p>
+          <button
+            type="button"
+            onClick={onClose}
+            className="mt-5 flex h-10 w-full cursor-pointer items-center justify-center rounded-md bg-[#714ef6] text-[14px] font-bold text-white transition hover:bg-[#6040df]"
+          >
+            확인
+          </button>
+        </div>
+      </section>
+    </div>
+  )
+}