add: new design (wip)

New design as WIP, swipe controls
This commit is contained in:
Fiona Lena Urban 2025-05-10 11:07:06 +02:00
parent 259adf53f6
commit 7af148058e
15 changed files with 354 additions and 142 deletions

View file

@ -1,7 +1,7 @@
.Button {
--padding: .2rem;
--background: var(--color-main);
--color: var(--color-white);
--background: var(--color-gradient-main-dark);
--color: var(--color-lightest);
--background-hover: var(--color-main-dark);
position: relative;
@ -16,20 +16,27 @@
background: var(--background);
color: var(--color);
&.transparent {
--background: transparent;
box-shadow: none;
padding: .5em 1.5em;
border-radius: var(--radius-default);
}
&.raised {
box-shadow: var(--box-shadow-z2);
padding: .5em 1.5em;
border-radius: var(--radius-default);
&.danger {
--background: var(--color-red);
--color: var(--color-white);
--background: var(--color-gradient-error);
--color: var(--color-lightest);
}
}
&.text {
--background: transparent;
--color: var(--color-black);
--color: var(--color-darkest);
padding: .5em 1.5em;
border-radius: var(--radius-default);
@ -38,11 +45,11 @@
}
&.white {
--color: var(--color-white);
--color: var(--color-lightest);
}
&.danger {
--color: var(--color-red);
--color: var(--color-error);
&:hover {
--background: rgba(255, 0, 0, 0.1);
@ -71,9 +78,9 @@
}
&.cta.white {
--background: var(--color-white);
--background: var(--color-lightest);
--color: var(--color-main);
--background-hover: var(--color-grey);
--background-hover: var(--color-light);
}
&.icon-button {