42 lines
1 KiB
CSS
42 lines
1 KiB
CSS
@layer components {
|
|
.top_component {
|
|
@apply min-h-screen w-full flex flex-col md:flex-row items-center gap-5 relative;
|
|
|
|
& > div {
|
|
@apply flex-1;
|
|
}
|
|
|
|
& > .top_component__image {
|
|
@apply flex justify-center items-center px-5;
|
|
|
|
& > img {
|
|
@apply rounded-lg w-full;
|
|
}
|
|
}
|
|
|
|
& > .top_component__presentation {
|
|
@apply flex flex-col gap-3;
|
|
|
|
& > h1 {
|
|
@apply font-bold text-3xl;
|
|
}
|
|
|
|
& > h4 {
|
|
@apply font-semibold text-xl;
|
|
}
|
|
|
|
& > p {
|
|
@apply font-normal text-base;
|
|
}
|
|
|
|
& .top_component__actions {
|
|
@apply flex flex-wrap my-3 gap-5;
|
|
|
|
& a {
|
|
@apply flex-1 h-12 outline outline-2 rounded-md outline-on_surface dark:outline-dark_on_surface p-2 uppercase;
|
|
@apply flex items-center justify-center min-w-[150px];
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|