New: フロントエンドにL.jsを導入 / Fix: 初期設定前にserver-infoが利用できない問題 / Feat: manifest.json / Chg: isOwnerをisAdminに戻しました / Fix: UserRepositoryのschemaの記述順序を統一 / Feat: server-infoにサーバー名とサーバー説明を記載 / New: manifest.jsonをフロントエンドで読み込み / New: スクロールバーのスタイルを指定 / New: フォントを指定 / New: line-heightを指定 / New: tab-sizeを指定 / New: <label>のwidthをfit-contentとして指定 / New: CSS変数にアクセントカラーなどを追加 / New: <a>のcolorをaccent-colorとして指定 / Feat: ページのレイアウトを作成 / Feat: 各ページのヘッダーでタイトルを表示 / Feat: スマホUI / Feat: セットアップウィザードをフロントエンドに実装 / Feat: NotFoundページ / New: Button,Input,InputPassword,Toggle,Textareaコンポーネントを作成 / Feat: modal機能 / Chg: server-infoをrefに変更 / Fix: L.jsのsetup/initializationがsetup/initilizationになっていたtypoを修正

packages/frontend/src/global.css

@@ -1,13 +1,23 @@
+@import url("https://fonts.googleapis.com/css2?family=BIZ+UDPGothic&display=swap");
+
 :root {
   --bg-color: #ffffff;
+  --bg-sub-color: #f1f1f1;
   --text-color: #000000;
+  --text-sub-color: #595959;
   --border-color: #e0e0e0;
+  --error-color: #ff0000;
+  --success-color: #00ff00;
+  --accent-color: #3ad0a1;
+  --accent-in-text-color: #000000;
 }
 
 @media (prefers-color-scheme: dark) {
   :root {
     --bg-color: #1b1b1b;
+    --bg-sub-color: #252525;
     --text-color: #ffffff;
+    --text-sub-color: #a4a4a4;
     --border-color: #2c2c2c;
   }
 }
@@ -15,12 +25,45 @@
 * {
   margin: 0;
   padding: 0;
+  scrollbar-width: thin;
+  scrollbar-color: var(--accent-color) var(--border-color);
+}
+
+::selection {
+  background-color: var(--accent-color);
+  color: var(--accent-in-text-color);
 }
 
 html, body {
   width: 100dvw;
   height: 100dvh;
   font-size: 14px;
+  font-family: "BIZ UDPGothic", sans-serif;
+  line-height: 1.5rem;
+  tab-size: 2;
   background-color: var(--bg-color);
   color: var(--text-color);
 }
+
+a {
+  color: var(--accent-color);
+}
+
+label {
+  width: fit-content;
+}
+
+.title {
+  font-size: 1.6rem;
+  font-weight: bold;
+}
+
+.modal {
+  background-color: var(--bg-color);
+  border-radius: 2rem;
+  padding: 3rem 6rem;
+  width: fit-content;
+  height: fit-content;
+  max-width: 90dvw;
+  max-height: 90dvh;
+}