taxonomies working
This commit is contained in:
parent
f7e0f4db6a
commit
fece623fa9
456
css/app.css
456
css/app.css
|
|
@ -715,6 +715,61 @@ video {
|
||||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bg-secondary {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 30 30 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-acoustique-coproprietes {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(36 94 242 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-acoustique-coproprietes-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 241 255 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-energies-urbanisme {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(2 126 80 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-energies-urbanisme-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(227 255 240 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-isolation-quotidien {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(194 69 3 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-isolation-quotidien-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 251 236 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-patrimoine-renovation {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(139 47 247 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-patrimoine-renovation-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 229 253 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-location {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 0 43 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-location-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(254 226 231 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.px-4 {
|
.px-4 {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
padding-right: 1rem;
|
padding-right: 1rem;
|
||||||
|
|
@ -784,6 +839,66 @@ video {
|
||||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-primary {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(47 1 84 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-secondary {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 30 30 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-acoustique-coproprietes {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(36 94 242 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-acoustique-coproprietes-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 241 255 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-energies-urbanisme {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(2 126 80 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-energies-urbanisme-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(227 255 240 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-isolation-quotidien {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(194 69 3 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-isolation-quotidien-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 251 236 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-patrimoine-renovation {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(139 47 247 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-patrimoine-renovation-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 229 253 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-location {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 0 43 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-location-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(254 226 231 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.antialiased {
|
.antialiased {
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
|
@ -855,6 +970,31 @@ body:not(.wp-admin) {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.filter-acoustique-coproprietes {
|
||||||
|
filter: invert(27%) sepia(88%) saturate(1302%)
|
||||||
|
hue-rotate(206deg) brightness(105%) contrast(114%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-energies-urbanisme {
|
||||||
|
filter: invert(28%) sepia(89%) saturate(1188%)
|
||||||
|
hue-rotate(131deg) brightness(95%) contrast(98%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-isolation-quotidien {
|
||||||
|
filter: invert(21%) sepia(94%) saturate(3059%)
|
||||||
|
hue-rotate(26deg) brightness(98%) contrast(98%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-patrimoine {
|
||||||
|
filter: invert(25%) sepia(79%) saturate(6075%)
|
||||||
|
hue-rotate(263deg) brightness(99%) contrast(96%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-location {
|
||||||
|
filter: invert(13%) sepia(71%) saturate(4425%)
|
||||||
|
hue-rotate(338deg) brightness(109%) contrast(117%);
|
||||||
|
}
|
||||||
|
|
||||||
/* ########### COMPONENTS ############ */
|
/* ########### COMPONENTS ############ */
|
||||||
|
|
||||||
.post-card {
|
.post-card {
|
||||||
|
|
@ -990,23 +1130,12 @@ body:not(.wp-admin) {
|
||||||
}
|
}
|
||||||
|
|
||||||
.primary-menu-container #primary-menu ul {
|
.primary-menu-container #primary-menu ul {
|
||||||
-moz-column-gap: 0.5rem;
|
|
||||||
column-gap: 0.5rem;
|
|
||||||
padding-right: 0px;
|
padding-right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 960px) {
|
@media (min-width: 960px) {
|
||||||
.primary-menu-container #primary-menu ul {
|
.primary-menu-container #primary-menu ul {
|
||||||
display: flex;
|
display: flex;
|
||||||
-moz-column-gap: 1rem;
|
|
||||||
column-gap: 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 1280px) {
|
|
||||||
.primary-menu-container #primary-menu ul {
|
|
||||||
-moz-column-gap: 2rem;
|
|
||||||
column-gap: 2rem;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -1025,20 +1154,19 @@ body:not(.wp-admin) {
|
||||||
}
|
}
|
||||||
|
|
||||||
.primary-menu-container #primary-menu li.menu-item {
|
.primary-menu-container #primary-menu li.menu-item {
|
||||||
|
border-radius: 0.75rem;
|
||||||
|
padding-left: 1rem;
|
||||||
|
padding-right: 1rem;
|
||||||
|
padding-top: 0.5rem;
|
||||||
|
padding-bottom: 0.5rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 0.875rem;
|
|
||||||
line-height: 1.25rem;
|
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
.primary-menu-container #primary-menu li.menu-item:hover > a,
|
.primary-menu-container #primary-menu li.menu-item:hover,
|
||||||
.primary-menu-container #primary-menu li.menu-item a:focus {
|
.primary-menu-container #primary-menu li.menu-item a:focus {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
--tw-text-opacity: 1;
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
color: rgb(223 30 30 / var(--tw-text-opacity));
|
|
||||||
-webkit-text-decoration-line: underline;
|
|
||||||
text-decoration-line: underline;
|
|
||||||
text-underline-offset: 8px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.primary-menu-container #primary-menu li.menu-item a:focus {
|
.primary-menu-container #primary-menu li.menu-item a:focus {
|
||||||
|
|
@ -1393,6 +1521,69 @@ article > *:not(.entry-content),
|
||||||
|
|
||||||
/* Home */
|
/* Home */
|
||||||
|
|
||||||
|
.home-header {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
max-width: 1440px;
|
||||||
|
padding-left: 4rem;
|
||||||
|
padding-right: 4rem;
|
||||||
|
padding-top: 8rem;
|
||||||
|
padding-bottom: 8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-header__titling {
|
||||||
|
max-width: 580px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-header__title {
|
||||||
|
padding-bottom: 1.5rem;
|
||||||
|
font-size: 2.25rem;
|
||||||
|
line-height: 2.5rem;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-header__scroll-down-indicator {
|
||||||
|
margin-top: 1.5rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 9999px;
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(47 1 84 / var(--tw-bg-opacity));
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-header__scroll-down-indicator__arrow {
|
||||||
|
-webkit-animation: bouncingArrow 1s infinite alternate
|
||||||
|
cubic-bezier(0.01, 0.61, 0.67, 0.99);
|
||||||
|
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); */
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes bouncingArrow {
|
||||||
|
0% {
|
||||||
|
transform: translateY(4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(-6px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bouncingArrow {
|
||||||
|
0% {
|
||||||
|
transform: translateY(4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(-6px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.section_latest_news .section_titling {
|
.section_latest_news .section_titling {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
|
|
@ -1412,6 +1603,233 @@ article > *:not(.entry-content),
|
||||||
padding-bottom: 4rem;
|
padding-bottom: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .thematiques-container {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
display: grid;
|
||||||
|
max-width: 1280px;
|
||||||
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
row-gap: 8rem;
|
||||||
|
padding-top: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
border-radius: 1.5rem;
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
||||||
|
padding: 2rem;
|
||||||
|
transition: all 0.3s ease-in-out;
|
||||||
|
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__thumbnail {
|
||||||
|
width: 100%;
|
||||||
|
align-self: flex-end;
|
||||||
|
max-height: 250px;
|
||||||
|
width: auto;
|
||||||
|
margin-top: -110px;
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__title {
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
font-size: 1.125rem;
|
||||||
|
line-height: 1.75rem;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__descritpion {
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__cta {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding-top: 2rem;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__cta::after {
|
||||||
|
position: absolute;
|
||||||
|
content: var(--tw-content);
|
||||||
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__cta:hover {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__cta {
|
||||||
|
transition: font-weight 0.3s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique__cta .cta_arrow_button {
|
||||||
|
display: block;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique:hover {
|
||||||
|
transform: scale(1.02) translateY(-10px);
|
||||||
|
box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique:hover .cta_arrow_button {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique.card-acoustique:hover .cta_arrow_button, .section-show-thematiques .card-thematique.card-petites-coproprietes:hover .cta_arrow_button {
|
||||||
|
filter: invert(27%) sepia(88%) saturate(1302%)
|
||||||
|
hue-rotate(206deg) brightness(105%) contrast(114%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique.card-au-quotidien:hover .cta_arrow_button, .section-show-thematiques .card-thematique.card-isolation:hover .cta_arrow_button {
|
||||||
|
filter: invert(21%) sepia(94%) saturate(3059%)
|
||||||
|
hue-rotate(26deg) brightness(98%) contrast(98%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique.card-energies:hover .cta_arrow_button, .section-show-thematiques .card-thematique.card-urbanisme:hover .cta_arrow_button {
|
||||||
|
filter: invert(28%) sepia(89%) saturate(1188%)
|
||||||
|
hue-rotate(131deg) brightness(95%) contrast(98%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique.card-location:hover .cta_arrow_button {
|
||||||
|
filter: invert(13%) sepia(71%) saturate(4425%)
|
||||||
|
hue-rotate(338deg) brightness(109%) contrast(117%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-show-thematiques .card-thematique.card-patrimoine:hover .cta_arrow_button {
|
||||||
|
filter: invert(25%) sepia(79%) saturate(6075%)
|
||||||
|
hue-rotate(263deg) brightness(99%) contrast(96%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-primary:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(47 1 84 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-secondary:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 30 30 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-acoustique-coproprietes:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(36 94 242 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-acoustique-coproprietes-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 241 255 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-energies-urbanisme:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(2 126 80 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-energies-urbanisme-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(227 255 240 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-isolation-quotidien:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(194 69 3 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-isolation-quotidien-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 251 236 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-patrimoine-renovation:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(139 47 247 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-patrimoine-renovation-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 229 253 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-location:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 0 43 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-location-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(254 226 231 / var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-primary:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(47 1 84 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-secondary:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 30 30 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-acoustique-coproprietes:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(36 94 242 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-acoustique-coproprietes-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 241 255 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-energies-urbanisme:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(2 126 80 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-energies-urbanisme-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(227 255 240 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-isolation-quotidien:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(194 69 3 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-isolation-quotidien-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 251 236 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-patrimoine-renovation:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(139 47 247 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-patrimoine-renovation-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 229 253 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-location:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 0 43 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-location-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(254 226 231 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
@media (min-width: 782px) {
|
@media (min-width: 782px) {
|
||||||
.md\:my-6 {
|
.md\:my-6 {
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
|
|
|
||||||
|
|
@ -162,6 +162,61 @@
|
||||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity))
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bg-secondary {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 30 30 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-acoustique-coproprietes {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(36 94 242 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-acoustique-coproprietes-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 241 255 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-energies-urbanisme {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(2 126 80 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-energies-urbanisme-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(227 255 240 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-isolation-quotidien {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(194 69 3 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-isolation-quotidien-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 251 236 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-patrimoine-renovation {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(139 47 247 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-patrimoine-renovation-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 229 253 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-location {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 0 43 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-location-light {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(254 226 231 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
.px-4 {
|
.px-4 {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
padding-right: 1rem
|
padding-right: 1rem
|
||||||
|
|
@ -231,6 +286,66 @@
|
||||||
color: rgb(255 255 255 / var(--tw-text-opacity))
|
color: rgb(255 255 255 / var(--tw-text-opacity))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-isolation-quotidien {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(194 69 3 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-primary {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(47 1 84 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-secondary {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 30 30 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-acoustique-coproprietes {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(36 94 242 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-acoustique-coproprietes-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 241 255 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-energies-urbanisme {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(2 126 80 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-energies-urbanisme-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(227 255 240 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-isolation-quotidien-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 251 236 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-patrimoine-renovation {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(139 47 247 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-patrimoine-renovation-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 229 253 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-location {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 0 43 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-location-light {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(254 226 231 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
.antialiased {
|
.antialiased {
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale
|
-moz-osx-font-smoothing: grayscale
|
||||||
|
|
@ -325,6 +440,126 @@ body {
|
||||||
max-width: 782px
|
max-width: 782px
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hover\:bg-primary:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(47 1 84 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-secondary:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 30 30 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-acoustique-coproprietes:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(36 94 242 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-acoustique-coproprietes-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 241 255 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-energies-urbanisme:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(2 126 80 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-energies-urbanisme-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(227 255 240 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-isolation-quotidien:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(194 69 3 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-isolation-quotidien-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 251 236 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-patrimoine-renovation:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(139 47 247 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-patrimoine-renovation-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(255 229 253 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-location:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(223 0 43 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:bg-location-light:hover {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgb(254 226 231 / var(--tw-bg-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-primary:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(47 1 84 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-secondary:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 30 30 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-acoustique-coproprietes:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(36 94 242 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-acoustique-coproprietes-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 241 255 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-energies-urbanisme:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(2 126 80 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-energies-urbanisme-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(227 255 240 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-isolation-quotidien:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(194 69 3 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-isolation-quotidien-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 251 236 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-patrimoine-renovation:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(139 47 247 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-patrimoine-renovation-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 229 253 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-location:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(223 0 43 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover\:text-location-light:hover {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(254 226 231 / var(--tw-text-opacity))
|
||||||
|
}
|
||||||
|
|
||||||
@media (min-width: 782px) {
|
@media (min-width: 782px) {
|
||||||
.md\:my-6 {
|
.md\:my-6 {
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@ require_once(__DIR__ . '/includes/post_types.php');
|
||||||
require_once(__DIR__ . '/includes/admin.php');
|
require_once(__DIR__ . '/includes/admin.php');
|
||||||
require_once(__DIR__ . '/includes/logos.php');
|
require_once(__DIR__ . '/includes/logos.php');
|
||||||
require_once(__DIR__ . '/includes/taxonomy.php');
|
require_once(__DIR__ . '/includes/taxonomy.php');
|
||||||
|
require_once(__DIR__ . '/includes/utilities.php');
|
||||||
|
|
||||||
// require_once(__DIR__ . '/includes/widget.php');
|
// require_once(__DIR__ . '/includes/widget.php');
|
||||||
// require_once( __DIR__ . '/includes/errorlog.php');
|
|
||||||
// require_once( __DIR__ . '/includes/logos.php');
|
// require_once( __DIR__ . '/includes/logos.php');
|
||||||
|
|
@ -34,6 +34,7 @@ function mywp_register_acf_blocks()
|
||||||
}
|
}
|
||||||
register_block_type(get_template_directory() . '/template-blocks/home/home-header');
|
register_block_type(get_template_directory() . '/template-blocks/home/home-header');
|
||||||
register_block_type(get_template_directory() . '/template-blocks/home/latest-news');
|
register_block_type(get_template_directory() . '/template-blocks/home/latest-news');
|
||||||
|
register_block_type(get_template_directory() . '/template-blocks/home/show-thematiques');
|
||||||
}
|
}
|
||||||
add_action('init', 'mywp_register_acf_blocks');
|
add_action('init', 'mywp_register_acf_blocks');
|
||||||
|
|
||||||
|
|
|
||||||
29
includes/utilities.php
Normal file
29
includes/utilities.php
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
<?php
|
||||||
|
function getThematiqueFamilySlug($thematique_slug)
|
||||||
|
{
|
||||||
|
|
||||||
|
switch ($thematique_slug) {
|
||||||
|
case "energie":
|
||||||
|
case "urbanisme":
|
||||||
|
return "energies-urbanisme";
|
||||||
|
|
||||||
|
case "acoustique":
|
||||||
|
case "petites-coproprietes":
|
||||||
|
return "acoustique-coproprietes";
|
||||||
|
|
||||||
|
case "isolation":
|
||||||
|
case "au-quotidien":
|
||||||
|
return "isolation-quotidien";
|
||||||
|
|
||||||
|
case "energies":
|
||||||
|
case "urbanisme":
|
||||||
|
return "energies-urbanisme";
|
||||||
|
|
||||||
|
case "patrimoine":
|
||||||
|
case "renovation":
|
||||||
|
return "patrimoine-renovation";
|
||||||
|
|
||||||
|
case "location":
|
||||||
|
return "location";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -6,6 +6,7 @@
|
||||||
|
|
||||||
/* ########### BASE ############ */
|
/* ########### BASE ############ */
|
||||||
@import './base/typography.css';
|
@import './base/typography.css';
|
||||||
|
@import './base/thematiques-colors.css';
|
||||||
|
|
||||||
/* ########### COMPONENTS ############ */
|
/* ########### COMPONENTS ############ */
|
||||||
@import './components/cta.css';
|
@import './components/cta.css';
|
||||||
|
|
@ -23,3 +24,4 @@
|
||||||
/* Home */
|
/* Home */
|
||||||
@import '../../template-blocks/home/home-header/home-header.css';
|
@import '../../template-blocks/home/home-header/home-header.css';
|
||||||
@import '../../template-blocks/home/latest-news/latest-news.css';
|
@import '../../template-blocks/home/latest-news/latest-news.css';
|
||||||
|
@import '../../template-blocks/home/show-thematiques/show-thematiques.css';
|
||||||
|
|
|
||||||
20
resources/css/base/thematiques-colors.css
Normal file
20
resources/css/base/thematiques-colors.css
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
.filter-acoustique-coproprietes {
|
||||||
|
filter: invert(27%) sepia(88%) saturate(1302%)
|
||||||
|
hue-rotate(206deg) brightness(105%) contrast(114%);
|
||||||
|
}
|
||||||
|
.filter-energies-urbanisme {
|
||||||
|
filter: invert(28%) sepia(89%) saturate(1188%)
|
||||||
|
hue-rotate(131deg) brightness(95%) contrast(98%);
|
||||||
|
}
|
||||||
|
.filter-isolation-quotidien {
|
||||||
|
filter: invert(21%) sepia(94%) saturate(3059%)
|
||||||
|
hue-rotate(26deg) brightness(98%) contrast(98%);
|
||||||
|
}
|
||||||
|
.filter-patrimoine {
|
||||||
|
filter: invert(25%) sepia(79%) saturate(6075%)
|
||||||
|
hue-rotate(263deg) brightness(99%) contrast(96%);
|
||||||
|
}
|
||||||
|
.filter-location {
|
||||||
|
filter: invert(13%) sepia(71%) saturate(4425%)
|
||||||
|
hue-rotate(338deg) brightness(109%) contrast(117%);
|
||||||
|
}
|
||||||
|
|
@ -24,9 +24,7 @@
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
@apply lg:flex
|
@apply lg:flex
|
||||||
gap-x-2
|
|
||||||
lg:gap-x-4
|
|
||||||
xl:gap-x-8
|
|
||||||
pr-0;
|
pr-0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -42,15 +40,16 @@
|
||||||
|
|
||||||
li.menu-item {
|
li.menu-item {
|
||||||
@apply font-medium
|
@apply font-medium
|
||||||
text-sm
|
|
||||||
text-center;
|
|
||||||
|
|
||||||
&:hover > a,
|
text-center
|
||||||
|
px-4
|
||||||
|
py-2
|
||||||
|
rounded-xl;
|
||||||
|
|
||||||
|
&:hover,
|
||||||
a:focus {
|
a:focus {
|
||||||
@apply cursor-pointer
|
@apply cursor-pointer;
|
||||||
underline
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
underline-offset-8
|
|
||||||
text-secondary;
|
|
||||||
}
|
}
|
||||||
a:focus {
|
a:focus {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
|
||||||
11
resources/svg/arrow-down-white.svg
Normal file
11
resources/svg/arrow-down-white.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg id="fleche-animation-scroll" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24.591" height="36.712" viewBox="0 0 24.591 36.712">
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip-path">
|
||||||
|
<rect id="Rectangle_773" data-name="Rectangle 773" width="24.591" height="36.712" fill="none" stroke="#fff" stroke-width="2"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
<g id="Groupe_3060" data-name="Groupe 3060" clip-path="url(#clip-path)">
|
||||||
|
<line id="Ligne_1913" data-name="Ligne 1913" y2="33.552" transform="translate(12.295 1.58)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
|
||||||
|
<path id="Tracé_11381" data-name="Tracé 11381" d="M1,15.452,11.715,26.167,22.43,15.452" transform="translate(0.58 8.965)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 867 B |
12
resources/svg/arrow-right-circle.svg
Normal file
12
resources/svg/arrow-right-circle.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="47" height="47" viewBox="0 0 47 47">
|
||||||
|
<g id="Groupe_3134" data-name="Groupe 3134" transform="translate(-260.842 -459)">
|
||||||
|
<g id="Groupe_1270" data-name="Groupe 1270" transform="translate(274.771 475.82)">
|
||||||
|
<line id="Ligne_6" data-name="Ligne 6" x2="19.821" transform="translate(0 6.33)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
|
||||||
|
<path id="Tracé_162" data-name="Tracé 162" d="M104.818,82.8l6.33-6.33-6.33-6.33" transform="translate(-91.328 -70.142)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
|
||||||
|
</g>
|
||||||
|
<g id="Ellipse_202" data-name="Ellipse 202" transform="translate(260.842 459)" fill="none" stroke="#000" stroke-width="2">
|
||||||
|
<circle cx="23.5" cy="23.5" r="23.5" stroke="none"/>
|
||||||
|
<circle cx="23.5" cy="23.5" r="22.5" fill="none"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 929 B |
|
|
@ -1,5 +1,5 @@
|
||||||
const theme = require('./theme.json');
|
const theme = require('./theme.json');
|
||||||
const tailpress = require("@jeffreyvr/tailwindcss-tailpress");
|
const tailpress = require('@jeffreyvr/tailwindcss-tailpress');
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
content: [
|
content: [
|
||||||
|
|
@ -7,30 +7,91 @@ module.exports = {
|
||||||
'./**/*.php',
|
'./**/*.php',
|
||||||
'./resources/css/*.css',
|
'./resources/css/*.css',
|
||||||
'./resources/js/*.js',
|
'./resources/js/*.js',
|
||||||
'./safelist.txt'
|
'./safelist.txt',
|
||||||
|
],
|
||||||
|
safelist: [
|
||||||
|
'bg-primary',
|
||||||
|
'text-primary',
|
||||||
|
'bg-secondary',
|
||||||
|
'text-secondary',
|
||||||
|
'bg-acoustique-coproprietes',
|
||||||
|
'text-acoustique-coproprietes',
|
||||||
|
'bg-acoustique-coproprietes-light',
|
||||||
|
'text-acoustique-coproprietes-light',
|
||||||
|
'bg-energies-urbanisme',
|
||||||
|
'text-energies-urbanisme',
|
||||||
|
'bg-energies-urbanisme-light',
|
||||||
|
'text-energies-urbanisme-light',
|
||||||
|
'bg-isolation-quotidien',
|
||||||
|
'text-isolation-quotidien',
|
||||||
|
'bg-isolation-quotidien-light',
|
||||||
|
'text-isolation-quotidien-light',
|
||||||
|
'bg-patrimoine-renovation',
|
||||||
|
'text-patrimoine-renovation',
|
||||||
|
'bg-patrimoine-renovation-light',
|
||||||
|
'text-patrimoine-renovation-light',
|
||||||
|
'bg-location',
|
||||||
|
'text-location',
|
||||||
|
'bg-location-light',
|
||||||
|
'text-location-light',
|
||||||
|
'hover:bg-primary',
|
||||||
|
'hover:text-primary',
|
||||||
|
'hover:bg-secondary',
|
||||||
|
'hover:text-secondary',
|
||||||
|
'hover:bg-acoustique-coproprietes',
|
||||||
|
'hover:text-acoustique-coproprietes',
|
||||||
|
'hover:bg-acoustique-coproprietes-light',
|
||||||
|
'hover:text-acoustique-coproprietes-light',
|
||||||
|
'hover:bg-energies-urbanisme',
|
||||||
|
'hover:text-energies-urbanisme',
|
||||||
|
'hover:bg-energies-urbanisme-light',
|
||||||
|
'hover:text-energies-urbanisme-light',
|
||||||
|
'hover:bg-isolation-quotidien',
|
||||||
|
'hover:text-isolation-quotidien',
|
||||||
|
'hover:bg-isolation-quotidien-light',
|
||||||
|
'hover:text-isolation-quotidien-light',
|
||||||
|
'hover:bg-patrimoine-renovation',
|
||||||
|
'hover:text-patrimoine-renovation',
|
||||||
|
'hover:bg-patrimoine-renovation-light',
|
||||||
|
'hover:text-patrimoine-renovation-light',
|
||||||
|
'hover:bg-location',
|
||||||
|
'hover:text-location',
|
||||||
|
'hover:bg-location-light',
|
||||||
|
'hover:text-location-light',
|
||||||
],
|
],
|
||||||
theme: {
|
theme: {
|
||||||
container: {
|
container: {
|
||||||
padding: {
|
padding: {
|
||||||
DEFAULT: '1rem',
|
DEFAULT: '1rem',
|
||||||
sm: '2rem',
|
sm: '2rem',
|
||||||
lg: '0rem'
|
lg: '0rem',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
extend: {
|
extend: {
|
||||||
colors: tailpress.colorMapper(tailpress.theme('settings.color.palette', theme)),
|
colors: tailpress.colorMapper(
|
||||||
fontSize: tailpress.fontSizeMapper(tailpress.theme('settings.typography.fontSizes', theme))
|
tailpress.theme('settings.color.palette', theme)
|
||||||
|
),
|
||||||
|
fontSize: tailpress.fontSizeMapper(
|
||||||
|
tailpress.theme(
|
||||||
|
'settings.typography.fontSizes',
|
||||||
|
theme
|
||||||
|
)
|
||||||
|
),
|
||||||
},
|
},
|
||||||
screens: {
|
screens: {
|
||||||
'xs': '480px',
|
xs: '480px',
|
||||||
'sm': '600px',
|
sm: '600px',
|
||||||
'md': '782px',
|
md: '782px',
|
||||||
'lg': tailpress.theme('settings.layout.contentSize', theme),
|
lg: tailpress.theme(
|
||||||
'xl': tailpress.theme('settings.layout.wideSize', theme),
|
'settings.layout.contentSize',
|
||||||
'2xl': '1440px'
|
theme
|
||||||
}
|
),
|
||||||
|
xl: tailpress.theme(
|
||||||
|
'settings.layout.wideSize',
|
||||||
|
theme
|
||||||
|
),
|
||||||
|
'2xl': '1440px',
|
||||||
},
|
},
|
||||||
plugins: [
|
},
|
||||||
tailpress.tailwind
|
plugins: [tailpress.tailwind],
|
||||||
]
|
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,31 @@
|
||||||
|
.home-header {
|
||||||
|
@apply max-w-screen-2xl mx-auto px-16 py-32;
|
||||||
|
|
||||||
|
&__titling {
|
||||||
|
@apply max-w-[580px];
|
||||||
|
}
|
||||||
|
&__title {
|
||||||
|
@apply text-4xl font-medium pb-6;
|
||||||
|
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); */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes bouncingArrow {
|
||||||
|
0% {
|
||||||
|
transform: translateY(4px);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translateY(-6px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -5,12 +5,14 @@ $home_header = get_field('home_header_datas');
|
||||||
|
|
||||||
|
|
||||||
<section class="home-header header_top">
|
<section class="home-header header_top">
|
||||||
<h1>qsdqsdd</h1>
|
<div class="home-header__titling">
|
||||||
<div class="home-header__content">
|
|
||||||
<h1 class="home-header__title">
|
<h1 class="home-header__title">
|
||||||
<?php echo $home_header['title'] ?>
|
<?php echo $home_header['title'] ?>
|
||||||
</h1>
|
</h1>
|
||||||
|
<p><?php echo $home_header['description'] ?></p>
|
||||||
|
<div class="home-header__scroll-down-indicator">
|
||||||
|
<img class="home-header__scroll-down-indicator__arrow" src='<?php echo get_template_directory_uri() ?>/resources/svg/arrow-down-white.svg' alt=''>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
17
template-blocks/home/show-thematiques/block.json
Normal file
17
template-blocks/home/show-thematiques/block.json
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
{
|
||||||
|
"name": "acf/show-thematiques",
|
||||||
|
"title": "Home | Thématiques",
|
||||||
|
"category": "homegrade-pages",
|
||||||
|
"multiple": false,
|
||||||
|
"icon": {
|
||||||
|
"foreground": "#DF1E1E",
|
||||||
|
"src": "schedule"
|
||||||
|
},
|
||||||
|
"keywords": [
|
||||||
|
"Thématiques"
|
||||||
|
],
|
||||||
|
"acf": {
|
||||||
|
"mode": "auto",
|
||||||
|
"renderTemplate": "show-thematiques.php"
|
||||||
|
}
|
||||||
|
}
|
||||||
85
template-blocks/home/show-thematiques/show-thematiques.css
Executable file
85
template-blocks/home/show-thematiques/show-thematiques.css
Executable file
|
|
@ -0,0 +1,85 @@
|
||||||
|
.section-show-thematiques {
|
||||||
|
.thematiques-container {
|
||||||
|
@apply grid
|
||||||
|
grid-cols-3
|
||||||
|
gap-8
|
||||||
|
gap-y-32
|
||||||
|
max-w-screen-xl
|
||||||
|
mx-auto
|
||||||
|
pt-16;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-thematique {
|
||||||
|
@apply bg-white flex flex-col p-8 rounded-3xl relative;
|
||||||
|
transition: all 0.3s ease-in-out;
|
||||||
|
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.15);
|
||||||
|
|
||||||
|
&__thumbnail {
|
||||||
|
@apply w-full self-end;
|
||||||
|
max-height: 250px;
|
||||||
|
width: auto;
|
||||||
|
margin-top: -110px;
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
&__title {
|
||||||
|
@apply text-lg font-bold pb-4;
|
||||||
|
}
|
||||||
|
&__descritpion {
|
||||||
|
}
|
||||||
|
|
||||||
|
&__cta {
|
||||||
|
@apply after:absolute
|
||||||
|
after:inset-0
|
||||||
|
font-bold
|
||||||
|
hover:opacity-100
|
||||||
|
pt-8
|
||||||
|
flex
|
||||||
|
items-center
|
||||||
|
justify-between;
|
||||||
|
transition: font-weight 0.3s ease-in-out;
|
||||||
|
.cta_arrow_button {
|
||||||
|
@apply block;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: scale(1.02) translateY(-10px);
|
||||||
|
box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.15);
|
||||||
|
|
||||||
|
.cta_arrow_button {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.card-acoustique:hover,
|
||||||
|
&.card-petites-coproprietes:hover {
|
||||||
|
.cta_arrow_button {
|
||||||
|
@apply filter-acoustique-coproprietes;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.card-au-quotidien:hover,
|
||||||
|
&.card-isolation:hover {
|
||||||
|
.cta_arrow_button {
|
||||||
|
@apply filter-isolation-quotidien;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.card-energies:hover,
|
||||||
|
&.card-urbanisme:hover {
|
||||||
|
.cta_arrow_button {
|
||||||
|
@apply filter-energies-urbanisme;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.card-location:hover {
|
||||||
|
.cta_arrow_button {
|
||||||
|
@apply filter-location;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.card-patrimoine:hover {
|
||||||
|
.cta_arrow_button {
|
||||||
|
@apply filter-patrimoine;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
44
template-blocks/home/show-thematiques/show-thematiques.php
Executable file
44
template-blocks/home/show-thematiques/show-thematiques.php
Executable file
|
|
@ -0,0 +1,44 @@
|
||||||
|
<?php
|
||||||
|
$block_titling_datas = get_field('block_titling_datas');
|
||||||
|
|
||||||
|
|
||||||
|
$terms = get_terms(array(
|
||||||
|
'taxonomy' => 'thematiques',
|
||||||
|
'parent' => 0,
|
||||||
|
'hide_empty' => false,
|
||||||
|
));
|
||||||
|
|
||||||
|
|
||||||
|
?>
|
||||||
|
|
||||||
|
<section class="section-show-thematiques">
|
||||||
|
<div class="section_titling">
|
||||||
|
<h2 class="section_titling__title"><?php echo $block_titling_datas['title'] ?></h2>
|
||||||
|
<h3 class="section_titling__subtitle"><?php echo $block_titling_datas['subtitle'] ?></h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="thematiques-container">
|
||||||
|
<?php foreach ($terms as $term) : ?>
|
||||||
|
<?php
|
||||||
|
|
||||||
|
$taxonomy_picture = get_field('taxonomy_pictures', $term);
|
||||||
|
$color = getThematiqueFamilySlug($term->slug);
|
||||||
|
?>
|
||||||
|
<div class="card-thematique card-<?php echo $term->slug ?>">
|
||||||
|
<img class="card-thematique__thumbnail" src="<?php echo $taxonomy_picture['illustration_s']['sizes']['medium'] ?>" alt="">
|
||||||
|
<h4 class="card-thematique__title text-<?php echo getThematiqueFamilySlug($term->slug) ?>"><?php echo $term->name ?></h4>
|
||||||
|
<p class="card-thematique__description"><?php echo $term->description ?></p>
|
||||||
|
|
||||||
|
<a class="card-thematique__cta hover:text-<?php echo getThematiqueFamilySlug($term->slug) ?>" href="<?php echo get_term_link($term) ?> ">
|
||||||
|
En savoir plus
|
||||||
|
<div class="cta_arrow_button">
|
||||||
|
<img src='<?php echo get_template_directory_uri() ?>/resources/svg/arrow-right-circle.svg' alt=''>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
Loading…
Reference in New Issue
Block a user