diff --git a/public/global.css b/public/global.css index 2c5d19f..30fba41 100644 --- a/public/global.css +++ b/public/global.css @@ -1,6 +1,6 @@ :root { - --primary-color: #3498db; - --primary-color-hover: #2980b9; + --primary-color: #4619c2; + --primary-color-hover: #6447b5; --secondary-color: #2c3e50; --background-color: #f8f9fa; --text-color: #333333; @@ -22,7 +22,7 @@ --background-color: #181a20; --color-text: #f5f6fa; --color-border: #333842; - --color-accent: #4f8cff; + --color-accent: var(--primary-color); } } @@ -33,7 +33,7 @@ --background-color: #181a20; --color-text: #f5f6fa; --color-border: #333842; - --color-accent: #4f8cff; + --color-accent: var(--primary-color); } :root.light, @@ -43,7 +43,7 @@ --background-color: #f8f9fa; --color-text: #333333; --color-border: #ddd; - --color-accent: #4f8cff; + --color-accent: var(--primary-color); } * { diff --git a/src/components/Header.svelte b/src/components/Header.svelte index 68f0c9b..ce50918 100644 --- a/src/components/Header.svelte +++ b/src/components/Header.svelte @@ -462,8 +462,15 @@ height: 28px; } + .header-controls { + display: flex; + align-items: center; + gap: 1rem; + margin: 1rem 0; + } + .search-bar { - margin-bottom: 1.5rem; + margin-bottom: 0; width: 100%; max-width: 500px; position: relative; @@ -533,12 +540,11 @@ flex-wrap: wrap; gap: 0.3rem; align-items: center; - margin-left: 1rem; position: relative; } .selected-tag { - background: var(--color-accent, #4f8cff); + background: var(--color-accent); color: #fff; border: none; border-radius: 8px; @@ -612,7 +618,7 @@ color: var(--color-text); border: 1px solid var(--color-border); border-radius: 6px; - padding: 0.4em 0.6em; + padding: 0.6em 0.8em; font-size: 0.9em; cursor: pointer; transition: background 0.2s, color 0.2s, border-color 0.2s; @@ -621,6 +627,7 @@ justify-content: center; position: relative; gap: 0.3rem; + height: 40px; } .filter-toggle:hover,