diff options
Diffstat (limited to 'static/style.css')
| -rw-r--r-- | static/style.css | 74 |
1 files changed, 49 insertions, 25 deletions
diff --git a/static/style.css b/static/style.css index c530839..4395e88 100644 --- a/static/style.css +++ b/static/style.css @@ -1,15 +1,15 @@ :root { - --bg: #0f1117; - --surface: #1a1d27; - --surface2: #252836; - --border: #2e3148; - --accent: #6c63ff; - --accent-hover: #8b84ff; + --bg: #0b0b0a; + --surface: #141412; + --surface2: #1e1e1b; + --border: #2a2a26; + --accent: #c07d0a; + --accent-hover: #a56a08; --text: #e2e8f0; --text-muted: #94a3b8; - --success: #22c55e; - --warning: #f59e0b; - --danger: #ef4444; + --success: #1ea34e; + --warning: #d4783a; + --danger: #b03030; --info: #3b82f6; } @@ -190,6 +190,24 @@ main { transition: border-color 0.2s ease; } +input[type="url"], +input[type="text"] { + padding: 0.75rem; + background-color: var(--surface2); + border: 1px solid var(--border); + border-radius: 0.375rem; + color: var(--text); + font-size: 0.9rem; + transition: border-color 0.2s ease; +} + +input[type="url"]:focus, +input[type="text"]:focus { + outline: none; + border-color: var(--accent); + background-color: rgba(108, 99, 255, 0.05); +} + .form-group input:focus, .form-group select:focus { outline: none; @@ -385,12 +403,6 @@ tbody tr:hover { gap: 0.5rem; } -.recipe-card-title { - font-weight: 600; - font-size: 1rem; - color: var(--text); -} - .recipe-type-badge { font-size: 0.7rem; padding: 0.2rem 0.6rem; @@ -410,20 +422,23 @@ tbody tr:hover { color: var(--text-muted); } -.recipe-card-ingredients { - font-size: 0.85rem; +.recipe-description { color: var(--text-muted); + font-size: 0.9rem; + margin: 0.25rem 0 0.5rem; line-height: 1.5; } -.recipe-card-instructions { - font-size: 0.85rem; +.recipe-card-title { color: var(--text); - line-height: 1.6; - border-top: 1px solid var(--border); - padding-top: 0.5rem; - margin-top: 0.25rem; - white-space: pre-line; + text-decoration: none; + font-weight: 600; + font-size: 1.05rem; +} + +.recipe-card-title:hover { + color: var(--accent); + text-decoration: underline; } .recipe-card .btn { @@ -454,7 +469,7 @@ tbody tr:hover { .grocery-item { display: flex; - align-items: flex-start; + align-items: center; gap: 1rem; padding: 0.75rem; background-color: rgba(255, 255, 255, 0.01); @@ -943,6 +958,15 @@ tbody tr:hover { border-bottom-left-radius: 0.25rem; } +.chat-bubble p { margin: 0 0 0.5rem; } +.chat-bubble p:last-child { margin-bottom: 0; } +.chat-bubble h3, .chat-bubble h4 { margin: 0.75rem 0 0.25rem; font-size: 0.95rem; } +.chat-bubble ul { padding-left: 1.25rem; margin: 0.25rem 0; } +.chat-bubble li { margin-bottom: 0.15rem; } +.chat-bubble code { background: rgba(0,0,0,0.3); padding: 0.1rem 0.35rem; border-radius: 0.25rem; font-size: 0.85rem; font-family: monospace; } +.chat-bubble pre { background: rgba(0,0,0,0.4); padding: 0.75rem; border-radius: 0.375rem; overflow-x: auto; margin: 0.5rem 0; } +.chat-bubble pre code { background: none; padding: 0; font-size: 0.82rem; } + .chat-typing-indicator { color: var(--text-muted); font-style: italic; |
