lars/Portfolio-2026
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

consistend secondary button and menu styling

Browse Source
This commit is contained in:
sefaria
2026-05-26 22:45:51 +02:00
parent 93a5a13e3e
commit 0521d33193
1 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/style.css
+10 -9
View File
@@ -157,9 +157,9 @@
--color-button-primary-hover: var(--color-orange-500); --color-button-primary-hover: var(--color-orange-500);
--color-button-primary-active: var(--color-orange-red-600); --color-button-primary-active: var(--color-orange-red-600);
--color-button-secondary: light-dark(var(--color-neutral-300), var(--color-neutral-700)); --color-button-secondary: light-dark(var(--color-neutral-200), var(--color-neutral-700));
--color-button-secondary-hover: light-dark(var(--color-neutral-200), var(--color-neutral-600)); --color-button-secondary-hover: light-dark(var(--color-neutral-100), var(--color-neutral-600));
--color-button-secondary-active: light-dark(var(--color-neutral-400), var(--color-neutral-800)); --color-button-secondary-active: light-dark(var(--color-neutral-300), var(--color-neutral-800));
--color-text-button-primary: var(--color-neutral-900); --color-text-button-primary: var(--color-neutral-900);
--color-text-button-primary-hover: var(--color-neutral-100); --color-text-button-primary-hover: var(--color-neutral-100);
@@ -504,7 +504,7 @@ button:visited, .button-primary:visited, .logo:visited {
flex: 1 1 auto; flex: 1 1 auto;
display: flex; display: flex;
align-self: stretch; align-self: stretch;
background: light-dark(var(--color-neutral-200), var(--color-neutral-800)); background: var(--color-button-secondary);
border-radius: var(--radius-xxl); border-radius: var(--radius-xxl);
box-shadow: var(--shadow-button); box-shadow: var(--shadow-button);
} }
@@ -539,14 +539,14 @@ button:visited, .button-primary:visited, .logo:visited {
.menu-button { .menu-button {
background: none; background: none;
color: light-dark(var(--color-neutral-700), var(--color-neutral-300)); color: var(--color-text-button-secondary);
} }
.menu-button:hover, .menu-button:hover,
.desktop-nav a[aria-current="page"]:hover, .desktop-nav a[aria-current="page"]:hover,
.mobile-menu a[aria-current="page"]:hover { .mobile-menu a[aria-current="page"]:hover {
background: light-dark(var(--color-neutral-400), var(--color-neutral-400)); background: var(--color-button-secondary-hover);
color: light-dark(var(--color-neutral-900), var(--color-neutral-900)); color: var(--color-text-button-seconary-hover);
text-decoration: underline; text-decoration: underline;
text-underline-offset: 0.175rem; text-underline-offset: 0.175rem;
text-decoration-thickness: 0.075rem; text-decoration-thickness: 0.075rem;
@@ -558,10 +558,11 @@ button:visited, .button-primary:visited, .logo:visited {
.mobile-menu a[aria-current="page"]:active, .mobile-menu a[aria-current="page"]:active,
.desktop-nav a[aria-current="page"], .desktop-nav a[aria-current="page"],
.mobile-menu a[aria-current="page"] { .mobile-menu a[aria-current="page"] {
background: light-dark(var(--color-neutral-600), var(--color-neutral-600)); background: light-dark(var(--color-neutral-400), var(--color-neutral-800));
color: light-dark(var(--color-neutral-100), var(--color-neutral-100)); color: var(--color-text-button-seconary-active);
} }
.menu-button:active, .menu-button:active,
.desktop-nav a[aria-current="page"]:active, .desktop-nav a[aria-current="page"]:active,
.mobile-menu a[aria-current="page"]:active { .mobile-menu a[aria-current="page"]:active {