diff --git a/template-components/cards/card-frequent-question.php b/template-components/cards/card-frequent-question.php
index 0015208..fe0c34f 100644
--- a/template-components/cards/card-frequent-question.php
+++ b/template-components/cards/card-frequent-question.php
@@ -2,12 +2,6 @@
$mots_cles = get_the_terms($args['post_ID'], 'mots-cles');
$thematique_icon = get_field('taxonomy_pictures', $args['thematique'])['icon'];
-// echo '
';
-// print_r($thematique_icon);
-// print_r($mots_cles);
-// print_r($args);
-// echo '
';
-
?>
diff --git a/template-components/cards/card-frequent_question.css b/template-components/cards/card-frequent_question.css
index fb85072..b9c6c51 100644
--- a/template-components/cards/card-frequent_question.css
+++ b/template-components/cards/card-frequent_question.css
@@ -1,5 +1,6 @@
.card-frequent-question {
@apply shadowed p-8 rounded-3xl relative;
+ transition: all 0.3s ease-in-out;
&__icon {
max-width: 80px;
@@ -18,33 +19,61 @@
@apply py-1 px-4 rounded-lg;
}
}
+ &:hover {
+ transform: scale(1.015) translateY(-8px);
+ box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.15);
+ }
&.card-acoustique:hover,
- &.card-petites-coproprietes:hover {
+ &.card-petites-coproprietes:hover,
+ &.card-acoustique .cta--with-arrow-button:focus-visible,
+ &.card-petites-coproprietes .cta--with-arrow-button:focus-visible {
+ @apply !outline-acoustique-coproprietes;
.cta_arrow_button {
@apply filter-acoustique-coproprietes;
}
}
+
&.card-au-quotidien:hover,
- &.card-isolation:hover {
+ &.card-isolation:hover,
+ &.card-au-quotidien .cta--with-arrow-button:focus-visible,
+ &.card-isolation .cta--with-arrow-button:focus-visible {
+ @apply !outline-isolation-quotidien;
.cta_arrow_button {
@apply filter-isolation-quotidien;
}
}
+
&.card-energies:hover,
- &.card-urbanisme:hover {
+ &.card-urbanisme:hover,
+ &.card-energies .cta--with-arrow-button:focus-visible,
+ &.card-urbanisme .cta--with-arrow-button:focus-visible {
+ @apply !outline-energies-urbanisme;
.cta_arrow_button {
@apply filter-energies-urbanisme;
}
}
- &.card-location:hover {
+
+ &.card-location:hover,
+ &.card-location .cta--with-arrow-button:focus-visible {
+ @apply !outline-location-renovation-circulaire;
+
.cta_arrow_button {
@apply filter-location-renovation-circulaire;
}
}
+ &.card-patrimoine .cta--with-arrow-button:focus-visible,
&.card-patrimoine:hover {
+ @apply !outline-patrimoine-renovation;
+
.cta_arrow_button {
@apply filter-patrimoine-renovation;
}
}
+ .cta--with-arrow-button:focus-visible {
+ @apply rounded-full;
+ outline-style: solid;
+ outline-width: 1px;
+ outline-offset: 6px;
+ }
}