60 lines
1.3 KiB
CSS
60 lines
1.3 KiB
CSS
.post-header {
|
|
@apply bg-purple-50 text-primary py-32;
|
|
|
|
h1.post-header__title,
|
|
h2.post-header__title {
|
|
@apply uppercase font-medium text-7xl;
|
|
line-height: 1.2;
|
|
}
|
|
&__inner {
|
|
@apply container mx-auto grid gap-24;
|
|
&--has-thumbnail {
|
|
grid-template-columns: 1fr 4fr;
|
|
}
|
|
&--no-thumbnail {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
|
|
.thumbnail-wrapper {
|
|
@apply bg-red-200;
|
|
img {
|
|
/* max-height: 200px; */
|
|
@apply object-contain;
|
|
}
|
|
}
|
|
|
|
.post-details {
|
|
@apply flex justify-between gap-28 mt-12;
|
|
grid-template-columns: 1fr 1fr;
|
|
|
|
&__label {
|
|
@apply uppercase font-bold text-lg;
|
|
letter-spacing: 0.2em;
|
|
}
|
|
}
|
|
|
|
.socials-buttons {
|
|
@apply flex gap-4;
|
|
|
|
&__button {
|
|
@apply bg-white text-carhop-green-700 px-4 py-2 font-normal rounded-full border-primary w-fit border-2 flex items-center gap-2;
|
|
transition: transform 0.3s ease-in-out;
|
|
&:hover {
|
|
transform: scale(1.05);
|
|
}
|
|
|
|
&[disabled='true'] {
|
|
@apply opacity-50 cursor-not-allowed;
|
|
}
|
|
img {
|
|
@apply w-8 h-8 filter-primary;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.article-meta__related-revue a {
|
|
@apply hover:underline underline-offset-8;
|
|
}
|