diff --git a/app/assets/css/main.css b/app/assets/css/main.css index 4f1ab74..4b39e60 100644 --- a/app/assets/css/main.css +++ b/app/assets/css/main.css @@ -273,6 +273,90 @@ p a, blockquote a { min-width: 0; } +/* ---- SHARED USelectMenu STYLES ---- + Apply via: + Classes are global (not scoped) because Nuxt UI portals the popup content to body. */ +button.zine-select, +button.timezone-select { + display: flex !important; + width: 100%; + padding: 5px 8px !important; + font-family: "Commit Mono", monospace !important; + font-size: 13px !important; + color: var(--text-bright) !important; + background: var(--input-bg) !important; + border: 1px solid var(--border) !important; + border-radius: 0 !important; + box-shadow: none !important; + outline: none !important; + min-height: 0; + --tw-ring-shadow: 0 0 #0000; + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-color: transparent; +} + +button.zine-select:hover, +button.timezone-select:hover { + background: var(--input-bg) !important; +} + +button.zine-select:focus, +button.zine-select:focus-visible, +button.zine-select[aria-expanded="true"], +button.timezone-select:focus, +button.timezone-select:focus-visible, +button.timezone-select[aria-expanded="true"] { + border-color: var(--candle) !important; +} + +.tz-content { + background: var(--input-bg) !important; + border: 1px solid var(--border) !important; + border-radius: 0 !important; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important; + --tw-ring-shadow: 0 0 #0000 !important; + --tw-ring-offset-shadow: 0 0 #0000 !important; + font-family: "Commit Mono", monospace !important; +} + +.tz-input { + border-bottom: 1px dashed var(--border) !important; +} + +.tz-input input { + font-family: "Commit Mono", monospace !important; + font-size: 13px !important; + color: var(--text-bright) !important; + background: transparent !important; + border-radius: 0 !important; + padding: 6px 8px !important; + box-shadow: none !important; + --tw-ring-shadow: 0 0 #0000 !important; + --tw-ring-offset-shadow: 0 0 #0000 !important; +} + +.tz-item { + font-family: "Commit Mono", monospace !important; + font-size: 13px !important; + color: var(--text) !important; + border-radius: 0 !important; + padding: 6px 8px !important; +} + +.tz-item::before { + border-radius: 0 !important; +} + +.tz-item[data-highlighted]::before, +.tz-item[data-highlighted]:not([data-disabled])::before { + background: var(--surface-hover) !important; +} + +.tz-item[data-highlighted], +.tz-item[data-highlighted]:not([data-disabled]) { + color: var(--text-bright) !important; +} + /* ---- MOBILE ---- */ @media (max-width: 1023px) { body { diff --git a/app/components/AppNavigation.vue b/app/components/AppNavigation.vue index 92402c6..07cc322 100644 --- a/app/components/AppNavigation.vue +++ b/app/components/AppNavigation.vue @@ -133,11 +133,11 @@ @@ -40,7 +39,7 @@ defineEmits(["update:modelValue"]); .tier-option { flex: 1; - padding: 10px 8px; + padding: 18px 8px; text-align: center; border: 1px dashed var(--border); background: var(--bg); @@ -67,30 +66,18 @@ defineEmits(["update:modelValue"]); } .tier-amount { - font-size: 16px; + font-size: 24px; font-weight: 600; color: var(--text); font-family: "Brygada 1918", serif; display: block; + line-height: 1.1; } .tier-option.current .tier-amount { color: var(--candle); } -.tier-label { - font-size: 9px; - letter-spacing: 0.06em; - text-transform: uppercase; - color: var(--text-faint); - display: block; - margin-top: 2px; -} - -.tier-option.current .tier-label { - color: var(--candle-dim); -} - @media (max-width: 768px) { .tier-picker { flex-wrap: wrap; diff --git a/app/layouts/admin.vue b/app/layouts/admin.vue index 8542106..5e0baad 100644 --- a/app/layouts/admin.vue +++ b/app/layouts/admin.vue @@ -66,6 +66,14 @@ Board Channels +
  • + + Site Content + +
  • @@ -76,7 +84,7 @@ @@ -170,6 +178,15 @@ Board Channels +
  • + + Site Content + +
  • @@ -190,7 +207,7 @@ diff --git a/app/pages/board.vue b/app/pages/board.vue index 312c699..93cdd5d 100644 --- a/app/pages/board.vue +++ b/app/pages/board.vue @@ -1,5 +1,9 @@