styleguide: update icons.scss, update navigation icons, add WIP icon grid
All checks were successful
/ build (push) Successful in 11s

This commit is contained in:
kritzl 2025-03-06 02:17:45 +01:00
commit da8c820122
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
23 changed files with 1028 additions and 222 deletions

View file

@ -374,6 +374,51 @@ main > div.generator {
}
}
.icon-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--text-5xl), 1fr));
align-items: center;
justify-items: center;
gap: 2rem;
div {
width: var(--text-5xl);
height: var(--text-5xl);
display: flex;
align-items: center;
justify-content: center;
box-sizing: content-box;
padding: 0.5rem;
border-radius: 0.3rem;
cursor: pointer;
&:hover,
&:focus {
background-color: var(--color-shade-2);
i[data-icon]::after {
content: attr(data-icon);
font-size: var(--text-xl);
background-color: var(--color-shade-2);
padding: 0.5rem;
z-index: 10;
position: absolute;
bottom: calc((var(--text-xl) * -1) - 2rem);
border-radius: 0.3rem;
}
}
i[data-icon] {
font-size: var(--text-5xl);
position: relative;
&.icon-small {
font-size: var(--text-3xl);
}
}
}
}
.swatch-grid {
background-color: var(--color-background);
color: var(--color-foreground);