transform scale for buttons on hover
This commit is contained in:
+16
-12
@@ -374,6 +374,7 @@ button, .button-primary, .button-secondary, .menu-button, .logo {
|
||||
border: none;
|
||||
border-radius: var(--radius-xxl);
|
||||
text-decoration: none;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
button, .button-primary, .logo {
|
||||
@@ -404,10 +405,14 @@ button, .button-primary, .logo {
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
button:hover, .button-primary:hover, .button-secondary:hover, .logo:hover {
|
||||
text-decoration: none;
|
||||
transform: scale(1.03);
|
||||
}
|
||||
|
||||
button:hover, .button-primary:hover, .logo:hover {
|
||||
background: var(--color-button-primary-hover);
|
||||
color: var(--color-text-button-primary);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.button-secondary:hover {
|
||||
@@ -415,17 +420,20 @@ button:hover, .button-primary:hover, .logo:hover {
|
||||
color: var(--color-text-button-secondary-hover);
|
||||
}
|
||||
|
||||
button:active, .button-primary:active, .button-secondary:active, .logo:active {
|
||||
box-shadow: var(--shadow-button-active);
|
||||
text-decoration: none;
|
||||
transform: scale(1.03);
|
||||
}
|
||||
|
||||
button:active, .button-primary:active, .logo:active {
|
||||
background: var(--color-button-primary-active);
|
||||
box-shadow: var(--shadow-button-active);
|
||||
color: var(--color-text-button-primary-active);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.button-secondary:active {
|
||||
background: var(--color-button-secondary-active);
|
||||
color: var(--color-text-button-secondary-active);
|
||||
box-shadow: var(--shadow-button-active);
|
||||
}
|
||||
|
||||
button:visited, .button-primary:visited, .logo:visited {
|
||||
@@ -540,6 +548,7 @@ button:visited, .button-primary:visited, .logo:visited {
|
||||
.menu-button {
|
||||
background: none;
|
||||
color: var(--color-text-button-secondary);
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.menu-button:hover,
|
||||
@@ -547,10 +556,8 @@ button:visited, .button-primary:visited, .logo:visited {
|
||||
.mobile-menu a[aria-current="page"]:hover {
|
||||
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;
|
||||
transition: 0.2s;
|
||||
text-decoration: none;
|
||||
transform: scale(1.03);
|
||||
}
|
||||
|
||||
.menu-button:active,
|
||||
@@ -566,10 +573,7 @@ button:visited, .button-primary:visited, .logo:visited {
|
||||
.menu-button:active,
|
||||
.desktop-nav a[aria-current="page"]:active,
|
||||
.mobile-menu a[aria-current="page"]:active {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.desktop-nav-secondary ul {
|
||||
|
||||
Reference in New Issue
Block a user