From 07786f8eb003c0e19980e77e4c40fe537b61ad42 Mon Sep 17 00:00:00 2001 From: bisnsh Date: Sat, 7 Feb 2026 22:27:31 +0800 Subject: [PATCH] first initial commit --- assets/css/global.css | 299 +++ assets/css/index.css | 4337 +++++++++++++++++++++++++++++++++++++ assets/css/input.css | 1 + assets/css/post.css | 153 ++ assets/css/screen.css | 13 + assets/js/carousel.js | 79 + assets/js/mobile-menu.js | 150 ++ assets/js/share.js | 87 + assets/js/timer.js | 57 + custom-profile.hbs | 83 + default.hbs | 157 ++ index.hbs | 219 ++ package.json | 12 + partials/footer.hbs | 31 + partials/navigation.hbs | 20 + partials/teacher-card.hbs | 78 + post.hbs | 145 ++ tag.hbs | 114 + 18 files changed, 6035 insertions(+) create mode 100644 assets/css/global.css create mode 100644 assets/css/index.css create mode 100644 assets/css/input.css create mode 100644 assets/css/post.css create mode 100644 assets/css/screen.css create mode 100644 assets/js/carousel.js create mode 100644 assets/js/mobile-menu.js create mode 100644 assets/js/share.js create mode 100644 assets/js/timer.js create mode 100644 custom-profile.hbs create mode 100644 default.hbs create mode 100644 index.hbs create mode 100644 package.json create mode 100644 partials/footer.hbs create mode 100644 partials/navigation.hbs create mode 100644 partials/teacher-card.hbs create mode 100644 post.hbs create mode 100644 tag.hbs diff --git a/assets/css/global.css b/assets/css/global.css new file mode 100644 index 0000000..c84d06c --- /dev/null +++ b/assets/css/global.css @@ -0,0 +1,299 @@ +:root { + /* 定义一个衬线字体栈 */ + --font-serif-zh: "SimSun","Noto Serif SC", "Georgia", "STSong", "Songti SC", serif; +} + +body { + /* 全站应用 */ + font-family: var(--font-serif-zh); + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + color: #262626; /* 衬线体配合深灰色阅读感更好 */ +} + +/* ========== 强制隐藏模板容器 ========== */ +#mobile-drawer-template { + display: none !important; + visibility: hidden !important; + position: absolute !important; + pointer-events: none !important; +} + +/* ========== 桌面端导航样式 ========== */ +@media (min-width: 768px) { + /* 强制隐藏移动端元素 */ + #mobile-menu-trigger, + #mobile-sidebar-overlay, + #mobile-sidebar-overlay-active { + display: none !important; + } + + /* 桌面端导航居中 */ + nav .hidden.md\\:flex.items-center.justify-center nav, + nav .hidden.md\\:flex.items-center.justify-center .nav { + display: flex !important; + justify-content: center !important; + align-items: center !important; + gap: 2rem !important; + } + + nav .hidden.md\\:flex.items-center.justify-center ul { + display: flex !important; + flex-direction: row !important; + gap: 2rem !important; + list-style: none !important; + padding: 0 !important; + margin: 0 !important; + } + + nav .hidden.md\\:flex.items-center.justify-center li { + margin: 0 !important; + } + + nav .hidden.md\\:flex.items-center.justify-center a { + text-decoration: none !important; + color: #374151 !important; + font-weight: 500 !important; + font-size: 0.875rem !important; + transition: color 0.2s !important; + } + + nav .hidden.md\\:flex.items-center.justify-center a:hover { + color: #2563eb !important; + } +} + +/* ========== 移动端抽屉基础样式 ========== */ +#mobile-sidebar-overlay-active { + display: none; /* 默认隐藏，通过 JS 控制显示 */ +} + +/* ========== 抽屉导航网格布局 ========== */ +.mobile-nav-grid { + display: grid !important; + grid-template-columns: repeat(2, 1fr) !important; + gap: 0.75rem !important; +} + +.mobile-nav-grid nav, +.mobile-nav-grid .nav { + display: contents !important; +} + +.mobile-nav-grid ul { + display: contents !important; + list-style: none !important; + padding: 0 !important; + margin: 0 !important; +} + +.mobile-nav-grid li { + display: block !important; + margin: 0 !important; +} + +.mobile-nav-grid a { + display: flex !important; + align-items: center !important; + justify-content: center !important; + padding: 0.75rem !important; + border-radius: 0.5rem !important; + background-color: #f9fafb !important; + color: #4b5563 !important; + font-weight: 500 !important; + text-decoration: none !important; + border: 1px solid #e5e7eb !important; + transition: all 0.2s !important; + font-size: 0.875rem !important; + text-align: center !important; +} + +.mobile-nav-grid a:hover, +.mobile-nav-grid a:active { + background-color: #eff6ff !important; + color: #2563eb !important; + border-color: #3b82f6 !important; + transform: scale(0.95); +} + +/* ========== 动画和过渡 ========== */ +.drawer-backdrop { + transition: opacity 300ms ease-out; +} + +.drawer-panel { + transition: transform 300ms ease-out; +} + +/* ========== 通用优化 ========== */ +#mobile-menu-trigger { + cursor: pointer; + background: none; + border: none; +} + +/* 平滑滚动 */ +.drawer-panel { + overscroll-behavior: contain; + -webkit-overflow-scrolling: touch; +} + +/* 防止内容抖动 */ +body.drawer-open { + overflow: hidden !important; + position: fixed !important; + width: 100% !important; +} + +/* 确保抽屉在最顶层 */ +#mobile-sidebar-overlay-active { + z-index: 9999 !important; +} + +#welcome-ip-location-info b { + color: #2563eb; /* 对应 Tailwind 的 blue-600 */ + font-weight: 700; + } +/* 默认模糊状态 */ +#welcome-ip-location-info .ip-mask { + filter: blur(5px); + cursor: pointer; + transition: all 0.3s ease; + display: inline-block; + background-color: rgba(0, 0, 0, 0.05); + padding: 0 4px; + border-radius: 4px; + user-select: none; /* 防止未解锁前被选中复制 */ +} + +/* 鼠标悬停时轻微减少模糊（给予视觉反馈） */ +#welcome-ip-location-info .ip-mask:hover { + filter: blur(3px); + background-color: rgba(0, 0, 0, 0.08); +} + +/* 点击或被激活时完全显示 */ +#welcome-ip-location-info .ip-mask.unmask, +#welcome-ip-location-info .ip-mask:active { + filter: blur(0); + background-color: transparent; + user-select: auto; +} + +.site-footer { + padding: 60px 20px; + background: #f9f9f9; /* 浅灰背景，简洁干净 */ + color: #555; + font-size: 0.9rem; + border-top: 1px solid #eee; + margin-top: 80px; +} + +.footer-content { + max-width: 1000px; + margin: 0 auto; + display: grid; + grid-template-columns: 2fr 1fr 1fr; /* 三栏布局 */ + gap: 40px; +} + +.footer-column h3, .footer-column h4 { + color: #111; + margin-bottom: 15px; + font-size: 1.1rem; +} + +.footer-column p { line-height: 1.6; } + +/* 微信公众号悬浮交互 */ +.wechat-trigger { + color: #1a73e8; + cursor: pointer; + position: relative; + border-bottom: 1px dashed #1a73e8; +} + +/* 弹出层容器 */ +.wechat-qr { + display: none; + position: absolute; + bottom: 35px; + left: 50%; + transform: translateX(-50%); /* 配合 left: 50% 实现相对于文字水平居中 */ + background: white; + padding: 12px; + box-shadow: 0 4px 20px rgba(0,0,0,0.15); + border-radius: 8px; + z-index: 100; + + width: 140px; + text-align: center !important; + box-sizing: border-box; /* 确保 padding 不撑破宽度 */ +} + +/* 二维码图片 */ +.wechat-qr img { + width: 100% !important; + height: auto !important; + display: block; + margin: 0 auto 10px; /* 这里的 auto 确保图片在容器内水平居中 */ +} + +/* 下方的文字 */ +.wechat-qr p { + font-size: 12px; + color: #666; + margin: 0 !important; + padding: 0 !important; + display: block; + width: 100%; + text-align: center; /* 确保文字在 p 标签内居中 */ + line-height: 1.2; + white-space: nowrap; /* 避免文字太长换行导致视觉偏移 */ +} +.wechat-trigger:hover .wechat-qr { display: block; } + +/* 次级导航样式 */ +.footer-nav ul { list-style: none; padding: 0; } +.footer-nav ul li { margin-bottom: 8px; } +.footer-nav a { color: #555; text-decoration: none; } +.footer-nav a:hover { color: #1a73e8; } + +/* 移动端适配 */ +@media (max-width: 768px) { + .footer-content { + grid-template-columns: 1fr; + text-align: center; + } + .wechat-qr { left: 50%; } +} + +/* 确保整个头部在滚动时固定 */ +.site-header-container { + position: sticky !important; + top: 0 !important; + z-index: 1000 !important; + width: 100%; +} + +/* 公告栏样式优化 */ +.gh-announcement { + background-color: var(--ghost-accent-color, #3eb0ef); + color: #fff; + padding: 10px 24px; + text-align: center; + font-size: 0.9rem; + font-weight: 500; + line-height: 1.4; +} + +.gh-announcement a { + color: #fff; + text-decoration: underline; + font-weight: 700; +} + +/* 修复移动端抽屉层级，确保在 header 之上 */ +#mobile-sidebar-overlay { + z-index: 10001 !important; +} diff --git a/assets/css/index.css b/assets/css/index.css new file mode 100644 index 0000000..495b718 --- /dev/null +++ b/assets/css/index.css @@ -0,0 +1,4337 @@ +/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */ +@layer properties; +@layer theme, base, components, utilities; +@layer theme { + :root, :host { + --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', + 'Noto Color Emoji'; + --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif; + --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', + monospace; + --color-red-50: oklch(97.1% 0.013 17.38); + --color-red-100: oklch(93.6% 0.032 17.717); + --color-red-200: oklch(88.5% 0.062 18.334); + --color-red-300: oklch(80.8% 0.114 19.571); + --color-red-400: oklch(70.4% 0.191 22.216); + --color-red-500: oklch(63.7% 0.237 25.331); + --color-red-600: oklch(57.7% 0.245 27.325); + --color-red-700: oklch(50.5% 0.213 27.518); + --color-red-800: oklch(44.4% 0.177 26.899); + --color-red-900: oklch(39.6% 0.141 25.723); + --color-red-950: oklch(25.8% 0.092 26.042); + --color-orange-50: oklch(98% 0.016 73.684); + --color-orange-100: oklch(95.4% 0.038 75.164); + --color-orange-200: oklch(90.1% 0.076 70.697); + --color-orange-300: oklch(83.7% 0.128 66.29); + --color-orange-400: oklch(75% 0.183 55.934); + --color-orange-500: oklch(70.5% 0.213 47.604); + --color-orange-600: oklch(64.6% 0.222 41.116); + --color-orange-700: oklch(55.3% 0.195 38.402); + --color-orange-800: oklch(47% 0.157 37.304); + --color-orange-900: oklch(40.8% 0.123 38.172); + --color-orange-950: oklch(26.6% 0.079 36.259); + --color-amber-50: oklch(98.7% 0.022 95.277); + --color-amber-100: oklch(96.2% 0.059 95.617); + --color-amber-200: oklch(92.4% 0.12 95.746); + --color-amber-300: oklch(87.9% 0.169 91.605); + --color-amber-400: oklch(82.8% 0.189 84.429); + --color-amber-500: oklch(76.9% 0.188 70.08); + --color-amber-600: oklch(66.6% 0.179 58.318); + --color-amber-700: oklch(55.5% 0.163 48.998); + --color-amber-800: oklch(47.3% 0.137 46.201); + --color-amber-900: oklch(41.4% 0.112 45.904); + --color-amber-950: oklch(27.9% 0.077 45.635); + --color-yellow-50: oklch(98.7% 0.026 102.212); + --color-yellow-100: oklch(97.3% 0.071 103.193); + --color-yellow-200: oklch(94.5% 0.129 101.54); + --color-yellow-300: oklch(90.5% 0.182 98.111); + --color-yellow-400: oklch(85.2% 0.199 91.936); + --color-yellow-500: oklch(79.5% 0.184 86.047); + --color-yellow-600: oklch(68.1% 0.162 75.834); + --color-yellow-700: oklch(55.4% 0.135 66.442); + --color-yellow-800: oklch(47.6% 0.114 61.907); + --color-yellow-900: oklch(42.1% 0.095 57.708); + --color-yellow-950: oklch(28.6% 0.066 53.813); + --color-lime-50: oklch(98.6% 0.031 120.757); + --color-lime-100: oklch(96.7% 0.067 122.328); + --color-lime-200: oklch(93.8% 0.127 124.321); + --color-lime-300: oklch(89.7% 0.196 126.665); + --color-lime-400: oklch(84.1% 0.238 128.85); + --color-lime-500: oklch(76.8% 0.233 130.85); + --color-lime-600: oklch(64.8% 0.2 131.684); + --color-lime-700: oklch(53.2% 0.157 131.589); + --color-lime-800: oklch(45.3% 0.124 130.933); + --color-lime-900: oklch(40.5% 0.101 131.063); + --color-lime-950: oklch(27.4% 0.072 132.109); + --color-green-50: oklch(98.2% 0.018 155.826); + --color-green-100: oklch(96.2% 0.044 156.743); + --color-green-200: oklch(92.5% 0.084 155.995); + --color-green-300: oklch(87.1% 0.15 154.449); + --color-green-400: oklch(79.2% 0.209 151.711); + --color-green-500: oklch(72.3% 0.219 149.579); + --color-green-600: oklch(62.7% 0.194 149.214); + --color-green-700: oklch(52.7% 0.154 150.069); + --color-green-800: oklch(44.8% 0.119 151.328); + --color-green-900: oklch(39.3% 0.095 152.535); + --color-green-950: oklch(26.6% 0.065 152.934); + --color-emerald-50: oklch(97.9% 0.021 166.113); + --color-emerald-100: oklch(95% 0.052 163.051); + --color-emerald-200: oklch(90.5% 0.093 164.15); + --color-emerald-300: oklch(84.5% 0.143 164.978); + --color-emerald-400: oklch(76.5% 0.177 163.223); + --color-emerald-500: oklch(69.6% 0.17 162.48); + --color-emerald-600: oklch(59.6% 0.145 163.225); + --color-emerald-700: oklch(50.8% 0.118 165.612); + --color-emerald-800: oklch(43.2% 0.095 166.913); + --color-emerald-900: oklch(37.8% 0.077 168.94); + --color-emerald-950: oklch(26.2% 0.051 172.552); + --color-teal-50: oklch(98.4% 0.014 180.72); + --color-teal-100: oklch(95.3% 0.051 180.801); + --color-teal-200: oklch(91% 0.096 180.426); + --color-teal-300: oklch(85.5% 0.138 181.071); + --color-teal-400: oklch(77.7% 0.152 181.912); + --color-teal-500: oklch(70.4% 0.14 182.503); + --color-teal-600: oklch(60% 0.118 184.704); + --color-teal-700: oklch(51.1% 0.096 186.391); + --color-teal-800: oklch(43.7% 0.078 188.216); + --color-teal-900: oklch(38.6% 0.063 188.416); + --color-teal-950: oklch(27.7% 0.046 192.524); + --color-cyan-50: oklch(98.4% 0.019 200.873); + --color-cyan-100: oklch(95.6% 0.045 203.388); + --color-cyan-200: oklch(91.7% 0.08 205.041); + --color-cyan-300: oklch(86.5% 0.127 207.078); + --color-cyan-400: oklch(78.9% 0.154 211.53); + --color-cyan-500: oklch(71.5% 0.143 215.221); + --color-cyan-600: oklch(60.9% 0.126 221.723); + --color-cyan-700: oklch(52% 0.105 223.128); + --color-cyan-800: oklch(45% 0.085 224.283); + --color-cyan-900: oklch(39.8% 0.07 227.392); + --color-cyan-950: oklch(30.2% 0.056 229.695); + --color-sky-50: oklch(97.7% 0.013 236.62); + --color-sky-100: oklch(95.1% 0.026 236.824); + --color-sky-200: oklch(90.1% 0.058 230.902); + --color-sky-300: oklch(82.8% 0.111 230.318); + --color-sky-400: oklch(74.6% 0.16 232.661); + --color-sky-500: oklch(68.5% 0.169 237.323); + --color-sky-600: oklch(58.8% 0.158 241.966); + --color-sky-700: oklch(50% 0.134 242.749); + --color-sky-800: oklch(44.3% 0.11 240.79); + --color-sky-900: oklch(39.1% 0.09 240.876); + --color-sky-950: oklch(29.3% 0.066 243.157); + --color-blue-50: oklch(97% 0.014 254.604); + --color-blue-100: oklch(93.2% 0.032 255.585); + --color-blue-200: oklch(88.2% 0.059 254.128); + --color-blue-300: oklch(80.9% 0.105 251.813); + --color-blue-400: oklch(70.7% 0.165 254.624); + --color-blue-500: oklch(62.3% 0.214 259.815); + --color-blue-600: oklch(54.6% 0.245 262.881); + --color-blue-700: oklch(48.8% 0.243 264.376); + --color-blue-800: oklch(42.4% 0.199 265.638); + --color-blue-900: oklch(37.9% 0.146 265.522); + --color-blue-950: oklch(28.2% 0.091 267.935); + --color-indigo-50: oklch(96.2% 0.018 272.314); + --color-indigo-100: oklch(93% 0.034 272.788); + --color-indigo-200: oklch(87% 0.065 274.039); + --color-indigo-300: oklch(78.5% 0.115 274.713); + --color-indigo-400: oklch(67.3% 0.182 276.935); + --color-indigo-500: oklch(58.5% 0.233 277.117); + --color-indigo-600: oklch(51.1% 0.262 276.966); + --color-indigo-700: oklch(45.7% 0.24 277.023); + --color-indigo-800: oklch(39.8% 0.195 277.366); + --color-indigo-900: oklch(35.9% 0.144 278.697); + --color-indigo-950: oklch(25.7% 0.09 281.288); + --color-violet-50: oklch(96.9% 0.016 293.756); + --color-violet-100: oklch(94.3% 0.029 294.588); + --color-violet-200: oklch(89.4% 0.057 293.283); + --color-violet-300: oklch(81.1% 0.111 293.571); + --color-violet-400: oklch(70.2% 0.183 293.541); + --color-violet-500: oklch(60.6% 0.25 292.717); + --color-violet-600: oklch(54.1% 0.281 293.009); + --color-violet-700: oklch(49.1% 0.27 292.581); + --color-violet-800: oklch(43.2% 0.232 292.759); + --color-violet-900: oklch(38% 0.189 293.745); + --color-violet-950: oklch(28.3% 0.141 291.089); + --color-purple-50: oklch(97.7% 0.014 308.299); + --color-purple-100: oklch(94.6% 0.033 307.174); + --color-purple-200: oklch(90.2% 0.063 306.703); + --color-purple-300: oklch(82.7% 0.119 306.383); + --color-purple-400: oklch(71.4% 0.203 305.504); + --color-purple-500: oklch(62.7% 0.265 303.9); + --color-purple-600: oklch(55.8% 0.288 302.321); + --color-purple-700: oklch(49.6% 0.265 301.924); + --color-purple-800: oklch(43.8% 0.218 303.724); + --color-purple-900: oklch(38.1% 0.176 304.987); + --color-purple-950: oklch(29.1% 0.149 302.717); + --color-fuchsia-50: oklch(97.7% 0.017 320.058); + --color-fuchsia-100: oklch(95.2% 0.037 318.852); + --color-fuchsia-200: oklch(90.3% 0.076 319.62); + --color-fuchsia-300: oklch(83.3% 0.145 321.434); + --color-fuchsia-400: oklch(74% 0.238 322.16); + --color-fuchsia-500: oklch(66.7% 0.295 322.15); + --color-fuchsia-600: oklch(59.1% 0.293 322.896); + --color-fuchsia-700: oklch(51.8% 0.253 323.949); + --color-fuchsia-800: oklch(45.2% 0.211 324.591); + --color-fuchsia-900: oklch(40.1% 0.17 325.612); + --color-fuchsia-950: oklch(29.3% 0.136 325.661); + --color-pink-50: oklch(97.1% 0.014 343.198); + --color-pink-100: oklch(94.8% 0.028 342.258); + --color-pink-200: oklch(89.9% 0.061 343.231); + --color-pink-300: oklch(82.3% 0.12 346.018); + --color-pink-400: oklch(71.8% 0.202 349.761); + --color-pink-500: oklch(65.6% 0.241 354.308); + --color-pink-600: oklch(59.2% 0.249 0.584); + --color-pink-700: oklch(52.5% 0.223 3.958); + --color-pink-800: oklch(45.9% 0.187 3.815); + --color-pink-900: oklch(40.8% 0.153 2.432); + --color-pink-950: oklch(28.4% 0.109 3.907); + --color-rose-50: oklch(96.9% 0.015 12.422); + --color-rose-100: oklch(94.1% 0.03 12.58); + --color-rose-200: oklch(89.2% 0.058 10.001); + --color-rose-300: oklch(81% 0.117 11.638); + --color-rose-400: oklch(71.2% 0.194 13.428); + --color-rose-500: oklch(64.5% 0.246 16.439); + --color-rose-600: oklch(58.6% 0.253 17.585); + --color-rose-700: oklch(51.4% 0.222 16.935); + --color-rose-800: oklch(45.5% 0.188 13.697); + --color-rose-900: oklch(41% 0.159 10.272); + --color-rose-950: oklch(27.1% 0.105 12.094); + --color-slate-50: oklch(98.4% 0.003 247.858); + --color-slate-100: oklch(96.8% 0.007 247.896); + --color-slate-200: oklch(92.9% 0.013 255.508); + --color-slate-300: oklch(86.9% 0.022 252.894); + --color-slate-400: oklch(70.4% 0.04 256.788); + --color-slate-500: oklch(55.4% 0.046 257.417); + --color-slate-600: oklch(44.6% 0.043 257.281); + --color-slate-700: oklch(37.2% 0.044 257.287); + --color-slate-800: oklch(27.9% 0.041 260.031); + --color-slate-900: oklch(20.8% 0.042 265.755); + --color-slate-950: oklch(12.9% 0.042 264.695); + --color-gray-50: oklch(98.5% 0.002 247.839); + --color-gray-100: oklch(96.7% 0.003 264.542); + --color-gray-200: oklch(92.8% 0.006 264.531); + --color-gray-300: oklch(87.2% 0.01 258.338); + --color-gray-400: oklch(70.7% 0.022 261.325); + --color-gray-500: oklch(55.1% 0.027 264.364); + --color-gray-600: oklch(44.6% 0.03 256.802); + --color-gray-700: oklch(37.3% 0.034 259.733); + --color-gray-800: oklch(27.8% 0.033 256.848); + --color-gray-900: oklch(21% 0.034 264.665); + --color-gray-950: oklch(13% 0.028 261.692); + --color-zinc-50: oklch(98.5% 0 0); + --color-zinc-100: oklch(96.7% 0.001 286.375); + --color-zinc-200: oklch(92% 0.004 286.32); + --color-zinc-300: oklch(87.1% 0.006 286.286); + --color-zinc-400: oklch(70.5% 0.015 286.067); + --color-zinc-500: oklch(55.2% 0.016 285.938); + --color-zinc-600: oklch(44.2% 0.017 285.786); + --color-zinc-700: oklch(37% 0.013 285.805); + --color-zinc-800: oklch(27.4% 0.006 286.033); + --color-zinc-900: oklch(21% 0.006 285.885); + --color-zinc-950: oklch(14.1% 0.005 285.823); + --color-neutral-50: oklch(98.5% 0 0); + --color-neutral-100: oklch(97% 0 0); + --color-neutral-200: oklch(92.2% 0 0); + --color-neutral-300: oklch(87% 0 0); + --color-neutral-400: oklch(70.8% 0 0); + --color-neutral-500: oklch(55.6% 0 0); + --color-neutral-600: oklch(43.9% 0 0); + --color-neutral-700: oklch(37.1% 0 0); + --color-neutral-800: oklch(26.9% 0 0); + --color-neutral-900: oklch(20.5% 0 0); + --color-neutral-950: oklch(14.5% 0 0); + --color-stone-50: oklch(98.5% 0.001 106.423); + --color-stone-100: oklch(97% 0.001 106.424); + --color-stone-200: oklch(92.3% 0.003 48.717); + --color-stone-300: oklch(86.9% 0.005 56.366); + --color-stone-400: oklch(70.9% 0.01 56.259); + --color-stone-500: oklch(55.3% 0.013 58.071); + --color-stone-600: oklch(44.4% 0.011 73.639); + --color-stone-700: oklch(37.4% 0.01 67.558); + --color-stone-800: oklch(26.8% 0.007 34.298); + --color-stone-900: oklch(21.6% 0.006 56.043); + --color-stone-950: oklch(14.7% 0.004 49.25); + --color-black: #000; + --color-white: #fff; + --spacing: 0.25rem; + --breakpoint-sm: 40rem; + --breakpoint-md: 48rem; + --breakpoint-lg: 64rem; + --breakpoint-xl: 80rem; + --breakpoint-2xl: 96rem; + --container-3xs: 16rem; + --container-2xs: 18rem; + --container-xs: 20rem; + --container-sm: 24rem; + --container-md: 28rem; + --container-lg: 32rem; + --container-xl: 36rem; + --container-2xl: 42rem; + --container-3xl: 48rem; + --container-4xl: 56rem; + --container-5xl: 64rem; + --container-6xl: 72rem; + --container-7xl: 80rem; + --text-xs: 0.75rem; + --text-xs--line-height: calc(1 / 0.75); + --text-sm: 0.875rem; + --text-sm--line-height: calc(1.25 / 0.875); + --text-base: 1rem; + --text-base--line-height: calc(1.5 / 1); + --text-lg: 1.125rem; + --text-lg--line-height: calc(1.75 / 1.125); + --text-xl: 1.25rem; + --text-xl--line-height: calc(1.75 / 1.25); + --text-2xl: 1.5rem; + --text-2xl--line-height: calc(2 / 1.5); + --text-3xl: 1.875rem; + --text-3xl--line-height: calc(2.25 / 1.875); + --text-4xl: 2.25rem; + --text-4xl--line-height: calc(2.5 / 2.25); + --text-5xl: 3rem; + --text-5xl--line-height: 1; + --text-6xl: 3.75rem; + --text-6xl--line-height: 1; + --text-7xl: 4.5rem; + --text-7xl--line-height: 1; + --text-8xl: 6rem; + --text-8xl--line-height: 1; + --text-9xl: 8rem; + --text-9xl--line-height: 1; + --font-weight-thin: 100; + --font-weight-extralight: 200; + --font-weight-light: 300; + --font-weight-normal: 400; + --font-weight-medium: 500; + --font-weight-semibold: 600; + --font-weight-bold: 700; + --font-weight-extrabold: 800; + --font-weight-black: 900; + --tracking-tighter: -0.05em; + --tracking-tight: -0.025em; + --tracking-normal: 0em; + --tracking-wide: 0.025em; + --tracking-wider: 0.05em; + --tracking-widest: 0.1em; + --leading-tight: 1.25; + --leading-snug: 1.375; + --leading-normal: 1.5; + --leading-relaxed: 1.625; + --leading-loose: 2; + --radius-xs: 0.125rem; + --radius-sm: 0.25rem; + --radius-md: 0.375rem; + --radius-lg: 0.5rem; + --radius-xl: 0.75rem; + --radius-2xl: 1rem; + --radius-3xl: 1.5rem; + --radius-4xl: 2rem; + --shadow-2xs: 0 1px rgb(0 0 0 / 0.05); + --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05); + --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); + --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); + --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); + --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); + --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25); + --inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05); + --inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05); + --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05); + --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05); + --drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15); + --drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12); + --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15); + --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1); + --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15); + --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15); + --text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2); + --text-shadow-sm: 0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075); + --text-shadow-md: 0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1); + --text-shadow-lg: 0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1); + --ease-in: cubic-bezier(0.4, 0, 1, 1); + --ease-out: cubic-bezier(0, 0, 0.2, 1); + --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); + --animate-spin: spin 1s linear infinite; + --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; + --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; + --animate-bounce: bounce 1s infinite; + --blur-xs: 4px; + --blur-sm: 8px; + --blur-md: 12px; + --blur-lg: 16px; + --blur-xl: 24px; + --blur-2xl: 40px; + --blur-3xl: 64px; + --perspective-dramatic: 100px; + --perspective-near: 300px; + --perspective-normal: 500px; + --perspective-midrange: 800px; + --perspective-distant: 1200px; + --aspect-video: 16 / 9; + --default-transition-duration: 150ms; + --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + --default-font-family: var(--font-sans); + --default-mono-font-family: var(--font-mono); + } +} +@layer base { + *, ::after, ::before, ::backdrop, ::file-selector-button { + box-sizing: border-box; + margin: 0; + padding: 0; + border: 0 solid; + } + html, :host { + line-height: 1.5; + -webkit-text-size-adjust: 100%; + tab-size: 4; + font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'); + font-feature-settings: var(--default-font-feature-settings, normal); + font-variation-settings: var(--default-font-variation-settings, normal); + -webkit-tap-highlight-color: transparent; + } + hr { + height: 0; + color: inherit; + border-top-width: 1px; + } + abbr:where([title]) { + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; + } + h1, h2, h3, h4, h5, h6 { + font-size: inherit; + font-weight: inherit; + } + a { + color: inherit; + -webkit-text-decoration: inherit; + text-decoration: inherit; + } + b, strong { + font-weight: bolder; + } + code, kbd, samp, pre { + font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace); + font-feature-settings: var(--default-mono-font-feature-settings, normal); + font-variation-settings: var(--default-mono-font-variation-settings, normal); + font-size: 1em; + } + small { + font-size: 80%; + } + sub, sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + sub { + bottom: -0.25em; + } + sup { + top: -0.5em; + } + table { + text-indent: 0; + border-color: inherit; + border-collapse: collapse; + } + :-moz-focusring { + outline: auto; + } + progress { + vertical-align: baseline; + } + summary { + display: list-item; + } + ol, ul, menu { + list-style: none; + } + img, svg, video, canvas, audio, iframe, embed, object { + display: block; + vertical-align: middle; + } + img, video { + max-width: 100%; + height: auto; + } + button, input, select, optgroup, textarea, ::file-selector-button { + font: inherit; + font-feature-settings: inherit; + font-variation-settings: inherit; + letter-spacing: inherit; + color: inherit; + border-radius: 0; + background-color: transparent; + opacity: 1; + } + :where(select:is([multiple], [size])) optgroup { + font-weight: bolder; + } + :where(select:is([multiple], [size])) optgroup option { + padding-inline-start: 20px; + } + ::file-selector-button { + margin-inline-end: 4px; + } + ::placeholder { + opacity: 1; + } + @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { + ::placeholder { + color: currentcolor; + @supports (color: color-mix(in lab, red, red)) { + color: color-mix(in oklab, currentcolor 50%, transparent); + } + } + } + textarea { + resize: vertical; + } + ::-webkit-search-decoration { + -webkit-appearance: none; + } + ::-webkit-date-and-time-value { + min-height: 1lh; + text-align: inherit; + } + ::-webkit-datetime-edit { + display: inline-flex; + } + ::-webkit-datetime-edit-fields-wrapper { + padding: 0; + } + ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { + padding-block: 0; + } + ::-webkit-calendar-picker-indicator { + line-height: 1; + } + :-moz-ui-invalid { + box-shadow: none; + } + button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button { + appearance: button; + } + ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { + height: auto; + } + [hidden]:where(:not([hidden='until-found'])) { + display: none !important; + } +} +@layer utilities { + .\@container\/card-header { + container-type: inline-size; + container-name: card-header; + } + .\@container { + container-type: inline-size; + } + .pointer-events-auto { + pointer-events: auto; + } + .pointer-events-none { + pointer-events: none; + } + .collapse { + visibility: collapse; + } + .invisible { + visibility: hidden; + } + .visible { + visibility: visible; + } + .sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip-path: inset(50%); + white-space: nowrap; + border-width: 0; + } + .not-sr-only { + position: static; + width: auto; + height: auto; + padding: 0; + margin: 0; + overflow: visible; + clip-path: none; + white-space: normal; + } + .absolute { + position: absolute; + } + .fixed { + position: fixed; + } + .relative { + position: relative; + } + .static { + position: static; + } + .sticky { + position: sticky; + } + .inset-0 { + inset: calc(var(--spacing) * 0); + } + .top-0 { + top: calc(var(--spacing) * 0); + } + .top-3 { + top: calc(var(--spacing) * 3); + } + .top-20 { + top: calc(var(--spacing) * 20); + } + .top-24 { + top: calc(var(--spacing) * 24); + } + .right-0 { + right: calc(var(--spacing) * 0); + } + .right-2 { + right: calc(var(--spacing) * 2); + } + .right-3 { + right: calc(var(--spacing) * 3); + } + .bottom-0 { + bottom: calc(var(--spacing) * 0); + } + .bottom-4 { + bottom: calc(var(--spacing) * 4); + } + .bottom-full { + bottom: 100%; + } + .left-0 { + left: calc(var(--spacing) * 0); + } + .left-1\/2 { + left: calc(1/2 * 100%); + } + .left-3 { + left: calc(var(--spacing) * 3); + } + .isolate { + isolation: isolate; + } + .isolation-auto { + isolation: auto; + } + .z-0 { + z-index: 0; + } + .z-10 { + z-index: 10; + } + .z-50 { + z-index: 50; + } + .z-\[100\] { + z-index: 100; + } + .order-0 { + order: 0; + } + .order-none { + order: 0; + } + .col-span-full { + grid-column: 1 / -1; + } + .col-start-2 { + grid-column-start: 2; + } + .row-span-2 { + grid-row: span 2 / span 2; + } + .row-start-1 { + grid-row-start: 1; + } + .float-end { + float: inline-end; + } + .float-left { + float: left; + } + .float-none { + float: none; + } + .float-right { + float: right; + } + .float-start { + float: inline-start; + } + .clear-both { + clear: both; + } + .clear-end { + clear: inline-end; + } + .clear-left { + clear: left; + } + .clear-none { + clear: none; + } + .clear-right { + clear: right; + } + .clear-start { + clear: inline-start; + } + .container { + width: 100%; + @media (width >= 40rem) { + max-width: 40rem; + } + @media (width >= 48rem) { + max-width: 48rem; + } + @media (width >= 64rem) { + max-width: 64rem; + } + @media (width >= 80rem) { + max-width: 80rem; + } + @media (width >= 96rem) { + max-width: 96rem; + } + } + .m-0 { + margin: calc(var(--spacing) * 0); + } + .-mx-1 { + margin-inline: calc(var(--spacing) * -1); + } + .mx-2 { + margin-inline: calc(var(--spacing) * 2); + } + .mx-6 { + margin-inline: calc(var(--spacing) * 6); + } + .mx-auto { + margin-inline: auto; + } + .my-1 { + margin-block: calc(var(--spacing) * 1); + } + .my-4 { + margin-block: calc(var(--spacing) * 4); + } + .mt-1 { + margin-top: calc(var(--spacing) * 1); + } + .mt-4 { + margin-top: calc(var(--spacing) * 4); + } + .mt-5 { + margin-top: calc(var(--spacing) * 5); + } + .mt-8 { + margin-top: calc(var(--spacing) * 8); + } + .mt-12 { + margin-top: calc(var(--spacing) * 12); + } + .mt-16 { + margin-top: calc(var(--spacing) * 16); + } + .mt-20 { + margin-top: calc(var(--spacing) * 20); + } + .mt-auto { + margin-top: auto; + } + .mr-1 { + margin-right: calc(var(--spacing) * 1); + } + .mr-1\.5 { + margin-right: calc(var(--spacing) * 1.5); + } + .mb-1 { + margin-bottom: calc(var(--spacing) * 1); + } + .mb-2 { + margin-bottom: calc(var(--spacing) * 2); + } + .mb-3 { + margin-bottom: calc(var(--spacing) * 3); + } + .mb-4 { + margin-bottom: calc(var(--spacing) * 4); + } + .mb-6 { + margin-bottom: calc(var(--spacing) * 6); + } + .mb-8 { + margin-bottom: calc(var(--spacing) * 8); + } + .mb-10 { + margin-bottom: calc(var(--spacing) * 10); + } + .mb-12 { + margin-bottom: calc(var(--spacing) * 12); + } + .mb-16 { + margin-bottom: calc(var(--spacing) * 16); + } + .box-border { + box-sizing: border-box; + } + .box-content { + box-sizing: content-box; + } + .line-clamp-1 { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 1; + } + .line-clamp-2 { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + } + .line-clamp-3 { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 3; + } + .block { + display: block; + } + .contents { + display: contents; + } + .flex { + display: flex; + } + .flow-root { + display: flow-root; + } + .grid { + display: grid; + } + .hidden { + display: none; + } + .inline { + display: inline; + } + .inline-block { + display: inline-block; + } + .inline-flex { + display: inline-flex; + } + .inline-grid { + display: inline-grid; + } + .inline-table { + display: inline-table; + } + .list-item { + display: list-item; + } + .table { + display: table; + } + .table-caption { + display: table-caption; + } + .table-cell { + display: table-cell; + } + .table-column { + display: table-column; + } + .table-column-group { + display: table-column-group; + } + .table-footer-group { + display: table-footer-group; + } + .table-header-group { + display: table-header-group; + } + .table-row { + display: table-row; + } + .table-row-group { + display: table-row-group; + } + .field-sizing-content { + field-sizing: content; + } + .field-sizing-fixed { + field-sizing: fixed; + } + .aspect-\[3\/4\] { + aspect-ratio: 3/4; + } + .aspect-\[16\/9\] { + aspect-ratio: 16/9; + } + .aspect-\[16\/10\] { + aspect-ratio: 16/10; + } + .size-3\.5 { + width: calc(var(--spacing) * 3.5); + height: calc(var(--spacing) * 3.5); + } + .size-4 { + width: calc(var(--spacing) * 4); + height: calc(var(--spacing) * 4); + } + .size-8 { + width: calc(var(--spacing) * 8); + height: calc(var(--spacing) * 8); + } + .size-9 { + width: calc(var(--spacing) * 9); + height: calc(var(--spacing) * 9); + } + .size-10 { + width: calc(var(--spacing) * 10); + height: calc(var(--spacing) * 10); + } + .size-auto { + width: auto; + height: auto; + } + .h-2 { + height: calc(var(--spacing) * 2); + } + .h-3 { + height: calc(var(--spacing) * 3); + } + .h-3\.5 { + height: calc(var(--spacing) * 3.5); + } + .h-4 { + height: calc(var(--spacing) * 4); + } + .h-5 { + height: calc(var(--spacing) * 5); + } + .h-8 { + height: calc(var(--spacing) * 8); + } + .h-9 { + height: calc(var(--spacing) * 9); + } + .h-10 { + height: calc(var(--spacing) * 10); + } + .h-11 { + height: calc(var(--spacing) * 11); + } + .h-16 { + height: calc(var(--spacing) * 16); + } + .h-24 { + height: calc(var(--spacing) * 24); + } + .h-36 { + height: calc(var(--spacing) * 36); + } + .h-\[var\(--radix-select-trigger-height\)\] { + height: var(--radix-select-trigger-height); + } + .h-auto { + height: auto; + } + .h-full { + height: 100%; + } + .h-lh { + height: 1lh; + } + .h-px { + height: 1px; + } + .h-screen { + height: 100vh; + } + .max-h-\(--radix-select-content-available-height\) { + max-height: var(--radix-select-content-available-height); + } + .max-h-\[70vh\] { + max-height: 70vh; + } + .max-h-lh { + max-height: 1lh; + } + .max-h-none { + max-height: none; + } + .max-h-screen { + max-height: 100vh; + } + .min-h-16 { + min-height: calc(var(--spacing) * 16); + } + .min-h-\[140px\] { + min-height: 140px; + } + .min-h-\[600px\] { + min-height: 600px; + } + .min-h-auto { + min-height: auto; + } + .min-h-lh { + min-height: 1lh; + } + .min-h-screen { + min-height: 100vh; + } + .w-2 { + width: calc(var(--spacing) * 2); + } + .w-3 { + width: calc(var(--spacing) * 3); + } + .w-3\.5 { + width: calc(var(--spacing) * 3.5); + } + .w-4 { + width: calc(var(--spacing) * 4); + } + .w-5 { + width: calc(var(--spacing) * 5); + } + .w-6 { + width: calc(var(--spacing) * 6); + } + .w-11 { + width: calc(var(--spacing) * 11); + } + .w-64 { + width: calc(var(--spacing) * 64); + } + .w-\[100px\] { + width: 100px; + } + .w-auto { + width: auto; + } + .w-fit { + width: fit-content; + } + .w-full { + width: 100%; + } + .w-screen { + width: 100vw; + } + .max-w-2xl { + max-width: var(--container-2xl); + } + .max-w-3xl { + max-width: var(--container-3xl); + } + .max-w-5xl { + max-width: var(--container-5xl); + } + .max-w-7xl { + max-width: var(--container-7xl); + } + .max-w-none { + max-width: none; + } + .max-w-screen { + max-width: 100vw; + } + .min-w-0 { + min-width: calc(var(--spacing) * 0); + } + .min-w-\[0px\] { + min-width: 0px; + } + .min-w-\[8rem\] { + min-width: 8rem; + } + .min-w-\[320px\] { + min-width: 320px; + } + .min-w-\[var\(--radix-select-trigger-width\)\] { + min-width: var(--radix-select-trigger-width); + } + .min-w-auto { + min-width: auto; + } + .min-w-full { + min-width: 100%; + } + .min-w-screen { + min-width: 100vw; + } + .flex-1 { + flex: 1; + } + .flex-auto { + flex: auto; + } + .flex-initial { + flex: 0 auto; + } + .flex-none { + flex: none; + } + .flex-shrink { + flex-shrink: 1; + } + .flex-shrink-0 { + flex-shrink: 0; + } + .shrink { + flex-shrink: 1; + } + .shrink-0 { + flex-shrink: 0; + } + .flex-grow { + flex-grow: 1; + } + .grow { + flex-grow: 1; + } + .basis-auto { + flex-basis: auto; + } + .basis-full { + flex-basis: 100%; + } + .table-auto { + table-layout: auto; + } + .table-fixed { + table-layout: fixed; + } + .caption-bottom { + caption-side: bottom; + } + .caption-top { + caption-side: top; + } + .border-collapse { + border-collapse: collapse; + } + .border-separate { + border-collapse: separate; + } + .origin-\(--radix-select-content-transform-origin\) { + transform-origin: var(--radix-select-content-transform-origin); + } + .origin-bottom-right { + transform-origin: 100% 100%; + } + .-translate-full { + --tw-translate-x: -100%; + --tw-translate-y: -100%; + translate: var(--tw-translate-x) var(--tw-translate-y); + } + .translate-full { + --tw-translate-x: 100%; + --tw-translate-y: 100%; + translate: var(--tw-translate-x) var(--tw-translate-y); + } + .-translate-x-1\/2 { + --tw-translate-x: calc(calc(1/2 * 100%) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + .translate-x-2 { + --tw-translate-x: calc(var(--spacing) * 2); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + .translate-3d { + translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z); + } + .translate-none { + translate: none; + } + .scale-120 { + --tw-scale-x: 120%; + --tw-scale-y: 120%; + --tw-scale-z: 120%; + scale: var(--tw-scale-x) var(--tw-scale-y); + } + .scale-3d { + scale: var(--tw-scale-x) var(--tw-scale-y) var(--tw-scale-z); + } + .scale-none { + scale: none; + } + .rotate-none { + rotate: none; + } + .transform { + transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); + } + .transform-cpu { + transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); + } + .transform-gpu { + transform: translateZ(0) var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); + } + .transform-none { + transform: none; + } + .\[animation\:spin_20s_linear_infinite\] { + animation: spin 20s linear infinite; + } + .animate-\[spin_20s_linear_infinite\] { + animation: spin 20s linear infinite; + } + .animate-pulse { + animation: var(--animate-pulse); + } + .cursor-default { + cursor: default; + } + .cursor-not-allowed { + cursor: not-allowed; + } + .cursor-pointer { + cursor: pointer; + } + .touch-pinch-zoom { + --tw-pinch-zoom: pinch-zoom; + touch-action: var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,); + } + .resize { + resize: both; + } + .resize-none { + resize: none; + } + .resize-x { + resize: horizontal; + } + .resize-y { + resize: vertical; + } + .snap-none { + scroll-snap-type: none; + } + .snap-mandatory { + --tw-scroll-snap-strictness: mandatory; + } + .snap-proximity { + --tw-scroll-snap-strictness: proximity; + } + .snap-align-none { + scroll-snap-align: none; + } + .snap-center { + scroll-snap-align: center; + } + .snap-end { + scroll-snap-align: end; + } + .snap-start { + scroll-snap-align: start; + } + .snap-always { + scroll-snap-stop: always; + } + .snap-normal { + scroll-snap-stop: normal; + } + .scroll-my-1 { + scroll-margin-block: calc(var(--spacing) * 1); + } + .list-inside { + list-style-position: inside; + } + .list-outside { + list-style-position: outside; + } + .appearance-auto { + appearance: auto; + } + .appearance-none { + appearance: none; + } + .grid-flow-col { + grid-auto-flow: column; + } + .grid-flow-col-dense { + grid-auto-flow: column dense; + } + .grid-flow-dense { + grid-auto-flow: dense; + } + .grid-flow-row { + grid-auto-flow: row; + } + .grid-flow-row-dense { + grid-auto-flow: row dense; + } + .auto-rows-min { + grid-auto-rows: min-content; + } + .grid-cols-1 { + grid-template-columns: repeat(1, minmax(0, 1fr)); + } + .grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + .grid-cols-4 { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + .grid-rows-\[auto_auto\] { + grid-template-rows: auto auto; + } + .flex-col { + flex-direction: column; + } + .flex-col-reverse { + flex-direction: column-reverse; + } + .flex-row { + flex-direction: row; + } + .flex-row-reverse { + flex-direction: row-reverse; + } + .flex-nowrap { + flex-wrap: nowrap; + } + .flex-wrap { + flex-wrap: wrap; + } + .flex-wrap-reverse { + flex-wrap: wrap-reverse; + } + .place-content-around { + place-content: space-around; + } + .place-content-baseline { + place-content: baseline; + } + .place-content-between { + place-content: space-between; + } + .place-content-center { + place-content: center; + } + .place-content-center-safe { + place-content: safe center; + } + .place-content-end { + place-content: end; + } + .place-content-end-safe { + place-content: safe end; + } + .place-content-evenly { + place-content: space-evenly; + } + .place-content-start { + place-content: start; + } + .place-content-stretch { + place-content: stretch; + } + .place-items-baseline { + place-items: baseline; + } + .place-items-center { + place-items: center; + } + .place-items-center-safe { + place-items: safe center; + } + .place-items-end { + place-items: end; + } + .place-items-end-safe { + place-items: safe end; + } + .place-items-start { + place-items: start; + } + .place-items-stretch { + place-items: stretch; + } + .content-around { + align-content: space-around; + } + .content-baseline { + align-content: baseline; + } + .content-between { + align-content: space-between; + } + .content-center { + align-content: center; + } + .content-center-safe { + align-content: safe center; + } + .content-end { + align-content: flex-end; + } + .content-end-safe { + align-content: safe flex-end; + } + .content-evenly { + align-content: space-evenly; + } + .content-normal { + align-content: normal; + } + .content-start { + align-content: flex-start; + } + .content-stretch { + align-content: stretch; + } + .items-baseline { + align-items: baseline; + } + .items-baseline-last { + align-items: last baseline; + } + .items-center { + align-items: center; + } + .items-center-safe { + align-items: safe center; + } + .items-end { + align-items: flex-end; + } + .items-end-safe { + align-items: safe flex-end; + } + .items-start { + align-items: flex-start; + } + .items-stretch { + align-items: stretch; + } + .justify-around { + justify-content: space-around; + } + .justify-baseline { + justify-content: baseline; + } + .justify-between { + justify-content: space-between; + } + .justify-center { + justify-content: center; + } + .justify-center-safe { + justify-content: safe center; + } + .justify-end { + justify-content: flex-end; + } + .justify-end-safe { + justify-content: safe flex-end; + } + .justify-evenly { + justify-content: space-evenly; + } + .justify-normal { + justify-content: normal; + } + .justify-start { + justify-content: flex-start; + } + .justify-stretch { + justify-content: stretch; + } + .justify-items-center { + justify-items: center; + } + .justify-items-center-safe { + justify-items: safe center; + } + .justify-items-end { + justify-items: end; + } + .justify-items-end-safe { + justify-items: safe end; + } + .justify-items-normal { + justify-items: normal; + } + .justify-items-start { + justify-items: start; + } + .justify-items-stretch { + justify-items: stretch; + } + .gap-1 { + gap: calc(var(--spacing) * 1); + } + .gap-1\.5 { + gap: calc(var(--spacing) * 1.5); + } + .gap-2 { + gap: calc(var(--spacing) * 2); + } + .gap-3 { + gap: calc(var(--spacing) * 3); + } + .gap-4 { + gap: calc(var(--spacing) * 4); + } + .gap-6 { + gap: calc(var(--spacing) * 6); + } + .gap-8 { + gap: calc(var(--spacing) * 8); + } + .gap-12 { + gap: calc(var(--spacing) * 12); + } + .space-y-5 { + :where(& > :not(:last-child)) { + --tw-space-y-reverse: 0; + margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse)); + margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse))); + } + } + .space-y-6 { + :where(& > :not(:last-child)) { + --tw-space-y-reverse: 0; + margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); + margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); + } + } + .space-y-10 { + :where(& > :not(:last-child)) { + --tw-space-y-reverse: 0; + margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse)); + margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse))); + } + } + .space-y-20 { + :where(& > :not(:last-child)) { + --tw-space-y-reverse: 0; + margin-block-start: calc(calc(var(--spacing) * 20) * var(--tw-space-y-reverse)); + margin-block-end: calc(calc(var(--spacing) * 20) * calc(1 - var(--tw-space-y-reverse))); + } + } + .space-y-reverse { + :where(& > :not(:last-child)) { + --tw-space-y-reverse: 1; + } + } + .gap-x-8 { + column-gap: calc(var(--spacing) * 8); + } + .space-x-reverse { + :where(& > :not(:last-child)) { + --tw-space-x-reverse: 1; + } + } + .gap-y-16 { + row-gap: calc(var(--spacing) * 16); + } + .divide-x { + :where(& > :not(:last-child)) { + --tw-divide-x-reverse: 0; + border-inline-style: var(--tw-border-style); + border-inline-start-width: calc(1px * var(--tw-divide-x-reverse)); + border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); + } + } + .divide-y { + :where(& > :not(:last-child)) { + --tw-divide-y-reverse: 0; + border-bottom-style: var(--tw-border-style); + border-top-style: var(--tw-border-style); + border-top-width: calc(1px * var(--tw-divide-y-reverse)); + border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); + } + } + .divide-y-reverse { + :where(& > :not(:last-child)) { + --tw-divide-y-reverse: 1; + } + } + .place-self-auto { + place-self: auto; + } + .place-self-center { + place-self: center; + } + .place-self-center-safe { + place-self: safe center; + } + .place-self-end { + place-self: end; + } + .place-self-end-safe { + place-self: safe end; + } + .place-self-start { + place-self: start; + } + .place-self-stretch { + place-self: stretch; + } + .self-auto { + align-self: auto; + } + .self-baseline { + align-self: baseline; + } + .self-baseline-last { + align-self: last baseline; + } + .self-center { + align-self: center; + } + .self-center-safe { + align-self: safe center; + } + .self-end { + align-self: flex-end; + } + .self-end-safe { + align-self: safe flex-end; + } + .self-start { + align-self: flex-start; + } + .self-stretch { + align-self: stretch; + } + .justify-self-auto { + justify-self: auto; + } + .justify-self-center { + justify-self: center; + } + .justify-self-center-safe { + justify-self: safe center; + } + .justify-self-end { + justify-self: flex-end; + } + .justify-self-end-safe { + justify-self: safe flex-end; + } + .justify-self-start { + justify-self: flex-start; + } + .justify-self-stretch { + justify-self: stretch; + } + .truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .overflow-hidden { + overflow: hidden; + } + .overflow-x-hidden { + overflow-x: hidden; + } + .overflow-y-auto { + overflow-y: auto; + } + .scroll-auto { + scroll-behavior: auto; + } + .scroll-smooth { + scroll-behavior: smooth; + } + .rounded { + border-radius: 0.25rem; + } + .rounded-2xl { + border-radius: var(--radius-2xl); + } + .rounded-3xl { + border-radius: var(--radius-3xl); + } + .rounded-full { + border-radius: calc(infinity * 1px); + } + .rounded-lg { + border-radius: var(--radius-lg); + } + .rounded-md { + border-radius: var(--radius-md); + } + .rounded-sm { + border-radius: var(--radius-sm); + } + .rounded-xl { + border-radius: var(--radius-xl); + } + .rounded-s { + border-start-start-radius: 0.25rem; + border-end-start-radius: 0.25rem; + } + .rounded-ss { + border-start-start-radius: 0.25rem; + } + .rounded-e { + border-start-end-radius: 0.25rem; + border-end-end-radius: 0.25rem; + } + .rounded-se { + border-start-end-radius: 0.25rem; + } + .rounded-ee { + border-end-end-radius: 0.25rem; + } + .rounded-es { + border-end-start-radius: 0.25rem; + } + .rounded-t { + border-top-left-radius: 0.25rem; + border-top-right-radius: 0.25rem; + } + .rounded-l { + border-top-left-radius: 0.25rem; + border-bottom-left-radius: 0.25rem; + } + .rounded-tl { + border-top-left-radius: 0.25rem; + } + .rounded-r { + border-top-right-radius: 0.25rem; + border-bottom-right-radius: 0.25rem; + } + .rounded-tr { + border-top-right-radius: 0.25rem; + } + .rounded-b { + border-bottom-right-radius: 0.25rem; + border-bottom-left-radius: 0.25rem; + } + .rounded-br { + border-bottom-right-radius: 0.25rem; + } + .rounded-bl { + border-bottom-left-radius: 0.25rem; + } + .border { + border-style: var(--tw-border-style); + border-width: 1px; + } + .border-0 { + border-style: var(--tw-border-style); + border-width: 0px; + } + .border-2 { + border-style: var(--tw-border-style); + border-width: 2px; + } + .border-x { + border-inline-style: var(--tw-border-style); + border-inline-width: 1px; + } + .border-y { + border-block-style: var(--tw-border-style); + border-block-width: 1px; + } + .border-s { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 1px; + } + .border-e { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 1px; + } + .border-t { + border-top-style: var(--tw-border-style); + border-top-width: 1px; + } + .border-r { + border-right-style: var(--tw-border-style); + border-right-width: 1px; + } + .border-b { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 1px; + } + .border-l { + border-left-style: var(--tw-border-style); + border-left-width: 1px; + } + .border-l-4 { + border-left-style: var(--tw-border-style); + border-left-width: 4px; + } + .border-dashed { + --tw-border-style: dashed; + border-style: dashed; + } + .border-dotted { + --tw-border-style: dotted; + border-style: dotted; + } + .border-double { + --tw-border-style: double; + border-style: double; + } + .border-hidden { + --tw-border-style: hidden; + border-style: hidden; + } + .border-none { + --tw-border-style: none; + border-style: none; + } + .border-solid { + --tw-border-style: solid; + border-style: solid; + } + .border-\[\#fbf0df\] { + border-color: #fbf0df; + } + .border-blue-500 { + border-color: var(--color-blue-500); + } + .border-emerald-500 { + border-color: var(--color-emerald-500); + } + .border-gray-50 { + border-color: var(--color-gray-50); + } + .border-gray-100 { + border-color: var(--color-gray-100); + } + .border-gray-100\/80 { + border-color: color-mix(in srgb, oklch(96.7% 0.003 264.542) 80%, transparent); + @supports (color: color-mix(in lab, red, red)) { + border-color: color-mix(in oklab, var(--color-gray-100) 80%, transparent); + } + } + .border-gray-200 { + border-color: var(--color-gray-200); + } + .border-purple-500 { + border-color: var(--color-purple-500); + } + .border-red-100 { + border-color: var(--color-red-100); + } + .border-red-500 { + border-color: var(--color-red-500); + } + .border-slate-100 { + border-color: var(--color-slate-100); + } + .border-slate-200 { + border-color: var(--color-slate-200); + } + .border-yellow-100 { + border-color: var(--color-yellow-100); + } + .bg-\[\#1a1a1a\] { + background-color: #1a1a1a; + } + .bg-\[\#242424\] { + background-color: #242424; + } + .bg-\[\#fbf0df\] { + background-color: #fbf0df; + } + .bg-amber-100 { + background-color: var(--color-amber-100); + } + .bg-blue-50 { + background-color: var(--color-blue-50); + } + .bg-blue-100 { + background-color: var(--color-blue-100); + } + .bg-blue-500 { + background-color: var(--color-blue-500); + } + .bg-blue-600 { + background-color: var(--color-blue-600); + } + .bg-emerald-50 { + background-color: var(--color-emerald-50); + } + .bg-emerald-500 { + background-color: var(--color-emerald-500); + } + .bg-emerald-600 { + background-color: var(--color-emerald-600); + } + .bg-gray-50 { + background-color: var(--color-gray-50); + } + .bg-gray-100 { + background-color: var(--color-gray-100); + } + .bg-gray-200 { + background-color: var(--color-gray-200); + } + .bg-gray-300 { + background-color: var(--color-gray-300); + } + .bg-green-50 { + background-color: var(--color-green-50); + } + .bg-green-500 { + background-color: var(--color-green-500); + } + .bg-purple-100 { + background-color: var(--color-purple-100); + } + .bg-red-50 { + background-color: var(--color-red-50); + } + .bg-red-50\/50 { + background-color: color-mix(in srgb, oklch(97.1% 0.013 17.38) 50%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-red-50) 50%, transparent); + } + } + .bg-red-100 { + background-color: var(--color-red-100); + } + .bg-red-500 { + background-color: var(--color-red-500); + } + .bg-slate-50 { + background-color: var(--color-slate-50); + } + .bg-slate-50\/50 { + background-color: color-mix(in srgb, oklch(98.4% 0.003 247.858) 50%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-slate-50) 50%, transparent); + } + } + .bg-slate-100 { + background-color: var(--color-slate-100); + } + .bg-slate-200 { + background-color: var(--color-slate-200); + } + .bg-transparent { + background-color: transparent; + } + .bg-white { + background-color: var(--color-white); + } + .bg-white\/20 { + background-color: color-mix(in srgb, #fff 20%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-white) 20%, transparent); + } + } + .bg-white\/50 { + background-color: color-mix(in srgb, #fff 50%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-white) 50%, transparent); + } + } + .bg-white\/80 { + background-color: color-mix(in srgb, #fff 80%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-white) 80%, transparent); + } + } + .bg-yellow-50 { + background-color: var(--color-yellow-50); + } + .-bg-conic { + --tw-gradient-position: in oklab; + background-image: conic-gradient(var(--tw-gradient-stops)); + } + .bg-conic { + --tw-gradient-position: in oklab; + background-image: conic-gradient(var(--tw-gradient-stops)); + } + .bg-gradient-to-br { + --tw-gradient-position: to bottom right in oklab; + background-image: linear-gradient(var(--tw-gradient-stops)); + } + .bg-gradient-to-r { + --tw-gradient-position: to right in oklab; + background-image: linear-gradient(var(--tw-gradient-stops)); + } + .bg-gradient-to-t { + --tw-gradient-position: to top in oklab; + background-image: linear-gradient(var(--tw-gradient-stops)); + } + .bg-radial { + --tw-gradient-position: in oklab; + background-image: radial-gradient(var(--tw-gradient-stops)); + } + .bg-none { + background-image: none; + } + .via-none { + --tw-gradient-via-stops: initial; + } + .from-black\/70 { + --tw-gradient-from: color-mix(in srgb, #000 70%, transparent); + @supports (color: color-mix(in lab, red, red)) { + --tw-gradient-from: color-mix(in oklab, var(--color-black) 70%, transparent); + } + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-blue-500 { + --tw-gradient-from: var(--color-blue-500); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-emerald-500 { + --tw-gradient-from: var(--color-emerald-500); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-red-500 { + --tw-gradient-from: var(--color-red-500); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-red-600 { + --tw-gradient-from: var(--color-red-600); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-indigo-600 { + --tw-gradient-to: var(--color-indigo-600); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-red-700 { + --tw-gradient-to: var(--color-red-700); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-rose-600 { + --tw-gradient-to: var(--color-rose-600); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-teal-600 { + --tw-gradient-to: var(--color-teal-600); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-transparent { + --tw-gradient-to: transparent; + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .mask-none { + mask-image: none; + } + .mask-circle { + --tw-mask-radial-shape: circle; + } + .mask-ellipse { + --tw-mask-radial-shape: ellipse; + } + .mask-radial-closest-corner { + --tw-mask-radial-size: closest-corner; + } + .mask-radial-closest-side { + --tw-mask-radial-size: closest-side; + } + .mask-radial-farthest-corner { + --tw-mask-radial-size: farthest-corner; + } + .mask-radial-farthest-side { + --tw-mask-radial-size: farthest-side; + } + .mask-radial-at-bottom { + --tw-mask-radial-position: bottom; + } + .mask-radial-at-bottom-left { + --tw-mask-radial-position: bottom left; + } + .mask-radial-at-bottom-right { + --tw-mask-radial-position: bottom right; + } + .mask-radial-at-center { + --tw-mask-radial-position: center; + } + .mask-radial-at-left { + --tw-mask-radial-position: left; + } + .mask-radial-at-right { + --tw-mask-radial-position: right; + } + .mask-radial-at-top { + --tw-mask-radial-position: top; + } + .mask-radial-at-top-left { + --tw-mask-radial-position: top left; + } + .mask-radial-at-top-right { + --tw-mask-radial-position: top right; + } + .box-decoration-clone { + -webkit-box-decoration-break: clone; + box-decoration-break: clone; + } + .box-decoration-slice { + -webkit-box-decoration-break: slice; + box-decoration-break: slice; + } + .decoration-clone { + -webkit-box-decoration-break: clone; + box-decoration-break: clone; + } + .decoration-slice { + -webkit-box-decoration-break: slice; + box-decoration-break: slice; + } + .bg-auto { + background-size: auto; + } + .bg-contain { + background-size: contain; + } + .bg-cover { + background-size: cover; + } + .bg-fixed { + background-attachment: fixed; + } + .bg-local { + background-attachment: local; + } + .bg-scroll { + background-attachment: scroll; + } + .bg-clip-border { + background-clip: border-box; + } + .bg-clip-content { + background-clip: content-box; + } + .bg-clip-padding { + background-clip: padding-box; + } + .bg-clip-text { + background-clip: text; + } + .bg-bottom { + background-position: bottom; + } + .bg-bottom-left { + background-position: left bottom; + } + .bg-bottom-right { + background-position: right bottom; + } + .bg-center { + background-position: center; + } + .bg-left { + background-position: left; + } + .bg-left-bottom { + background-position: left bottom; + } + .bg-left-top { + background-position: left top; + } + .bg-right { + background-position: right; + } + .bg-right-bottom { + background-position: right bottom; + } + .bg-right-top { + background-position: right top; + } + .bg-top { + background-position: top; + } + .bg-top-left { + background-position: left top; + } + .bg-top-right { + background-position: right top; + } + .bg-no-repeat { + background-repeat: no-repeat; + } + .bg-repeat { + background-repeat: repeat; + } + .bg-repeat-round { + background-repeat: round; + } + .bg-repeat-space { + background-repeat: space; + } + .bg-repeat-x { + background-repeat: repeat-x; + } + .bg-repeat-y { + background-repeat: repeat-y; + } + .bg-origin-border { + background-origin: border-box; + } + .bg-origin-content { + background-origin: content-box; + } + .bg-origin-padding { + background-origin: padding-box; + } + .mask-add { + mask-composite: add; + } + .mask-exclude { + mask-composite: exclude; + } + .mask-intersect { + mask-composite: intersect; + } + .mask-subtract { + mask-composite: subtract; + } + .mask-alpha { + mask-mode: alpha; + } + .mask-luminance { + mask-mode: luminance; + } + .mask-match { + mask-mode: match-source; + } + .mask-type-alpha { + mask-type: alpha; + } + .mask-type-luminance { + mask-type: luminance; + } + .mask-auto { + mask-size: auto; + } + .mask-contain { + mask-size: contain; + } + .mask-cover { + mask-size: cover; + } + .mask-clip-border { + mask-clip: border-box; + } + .mask-clip-content { + mask-clip: content-box; + } + .mask-clip-fill { + mask-clip: fill-box; + } + .mask-clip-padding { + mask-clip: padding-box; + } + .mask-clip-stroke { + mask-clip: stroke-box; + } + .mask-clip-view { + mask-clip: view-box; + } + .mask-no-clip { + mask-clip: no-clip; + } + .mask-bottom { + mask-position: bottom; + } + .mask-bottom-left { + mask-position: left bottom; + } + .mask-bottom-right { + mask-position: right bottom; + } + .mask-center { + mask-position: center; + } + .mask-left { + mask-position: left; + } + .mask-right { + mask-position: right; + } + .mask-top { + mask-position: top; + } + .mask-top-left { + mask-position: left top; + } + .mask-top-right { + mask-position: right top; + } + .mask-no-repeat { + mask-repeat: no-repeat; + } + .mask-repeat { + mask-repeat: repeat; + } + .mask-repeat-round { + mask-repeat: round; + } + .mask-repeat-space { + mask-repeat: space; + } + .mask-repeat-x { + mask-repeat: repeat-x; + } + .mask-repeat-y { + mask-repeat: repeat-y; + } + .mask-origin-border { + mask-origin: border-box; + } + .mask-origin-content { + mask-origin: content-box; + } + .mask-origin-fill { + mask-origin: fill-box; + } + .mask-origin-padding { + mask-origin: padding-box; + } + .mask-origin-stroke { + mask-origin: stroke-box; + } + .mask-origin-view { + mask-origin: view-box; + } + .fill-none { + fill: none; + } + .stroke-none { + stroke: none; + } + .object-contain { + object-fit: contain; + } + .object-cover { + object-fit: cover; + } + .object-fill { + object-fit: fill; + } + .object-none { + object-fit: none; + } + .object-scale-down { + object-fit: scale-down; + } + .object-left-bottom { + object-position: left bottom; + } + .object-left-top { + object-position: left top; + } + .object-right-bottom { + object-position: right bottom; + } + .object-right-top { + object-position: right top; + } + .p-1 { + padding: calc(var(--spacing) * 1); + } + .p-2 { + padding: calc(var(--spacing) * 2); + } + .p-3 { + padding: calc(var(--spacing) * 3); + } + .p-4 { + padding: calc(var(--spacing) * 4); + } + .p-5 { + padding: calc(var(--spacing) * 5); + } + .p-6 { + padding: calc(var(--spacing) * 6); + } + .p-8 { + padding: calc(var(--spacing) * 8); + } + .p-12 { + padding: calc(var(--spacing) * 12); + } + .px-1 { + padding-inline: calc(var(--spacing) * 1); + } + .px-2 { + padding-inline: calc(var(--spacing) * 2); + } + .px-2\.5 { + padding-inline: calc(var(--spacing) * 2.5); + } + .px-3 { + padding-inline: calc(var(--spacing) * 3); + } + .px-4 { + padding-inline: calc(var(--spacing) * 4); + } + .px-5 { + padding-inline: calc(var(--spacing) * 5); + } + .px-6 { + padding-inline: calc(var(--spacing) * 6); + } + .px-8 { + padding-inline: calc(var(--spacing) * 8); + } + .px-10 { + padding-inline: calc(var(--spacing) * 10); + } + .px-\[0\.3rem\] { + padding-inline: 0.3rem; + } + .py-1 { + padding-block: calc(var(--spacing) * 1); + } + .py-1\.5 { + padding-block: calc(var(--spacing) * 1.5); + } + .py-2 { + padding-block: calc(var(--spacing) * 2); + } + .py-2\.5 { + padding-block: calc(var(--spacing) * 2.5); + } + .py-3 { + padding-block: calc(var(--spacing) * 3); + } + .py-6 { + padding-block: calc(var(--spacing) * 6); + } + .py-12 { + padding-block: calc(var(--spacing) * 12); + } + .py-20 { + padding-block: calc(var(--spacing) * 20); + } + .py-\[0\.2rem\] { + padding-block: 0.2rem; + } + .pt-4 { + padding-top: calc(var(--spacing) * 4); + } + .pt-8 { + padding-top: calc(var(--spacing) * 8); + } + .pt-10 { + padding-top: calc(var(--spacing) * 10); + } + .pt-16 { + padding-top: calc(var(--spacing) * 16); + } + .pt-20 { + padding-top: calc(var(--spacing) * 20); + } + .pt-24 { + padding-top: calc(var(--spacing) * 24); + } + .pr-8 { + padding-right: calc(var(--spacing) * 8); + } + .pb-4 { + padding-bottom: calc(var(--spacing) * 4); + } + .pb-10 { + padding-bottom: calc(var(--spacing) * 10); + } + .pb-12 { + padding-bottom: calc(var(--spacing) * 12); + } + .pb-20 { + padding-bottom: calc(var(--spacing) * 20); + } + .pb-24 { + padding-bottom: calc(var(--spacing) * 24); + } + .pl-2 { + padding-left: calc(var(--spacing) * 2); + } + .pl-4 { + padding-left: calc(var(--spacing) * 4); + } + .text-center { + text-align: center; + } + .text-end { + text-align: end; + } + .text-justify { + text-align: justify; + } + .text-left { + text-align: left; + } + .text-right { + text-align: right; + } + .text-start { + text-align: start; + } + .align-baseline { + vertical-align: baseline; + } + .align-bottom { + vertical-align: bottom; + } + .align-middle { + vertical-align: middle; + } + .align-sub { + vertical-align: sub; + } + .align-super { + vertical-align: super; + } + .align-text-bottom { + vertical-align: text-bottom; + } + .align-text-top { + vertical-align: text-top; + } + .align-top { + vertical-align: top; + } + .font-mono { + font-family: var(--font-mono); + } + .text-2xl { + font-size: var(--text-2xl); + line-height: var(--tw-leading, var(--text-2xl--line-height)); + } + .text-3xl { + font-size: var(--text-3xl); + line-height: var(--tw-leading, var(--text-3xl--line-height)); + } + .text-4xl { + font-size: var(--text-4xl); + line-height: var(--tw-leading, var(--text-4xl--line-height)); + } + .text-5xl { + font-size: var(--text-5xl); + line-height: var(--tw-leading, var(--text-5xl--line-height)); + } + .text-6xl { + font-size: var(--text-6xl); + line-height: var(--tw-leading, var(--text-6xl--line-height)); + } + .text-base { + font-size: var(--text-base); + line-height: var(--tw-leading, var(--text-base--line-height)); + } + .text-lg { + font-size: var(--text-lg); + line-height: var(--tw-leading, var(--text-lg--line-height)); + } + .text-sm { + font-size: var(--text-sm); + line-height: var(--tw-leading, var(--text-sm--line-height)); + } + .text-xl { + font-size: var(--text-xl); + line-height: var(--tw-leading, var(--text-xl--line-height)); + } + .text-xs { + font-size: var(--text-xs); + line-height: var(--tw-leading, var(--text-xs--line-height)); + } + .text-\[10px\] { + font-size: 10px; + } + .text-\[11px\] { + font-size: 11px; + } + .leading-none { + --tw-leading: 1; + line-height: 1; + } + .leading-relaxed { + --tw-leading: var(--leading-relaxed); + line-height: var(--leading-relaxed); + } + .leading-tight { + --tw-leading: var(--leading-tight); + line-height: var(--leading-tight); + } + .font-black { + --tw-font-weight: var(--font-weight-black); + font-weight: var(--font-weight-black); + } + .font-bold { + --tw-font-weight: var(--font-weight-bold); + font-weight: var(--font-weight-bold); + } + .font-medium { + --tw-font-weight: var(--font-weight-medium); + font-weight: var(--font-weight-medium); + } + .font-semibold { + --tw-font-weight: var(--font-weight-semibold); + font-weight: var(--font-weight-semibold); + } + .tracking-tight { + --tw-tracking: var(--tracking-tight); + letter-spacing: var(--tracking-tight); + } + .tracking-wide { + --tw-tracking: var(--tracking-wide); + letter-spacing: var(--tracking-wide); + } + .tracking-wider { + --tw-tracking: var(--tracking-wider); + letter-spacing: var(--tracking-wider); + } + .tracking-widest { + --tw-tracking: var(--tracking-widest); + letter-spacing: var(--tracking-widest); + } + .text-balance { + text-wrap: balance; + } + .text-nowrap { + text-wrap: nowrap; + } + .text-pretty { + text-wrap: pretty; + } + .text-wrap { + text-wrap: wrap; + } + .break-normal { + overflow-wrap: normal; + word-break: normal; + } + .break-words { + overflow-wrap: break-word; + } + .wrap-anywhere { + overflow-wrap: anywhere; + } + .wrap-break-word { + overflow-wrap: break-word; + } + .wrap-normal { + overflow-wrap: normal; + } + .break-all { + word-break: break-all; + } + .break-keep { + word-break: keep-all; + } + .overflow-ellipsis { + text-overflow: ellipsis; + } + .text-clip { + text-overflow: clip; + } + .text-ellipsis { + text-overflow: ellipsis; + } + .hyphens-auto { + -webkit-hyphens: auto; + hyphens: auto; + } + .hyphens-manual { + -webkit-hyphens: manual; + hyphens: manual; + } + .hyphens-none { + -webkit-hyphens: none; + hyphens: none; + } + .whitespace-break-spaces { + white-space: break-spaces; + } + .whitespace-normal { + white-space: normal; + } + .whitespace-nowrap { + white-space: nowrap; + } + .whitespace-pre { + white-space: pre; + } + .whitespace-pre-line { + white-space: pre-line; + } + .whitespace-pre-wrap { + white-space: pre-wrap; + } + .text-\[\#1a1a1a\] { + color: #1a1a1a; + } + .text-\[\#fbf0df\] { + color: #fbf0df; + } + .text-\[rgba\(255\,255\,255\,0\.87\)\] { + color: rgba(255,255,255,0.87); + } + .text-amber-800 { + color: var(--color-amber-800); + } + .text-blue-500 { + color: var(--color-blue-500); + } + .text-blue-600 { + color: var(--color-blue-600); + } + .text-blue-600\/70 { + color: color-mix(in srgb, oklch(54.6% 0.245 262.881) 70%, transparent); + @supports (color: color-mix(in lab, red, red)) { + color: color-mix(in oklab, var(--color-blue-600) 70%, transparent); + } + } + .text-blue-700 { + color: var(--color-blue-700); + } + .text-blue-800 { + color: var(--color-blue-800); + } + .text-emerald-700 { + color: var(--color-emerald-700); + } + .text-gray-300 { + color: var(--color-gray-300); + } + .text-gray-400 { + color: var(--color-gray-400); + } + .text-gray-500 { + color: var(--color-gray-500); + } + .text-gray-600 { + color: var(--color-gray-600); + } + .text-gray-700 { + color: var(--color-gray-700); + } + .text-gray-800 { + color: var(--color-gray-800); + } + .text-gray-900 { + color: var(--color-gray-900); + } + .text-green-600 { + color: var(--color-green-600); + } + .text-purple-800 { + color: var(--color-purple-800); + } + .text-red-500 { + color: var(--color-red-500); + } + .text-red-600 { + color: var(--color-red-600); + } + .text-red-800 { + color: var(--color-red-800); + } + .text-slate-300 { + color: var(--color-slate-300); + } + .text-slate-400 { + color: var(--color-slate-400); + } + .text-slate-500 { + color: var(--color-slate-500); + } + .text-slate-600 { + color: var(--color-slate-600); + } + .text-slate-700 { + color: var(--color-slate-700); + } + .text-slate-800 { + color: var(--color-slate-800); + } + .text-slate-900 { + color: var(--color-slate-900); + } + .text-white { + color: var(--color-white); + } + .text-yellow-700 { + color: var(--color-yellow-700); + } + .capitalize { + text-transform: capitalize; + } + .lowercase { + text-transform: lowercase; + } + .normal-case { + text-transform: none; + } + .uppercase { + text-transform: uppercase; + } + .italic { + font-style: italic; + } + .not-italic { + font-style: normal; + } + .font-stretch-condensed { + font-stretch: condensed; + } + .font-stretch-expanded { + font-stretch: expanded; + } + .font-stretch-extra-condensed { + font-stretch: extra-condensed; + } + .font-stretch-extra-expanded { + font-stretch: extra-expanded; + } + .font-stretch-normal { + font-stretch: normal; + } + .font-stretch-semi-condensed { + font-stretch: semi-condensed; + } + .font-stretch-semi-expanded { + font-stretch: semi-expanded; + } + .font-stretch-ultra-condensed { + font-stretch: ultra-condensed; + } + .font-stretch-ultra-expanded { + font-stretch: ultra-expanded; + } + .diagonal-fractions { + --tw-numeric-fraction: diagonal-fractions; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .lining-nums { + --tw-numeric-figure: lining-nums; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .oldstyle-nums { + --tw-numeric-figure: oldstyle-nums; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .ordinal { + --tw-ordinal: ordinal; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .proportional-nums { + --tw-numeric-spacing: proportional-nums; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .slashed-zero { + --tw-slashed-zero: slashed-zero; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .stacked-fractions { + --tw-numeric-fraction: stacked-fractions; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .tabular-nums { + --tw-numeric-spacing: tabular-nums; + font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); + } + .normal-nums { + font-variant-numeric: normal; + } + .line-through { + text-decoration-line: line-through; + } + .no-underline { + text-decoration-line: none; + } + .overline { + text-decoration-line: overline; + } + .underline { + text-decoration-line: underline; + } + .decoration-dashed { + text-decoration-style: dashed; + } + .decoration-dotted { + text-decoration-style: dotted; + } + .decoration-double { + text-decoration-style: double; + } + .decoration-solid { + text-decoration-style: solid; + } + .decoration-wavy { + text-decoration-style: wavy; + } + .decoration-auto { + text-decoration-thickness: auto; + } + .decoration-from-font { + text-decoration-thickness: from-font; + } + .underline-offset-4 { + text-underline-offset: 4px; + } + .antialiased { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + .subpixel-antialiased { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + .placeholder-\[\#fbf0df\]\/40 { + &::placeholder { + color: color-mix(in oklab, #fbf0df 40%, transparent); + } + } + .accent-auto { + accent-color: auto; + } + .scheme-dark { + color-scheme: dark; + } + .scheme-light { + color-scheme: light; + } + .scheme-light-dark { + color-scheme: light dark; + } + .scheme-normal { + color-scheme: normal; + } + .scheme-only-dark { + color-scheme: only dark; + } + .scheme-only-light { + color-scheme: only light; + } + .opacity-0 { + opacity: 0%; + } + .opacity-20 { + opacity: 20%; + } + .opacity-50 { + opacity: 50%; + } + .mix-blend-plus-darker { + mix-blend-mode: plus-darker; + } + .mix-blend-plus-lighter { + mix-blend-mode: plus-lighter; + } + .shadow { + --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-2xl { + --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-\[4px_0_10px_rgba\(254\,249\,195\,1\)\] { + --tw-shadow: 4px 0 10px var(--tw-shadow-color, rgba(254,249,195,1)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-lg { + --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-md { + --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-sm { + --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-xs { + --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .ring { + --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .inset-ring { + --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-initial { + --tw-shadow-color: initial; + } + .inset-shadow-initial { + --tw-inset-shadow-color: initial; + } + .outline-hidden { + --tw-outline-style: none; + outline-style: none; + @media (forced-colors: active) { + outline: 2px solid transparent; + outline-offset: 2px; + } + } + .outline { + outline-style: var(--tw-outline-style); + outline-width: 1px; + } + .blur { + --tw-blur: blur(8px); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .drop-shadow { + --tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.1))) drop-shadow(0 1px 1px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.06))); + --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow( 0 1px 1px rgb(0 0 0 / 0.06)); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .drop-shadow-none { + --tw-drop-shadow: ; + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .grayscale { + --tw-grayscale: grayscale(100%); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .invert { + --tw-invert: invert(100%); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .sepia { + --tw-sepia: sepia(100%); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .filter { + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + .backdrop-blur { + --tw-backdrop-blur: blur(8px); + -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + } + .backdrop-blur-md { + --tw-backdrop-blur: blur(var(--blur-md)); + -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + } + .backdrop-grayscale { + --tw-backdrop-grayscale: grayscale(100%); + -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + } + .backdrop-invert { + --tw-backdrop-invert: invert(100%); + -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + } + .backdrop-sepia { + --tw-backdrop-sepia: sepia(100%); + -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + } + .backdrop-filter { + -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); + } + .transition { + transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + .transition-\[color\,box-shadow\] { + transition-property: color,box-shadow; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + .transition-all { + transition-property: all; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + .transition-colors { + transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + .transition-transform { + transition-property: transform, translate, scale, rotate; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + .transition-discrete { + transition-behavior: allow-discrete; + } + .transition-normal { + transition-behavior: normal; + } + .duration-100 { + --tw-duration: 100ms; + transition-duration: 100ms; + } + .duration-300 { + --tw-duration: 300ms; + transition-duration: 300ms; + } + .duration-500 { + --tw-duration: 500ms; + transition-duration: 500ms; + } + .duration-700 { + --tw-duration: 700ms; + transition-duration: 700ms; + } + .ease-in { + --tw-ease: var(--ease-in); + transition-timing-function: var(--ease-in); + } + .ease-in-out { + --tw-ease: var(--ease-in-out); + transition-timing-function: var(--ease-in-out); + } + .ease-out { + --tw-ease: var(--ease-out); + transition-timing-function: var(--ease-out); + } + .will-change-auto { + will-change: auto; + } + .will-change-contents { + will-change: contents; + } + .will-change-scroll { + will-change: scroll-position; + } + .will-change-transform { + will-change: transform; + } + .contain-inline-size { + --tw-contain-size: inline-size; + contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,); + } + .contain-layout { + --tw-contain-layout: layout; + contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,); + } + .contain-paint { + --tw-contain-paint: paint; + contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,); + } + .contain-size { + --tw-contain-size: size; + contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,); + } + .contain-style { + --tw-contain-style: style; + contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,); + } + .contain-content { + contain: content; + } + .contain-none { + contain: none; + } + .contain-strict { + contain: strict; + } + .content-none { + --tw-content: none; + content: none; + } + .forced-color-adjust-auto { + forced-color-adjust: auto; + } + .forced-color-adjust-none { + forced-color-adjust: none; + } + .outline-dashed { + --tw-outline-style: dashed; + outline-style: dashed; + } + .outline-dotted { + --tw-outline-style: dotted; + outline-style: dotted; + } + .outline-double { + --tw-outline-style: double; + outline-style: double; + } + .outline-none { + --tw-outline-style: none; + outline-style: none; + } + .outline-solid { + --tw-outline-style: solid; + outline-style: solid; + } + .select-none { + -webkit-user-select: none; + user-select: none; + } + .backface-hidden { + backface-visibility: hidden; + } + .backface-visible { + backface-visibility: visible; + } + .divide-x-reverse { + :where(& > :not(:last-child)) { + --tw-divide-x-reverse: 1; + } + } + .duration-initial { + --tw-duration: initial; + } + .ring-inset { + --tw-ring-inset: inset; + } + .text-shadow-initial { + --tw-text-shadow-color: initial; + } + .transform-3d { + transform-style: preserve-3d; + } + .transform-border { + transform-box: border-box; + } + .transform-content { + transform-box: content-box; + } + .transform-fill { + transform-box: fill-box; + } + .transform-flat { + transform-style: flat; + } + .transform-stroke { + transform-box: stroke-box; + } + .transform-view { + transform-box: view-box; + } + .group-hover\:-translate-x-1 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + --tw-translate-x: calc(var(--spacing) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + } + .group-hover\:translate-x-0 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + --tw-translate-x: calc(var(--spacing) * 0); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + } + .group-hover\:scale-105 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + --tw-scale-x: 105%; + --tw-scale-y: 105%; + --tw-scale-z: 105%; + scale: var(--tw-scale-x) var(--tw-scale-y); + } + } + } + .group-hover\:scale-110 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + --tw-scale-x: 110%; + --tw-scale-y: 110%; + --tw-scale-z: 110%; + scale: var(--tw-scale-x) var(--tw-scale-y); + } + } + } + .group-hover\:rotate-12 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + rotate: 12deg; + } + } + } + .group-hover\:text-blue-600 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + color: var(--color-blue-600); + } + } + } + .group-hover\:opacity-100 { + &:is(:where(.group):hover *) { + @media (hover: hover) { + opacity: 100%; + } + } + } + .group-data-\[disabled\=true\]\:pointer-events-none { + &:is(:where(.group)[data-disabled="true"] *) { + pointer-events: none; + } + } + .group-data-\[disabled\=true\]\:opacity-50 { + &:is(:where(.group)[data-disabled="true"] *) { + opacity: 50%; + } + } + .peer-disabled\:cursor-not-allowed { + &:is(:where(.peer):disabled ~ *) { + cursor: not-allowed; + } + } + .peer-disabled\:opacity-50 { + &:is(:where(.peer):disabled ~ *) { + opacity: 50%; + } + } + .file\:inline-flex { + &::file-selector-button { + display: inline-flex; + } + } + .file\:h-7 { + &::file-selector-button { + height: calc(var(--spacing) * 7); + } + } + .file\:border-0 { + &::file-selector-button { + border-style: var(--tw-border-style); + border-width: 0px; + } + } + .file\:bg-transparent { + &::file-selector-button { + background-color: transparent; + } + } + .file\:text-sm { + &::file-selector-button { + font-size: var(--text-sm); + line-height: var(--tw-leading, var(--text-sm--line-height)); + } + } + .file\:font-medium { + &::file-selector-button { + --tw-font-weight: var(--font-weight-medium); + font-weight: var(--font-weight-medium); + } + } + .focus-within\:border-\[\#f3d5a3\] { + &:focus-within { + border-color: #f3d5a3; + } + } + .hover\:-translate-y-1 { + &:hover { + @media (hover: hover) { + --tw-translate-y: calc(var(--spacing) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + } + .hover\:-translate-y-px { + &:hover { + @media (hover: hover) { + --tw-translate-y: -1px; + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + } + .hover\:scale-105 { + &:hover { + @media (hover: hover) { + --tw-scale-x: 105%; + --tw-scale-y: 105%; + --tw-scale-z: 105%; + scale: var(--tw-scale-x) var(--tw-scale-y); + } + } + } + .hover\:border-blue-600 { + &:hover { + @media (hover: hover) { + border-color: var(--color-blue-600); + } + } + } + .hover\:bg-\[\#f3d5a3\] { + &:hover { + @media (hover: hover) { + background-color: #f3d5a3; + } + } + } + .hover\:bg-blue-50\/30 { + &:hover { + @media (hover: hover) { + background-color: color-mix(in srgb, oklch(97% 0.014 254.604) 30%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-blue-50) 30%, transparent); + } + } + } + } + .hover\:bg-blue-600 { + &:hover { + @media (hover: hover) { + background-color: var(--color-blue-600); + } + } + } + .hover\:bg-blue-700 { + &:hover { + @media (hover: hover) { + background-color: var(--color-blue-700); + } + } + } + .hover\:bg-emerald-50\/30 { + &:hover { + @media (hover: hover) { + background-color: color-mix(in srgb, oklch(97.9% 0.021 166.113) 30%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-emerald-50) 30%, transparent); + } + } + } + } + .hover\:bg-emerald-700 { + &:hover { + @media (hover: hover) { + background-color: var(--color-emerald-700); + } + } + } + .hover\:bg-purple-50\/30 { + &:hover { + @media (hover: hover) { + background-color: color-mix(in srgb, oklch(97.7% 0.014 308.299) 30%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-purple-50) 30%, transparent); + } + } + } + } + .hover\:bg-red-50\/30 { + &:hover { + @media (hover: hover) { + background-color: color-mix(in srgb, oklch(97.1% 0.013 17.38) 30%, transparent); + @supports (color: color-mix(in lab, red, red)) { + background-color: color-mix(in oklab, var(--color-red-50) 30%, transparent); + } + } + } + } + .hover\:bg-slate-100 { + &:hover { + @media (hover: hover) { + background-color: var(--color-slate-100); + } + } + } + .hover\:text-blue-500 { + &:hover { + @media (hover: hover) { + color: var(--color-blue-500); + } + } + } + .hover\:text-blue-600 { + &:hover { + @media (hover: hover) { + color: var(--color-blue-600); + } + } + } + .hover\:text-emerald-500 { + &:hover { + @media (hover: hover) { + color: var(--color-emerald-500); + } + } + } + .hover\:text-purple-500 { + &:hover { + @media (hover: hover) { + color: var(--color-purple-500); + } + } + } + .hover\:text-red-500 { + &:hover { + @media (hover: hover) { + color: var(--color-red-500); + } + } + } + .hover\:text-slate-900 { + &:hover { + @media (hover: hover) { + color: var(--color-slate-900); + } + } + } + .hover\:text-white { + &:hover { + @media (hover: hover) { + color: var(--color-white); + } + } + } + .hover\:underline { + &:hover { + @media (hover: hover) { + text-decoration-line: underline; + } + } + } + .hover\:opacity-80 { + &:hover { + @media (hover: hover) { + opacity: 80%; + } + } + } + .hover\:shadow-xl { + &:hover { + @media (hover: hover) { + --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + } + } + .hover\:drop-shadow-\[0_0_2em_\#61dafbaa\] { + &:hover { + @media (hover: hover) { + --tw-drop-shadow-size: drop-shadow(0 0 2em var(--tw-drop-shadow-color, #61dafbaa)); + --tw-drop-shadow: var(--tw-drop-shadow-size); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + } + } + .hover\:drop-shadow-\[0_0_2em_\#646cffaa\] { + &:hover { + @media (hover: hover) { + --tw-drop-shadow-size: drop-shadow(0 0 2em var(--tw-drop-shadow-color, #646cffaa)); + --tw-drop-shadow: var(--tw-drop-shadow-size); + filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); + } + } + } + .hover\:\[animation-play-state\:paused\] { + &:hover { + @media (hover: hover) { + animation-play-state: paused; + } + } + } + .focus\:border-\[\#f3d5a3\] { + &:focus { + border-color: #f3d5a3; + } + } + .focus\:text-white { + &:focus { + color: var(--color-white); + } + } + .focus-visible\:ring-\[3px\] { + &:focus-visible { + --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + } + .active\:scale-95 { + &:active { + --tw-scale-x: 95%; + --tw-scale-y: 95%; + --tw-scale-z: 95%; + scale: var(--tw-scale-x) var(--tw-scale-y); + } + } + .disabled\:pointer-events-none { + &:disabled { + pointer-events: none; + } + } + .disabled\:cursor-not-allowed { + &:disabled { + cursor: not-allowed; + } + } + .disabled\:opacity-50 { + &:disabled { + opacity: 50%; + } + } + .has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\] { + &:has(*[data-slot="card-action"]) { + grid-template-columns: 1fr auto; + } + } + .has-\[\>svg\]\:px-2\.5 { + &:has(>svg) { + padding-inline: calc(var(--spacing) * 2.5); + } + } + .has-\[\>svg\]\:px-3 { + &:has(>svg) { + padding-inline: calc(var(--spacing) * 3); + } + } + .has-\[\>svg\]\:px-4 { + &:has(>svg) { + padding-inline: calc(var(--spacing) * 4); + } + } + .data-\[disabled\]\:pointer-events-none { + &[data-disabled] { + pointer-events: none; + } + } + .data-\[disabled\]\:opacity-50 { + &[data-disabled] { + opacity: 50%; + } + } + .data-\[side\=bottom\]\:translate-y-1 { + &[data-side="bottom"] { + --tw-translate-y: calc(var(--spacing) * 1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + .data-\[side\=left\]\:-translate-x-1 { + &[data-side="left"] { + --tw-translate-x: calc(var(--spacing) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + .data-\[side\=right\]\:translate-x-1 { + &[data-side="right"] { + --tw-translate-x: calc(var(--spacing) * 1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + .data-\[side\=top\]\:-translate-y-1 { + &[data-side="top"] { + --tw-translate-y: calc(var(--spacing) * -1); + translate: var(--tw-translate-x) var(--tw-translate-y); + } + } + .data-\[size\=default\]\:h-9 { + &[data-size="default"] { + height: calc(var(--spacing) * 9); + } + } + .data-\[size\=sm\]\:h-8 { + &[data-size="sm"] { + height: calc(var(--spacing) * 8); + } + } + .\*\:data-\[slot\=select-value\]\:line-clamp-1 { + :is(& > *) { + &[data-slot="select-value"] { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 1; + } + } + } + .\*\:data-\[slot\=select-value\]\:flex { + :is(& > *) { + &[data-slot="select-value"] { + display: flex; + } + } + } + .\*\:data-\[slot\=select-value\]\:items-center { + :is(& > *) { + &[data-slot="select-value"] { + align-items: center; + } + } + } + .\*\:data-\[slot\=select-value\]\:gap-2 { + :is(& > *) { + &[data-slot="select-value"] { + gap: calc(var(--spacing) * 2); + } + } + } + .sm\:px-6 { + @media (width >= 40rem) { + padding-inline: calc(var(--spacing) * 6); + } + } + .sm\:text-4xl { + @media (width >= 40rem) { + font-size: var(--text-4xl); + line-height: var(--tw-leading, var(--text-4xl--line-height)); + } + } + .md\:flex { + @media (width >= 48rem) { + display: flex; + } + } + .md\:aspect-\[21\/9\] { + @media (width >= 48rem) { + aspect-ratio: 21/9; + } + } + .md\:grid-cols-2 { + @media (width >= 48rem) { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + } + .md\:grid-cols-3 { + @media (width >= 48rem) { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + } + .md\:flex-row { + @media (width >= 48rem) { + flex-direction: row; + } + } + .md\:items-center { + @media (width >= 48rem) { + align-items: center; + } + } + .md\:gap-8 { + @media (width >= 48rem) { + gap: calc(var(--spacing) * 8); + } + } + .md\:p-8 { + @media (width >= 48rem) { + padding: calc(var(--spacing) * 8); + } + } + .md\:p-12 { + @media (width >= 48rem) { + padding: calc(var(--spacing) * 12); + } + } + .md\:text-2xl { + @media (width >= 48rem) { + font-size: var(--text-2xl); + line-height: var(--tw-leading, var(--text-2xl--line-height)); + } + } + .md\:text-3xl { + @media (width >= 48rem) { + font-size: var(--text-3xl); + line-height: var(--tw-leading, var(--text-3xl--line-height)); + } + } + .md\:text-5xl { + @media (width >= 48rem) { + font-size: var(--text-5xl); + line-height: var(--tw-leading, var(--text-5xl--line-height)); + } + } + .md\:text-6xl { + @media (width >= 48rem) { + font-size: var(--text-6xl); + line-height: var(--tw-leading, var(--text-6xl--line-height)); + } + } + .md\:text-sm { + @media (width >= 48rem) { + font-size: var(--text-sm); + line-height: var(--tw-leading, var(--text-sm--line-height)); + } + } + .lg\:col-span-4 { + @media (width >= 64rem) { + grid-column: span 4 / span 4; + } + } + .lg\:col-span-8 { + @media (width >= 64rem) { + grid-column: span 8 / span 8; + } + } + .lg\:mx-10 { + @media (width >= 64rem) { + margin-inline: calc(var(--spacing) * 10); + } + } + .lg\:block { + @media (width >= 64rem) { + display: block; + } + } + .lg\:grid-cols-3 { + @media (width >= 64rem) { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + } + .lg\:grid-cols-12 { + @media (width >= 64rem) { + grid-template-columns: repeat(12, minmax(0, 1fr)); + } + } + .lg\:px-8 { + @media (width >= 64rem) { + padding-inline: calc(var(--spacing) * 8); + } + } + .xl\:col-span-3 { + @media (width >= 80rem) { + grid-column: span 3 / span 3; + } + } + .xl\:col-span-9 { + @media (width >= 80rem) { + grid-column: span 9 / span 9; + } + } + .xl\:grid-cols-4 { + @media (width >= 80rem) { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + } + .\[\&_svg\]\:pointer-events-none { + & svg { + pointer-events: none; + } + } + .\[\&_svg\]\:shrink-0 { + & svg { + flex-shrink: 0; + } + } + .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 { + & svg:not([class*='size-']) { + width: calc(var(--spacing) * 4); + height: calc(var(--spacing) * 4); + } + } + .\[\.border-b\]\:pb-6 { + &:is(.border-b) { + padding-bottom: calc(var(--spacing) * 6); + } + } + .\[\.border-t\]\:pt-6 { + &:is(.border-t) { + padding-top: calc(var(--spacing) * 6); + } + } + .\*\:\[span\]\:last\:flex { + :is(& > *) { + &:is(span) { + &:last-child { + display: flex; + } + } + } + } + .\*\:\[span\]\:last\:items-center { + :is(& > *) { + &:is(span) { + &:last-child { + align-items: center; + } + } + } + } + .\*\:\[span\]\:last\:gap-2 { + :is(& > *) { + &:is(span) { + &:last-child { + gap: calc(var(--spacing) * 2); + } + } + } + } +} +@property --tw-translate-x { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-translate-y { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-translate-z { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-scale-x { + syntax: "*"; + inherits: false; + initial-value: 1; +} +@property --tw-scale-y { + syntax: "*"; + inherits: false; + initial-value: 1; +} +@property --tw-scale-z { + syntax: "*"; + inherits: false; + initial-value: 1; +} +@property --tw-rotate-x { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-y { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-z { + syntax: "*"; + inherits: false; +} +@property --tw-skew-x { + syntax: "*"; + inherits: false; +} +@property --tw-skew-y { + syntax: "*"; + inherits: false; +} +@property --tw-pan-x { + syntax: "*"; + inherits: false; +} +@property --tw-pan-y { + syntax: "*"; + inherits: false; +} +@property --tw-pinch-zoom { + syntax: "*"; + inherits: false; +} +@property --tw-scroll-snap-strictness { + syntax: "*"; + inherits: false; + initial-value: proximity; +} +@property --tw-space-y-reverse { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-space-x-reverse { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-divide-x-reverse { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-border-style { + syntax: "*"; + inherits: false; + initial-value: solid; +} +@property --tw-divide-y-reverse { + syntax: "*"; + inherits: false; + initial-value: 0; +} +@property --tw-gradient-position { + syntax: "*"; + inherits: false; +} +@property --tw-gradient-from { + syntax: ""; + inherits: false; + initial-value: #0000; +} +@property --tw-gradient-via { + syntax: ""; + inherits: false; + initial-value: #0000; +} +@property --tw-gradient-to { + syntax: ""; + inherits: false; + initial-value: #0000; +} +@property --tw-gradient-stops { + syntax: "*"; + inherits: false; +} +@property --tw-gradient-via-stops { + syntax: "*"; + inherits: false; +} +@property --tw-gradient-from-position { + syntax: ""; + inherits: false; + initial-value: 0%; +} +@property --tw-gradient-via-position { + syntax: ""; + inherits: false; + initial-value: 50%; +} +@property --tw-gradient-to-position { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-leading { + syntax: "*"; + inherits: false; +} +@property --tw-font-weight { + syntax: "*"; + inherits: false; +} +@property --tw-tracking { + syntax: "*"; + inherits: false; +} +@property --tw-ordinal { + syntax: "*"; + inherits: false; +} +@property --tw-slashed-zero { + syntax: "*"; + inherits: false; +} +@property --tw-numeric-figure { + syntax: "*"; + inherits: false; +} +@property --tw-numeric-spacing { + syntax: "*"; + inherits: false; +} +@property --tw-numeric-fraction { + syntax: "*"; + inherits: false; +} +@property --tw-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-inset-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-inset-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-inset-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-ring-color { + syntax: "*"; + inherits: false; +} +@property --tw-ring-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-inset-ring-color { + syntax: "*"; + inherits: false; +} +@property --tw-inset-ring-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-ring-inset { + syntax: "*"; + inherits: false; +} +@property --tw-ring-offset-width { + syntax: ""; + inherits: false; + initial-value: 0px; +} +@property --tw-ring-offset-color { + syntax: "*"; + inherits: false; + initial-value: #fff; +} +@property --tw-ring-offset-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-outline-style { + syntax: "*"; + inherits: false; + initial-value: solid; +} +@property --tw-blur { + syntax: "*"; + inherits: false; +} +@property --tw-brightness { + syntax: "*"; + inherits: false; +} +@property --tw-contrast { + syntax: "*"; + inherits: false; +} +@property --tw-grayscale { + syntax: "*"; + inherits: false; +} +@property --tw-hue-rotate { + syntax: "*"; + inherits: false; +} +@property --tw-invert { + syntax: "*"; + inherits: false; +} +@property --tw-opacity { + syntax: "*"; + inherits: false; +} +@property --tw-saturate { + syntax: "*"; + inherits: false; +} +@property --tw-sepia { + syntax: "*"; + inherits: false; +} +@property --tw-drop-shadow { + syntax: "*"; + inherits: false; +} +@property --tw-drop-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-drop-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-drop-shadow-size { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-blur { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-brightness { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-contrast { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-grayscale { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-hue-rotate { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-invert { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-opacity { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-saturate { + syntax: "*"; + inherits: false; +} +@property --tw-backdrop-sepia { + syntax: "*"; + inherits: false; +} +@property --tw-duration { + syntax: "*"; + inherits: false; +} +@property --tw-ease { + syntax: "*"; + inherits: false; +} +@property --tw-contain-size { + syntax: "*"; + inherits: false; +} +@property --tw-contain-layout { + syntax: "*"; + inherits: false; +} +@property --tw-contain-paint { + syntax: "*"; + inherits: false; +} +@property --tw-contain-style { + syntax: "*"; + inherits: false; +} +@property --tw-text-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-text-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@keyframes spin { + to { + transform: rotate(360deg); + } +} +@keyframes ping { + 75%, 100% { + transform: scale(2); + opacity: 0; + } +} +@keyframes pulse { + 50% { + opacity: 0.5; + } +} +@keyframes bounce { + 0%, 100% { + transform: translateY(-25%); + animation-timing-function: cubic-bezier(0.8, 0, 1, 1); + } + 50% { + transform: none; + animation-timing-function: cubic-bezier(0, 0, 0.2, 1); + } +} +@layer properties { + @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { + *, ::before, ::after, ::backdrop { + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-translate-z: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-scale-z: 1; + --tw-rotate-x: initial; + --tw-rotate-y: initial; + --tw-rotate-z: initial; + --tw-skew-x: initial; + --tw-skew-y: initial; + --tw-pan-x: initial; + --tw-pan-y: initial; + --tw-pinch-zoom: initial; + --tw-scroll-snap-strictness: proximity; + --tw-space-y-reverse: 0; + --tw-space-x-reverse: 0; + --tw-divide-x-reverse: 0; + --tw-border-style: solid; + --tw-divide-y-reverse: 0; + --tw-gradient-position: initial; + --tw-gradient-from: #0000; + --tw-gradient-via: #0000; + --tw-gradient-to: #0000; + --tw-gradient-stops: initial; + --tw-gradient-via-stops: initial; + --tw-gradient-from-position: 0%; + --tw-gradient-via-position: 50%; + --tw-gradient-to-position: 100%; + --tw-leading: initial; + --tw-font-weight: initial; + --tw-tracking: initial; + --tw-ordinal: initial; + --tw-slashed-zero: initial; + --tw-numeric-figure: initial; + --tw-numeric-spacing: initial; + --tw-numeric-fraction: initial; + --tw-shadow: 0 0 #0000; + --tw-shadow-color: initial; + --tw-shadow-alpha: 100%; + --tw-inset-shadow: 0 0 #0000; + --tw-inset-shadow-color: initial; + --tw-inset-shadow-alpha: 100%; + --tw-ring-color: initial; + --tw-ring-shadow: 0 0 #0000; + --tw-inset-ring-color: initial; + --tw-inset-ring-shadow: 0 0 #0000; + --tw-ring-inset: initial; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-offset-shadow: 0 0 #0000; + --tw-outline-style: solid; + --tw-blur: initial; + --tw-brightness: initial; + --tw-contrast: initial; + --tw-grayscale: initial; + --tw-hue-rotate: initial; + --tw-invert: initial; + --tw-opacity: initial; + --tw-saturate: initial; + --tw-sepia: initial; + --tw-drop-shadow: initial; + --tw-drop-shadow-color: initial; + --tw-drop-shadow-alpha: 100%; + --tw-drop-shadow-size: initial; + --tw-backdrop-blur: initial; + --tw-backdrop-brightness: initial; + --tw-backdrop-contrast: initial; + --tw-backdrop-grayscale: initial; + --tw-backdrop-hue-rotate: initial; + --tw-backdrop-invert: initial; + --tw-backdrop-opacity: initial; + --tw-backdrop-saturate: initial; + --tw-backdrop-sepia: initial; + --tw-duration: initial; + --tw-ease: initial; + --tw-contain-size: initial; + --tw-contain-layout: initial; + --tw-contain-paint: initial; + --tw-contain-style: initial; + --tw-text-shadow-color: initial; + --tw-text-shadow-alpha: 100%; + } + } +} diff --git a/assets/css/input.css b/assets/css/input.css new file mode 100644 index 0000000..a461c50 --- /dev/null +++ b/assets/css/input.css @@ -0,0 +1 @@ +@import "tailwindcss"; \ No newline at end of file diff --git a/assets/css/post.css b/assets/css/post.css new file mode 100644 index 0000000..29542ae --- /dev/null +++ b/assets/css/post.css @@ -0,0 +1,153 @@ +/* 1. 标题和元数据美化 */ +.gh-article-title { + margin-bottom: 1.5rem; + line-height: 1.1; + font-weight: 800; + letter-spacing: -0.02em; +} + +.gh-article-meta-modern { + display: flex; + align-items: center; + gap: 12px; + margin-top: 2rem; + margin-bottom: 3rem; + padding-bottom: 2rem; + border-bottom: 1px solid rgba(0,0,0,0.05); +} + +.gh-author-avatar img { + width: 44px; + height: 44px; + border-radius: 50%; + border: 2px solid #fff; + box-shadow: 0 2px 5px rgba(0,0,0,0.1); + transition: transform 0.2s ease; +} + +.gh-author-avatar:hover img { + transform: translateY(-2px); +} + +.gh-article-meta-text { + line-height: 1.4; + font-size: 0.95rem; +} + +.gh-author-name { + font-weight: 700; + color: var(--ghost-accent-color); +} + +.gh-article-meta-sub { + opacity: 0.6; + font-size: 0.85rem; +} + +/* 2. 封面图圆角与阴影 */ +.gh-feature-image-wrapper img { + border-radius: 12px; + box-shadow: 0 20px 40px rgba(0,0,0,0.08); +} + +/* 3. 正文排版优化 */ +.gh-content { + font-size: 1.15rem; + line-height: 1.75; +} + +.gh-content p { + margin-bottom: 0.8em; + text-indent: 2em; +} + +.gh-content figure p, +.gh-content blockquote p { + text-indent: 0; +} + +/* 4. 底部标签样式 */ +.gh-post-tags a { + display: inline-block; + padding: 4px 12px; + margin: 4px; + background: #f0f0f0; + border-radius: 20px; + font-size: 0.8rem; + transition: all 0.2s; +} + +.gh-post-tags a:hover { + background: var(--ghost-accent-color); + color: #fff !important; + text-decoration: none; +} + +/* 5. 阅读更多部分的卡片提升 */ +.gh-feed { + gap: 2rem; +} + +.post-card { + transition: transform 0.3s ease; +} + +.post-card:hover { + transform: translateY(-5px); +} + +/* 3.5 分割线美化 */ +.gh-content hr { + margin: 3rem 0; /* 上下留出一定间距，让页面有呼吸感 */ + border: 0; /* 去除默认的凹凸边框 */ + border-top: 1px solid rgba(0, 0, 0, 0.1); /* 使用带透明度的黑色，形成优雅的灰色 */ + /* 或者使用具体的十六进制色值： border-top: 1px solid #e0e0e0; */ +} + +/* 标题样式美化 */ +.gh-content h1, +.gh-content h2, +.gh-content h3 { + color: #1a1a1a; + line-height: 1.3; + margin: 2.5rem 0 1rem; /* 增加上方间距，减少下方间距 */ + font-weight: 700; +} + +.gh-content h1 { font-size: 2rem; } +.gh-content h2 { font-size: 1.65rem; } +.gh-content h3 { font-size: 1.35rem; } + +/* 重点：标题不需要首行缩进 */ +.gh-content h1, .gh-content h2, .gh-content h3 { + text-indent: 0 !important; +} + +/* 引文样式优化 */ +.gh-content blockquote { + margin: 2rem 0; + padding: 0.5rem 1.5rem; + border-left: 4px solid var(--ghost-accent-color, #15171a); /* 使用主题色或深色作为边框 */ + background: rgba(0, 0, 0, 0.02); /* 极淡的背景色 */ + font-style: italic; + color: #444; +} + +/* 引文内的段落不需要缩进 */ +.gh-content blockquote p { + text-indent: 0 !important; + margin-bottom: 0.5em; +} + + +/* 宽屏图片样式示例 */ +.kg-width-wide .kg-image { + max-width: 1200px; + margin: 2em auto; +} + +/* 全屏图片样式示例 */ +.kg-width-full .kg-image { + max-width: 100vw; + margin: 2em auto; +} \ No newline at end of file diff --git a/assets/css/screen.css b/assets/css/screen.css new file mode 100644 index 0000000..01f48c8 --- /dev/null +++ b/assets/css/screen.css @@ -0,0 +1,13 @@ +@keyframes marquee-custom { + 0% { transform: translateX(0); } + 100% { transform: translateX(-100%); } +} +.animate-marquee-custom { animation: marquee-custom 20s linear infinite; } +@keyframes slide-down { + from { opacity: 0; transform: translateY(-10px); } + to { opacity: 1; transform: translateY(0); } +} + +.animate-slide-down { + animation: slide-down 0.2s ease-out forwards; +} \ No newline at end of file diff --git a/assets/js/carousel.js b/assets/js/carousel.js new file mode 100644 index 0000000..8da4387 --- /dev/null +++ b/assets/js/carousel.js @@ -0,0 +1,79 @@ +document.addEventListener('DOMContentLoaded', function() { + const carousel = document.querySelector('.js-carousel'); + if (!carousel) return; + + const track = carousel.querySelector('.js-carousel-track'); + const slides = track.children; + const dots = carousel.querySelectorAll('.js-dot'); + const prevBtn = carousel.querySelector('.js-carousel-prev'); + const nextBtn = carousel.querySelector('.js-carousel-next'); + + let current = 0; + const total = slides.length; + let touchStartX = 0; + let touchEndX = 0; + + function updateDisplay() { + // 移动轨道 + track.style.transform = `translateX(-${current * 100}%)`; + // 更新指示器 + dots.forEach((dot, i) => { + if (i === current) { + dot.classList.add('bg-white', 'w-6'); + dot.classList.remove('bg-white/50'); + } else { + dot.classList.remove('bg-white', 'w-6'); + dot.classList.add('bg-white/50'); + } + }); + } + + function next() { + current = (current === total - 1) ? 0 : current + 1; + updateDisplay(); + } + + function prev() { + current = (current === 0) ? total - 1 : current - 1; + updateDisplay(); + } + + // 自动轮播 + let autoPlay = setInterval(next, 5000); + + function resetTimer() { + clearInterval(autoPlay); + autoPlay = setInterval(next, 5000); + } + + // 事件监听 + if (nextBtn) nextBtn.addEventListener('click', () => { next(); resetTimer(); }); + if (prevBtn) prevBtn.addEventListener('click', () => { prev(); resetTimer(); }); + + dots.forEach(dot => { + dot.addEventListener('click', () => { + current = parseInt(dot.getAttribute('data-index')); + updateDisplay(); + resetTimer(); + }); + }); + + // --- 触摸滑动逻辑 --- + carousel.addEventListener('touchstart', (e) => { + touchStartX = e.changedTouches[0].screenX; + }, { passive: true }); + + carousel.addEventListener('touchend', (e) => { + touchEndX = e.changedTouches[0].screenX; + const distance = touchStartX - touchEndX; + const minSwipeDistance = 50; + + if (Math.abs(distance) > minSwipeDistance) { + if (distance > 0) next(); else prev(); + resetTimer(); + } + }, { passive: true }); + + // 初始化 + updateDisplay(); +}); \ No newline at end of file diff --git a/assets/js/mobile-menu.js b/assets/js/mobile-menu.js new file mode 100644 index 0000000..be88323 --- /dev/null +++ b/assets/js/mobile-menu.js @@ -0,0 +1,150 @@ +(function() { + 'use strict'; + + let drawerElement = null; + let isDrawerOpen = false; + + // 创建抽屉 (从隐藏的 div 克隆) + function createDrawer() { + const template = document.getElementById('mobile-drawer-template'); + if (!template) { + console.error('Drawer template not found'); + return null; + } + + const overlay = template.querySelector('#mobile-sidebar-overlay'); + if (!overlay) { + console.error('Overlay element not found in template'); + return null; + } + + const clone = overlay.cloneNode(true); + clone.id = 'mobile-sidebar-overlay-active'; + + // --- [新增逻辑] 自动搬运侧边栏挂件 --- + const sidebarWidgets = document.getElementById('sidebar-widgets'); + const drawerContent = clone.querySelector('.p-5.space-y-6'); // 抽屉的内容容器 + + if (sidebarWidgets && drawerContent) { + // 创建一个专门存放侧边栏内容的容器 + const sidebarMobileContainer = document.createElement('section'); + sidebarMobileContainer.className = 'mobile-sidebar-content space-y-6 pt-4 border-t border-gray-100'; + sidebarMobileContainer.innerHTML = '

实时资讯

'; + + // 克隆侧边栏所有的子元素（欢迎卡片、计时器等） + const widgetsClone = sidebarWidgets.cloneNode(true); + // 移除原本的 ID 避免冲突 + widgetsClone.removeAttribute('id'); + // 将侧边栏内容追加到抽屉中 + sidebarMobileContainer.appendChild(widgetsClone); + drawerContent.appendChild(sidebarMobileContainer); + } + // ------------------------------------ + + document.body.appendChild(clone); + return clone; + } + + function openDrawer() { + if (isDrawerOpen) return; + + if (!drawerElement) { + drawerElement = createDrawer(); + if (!drawerElement) return; + bindDrawerEvents(); + } + + // 锁定背景滚动 + const scrollY = window.scrollY; + document.body.style.overflow = 'hidden'; + document.body.style.position = 'fixed'; + document.body.style.top = `-${scrollY}px`; + document.body.style.width = '100%'; + + drawerElement.style.display = 'block'; + isDrawerOpen = true; + + requestAnimationFrame(() => { + requestAnimationFrame(() => { + const backdrop = drawerElement.querySelector('.drawer-backdrop'); + const panel = drawerElement.querySelector('.drawer-panel'); + if (backdrop) backdrop.style.opacity = '1'; + if (panel) panel.style.transform = 'translateX(0)'; + }); + }); + + // 如果克隆的内容里包含计时器，需要重新初始化计时器逻辑 + if (window.initTimers) window.initTimers(drawerElement); + } + + function closeDrawer() { + if (!isDrawerOpen || !drawerElement) return; + + const backdrop = drawerElement.querySelector('.drawer-backdrop'); + const panel = drawerElement.querySelector('.drawer-panel'); + + if (backdrop) backdrop.style.opacity = '0'; + if (panel) panel.style.transform = 'translateX(100%)'; + + setTimeout(() => { + if (drawerElement) { + drawerElement.style.display = 'none'; + } + + // 恢复滚动 + const scrollY = document.body.style.top; + document.body.style.overflow = ''; + document.body.style.position = ''; + document.body.style.top = ''; + document.body.style.width = ''; + window.scrollTo(0, parseInt(scrollY || '0') * -1); + + isDrawerOpen = false; + }, 300); + } + + function bindDrawerEvents() { + if (!drawerElement) return; + + const closeBtn = drawerElement.querySelector('#drawer-close-btn'); + if (closeBtn) { + closeBtn.addEventListener('click', (e) => { + e.preventDefault(); + closeDrawer(); + }); + } + + const backdrop = drawerElement.querySelector('.drawer-backdrop'); + if (backdrop) { + backdrop.addEventListener('click', closeDrawer); + } + + const links = drawerElement.querySelectorAll('.drawer-link, .mobile-nav-grid a, a'); + links.forEach(link => { + link.addEventListener('click', () => { + setTimeout(closeDrawer, 100); + }); + }); + } + + document.addEventListener('DOMContentLoaded', () => { + const trigger = document.getElementById('mobile-menu-trigger'); + if (trigger) { + trigger.addEventListener('click', (e) => { + e.preventDefault(); + e.stopPropagation(); + openDrawer(); + }); + } + + document.addEventListener('keydown', (e) => { + if (e.key === 'Escape' && isDrawerOpen) closeDrawer(); + }); + }); + + window.mobileMenu = { + open: openDrawer, + close: closeDrawer, + isOpen: () => isDrawerOpen + }; +})(); \ No newline at end of file diff --git a/assets/js/share.js b/assets/js/share.js new file mode 100644 index 0000000..bb5c5d4 --- /dev/null +++ b/assets/js/share.js @@ -0,0 +1,87 @@ +(function() { + const initShare = () => { + const shareBtn = document.getElementById('share-btn'); + const sharePanel = document.getElementById('share-panel'); + const copyBtn = document.getElementById('copy-link'); + const shareContainer = document.getElementById('share-component'); + const closeBtn = document.getElementById('close-share'); + + if (!shareBtn || !sharePanel) return; + + // 1. 处理分享主按钮 + shareBtn.addEventListener('click', async (e) => { + e.preventDefault(); + e.stopPropagation(); + + const shareData = { + title: document.title, + url: window.location.href + }; + + // 原生分享触发条件：浏览器支持 + 必须是 HTTPS 环境 + if (navigator.share && window.isSecureContext) { + try { + await navigator.share(shareData); + return; // 成功唤起系统分享，不再向下执行 + } catch (err) { + // 如果不是用户主动取消(AbortError)，则打印错误并在下方降级处理 + if (err.name !== 'AbortError') console.error('Share failed:', err); + } + } + + // 降级方案：显示自定义 HTML 分享面板 + sharePanel.classList.toggle('hidden'); + }); + + // 2. 处理链接复制 + copyBtn.addEventListener('click', (e) => { + e.preventDefault(); + const currentUrl = window.location.href; + + navigator.clipboard.writeText(currentUrl).then(() => { + const iconBg = document.getElementById('copy-icon-bg'); + const copySvg = document.getElementById('copy-svg'); + const checkSvg = document.getElementById('check-svg'); + const copyText = document.getElementById('copy-text'); + + // 成功反馈状态 + iconBg.classList.replace('bg-slate-100', 'bg-green-500'); + iconBg.classList.replace('text-slate-600', 'text-white'); + copySvg.classList.add('hidden'); + checkSvg.classList.remove('hidden'); + copyText.innerText = '已复制'; + + setTimeout(() => { + iconBg.classList.replace('bg-green-500', 'bg-slate-100'); + iconBg.classList.replace('text-white', 'text-slate-600'); + copySvg.classList.remove('hidden'); + checkSvg.classList.add('hidden'); + copyText.innerText = '复制'; + }, 2000); + }).catch(() => { + alert('复制失败，请手动复制地址栏链接'); + }); + }); + + // 3. 面板交互控制 + const closePanel = () => sharePanel.classList.add('hidden'); + + // 点击关闭按钮隐藏 + if (closeBtn) closeBtn.addEventListener('click', closePanel); + + // 点击页面其他地方隐藏 + document.addEventListener('click', (e) => { + if (!shareContainer.contains(e.target)) closePanel(); + }); + + // 阻止面板内部点击触发隐藏 + sharePanel.addEventListener('click', (e) => e.stopPropagation()); + }; + + // 确保 DOM 加载后运行 + if (document.readyState === 'loading') { + document.addEventListener('DOMContentLoaded', initShare); + } else { + initShare(); + } +})(); \ No newline at end of file diff --git a/assets/js/timer.js b/assets/js/timer.js new file mode 100644 index 0000000..4ebf7e4 --- /dev/null +++ b/assets/js/timer.js @@ -0,0 +1,57 @@ +function initClassTimers() { + const timers = document.querySelectorAll('.js-event-timer'); + + timers.forEach(timer => { + const targetTimeStr = timer.getAttribute('data-target'); + const labelEl = timer.querySelector('.js-timer-label'); + const daysEl = timer.querySelector('.js-days'); + const hoursEl = timer.querySelector('.js-hours'); + const minutesEl = timer.querySelector('.js-minutes'); + const secondsEl = timer.querySelector('.js-seconds'); + + // 清除可能存在的旧定时器（防止PJAX导致的叠加） + if (timer.timerId) clearInterval(timer.timerId); + + function updateTimer() { + const targetDate = new Date(targetTimeStr).getTime(); + // 简单格式校验，防止 Excerpt 填错导致报错 + if (isNaN(targetDate)) { + if (labelEl) labelEl.innerText = "日期错误"; + return; + } + + const now = new Date().getTime(); + const difference = targetDate - now; + const isPast = difference < 0; + const absDiff = Math.abs(difference); + + // 更新状态标签 + if (labelEl) { + labelEl.innerText = isPast ? "已经过去" : "倒计时中"; + } + + // 计算时间 + const d = Math.floor(absDiff / (1000 * 60 * 60 * 24)); + const h = Math.floor((absDiff / (1000 * 60 * 60)) % 24); + const m = Math.floor((absDiff / 1000 / 60) % 60); + const s = Math.floor((absDiff / 1000) % 60); + + // 更新数字显示 (加了动画平滑过渡感) + if (daysEl) daysEl.innerText = d.toString().padStart(2, '0'); + if (hoursEl) hoursEl.innerText = h.toString().padStart(2, '0'); + if (minutesEl) minutesEl.innerText = m.toString().padStart(2, '0'); + if (secondsEl) secondsEl.innerText = s.toString().padStart(2, '0'); + } + + updateTimer(); + timer.timerId = setInterval(updateTimer, 1000); + }); +} + +// 首次加载执行 +document.addEventListener('DOMContentLoaded', initClassTimers); + +// PJAX 兼容执行 (适配 Ghost 常用的主题加载方式) +if (typeof pjax !== 'undefined' || document.querySelector('[data-pjax]')) { + document.addEventListener('pjax:complete', initClassTimers); +} \ No newline at end of file diff --git a/custom-profile.hbs b/custom-profile.hbs new file mode 100644 index 0000000..889717f --- /dev/null +++ b/custom-profile.hbs @@ -0,0 +1,83 @@ +{{!< default}} + +{{#post}} +
+ + {{!-- 面包屑导航 --}} + + +
+ + + +
+
+
+

+ {{#match primary_tag.slug "=" "teacher-profile"}}教师简介{{else}}个人简介{{/match}} +

+
+ +
+ {{content}} +
+ {{!-- Ghost 原生评论区 --}} + {{#if comments}} +
+

参与讨论

+ {{comments}} +
+ {{/if}} +
+
+
+
+{{/post}} \ No newline at end of file diff --git a/default.hbs b/default.hbs new file mode 100644 index 0000000..f3d4768 --- /dev/null +++ b/default.hbs @@ -0,0 +1,157 @@ + + + + + + + + + {{meta_title}} + {{ghost_head}} + + + +{{!-- 统一的固定头部容器 --}} +
+ {{!-- 1. 公告栏：仅在后台有内容时渲染 --}} + {{#if @site.announcement}} +
+ {{announcement}} +
+ {{/if}} + + {{!-- 2. 导航栏 --}} + +
+ +{{!-- 页面主体内容：现在内容会自动排在 sticky header 下方，无需手动 pt-16 --}} +
+ {{{body}}} + {{> "footer"}} +
+ +{{!-- 移动端菜单模板 --}} +
+
+
+
+
+ 菜单导航 + +
+
+
+

页面导航

+
+ {{navigation}} +
+
+
+
+ {{#if @member}} +
+
+
+ + + +
+
+

会员

+ 个人中心 +
+
+ + + + + 退出登录 + +
+ {{else}} +
+ + + + + 登录 + + + + + + 立即注册 + +
+ {{/if}} +
+
+
+
+
+ + {{ghost_foot}} + + + + + \ No newline at end of file diff --git a/index.hbs b/index.hbs new file mode 100644 index 0000000..ddef900 --- /dev/null +++ b/index.hbs @@ -0,0 +1,219 @@ +{{!< default}} + +
+ {{!-- 1. 轮播图 --}} + {{#get "posts" filter="tag:hash-slider" limit="5" as |slides|}} + + {{/get}} + +
+
+ {{!-- ============ 左侧主内容区 ============ --}} +
+ + {{!-- 板块一：班级热点 🔥 --}} +
+
+
🔥 班级热点
+
+ +
+ {{!-- 1.1 特别策划 (Red Theme) --}} + {{#get "posts" filter="tag:special-event" limit="4" include="tags" order="featured desc, published_at desc"}} +
+
+

特别策划

+ 更多 → +
+
+ {{#foreach posts}} + +

+ {{#if featured}}📌 {{/if}}{{title}} +

+

{{excerpt}}

+ + {{/foreach}} +
+
+ {{/get}} + + {{!-- 1.2 班级活动 (Blue Theme) --}} + {{#get "posts" filter="tag:event" limit="4" include="tags"}} +
+
+

班级活动

+ 更多 → +
+
+ {{#foreach posts}} + +

{{title}}

+

{{excerpt}}

+ + {{/foreach}} +
+
+ {{/get}} +
+
+ + {{!-- 板块二：风采展示 🌟 --}} +
+
+
🌟 风采展示
+
+ +
+ {{!-- 2.1 学生风采 (Green Theme) --}} + {{#get "posts" filter="tag:student" limit="4"}} +
+
+

学生风采

+ 更多 → +
+
+ {{#foreach posts}} + +

{{title}}

+

{{excerpt}}

+ + {{/foreach}} +
+
+ {{/get}} + + {{!-- 2.2 教师风采 (Purple Theme) --}} + {{#get "posts" filter="tag:teacher" limit="4"}} +
+
+

教师风采

+ 更多 → +
+
+ {{#foreach posts}} + +

{{title}}

+

{{excerpt}}

+ + {{/foreach}} +
+
+ {{/get}} +
+
+ + {{!-- 板块三：档案库 📂 --}} +
+
+
📂 档案库
+
+ + {{!-- 3.1 教师档案 --}} +
+
+

👨‍🏫 教师档案

+ 查看全部 → +
+
+ {{#get "posts" filter="tag:teacher-profile" limit="8" include="tags,authors"}} + {{#foreach posts}} + {{> "teacher-card"}} + {{else}} +

目前还没有教师档案入库...

+ {{/foreach}} + {{/get}} +
+
+ + {{!-- 3.2 学生档案 (含权限判断) --}} +
+
+

🎓 学生档案

+ {{#if @member}} + 查看全部 → + {{/if}} +
+ + {{#if @member}} +
+ {{#get "posts" filter="tag:student-profile" limit="8" include="tags,authors"}} + {{#foreach posts}} + {{> "teacher-card"}} + {{else}} +

目前还没有学生档案入库...

+ {{/foreach}} + {{/get}} +
+ {{else}} + {{!-- 未登录占位卡片 --}} +
+
🔐
+

学生档案仅限内部成员访问

+

为了保护隐私，请先登录你的班级账号

+ + 立即登录 + +
+ {{/if}} +
+
+
+ + {{!-- ============ 右侧边栏 ============ --}} + +
+
+ + +
\ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..4630364 --- /dev/null +++ b/package.json @@ -0,0 +1,12 @@ +{ + "name": "my-class-theme", + "version": "3.1.1", + "engines": { + "ghost": ">=5.0.0" + }, + "author": { + "name": "BI", + "email": "hello@ghost.org", + "url": "https://ghost.org/" + } +} diff --git a/partials/footer.hbs b/partials/footer.hbs new file mode 100644 index 0000000..4cdfbd3 --- /dev/null +++ b/partials/footer.hbs @@ -0,0 +1,31 @@ +
+
+
+

{{@site.title}}

+

{{@site.description}}

+

© {{date format="YYYY"}} · All Rights Resevered

+
+ +
+

联系我们

+
+ Email: + feedback +
+
+ WeChat: + 微信公众号 +
+ 微信公众号 +

扫码关注公众号

+
+ +
+
+ +
+

探索

+ {{navigation type="secondary"}} +
+
+
\ No newline at end of file diff --git a/partials/navigation.hbs b/partials/navigation.hbs new file mode 100644 index 0000000..8ca1dc1 --- /dev/null +++ b/partials/navigation.hbs @@ -0,0 +1,20 @@ + \ No newline at end of file diff --git a/partials/teacher-card.hbs b/partials/teacher-card.hbs new file mode 100644 index 0000000..baf8ac9 --- /dev/null +++ b/partials/teacher-card.hbs @@ -0,0 +1,78 @@ +{{!-- + 通用档案卡片组件 + 功能：根据 primary_tag.slug="teacher-profile" 自动切换 Faculty(蓝) 或 Student(绿) 样式 +--}} + + + + {{!-- 1. 图片区域 --}} +
+ {{#if feature_image}} + {{title}} + {{else}} + {{!-- 无图时的占位图标 --}} +
+ {{#match primary_tag.slug "=" "teacher-profile"}}👨‍🏫{{else}}🎓{{/match}} +
+ {{/if}} + + {{!-- 左上角悬浮身份标签 --}} +
+ {{#match primary_tag.slug "=" "teacher-profile"}} + Teacher + {{else}} + Student + {{/match}} +
+
+ + {{!-- 2. 信息内容区域 --}} +
+ + {{!-- 姓名标题 --}} +
+

+ {{title}} +

+
+ + {{!-- 摘要/头衔展示 --}} +
+ {{#if custom_excerpt}} +

+ {{#match primary_tag.slug "=" "teacher-profile"}} + Position: + {{else}} + “ + {{/match}} + {{custom_excerpt}} + {{#match primary_tag.slug "!==" "teacher-profile"}}”{{/match}} +

+ {{/if}} +
+ + {{!-- 底部元数据栏 --}} +
+ {{!-- 分类/学科标签 --}} + + {{#if primary_tag}} + + {{primary_tag.name}} + {{else}} + + 档案库 + {{/if}} + + + {{!-- 悬浮出现的动作提示 --}} + + PROFILE → + +
+
+ \ No newline at end of file diff --git a/post.hbs b/post.hbs new file mode 100644 index 0000000..3a60205 --- /dev/null +++ b/post.hbs @@ -0,0 +1,145 @@ +{{!< default}} + +{{#post}} +
+ + {{!-- 顶部导航 --}} +
+ + + + + 返回首页 + +
+ +
+ + {{!-- 1. 封面图 --}} + {{#if feature_image}} +
+ {{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}} +
+ {{/if}} + + {{!-- 内容容器 --}} +
+ + {{!-- 文章头部 --}} +
+
+ {{#if primary_tag}} + {{#primary_tag}} + {{!-- 这里使用 tag-{{slug}} 类名，你可以在 CSS 中定义不同分类的颜色 --}} + + + + + {{name}} + + {{/primary_tag}} + {{/if}} + + + + + + + +
+ +

+ {{title}} +

+ + {{#if custom_excerpt}} +

+ {{custom_excerpt}} +

+ {{/if}} +
+ + {{!-- 正文区域 --}} +
+ {{content}} +
+ +{{!-- 底部装饰 --}} +
+
+ + + + 完 · 阅读时长 {{reading_time seconds="< 1 分钟" minutes="% 分钟"}} +
+ + {{!-- 这里插入分享按钮 --}} +
+ + + {{!-- 下拉面板 --}} + +
+
+ + {{!-- Ghost 原生评论区 --}} + {{#if comments}} +
+

参与讨论

+ {{comments}} +
+ {{/if}} +
+
+
+{{/post}} + + \ No newline at end of file diff --git a/tag.hbs b/tag.hbs new file mode 100644 index 0000000..e60ac39 --- /dev/null +++ b/tag.hbs @@ -0,0 +1,114 @@ +{{!< default}} +{{!-- 上面的代码块表示该页面嵌套在 default.hbs 模板中 --}} + +
+ {{#tag}} +
+
+
+ {{!-- + Ghost 的 Tag 颜色通常通过 slug 匹配类名 + 或者在后台 Tag 设置里的 "Accent Color" 获取 + --}} + + {{name}} + +
+

+ {{name}}专栏 +

+

+ {{#if description}} + {{description}} + {{else}} + 分享{{name}}的相关内容 + {{/if}} + — 共 {{plural ../pagination.total empty='0 篇' singular='% 篇' plural='% 篇'}} +

+
+
+ {{/tag}} + +
+ {{#if posts}} +
+ {{#foreach posts}} + + {{/foreach}} +
+ + {{!-- 分页控制 --}} + {{#if pagination.pages}} + {{#if pagination.total}} +
+ {{#if pagination.prev}} + + ← 上一页 + + {{else}} + + ← 上一页 + + {{/if}} + + + 第 {{pagination.page}} / {{pagination.pages}} 页 + + + {{#if pagination.next}} + + 下一页 → + + {{else}} + + 下一页 → + + {{/if}} +
+ {{/if}} + {{/if}} + + {{else}} +
+

该分类下暂无文章

+ + 返回首页 + +
+ {{/if}} +
+
\ No newline at end of file