consistend secondary button and menu styling

This commit is contained in:
sefaria
2026-05-26 22:45:51 +02:00
parent 93a5a13e3e
commit 0521d33193
+11 -10
View File
@@ -157,9 +157,9 @@
--color-button-primary-hover: var(--color-orange-500);
--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-hover: light-dark(var(--color-neutral-200), var(--color-neutral-600));
--color-button-secondary-active: light-dark(var(--color-neutral-400), var(--color-neutral-800));
--color-button-secondary: light-dark(var(--color-neutral-200), var(--color-neutral-700));
--color-button-secondary-hover: light-dark(var(--color-neutral-100), var(--color-neutral-600));
--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-hover: var(--color-neutral-100);
@@ -504,7 +504,7 @@ button:visited, .button-primary:visited, .logo:visited {
flex: 1 1 auto;
display: flex;
align-self: stretch;
background: light-dark(var(--color-neutral-200), var(--color-neutral-800));
background: var(--color-button-secondary);
border-radius: var(--radius-xxl);
box-shadow: var(--shadow-button);
}
@@ -538,15 +538,15 @@ button:visited, .button-primary:visited, .logo:visited {
}
.menu-button {
background:none;
color: light-dark(var(--color-neutral-700), var(--color-neutral-300));
background: none;
color: var(--color-text-button-secondary);
}
.menu-button:hover,
.desktop-nav a[aria-current="page"]:hover,
.mobile-menu a[aria-current="page"]:hover {
background: light-dark(var(--color-neutral-400), var(--color-neutral-400));
color: light-dark(var(--color-neutral-900), var(--color-neutral-900));
background: var(--color-button-secondary-hover);
color: var(--color-text-button-seconary-hover);
text-decoration: underline;
text-underline-offset: 0.175rem;
text-decoration-thickness: 0.075rem;
@@ -558,10 +558,11 @@ button:visited, .button-primary:visited, .logo:visited {
.mobile-menu a[aria-current="page"]:active,
.desktop-nav a[aria-current="page"],
.mobile-menu a[aria-current="page"] {
background: light-dark(var(--color-neutral-600), var(--color-neutral-600));
color: light-dark(var(--color-neutral-100), var(--color-neutral-100));
background: light-dark(var(--color-neutral-400), var(--color-neutral-800));
color: var(--color-text-button-seconary-active);
}
.menu-button:active,
.desktop-nav a[aria-current="page"]:active,
.mobile-menu a[aria-current="page"]:active {