lhoist-stay-safe/src/assets/css/pages/Profile.scss

45 lines
1.1 KiB
SCSS

.page-container--profile {
.screen__content {
@apply w-full md:w-fit;
}
.profile-select {
@apply grid sm:grid-cols-2 md:grid-cols-2 xl:grid-cols-4 list-none gap-1 2xl:px-2 max-w-screen-xl;
padding-inline-start: 0;
&__profile-type {
@apply flex flex-col justify-center items-center py-10 px-3 cursor--pointer gap-2 w-fit mx-auto;
transition: all 0.3s ease-in-out;
&:hover,
&--selected {
@apply bg-slate-100;
transform: scale(1.05) rotate(1deg);
}
&:hover:nth-child(even),
&--selected:nth-child(even) {
transform: scale(1.05) rotate(-1deg);
}
&[is-current="true"] {
@apply bg-slate-100;
transform: scale(1.1) rotate(-1deg);
}
&[is-current="true"]:nth-child(even) {
transform: scale(1.1) rotate(1deg);
}
img {
@apply w-auto h-32;
pointer-events: none;
}
}
.titling-construction {
@apply mt-4 text-2xl;
}
// &__profile-type:hover,
// &__profile-type--selected {
// @apply bg-neutral-100;
// }
}
.cta--next {
@apply mx-auto mb-8;
// transform: translateY(50%);
}
}