handling css path for moving acf blocks to plugin
This commit is contained in:
parent
075e722a6d
commit
4b8a70a33d
43
resources/css/blocks/aides-financieres.css
Executable file
43
resources/css/blocks/aides-financieres.css
Executable file
|
|
@ -0,0 +1,43 @@
|
|||
#block-aides-financieres {
|
||||
.section_titling {
|
||||
@apply max-w-screen-md;
|
||||
}
|
||||
.card-large-content {
|
||||
@apply lg:grid grid-cols-2 gap-12;
|
||||
|
||||
&__renolution-details {
|
||||
/* .logo_renolution { */
|
||||
.renolution__logo {
|
||||
@apply p-6 mb-8 bg-white shadowed w-fit rounded-3xl;
|
||||
}
|
||||
.renolution__title {
|
||||
@apply text-lg font-bold text-secondary pb-3;
|
||||
}
|
||||
.cta {
|
||||
@apply mt-8;
|
||||
}
|
||||
.renolution__guide-external-links {
|
||||
@apply grid grid-cols-2 gap-12 pt-6;
|
||||
.question_title {
|
||||
@apply text-black font-bold pt-6 pb-2;
|
||||
}
|
||||
.question_explanation {
|
||||
@apply text-sm;
|
||||
}
|
||||
.question_url {
|
||||
@apply block text-sm text-black font-bold mt-2 py-2;
|
||||
&:hover {
|
||||
@apply text-secondary;
|
||||
}
|
||||
img {
|
||||
@apply inline-block ml-1 -mt-1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__renolution-illustration-picture {
|
||||
@apply ml-auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
24
resources/css/blocks/demarches-administratives.css
Executable file
24
resources/css/blocks/demarches-administratives.css
Executable file
|
|
@ -0,0 +1,24 @@
|
|||
#block-demarches-administratives {
|
||||
&.card-large-content-container--has-illustration {
|
||||
@apply pt-64;
|
||||
}
|
||||
|
||||
.card-large-content--has-illustration {
|
||||
@apply pt-28;
|
||||
}
|
||||
.card-large-content__top-illustration {
|
||||
transform: translate(-50%, -70%);
|
||||
}
|
||||
.card-large-content__links-container {
|
||||
@apply grid-cols-1
|
||||
md:grid-cols-2
|
||||
lg:grid-cols-4
|
||||
gap-x-12;
|
||||
.card-large-content__link {
|
||||
/* @apply flex flex-col; */
|
||||
.cta {
|
||||
@apply self-end px-6 w-full text-center md:w-fit;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
66
resources/css/blocks/home-header.css
Executable file
66
resources/css/blocks/home-header.css
Executable file
|
|
@ -0,0 +1,66 @@
|
|||
.home-header {
|
||||
@apply max-w-screen-xl mx-auto px-6 lg:px-16 pt-16 xl:pt-20
|
||||
mb-24;
|
||||
isolation: isolate;
|
||||
|
||||
/* relative */
|
||||
/* bg-red-100 */
|
||||
/* aspect-ratio: 1.5; */
|
||||
|
||||
/* min-height: 80vh; */
|
||||
/* background-color: #fbfff5a6; */
|
||||
&__titling {
|
||||
@apply max-w-[580px]
|
||||
relative
|
||||
z-10
|
||||
lg:absolute
|
||||
mb-[-100px]
|
||||
lg:mb-0;
|
||||
}
|
||||
&__title {
|
||||
@apply text-3xl md:text-4xl font-medium pb-6 pt-16;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
&__scroll-down-indicator {
|
||||
@apply bg-primary rounded-full flex justify-center items-center mt-6;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
&__arrow {
|
||||
animation: bouncingArrow 1s infinite alternate cubic-bezier(0.01, 0.61, 0.67, 0.99);
|
||||
/* cubic-bezier(0.01, 0.61, 0.39, 1); */
|
||||
/* cubic-bezier(0.18, 0.89, 0.3, 1); */
|
||||
}
|
||||
}
|
||||
|
||||
&__fresque {
|
||||
@apply w-full;
|
||||
z-index: -1;
|
||||
@apply bg-purple-50;
|
||||
img {
|
||||
@apply w-full h-full max-h-full object-contain;
|
||||
/* object-position: 100% 100%; */
|
||||
@screen lg {
|
||||
/* object-position: 100% 0%; */
|
||||
}
|
||||
}
|
||||
@media (max-aspect-ratio: 16 / 9) {
|
||||
img {
|
||||
/* @apply bg-red-100; */
|
||||
}
|
||||
}
|
||||
@media (min-aspect-ratio: 16 / 9) {
|
||||
img {
|
||||
/* @apply bg-green-100; */
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@keyframes bouncingArrow {
|
||||
0% {
|
||||
transform: translateY(4px);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(-6px);
|
||||
}
|
||||
}
|
||||
17
resources/css/blocks/latest-news.css
Normal file
17
resources/css/blocks/latest-news.css
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
.section_latest_news {
|
||||
@apply py-24;
|
||||
.section_titling {
|
||||
@apply max-w-md mx-auto;
|
||||
}
|
||||
.articles_container {
|
||||
@apply grid
|
||||
grid-cols-1
|
||||
sm:grid-cols-2
|
||||
xl:grid-cols-4
|
||||
max-w-screen-2xl
|
||||
px-8
|
||||
py-16
|
||||
gap-8
|
||||
mx-auto;
|
||||
}
|
||||
}
|
||||
7
resources/css/blocks/questions-frequentes.css
Normal file
7
resources/css/blocks/questions-frequentes.css
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
#block-questions-frequentes {
|
||||
@apply py-28 px-8;
|
||||
}
|
||||
|
||||
.questions-frequentes-grid {
|
||||
@apply grid md:grid-cols-2 lg:grid-cols-3 gap-8 gap-x-8 max-w-screen-xl mx-auto;
|
||||
}
|
||||
83
resources/css/blocks/show-thematiques.css
Executable file
83
resources/css/blocks/show-thematiques.css
Executable file
|
|
@ -0,0 +1,83 @@
|
|||
.swiper-content {
|
||||
@apply lg:px-24 relative max-w-screen-2xl mx-auto;
|
||||
/* @apply bg-fuchsia-100; */
|
||||
}
|
||||
.swiper-container {
|
||||
height: auto;
|
||||
@apply px-3 overflow-hidden;
|
||||
/* @apply bg-yellow-50; */
|
||||
}
|
||||
|
||||
.swiper-wrapper {
|
||||
@apply pt-24 pb-16 w-full flex-col lg:flex-row gap-y-20;
|
||||
}
|
||||
|
||||
.swiper-slide {
|
||||
@apply h-auto;
|
||||
.card-thematique {
|
||||
@apply h-full;
|
||||
}
|
||||
}
|
||||
|
||||
.thematique-button-next,
|
||||
.thematique-button-prev {
|
||||
@apply absolute top-1/2 z-50 opacity-80 hidden lg:block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
&:hover,
|
||||
&:focus {
|
||||
@apply opacity-100;
|
||||
filter: invert(13%) sepia(71%) saturate(4425%) hue-rotate(338deg) brightness(109%)
|
||||
contrast(117%);
|
||||
}
|
||||
&:focus {
|
||||
@apply rounded-full;
|
||||
}
|
||||
}
|
||||
.thematique-button-next {
|
||||
@apply right-0 transform;
|
||||
}
|
||||
.thematique-button-prev {
|
||||
@apply left-0;
|
||||
}
|
||||
.swiper-pagination {
|
||||
@apply hidden lg:block;
|
||||
}
|
||||
.swiper-pagination-bullet {
|
||||
@apply w-3 h-3 mx-2 opacity-100 bg-white !border-2 !border-solid border-black opacity-80;
|
||||
}
|
||||
.swiper-pagination-bullet:focus {
|
||||
outline-offset: 4px;
|
||||
}
|
||||
.swiper-pagination-bullet-active {
|
||||
@apply bg-secondary !border-secondary opacity-100;
|
||||
}
|
||||
|
||||
/* .swiper-slide {
|
||||
background-color: red !important;
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swiper-slide img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
} */
|
||||
.section-show-thematiques {
|
||||
@apply pt-8 pb-8 px-8 md:px-16;
|
||||
.thematiques-container {
|
||||
@apply grid
|
||||
grid-cols-3
|
||||
gap-8
|
||||
gap-y-32
|
||||
max-w-screen-xl
|
||||
mx-auto
|
||||
pt-16;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user