diff --git a/resources/css/pages/single-auteurs.css b/resources/css/pages/single-auteurs.css new file mode 100644 index 0000000..00bd8b4 --- /dev/null +++ b/resources/css/pages/single-auteurs.css @@ -0,0 +1,88 @@ +.page--single-auteurs { + @apply max-w-screen-xl mx-auto px-4; + + &__header { + @apply py-12 !my-0 bg-primary alignfull pb-80; + h1 { + @apply !text-5xl uppercase mb-8 col-span-2 !text-white; + } + p { + @apply text-white; + } + + .inner { + @apply mx-auto flex flex-col lg:flex-row gap-24 justify-center items-center max-w-screen-xl; + } + + .sub-infos { + @apply text-lg text-white flex gap-2 py-4; + + .data-type { + @apply uppercase font-medium text-lg tracking-widest; + } + + .articles-amount { + @apply flex items-center gap-2; + &::before { + content: ''; + @apply block w-6 h-6 bg-no-repeat bg-center; + background-image: url('../resources/img/icons/icon-activites.svg'); + background-size: contain; + } + } + } + .author-card__profile-picture { + @apply block col-span-2 lg:col-span-1 relative z-10 w-48 h-48 p-0; + .profile-picture-container { + @apply relative z-10 w-full h-full bg-white p-4; + z-index: 2; + } + .background-picture { + @apply absolute inset-0 w-full h-full bg-white; + z-index: -1; + transform: translate(30px, 30px) rotate(5deg); + + &:after { + content: ''; + @apply absolute inset-0 w-full h-full bg-carhop-green-100; + z-index: 2; + top: 1rem; + left: 1rem; + width: calc(100% - 2rem); + height: calc(100% - 2rem); + } + } + } + .infos { + @apply max-w-screen-md; + } + } + &__comities-list { + @apply flex flex-wrap gap-2 items-center col-span-2 text-primary font-normal pt-4; + } + &__comity { + @apply text-lg flex items-center gap-2 font-light tracking-wide; + + &:before { + @apply content-[''] block w-6 h-6 bg-no-repeat bg-center; + background-size: contain; + } + + + .page--single-auteurs__comity { + @apply before:content-['|'] before:mx-2 before:text-primary; + } + &--redaction { + &:before { + background-image: url('../resources/img/icons/carhop-plume-white.svg'); + } + } + } + + &__latest-publication { + transform: translateY(-200px); + margin-bottom: -150px; + p { + @apply text-white uppercase text-lg font-semibold tracking-widest mb-8; + } + } +}