vcgit-forge/angular-challenges
1
0
Fork 0
mirror of https://github.com/Raghu-Ch/angular-challenges.git synced 2026-02-10 12:53:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

style: update button hover effect

Browse Source
This commit is contained in:
Sven Brodny
2024-03-13 17:30:58 +01:00
parent 849b90a7b7
commit 7fef31a80c
2 changed files with 21 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/src/components/SubscriptionForm.astro
View File

@@ -85,10 +85,12 @@ const { data } = await getEntry('i18n', lang ?? 'en');
text-decoration: none;
font-size: var(--sl-text-sm);
background: var(--sl-color-text-accent);
transition: var(--button-transition);
&:hover {
top: unset;
opacity: unset;
opacity: var(--button-hover-opacity);
transition: var(--button-transition);
}
}
}

18
docs/src/styles/custom-css.css
View File

@@ -16,6 +16,9 @@
--color-btn: var(--sl-color-white);
--color-chip: rgb(35, 38, 47);
--color-chip-border: rgba(240, 246, 252, 0.1);
--button-transition: opacity 100ms ease-in-out;
--button-hover-opacity: 0.85;
}
:root[data-theme='light'],
@@ -50,6 +53,21 @@
margin: 0px 2px;
}
a.action,
.article-footer > a,
.action-footer > a.action-button {
transition: var(--button-transition);
&:hover {
opacity: var(--button-hover-opacity);
transition: var(--button-transition);
&:not(.primary):not(.button-sponsor) {
opacity: 0.66;
}
}
}
.article-footer {
margin-top: 3rem !important;
display: flex;