牌位版面設計

web/admin/item/css/styles.css

@@ -0,0 +1,61 @@
+/* You can add global styles to this file, and also import other style files */
+
+/*@import "bootstrap/scss/bootstrap";
+@import "bootstrap-icons/font/bootstrap-icons";*/
+
+// 3. 自定義全域樣式 (讓 Sidebar 滿版)
+html, body {
+  height: 100%;
+  // 修正捲軸在 Dark mode 的顏色
+  &[data-bs-theme="dark"] {
+    color-scheme: dark;
+  }
+}
+
+// Sidebar 固定寬度設定 (可依需求調整)
+.sidebar {
+  width: 250px;
+  min-height: 100vh;
+  transition: all 0.3s;
+
+  @include media-breakpoint-down(md) {
+    width: 100%; // 手機版變成全寬或隱藏
+    min-height: auto;
+  }
+}
+
+.main-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  overflow-y: auto; // 內容區域獨立捲動
+}
+
+input[type="checkbox"]{
+
+  /* 1. Remove native styles */
+  -webkit-appearance: none;
+  appearance: none;
+
+  width: 25px !important;
+  height: 25px !important;
+
+  border: 2px solid #555; /* Your custom border */
+  border-radius: 4px;      /* Optional: rounded corners */
+  outline: none;
+  cursor: pointer;
+
+  /* Layout for the checkmark */
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: 8px;
+  vertical-align: middle;
+  background-color: white;
+  transition: all 0.2s ease;
+}
+
+$toast-max-width: 500px;
+$toast-font-size: 1.5rem;
+