Template:IconButton/styles.css: Difference between revisions
Appearance
RikThePixel (talk | contribs) No edit summary |
RikThePixel (talk | contribs) No edit summary |
||
| Line 13: | Line 13: | ||
.scamp-icon-button:hover .scamp-link-button { | .scamp-icon-button:hover .scamp-link-button { | ||
background-color: var(-- | background-color: var(--scamp-primary--hover); | ||
border: 1px solid var(-- | border: 1px solid var(--scamp-primary-border--hover); | ||
} | } | ||
Revision as of 16:00, 14 January 2026
.scamp-icon-button * {
box-sizing: border-box;
}
.scamp-icon-button {
transition: background-color 0.2s ease;
border-radius: 4px;
}
.scamp-icon-button:hover {
background-color: var(--background-color-interactive--hover);
}
.scamp-icon-button:hover .scamp-link-button {
background-color: var(--scamp-primary--hover);
border: 1px solid var(--scamp-primary-border--hover);
}
.scamp-icon-button__img a {
padding: 1rem;
}
.scamp-icon-button__img a,
.scamp-icon-button__img span {
display: block;
width: 100%;
height: 100%;
text-align: center;
}
.scamp-icon-button__img img {
aspect-ratio: 1;
}
.scamp-icon-button.scamp-icon-button--sm .scamp-icon-button__img img {
width: 32px;
height: 32px;
}
.scamp-icon-button.scamp-icon-button--md .scamp-icon-button__img img {
width: 48px;
height: 48px;
}
.scamp-icon-button.scamp-icon-button--lg .scamp-icon-button__img img {
width: 64px;
height: 64px;
}
.scamp-icon-button .scamp-link-button {
width: 100%;
}