summaryrefslogtreecommitdiff
path: root/web/css/components.css
diff options
context:
space:
mode:
authorPaul Buetow <paul@buetow.org>2026-05-17 15:25:52 +0300
committerPaul Buetow <paul@buetow.org>2026-05-17 15:25:52 +0300
commit914bd7cd6aa14e839332a98d91c30b19865b0cf2 (patch)
tree02b11537237a204048589e14ed24938b805e42f7 /web/css/components.css
parent3b24f0e1be832584d6550e8cc3e5d24329f66f90 (diff)
Restructure repo: move Go server into player-server/
Diffstat (limited to 'web/css/components.css')
-rw-r--r--web/css/components.css262
1 files changed, 0 insertions, 262 deletions
diff --git a/web/css/components.css b/web/css/components.css
deleted file mode 100644
index a81753a..0000000
--- a/web/css/components.css
+++ /dev/null
@@ -1,262 +0,0 @@
-/* Buttons */
-.btn {
- display: inline-flex;
- align-items: center;
- justify-content: center;
- gap: 0.35rem;
- padding: 0.5rem 0.85rem;
- border-radius: var(--radius-sm);
- border: 1px solid transparent;
- font-size: 0.85rem;
- font-weight: 600;
- line-height: 1.2;
- cursor: pointer;
- background: var(--bg-elevated);
- color: var(--text-primary);
- transition: background var(--transition-fast), border-color var(--transition-fast), transform 80ms ease;
-}
-.btn:hover { background: var(--bg-surface-hover); }
-.btn:active { transform: translateY(1px); }
-.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-
-.btn-primary {
- background: var(--accent);
- color: var(--text-inverse);
- border-color: var(--accent-active);
-}
-.btn-primary:hover { background: var(--accent-hover); }
-.btn-danger {
- background: var(--danger);
- color: var(--text-inverse);
- border-color: var(--danger-active);
-}
-.btn-danger:hover { background: var(--danger-hover); }
-.btn-ghost {
- background: transparent;
- color: var(--text-secondary);
- border-color: var(--border);
-}
-.btn-ghost:hover { color: var(--text-primary); background: var(--bg-surface-hover); }
-.btn-sm { padding: 0.3rem 0.55rem; font-size: 0.78rem; }
-.btn-lg { padding: 0.65rem 1.1rem; font-size: 0.95rem; }
-
-/* Icon buttons */
-.icon-btn {
- width: 2.25rem;
- height: 2.25rem;
- border-radius: var(--radius-sm);
- background: transparent;
- border: 1px solid transparent;
- color: var(--text-secondary);
- cursor: pointer;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- font-size: 1.05rem;
- line-height: 1;
- padding: 0;
- transition: background var(--transition-fast), color var(--transition-fast);
-}
-.icon-btn:hover { background: var(--bg-surface-hover); color: var(--text-primary); }
-.icon-btn.active { color: var(--accent); background: var(--accent-soft); }
-
-/* Forms */
-input, textarea, select {
- font: inherit;
- color: var(--text-primary);
- background: var(--bg-elevated);
- border: 1px solid var(--border);
- border-radius: var(--radius-sm);
- padding: 0.5rem 0.65rem;
- width: 100%;
-}
-input:focus, textarea:focus, select:focus {
- outline: none;
- border-color: var(--accent);
- box-shadow: 0 0 0 3px var(--accent-soft);
-}
-label {
- display: block;
- font-size: 0.8rem;
- font-weight: 600;
- margin: 0.35rem 0 0.2rem;
- color: var(--text-secondary);
-}
-
-.input-sm {
- width: auto;
- min-width: 5rem;
- max-width: 8rem;
- padding: 0.35rem 0.5rem;
- font-size: 0.78rem;
-}
-
-/* Error message */
-.error-message {
- color: var(--danger);
- font-size: 0.85rem;
- min-height: 1.25rem;
- margin: 0.35rem 0 0;
-}
-
-/* Search bar */
-.search-bar {
- position: relative;
- display: flex;
- align-items: center;
- gap: 0.4rem;
- background: var(--bg-elevated);
- border: 1px solid var(--border);
- border-radius: var(--radius-md);
- padding: 0.25rem 0.6rem;
- max-width: min(100%, 72rem);
- width: 100%;
-}
-.search-overlay {
- position: fixed;
- inset: 1rem 1rem auto 1rem;
- z-index: 90;
- display: flex;
- justify-content: center;
- pointer-events: none;
-}
-.search-overlay.hidden {
- display: none;
-}
-.search-overlay-bar {
- align-items: flex-start;
- flex-wrap: wrap;
- max-width: min(72rem, calc(100vw - 2rem));
- box-shadow: var(--shadow-lg);
- pointer-events: auto;
-}
-.search-bar input {
- background: transparent;
- border: none;
- padding: 0.35rem 0.2rem;
- flex: 1 1 18rem;
- min-width: 8rem;
-}
-.search-bar input:focus { box-shadow: none; }
-.tag-filter-list {
- display: flex;
- align-items: center;
- flex-wrap: wrap;
- gap: 0.3rem;
- flex: 1 1 18rem;
- min-width: 0;
- max-width: none;
-}
-.tag-filter-chip {
- display: inline-flex;
- align-items: center;
- flex: 0 0 auto;
- max-width: 9rem;
- min-height: 2rem;
- padding: 0.25rem 0.5rem;
- border: 1px solid var(--border);
- border-radius: var(--radius-sm);
- background: transparent;
- color: var(--text-secondary);
- font: inherit;
- font-size: 0.78rem;
- cursor: pointer;
-}
-.tag-filter-chip:hover,
-.tag-filter-chip:focus-visible {
- background: var(--bg-surface-hover);
- color: var(--text-primary);
- outline: none;
-}
-.tag-filter-chip.active {
- border-color: var(--accent);
- background: var(--accent-soft);
- color: var(--text-primary);
-}
-.tag-filter-chip span {
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-/* Search syntax help tooltip */
-.search-help {
- position: absolute;
- top: calc(100% + 0.5rem);
- left: 0;
- background: var(--bg-surface);
- border: 1px solid var(--border-strong);
- border-radius: var(--radius-md);
- box-shadow: var(--shadow-lg);
- padding: 0.6rem 0.75rem;
- font-size: 0.78rem;
- color: var(--text-secondary);
- z-index: 45;
- max-width: 22rem;
- line-height: 1.5;
-}
-.search-help-title {
- font-weight: 600;
- color: var(--text-primary);
- margin-bottom: 0.35rem;
- font-size: 0.82rem;
-}
-.search-help-row {
- display: flex;
- flex-wrap: wrap;
- align-items: center;
- gap: 0.35rem;
-}
-.search-help-row code {
- font-family: var(--font-mono);
- font-size: 0.75rem;
- background: var(--bg-elevated);
- border: 1px solid var(--border);
- border-radius: var(--radius-sm);
- padding: 0.15rem 0.35rem;
- color: var(--text-primary);
-}
-
-/* Toast */
-.toast {
- position: fixed;
- bottom: 1rem;
- right: 1rem;
- background: var(--bg-surface);
- color: var(--text-primary);
- border: 1px solid var(--border-strong);
- border-radius: var(--radius-md);
- box-shadow: var(--shadow-lg);
- padding: 0.65rem 0.9rem;
- z-index: 110;
- font-size: 0.85rem;
- transform: translateY(120%);
- opacity: 0;
- transition: transform var(--transition-base), opacity var(--transition-base);
-}
-.toast.show { transform: translateY(0); opacity: 1; }
-.toast.info { border-left: 4px solid var(--accent); }
-.toast.success { border-left: 4px solid var(--success); }
-.toast.error { border-left: 4px solid var(--danger); }
-
-/* Share rows */
-.share-row { cursor: pointer; outline: none; }
-.share-row.selected { background: var(--accent-soft); border-left: 3px solid var(--accent); padding-left: calc(0.25rem - 3px); }
-.share-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
-
-.shares-hint {
- font-size: 0.75rem;
- color: var(--text-secondary);
- padding: 0.5rem 0.25rem;
- text-align: center;
- border-top: 1px solid var(--border);
-}
-.shares-hint kbd {
- display: inline-block;
- padding: 0.08rem 0.3rem;
- font-family: inherit;
- font-size: 0.7rem;
- background: var(--bg-elevated);
- border: 1px solid var(--border);
- border-radius: var(--radius-sm);
- color: var(--text-primary);
-}