diff --git a/css/app.css b/css/app.css index f0fc2b3..f600dea 100644 --- a/css/app.css +++ b/css/app.css @@ -1136,6 +1136,31 @@ video { border-radius: 22px; } +a:focus, +button:focus { + outline: red solid 1px; + outline-width: 1px; + outline-offset: 8px; + outline-radius: 50px; + /* border-radius: 10px; */ +} + +.focus-text { + border-radius: 0.125rem; + outline-style: solid; + outline-width: 1px; + outline-offset: 2px; + outline-color: #DF1E1E; +} + +p a:focus, ul a:focus, ol a:focus { + border-radius: 0.125rem; + outline-style: solid; + outline-width: 1px; + outline-offset: 2px; + outline-color: #DF1E1E; +} + /* ########### BASE ############ */ body:not(.wp-admin) { @@ -1150,15 +1175,6 @@ body { -moz-osx-font-smoothing: grayscale; } -a:focus, -button:focus { - outline: red solid 1px; - outline-width: 1px; - outline-offset: 8px; - outline-radius: 50px; - /* border-radius: 10px; */ -} - *::marker { display: inline-block; color: red; @@ -2433,9 +2449,6 @@ header#main-header { } .menu-renovateur__navlist > .menu-item { - display: flex; - align-items: center; - justify-content: center; font-weight: 700; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); @@ -2526,6 +2539,46 @@ header#main-header { text-underline-offset: 4px; } +.menu-renovateur .menu-item .page_icon { + height: 50px; + width: 50px; +} + +.menu-renovateur .menu-item__submenu-title { + margin-bottom: 1rem; + border-bottom-width: 1px; + --tw-border-opacity: 1; + border-color: rgb(118 117 117 / var(--tw-border-opacity)); + padding-bottom: 1rem; +} + +.menu-renovateur .menu-item__submenu-toggle, + .menu-renovateur .menu-item > a { + display: flex; + align-items: center; + justify-content: center; + border-radius: 1.5rem; + padding: 1.5rem; +} + +.menu-renovateur .menu-item__submenu-toggle { + text-align: left; +} + +.menu-renovateur .menu-item__submenu-close { + position: absolute; + top: 2rem; + right: 2rem; + height: auto; + border-radius: 9999px; + text-align: right; + outline-offset: 4px; + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; + padding: 0; +} + .menu-renovateur__navlist-container { order: 3; width: 100%; @@ -2648,60 +2701,40 @@ header#main-header { height: fit-content; } -.menu-renovateur .menu-item .page_icon { - height: 50px; - width: 50px; -} - -.menu-renovateur .menu-item__submenu-title { - margin-bottom: 1rem; - border-bottom-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(118 117 117 / var(--tw-border-opacity)); - padding-bottom: 1rem; -} - -.menu-renovateur .menu-item__submenu-toggle, - .menu-renovateur .menu-item > a { - border-radius: 1.5rem; - padding: 1.5rem; -} - -.menu-renovateur .menu-item__submenu-toggle { - text-align: left; -} - -.menu-renovateur .menu-item__submenu-close { - position: absolute; - top: 2rem; - right: 2rem; - height: auto; - border-radius: 9999px; - text-align: right; - outline-offset: 4px; - width: -webkit-fit-content; - width: -moz-fit-content; - width: fit-content; - padding: 0; -} - .menu-renovateur--footer { + width: 100%; + padding: 0px; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.menu-renovateur--footer .menu-renovateur__navlist-container { + width: 100%; +} + +.menu-renovateur--footer .menu-renovateur__navlist { + position: relative; display: grid; row-gap: 1rem; } @media (min-width: 600px) { - .menu-renovateur--footer { + .menu-renovateur--footer .menu-renovateur__navlist { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (min-width: 960px) { - .menu-renovateur--footer { + .menu-renovateur--footer .menu-renovateur__navlist { grid-template-columns: repeat(4, minmax(0, 1fr)); } } +.menu-renovateur--footer .menu-renovateur__navlist .menu-item { + justify-content: flex-start; +} + .menu-renovateur--footer li .page_icon { height: 50px; width: 50px; @@ -2717,7 +2750,13 @@ header#main-header { } .menu-renovateur--footer li .sub-menu { - display: none; + /* @apply hidden; */ + /* @apply absolute top-0 left-0 z-50 w-full h-full bg-white grid grid-cols-2; */ +} + +.menu-renovateur--footer .menu-item__submenu-toggle, + .menu-renovateur--footer .menu-item > a { + padding: 0.75rem; } /* .primary-menu-container { */ @@ -3139,18 +3178,22 @@ header#main-header { .entry-content--acoustique-coproprietes .homegrade-blocks-focus-point-bullet, .entry-content--acoustique-coproprietes .homegrade-blocks-focused-schema ol li:before, .entry-content--acoustique-coproprietes .wp-block-button__link, + .entry-content--acoustique-coproprietes ul li:before, body.acoustique-coproprietes .chapter_index__position-indicator, body.acoustique-coproprietes .homegrade-blocks-focus-point-bullet, body.acoustique-coproprietes .homegrade-blocks-focused-schema ol li:before, body.acoustique-coproprietes .wp-block-button__link, + body.acoustique-coproprietes ul li:before, .post-conseil-page--acoustique-coproprietes .chapter_index__position-indicator, .post-conseil-page--acoustique-coproprietes .homegrade-blocks-focus-point-bullet, .post-conseil-page--acoustique-coproprietes .homegrade-blocks-focused-schema ol li:before, .post-conseil-page--acoustique-coproprietes .wp-block-button__link, + .post-conseil-page--acoustique-coproprietes ul li:before, .post-question-page--acoustique-coproprietes .chapter_index__position-indicator, .post-question-page--acoustique-coproprietes .homegrade-blocks-focus-point-bullet, .post-question-page--acoustique-coproprietes .homegrade-blocks-focused-schema ol li:before, - .post-question-page--acoustique-coproprietes .wp-block-button__link { + .post-question-page--acoustique-coproprietes .wp-block-button__link, + .post-question-page--acoustique-coproprietes ul li:before { --tw-bg-opacity: 1; background-color: rgb(36 94 242 / var(--tw-bg-opacity)); } @@ -3557,14 +3600,24 @@ article > *:not(.entry-content, .chapter-header-block), margin-bottom: 2rem; } +.entry-content ul li { + /* @apply my-1 grid gap-2; + grid-template-columns: 10px 1fr; */ + position: relative; + padding-left: 1.25rem; +} + .entry-content ul li:before { + position: absolute; + left: 0px; list-style-type: none; content: ''; display: inline-block; - height: 10px; - width: 10px; + height: 8px; + width: 8px; border-radius: 50%; margin-right: 14px; + margin-top: 9px; } .tooltip-word { @@ -3575,6 +3628,38 @@ article > *:not(.entry-content, .chapter-header-block), -webkit-text-decoration-color:; text-decoration-color:; text-decoration-thickness: 2px !important; + font-weight: 700; +} + +.tooltip-word:focus { + border-radius: 0.125rem; + outline-style: solid; + outline-width: 1px; + outline-offset: 2px; + outline-color: #DF1E1E; +} + +.tooltip-popup { + border-radius: 0.75rem; + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); + padding: 1rem; + font-weight: 400; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); +} + +.tooltip-popup:after { + position: absolute; + z-index: -2; + /* background-color: white; */ +} + +.brochure-link-format:focus { + border-radius: 0.125rem; + outline-style: solid; + outline-width: 1px; + outline-offset: 2px; + outline-color: #DF1E1E; } /* ########### BLOCKS ############ */ @@ -4120,25 +4205,6 @@ article > *:not(.entry-content, .chapter-header-block), background-color: rgb(47 1 84 / var(--tw-bg-opacity)); } -.tooltip-word { - font-weight: 700; -} - -.tooltip-popup { - border-radius: 0.75rem; - --tw-bg-opacity: 1; - background-color: rgb(255 255 255 / var(--tw-bg-opacity)); - padding: 1rem; - font-weight: 400; - box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); -} - -.tooltip-popup:after { - position: absolute; - z-index: -2; - /* background-color: white; */ -} - .homegrade-blocks-vocabulaire-summary { border-radius: 1rem; background-color: rgb(239, 239, 239, 0.6); diff --git a/css/editor-style.css b/css/editor-style.css index b87791b..b3ba671 100644 --- a/css/editor-style.css +++ b/css/editor-style.css @@ -127,6 +127,10 @@ flex-grow: 1 } +.transform { + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) +} + .flex-col { flex-direction: column } diff --git a/footer.php b/footer.php index 7f4026e..f7e7b73 100644 --- a/footer.php +++ b/footer.php @@ -37,16 +37,23 @@
+
+ + + 'false', + // 'theme_location' => 'renovateur', + // 'li_class' => 'menu-navlink', + // 'fallback_cb' => false, + // 'menu_class' => 'menu-renovateur__navlist', + // ) + // ); + ?> +
'false', - 'theme_location' => 'renovateur', - 'li_class' => 'menu-navlink', - 'fallback_cb' => false, - 'menu_class' => 'menu-renovateur--footer', - ) - ); diff --git a/includes/admin.php b/includes/admin.php index 78277a6..1867ad1 100644 --- a/includes/admin.php +++ b/includes/admin.php @@ -156,7 +156,12 @@ add_filter('manage_conseils_posts_columns', 'add_acf_posts_columns'); add_filter('manage_questions_posts_columns', 'add_acf_posts_columns'); add_filter('manage_brochures_posts_columns', 'add_acf_posts_columns'); -// CUSTOMISATION DE LA COLONNE POUR AFFICHER : THEMATIQUE PARENT > THEMATIQUE + + +/* ---------------------------------------------------------------------- + CUSTOMISATION DE LA COLONNE POUR AFFICHER : THEMATIQUE PARENT > THEMATIQUE + ------------------------------------------------------------------------*/ + function handle_posts_custom_columns($column, $post_id) { if ($column != 'thematiques_taxo') { @@ -178,6 +183,69 @@ add_action('manage_questions_posts_custom_column', 'handle_posts_custom_columns' add_action('manage_brochures_posts_custom_column', 'handle_posts_custom_columns', 10, 2); +/* ------------------------------------------- + CREATION DU DROPDOWN SELECT AVEC LES OPTIONS + ---------------------------------------------*/ + +function filter_posts_per_thematique_declare_dropdown() +{ + global $pagenow; + $post_type = (isset($_GET['post_type'])) ? $_GET['post_type'] : 'post'; + + //only add filter to post type you want + if ($post_type == 'questions') { + $all_thematiques = get_terms([ + 'taxonomy' => 'thematiques', + 'hide_empty' => true, + ]); + write_log($all_thematiques); + + + $all_oj_ids = get_posts(array('post_type' => 'oj', 'posts_per_page' => -1, 'orderby' => 'title', 'order' => 'ASC', 'fields' => 'ids')); + $thematiques = get_terms(array('taxonomy' => 'thematiques', 'hide_empty' => true)); +?> + +query_vars['meta_key'] = 'thematiques_taxo'; // change to meta key created by acf. + $query->query_vars['meta_value'] = $_GET['thematiques']; + } +} + +// add_filter('parse_query', 'filter_post_by_thematiques_query'); + + + + /* ---------------------------------------------------------------------- @@ -190,9 +258,9 @@ function wpdocs_admin_classes($classes) // } global $pagenow; global $post; - echo '
';
-	write_log($post);
-	echo '
'; + // echo '
';
+	// write_log($post);
+	// echo '
'; $thematique = get_the_terms(get_the_ID(), 'thematiques')[0] ?? null; $thematiqueParent = getParentThematique($thematique); $thematiqueColorSlug = getThematiqueFamilySlug($thematiqueParent->slug) ?? null; diff --git a/includes/navwalker.php b/includes/navwalker.php index 5b7036d..2cde45c 100644 --- a/includes/navwalker.php +++ b/includes/navwalker.php @@ -18,12 +18,12 @@ function wrap_parent_menu_item_buttons($output, $item, $depth, $args) } - // #### MENU RENOVATEUR — N'est pas utilisé pour le menu principal + // #### MENU RENOVATEUR — FOOTER — N'est pas utilisé pour le menu principal if ($args->theme_location === "renovateur") { $page_icon = get_field('page_icon', $item->object_id); if (in_array('menu-item-has-children', $item->classes, true)) { - $output = ''; + $output = ''; } // #### ICONE DE PAGE FOR TOP LEVEL MENU ITEMS diff --git a/js/app.js b/js/app.js index 3cc30bc..0a747f5 100644 --- a/js/app.js +++ b/js/app.js @@ -1,16 +1,19 @@ (() => { - // resources/js/header.js + // resources/js/menus.js function menuInit() { const header = document.querySelector("#main-header"); + const footer = document.querySelector("footer"); if (!header) return; const searchModule = header.querySelector(".search-module"); const searchModuleToggle = header.querySelector("#search-module-toggle"); const mobileMenuToggle = header.querySelector("#mobile-menu-toggle"); - const submenuToggles = header.querySelectorAll(".menu-item__submenu-toggle"); - const submenuCloseBtns = header.querySelectorAll(".menu-item__submenu-close"); + const headerSubmenuToggles = header.querySelectorAll(".menu-item__submenu-toggle"); + const headerSubmenuCloseBtns = header.querySelectorAll(".menu-item__submenu-close"); + const footerSubmenuToggles = footer.querySelectorAll(".menu-item__submenu-toggle"); + const footerSubmenuCloseBtns = footer.querySelectorAll(".menu-item__submenu-close"); function isSubmenuOpen() { - return header.querySelector(".sub-menu--open") !== null; + return header.querySelector(".sub-menu--open") !== null || footer.querySelector(".sub-menu--open") !== null; } function openSubmenu(buttonToggle) { let isExpanded = buttonToggle.getAttribute("aria-expanded") === "true"; @@ -19,8 +22,14 @@ buttonToggle.parentElement.querySelector(".sub-menu").classList.toggle("sub-menu--closed"); } function closeSubmenus() { - const openSubmenus = header.querySelectorAll(".sub-menu--open"); - openSubmenus.forEach((submenu) => { + const headerOpenSubmenus = header.querySelectorAll(".sub-menu--open"); + const footerOpenSubmenus = footer.querySelectorAll(".sub-menu--open"); + headerOpenSubmenus.forEach((submenu) => { + submenu.classList.remove("sub-menu--open"); + submenu.classList.add("sub-menu--closed"); + submenu.parentElement.querySelector(".menu-item__submenu-toggle").setAttribute("aria-expanded", "false"); + }); + footerOpenSubmenus.forEach((submenu) => { submenu.classList.remove("sub-menu--open"); submenu.classList.add("sub-menu--closed"); submenu.parentElement.querySelector(".menu-item__submenu-toggle").setAttribute("aria-expanded", "false"); @@ -41,7 +50,7 @@ currentOpenedSubmenu.classList.add("sub-menu--closed"); currentOpenedSubmenu.parentElement.querySelector(".menu-item__submenu-toggle").setAttribute("aria-expanded", "false"); } - submenuToggles.forEach((button) => { + headerSubmenuToggles.forEach((button) => { button.addEventListener("click", () => { if (isSearchOpen() === true) { closeSearch(); @@ -49,7 +58,18 @@ handleSubmenuToggle(button); }); }); - submenuCloseBtns.forEach((button) => { + headerSubmenuCloseBtns.forEach((button) => { + button.addEventListener("click", () => closeCurrentSubmenu(button)); + }); + footerSubmenuToggles.forEach((button) => { + button.addEventListener("click", () => { + if (isSearchOpen() === true) { + closeSearch(); + } + handleSubmenuToggle(button); + }); + }); + footerSubmenuCloseBtns.forEach((button) => { button.addEventListener("click", () => closeCurrentSubmenu(button)); }); function isSearchOpen() { @@ -213,10 +233,10 @@ e.preventDefault(); let target = e.target.getAttribute("href"); let targetBlock = document.querySelector(target); - console.log(targetBlock); targetBlock.scrollIntoView({ behavior: "smooth" }); + targetBlock.focus(); }); }); } @@ -227,7 +247,7 @@ } // resources/js/app.js - window.addEventListener("load", function() { + window.addEventListener("DOMContentLoaded", (event) => { menuInit(); singleConseil(); }); diff --git a/resources/css/app.css b/resources/css/app.css index 3cb863c..7fe4fa7 100644 --- a/resources/css/app.css +++ b/resources/css/app.css @@ -6,6 +6,7 @@ @import './utilities/shadows.css'; @import './utilities/animation.css'; @import './utilities/rounding-radius.css'; +@import './utilities/focus.css'; /* ########### BASE ############ */ @import './base/typography.css'; @@ -40,6 +41,8 @@ @import './editor-content/color-taxonomy-scheme.css'; @import './editor-content/gutenberg.css'; @import './editor-content/format-types.css'; +@import './editor-content/text-formats/tooltip.css'; +@import './editor-content/text-formats/brochure.css'; /* ########### BLOCKS ############ */ @@ -56,7 +59,6 @@ @import './blocks/questions-container-block.css'; @import './blocks/points-cles.css'; @import './blocks/highlight.css'; -@import './blocks/tooltip.css'; @import './blocks/vocabulaire-summary.css'; @import './blocks/aside.css'; @import './blocks/focused-schema.css'; diff --git a/resources/css/base/generalites.css b/resources/css/base/generalites.css index 4d7c156..739ab30 100644 --- a/resources/css/base/generalites.css +++ b/resources/css/base/generalites.css @@ -1,13 +1,6 @@ body { @apply bg-white antialiased; } -a:focus, -button:focus { - outline: red solid 1px; - @apply outline-1 outline-offset-8; - outline-radius: 50px; - /* border-radius: 10px; */ -} *::marker { display: inline-block; diff --git a/resources/css/editor-content/color-taxonomy-scheme.css b/resources/css/editor-content/color-taxonomy-scheme.css index fafa52c..ce0542d 100644 --- a/resources/css/editor-content/color-taxonomy-scheme.css +++ b/resources/css/editor-content/color-taxonomy-scheme.css @@ -20,7 +20,8 @@ body.acoustique-coproprietes, .chapter_index__position-indicator, .homegrade-blocks-focus-point-bullet, .homegrade-blocks-focused-schema ol li:before, - .wp-block-button__link { + .wp-block-button__link, + ul li:before { @apply bg-acoustique-coproprietes; } .tooltip-word { diff --git a/resources/css/editor-content/gutenberg.css b/resources/css/editor-content/gutenberg.css index 952ced2..e4f7561 100644 --- a/resources/css/editor-content/gutenberg.css +++ b/resources/css/editor-content/gutenberg.css @@ -33,13 +33,19 @@ article > *:not(.entry-content, .chapter-header-block), @apply mb-8; } + ul li { + /* @apply my-1 grid gap-2; + grid-template-columns: 10px 1fr; */ + @apply relative pl-5; + } ul li:before { - @apply list-none; + @apply list-none absolute left-0; content: ''; display: inline-block; - height: 10px; - width: 10px; + height: 8px; + width: 8px; border-radius: 50%; margin-right: 14px; + margin-top: 9px; } } diff --git a/resources/css/editor-content/text-formats/brochure.css b/resources/css/editor-content/text-formats/brochure.css new file mode 100644 index 0000000..321433c --- /dev/null +++ b/resources/css/editor-content/text-formats/brochure.css @@ -0,0 +1,3 @@ +.brochure-link-format:focus { + @apply focus-text; +} diff --git a/resources/css/blocks/tooltip.css b/resources/css/editor-content/text-formats/tooltip.css similarity index 76% rename from resources/css/blocks/tooltip.css rename to resources/css/editor-content/text-formats/tooltip.css index f91c251..27f115a 100644 --- a/resources/css/blocks/tooltip.css +++ b/resources/css/editor-content/text-formats/tooltip.css @@ -1,9 +1,13 @@ .tooltip-word { @apply font-bold; } +.tooltip-word:focus { + @apply focus-text; +} .tooltip-popup { @apply bg-white rounded-xl shadowed p-4 font-normal; } + .tooltip-popup:after { @apply absolute; z-index: -2; diff --git a/resources/css/layout/menu-renovateur.css b/resources/css/layout/menu-renovateur.css index 5d2c826..6d7f94e 100644 --- a/resources/css/layout/menu-renovateur.css +++ b/resources/css/layout/menu-renovateur.css @@ -39,10 +39,8 @@ } @apply text-black - flex + lg:relative - justify-center - items-center font-bold; } /* Generic Submenu Item */ @@ -104,6 +102,30 @@ } } } + .menu-item { + .page_icon { + @apply w-[50px] h-[50px]; + } + + &__submenu-title { + @apply pb-4 mb-4 border-b border-gray-dark; + } + &__submenu-toggle, + > a { + @apply p-6 rounded-3xl + flex + justify-center + items-center; + } + &__submenu-toggle { + @apply text-left; + } + &__submenu-close { + @apply absolute text-right top-8 right-8 w-fit h-auto rounded-full outline-offset-4; + width: fit-content; + padding: 0; + } + } &__navlist-container { @apply /* bg-white */ order-3 @@ -179,33 +201,19 @@ &__search-module-toggle { @apply h-fit; } - - .menu-item { - .page_icon { - @apply w-[50px] h-[50px]; - } - - &__submenu-title { - @apply pb-4 mb-4 border-b border-gray-dark; - } - &__submenu-toggle, - > a { - @apply p-6 rounded-3xl; - } - &__submenu-toggle { - @apply text-left; - } - &__submenu-close { - @apply absolute text-right top-8 right-8 w-fit h-auto rounded-full outline-offset-4; - width: fit-content; - padding: 0; - } - } } .menu-renovateur--footer { - @apply grid sm:grid-cols-2 lg:grid-cols-4 gap-y-4; - + @apply p-0 shadow-none w-full; + .menu-renovateur__navlist-container { + @apply w-full; + } + .menu-renovateur__navlist { + @apply grid sm:grid-cols-2 lg:grid-cols-4 gap-y-4 relative; + .menu-item { + @apply justify-start; + } + } li { .page_icon { @apply w-[50px] h-[50px]; @@ -217,7 +225,14 @@ font-bold; .sub-menu { - @apply hidden; + /* @apply hidden; */ + /* @apply absolute top-0 left-0 z-50 w-full h-full bg-white grid grid-cols-2; */ + } + } + .menu-item { + &__submenu-toggle, + > a { + @apply p-3; } } } diff --git a/resources/css/utilities/focus.css b/resources/css/utilities/focus.css new file mode 100644 index 0000000..1346277 --- /dev/null +++ b/resources/css/utilities/focus.css @@ -0,0 +1,19 @@ +a:focus, +button:focus { + outline: red solid 1px; + @apply outline-1 outline-offset-8; + outline-radius: 50px; + /* border-radius: 10px; */ +} + +.focus-text { + @apply outline outline-offset-2 outline-1 outline-secondary rounded-sm; +} + +p, +ul, +ol { + a:focus { + @apply focus-text; + } +} diff --git a/resources/js/app.js b/resources/js/app.js index 84b922a..d03f4c4 100644 --- a/resources/js/app.js +++ b/resources/js/app.js @@ -1,7 +1,9 @@ -import menuInit from './header'; +import menuInit from './menus'; import singleConseil from './single-conseil'; -window.addEventListener('load', function () { +// window.addEventListener('load', function () {}); + +window.addEventListener('DOMContentLoaded', (event) => { menuInit(); singleConseil(); }); diff --git a/resources/js/header.js b/resources/js/menus.js similarity index 84% rename from resources/js/header.js rename to resources/js/menus.js index d9bf283..1ad3ee2 100644 --- a/resources/js/header.js +++ b/resources/js/menus.js @@ -1,5 +1,6 @@ export default function menuInit() { const header = document.querySelector('#main-header'); + const footer = document.querySelector('footer'); if (!header) return; // Search module @@ -13,12 +14,17 @@ export default function menuInit() { HANDLE SUBMENUS -----------------------------------------------------------*/ // SubmenusToggles - const submenuToggles = header.querySelectorAll('.menu-item__submenu-toggle'); - const submenuCloseBtns = header.querySelectorAll('.menu-item__submenu-close'); + const headerSubmenuToggles = header.querySelectorAll('.menu-item__submenu-toggle'); + const headerSubmenuCloseBtns = header.querySelectorAll('.menu-item__submenu-close'); + const footerSubmenuToggles = footer.querySelectorAll('.menu-item__submenu-toggle'); + const footerSubmenuCloseBtns = footer.querySelectorAll('.menu-item__submenu-close'); function isSubmenuOpen() { // console.log(header.querySelector('.sub-menu--open') !== null); - return header.querySelector('.sub-menu--open') !== null; + return ( + header.querySelector('.sub-menu--open') !== null || + footer.querySelector('.sub-menu--open') !== null + ); } function openSubmenu(buttonToggle) { @@ -28,8 +34,16 @@ export default function menuInit() { buttonToggle.parentElement.querySelector('.sub-menu').classList.toggle('sub-menu--closed'); } function closeSubmenus() { - const openSubmenus = header.querySelectorAll('.sub-menu--open'); - openSubmenus.forEach((submenu) => { + const headerOpenSubmenus = header.querySelectorAll('.sub-menu--open'); + const footerOpenSubmenus = footer.querySelectorAll('.sub-menu--open'); + headerOpenSubmenus.forEach((submenu) => { + submenu.classList.remove('sub-menu--open'); + submenu.classList.add('sub-menu--closed'); + submenu.parentElement + .querySelector('.menu-item__submenu-toggle') + .setAttribute('aria-expanded', 'false'); + }); + footerOpenSubmenus.forEach((submenu) => { submenu.classList.remove('sub-menu--open'); submenu.classList.add('sub-menu--closed'); submenu.parentElement @@ -60,8 +74,8 @@ export default function menuInit() { .querySelector('.menu-item__submenu-toggle') .setAttribute('aria-expanded', 'false'); } - // SUBMENU TOGGGLES open/close - submenuToggles.forEach((button) => { + // ###HEADER — SUBMENU TOGGGLES open/close + headerSubmenuToggles.forEach((button) => { button.addEventListener('click', () => { if (isSearchOpen() === true) { closeSearch(); @@ -72,7 +86,23 @@ export default function menuInit() { }); }); - submenuCloseBtns.forEach((button) => { + headerSubmenuCloseBtns.forEach((button) => { + button.addEventListener('click', () => closeCurrentSubmenu(button)); + }); + + // ###FOOTER — SUBMENU TOGGGLES open/close + footerSubmenuToggles.forEach((button) => { + button.addEventListener('click', () => { + if (isSearchOpen() === true) { + closeSearch(); + } + + handleSubmenuToggle(button); + // closeSearch(); + }); + }); + + footerSubmenuCloseBtns.forEach((button) => { button.addEventListener('click', () => closeCurrentSubmenu(button)); }); diff --git a/resources/js/single-conseil.js b/resources/js/single-conseil.js index 7be72c6..92823bf 100644 --- a/resources/js/single-conseil.js +++ b/resources/js/single-conseil.js @@ -10,10 +10,11 @@ export default function singleConseil() { e.preventDefault(); let target = e.target.getAttribute('href'); let targetBlock = document.querySelector(target); - console.log(targetBlock); + targetBlock.scrollIntoView({ behavior: 'smooth', }); + targetBlock.focus(); }); }); } diff --git a/single-conseils.php b/single-conseils.php index 45bb2fb..be97a45 100644 --- a/single-conseils.php +++ b/single-conseils.php @@ -2,13 +2,26 @@ get_header(); function build_chapter_index($blocks) { - $chapterIndex = []; + $chapterBlockIndex = []; foreach ($blocks as $key => $block) { if ($block['blockName'] == 'homegrade-content-blocks/questions-container') { - array_push($chapterIndex, $block['attrs']['relatedPostId']); + // array_push($chapterBlockIndex, $block['attrs']['relatedPostId']); + array_push($chapterBlockIndex, [ + 'block-type' => $block['blockName'], + 'anchor' => '#questions-container-' . $block['attrs']['relatedPostId'], + 'title' => get_the_title($block['attrs']['relatedPostId']), + ]); + } + if ($block['blockName'] == 'homegrade-content-blocks/vocabulaire-summary') { + array_push($chapterBlockIndex, [ + 'block-type' => $block['blockName'], + 'anchor' => "#vocabulaire-summary", + 'title' => "Vocabulaire" . " " . get_the_terms(get_the_ID(), "thematiques")[0]->name, + ]); } } - return $chapterIndex; + write_log($chapterBlockIndex); + return $chapterBlockIndex; } ?> @@ -23,11 +36,11 @@ function build_chapter_index($blocks)
""> post_content); - $chapterIndex = build_chapter_index($blocks); + $chapterBlockIndex = build_chapter_index($blocks); ?>
- + diff --git a/template-archive-conseils.php b/template-archive-conseils.php index 562bd99..0fba88a 100644 --- a/template-archive-conseils.php +++ b/template-archive-conseils.php @@ -57,7 +57,6 @@ $thematiquesTerms = get_terms(array( -
diff --git a/template-components/header/menu-renovateur-footer.php b/template-components/header/menu-renovateur-footer.php new file mode 100644 index 0000000..284939f --- /dev/null +++ b/template-components/header/menu-renovateur-footer.php @@ -0,0 +1,143 @@ +term_id, array('order' => 'DESC')); +$logoID = get_theme_mod('custom_logo'); +$logoSRC = wp_get_attachment_image_src($logoID, 'full'); + +?> + + +
+ +
+ +
    + $item) : + // write_log("item"); + // write_log($item); + $link = $item->url; + $title = $item->title; + + // $pageIcon = get_field('page_icon', $item->ID); + + // echo '
    ';
+				// print_r($item);
+				// print_r($pageIcon);
+				// echo '
    '; + // item does not have a parent so menu_item_parent equals 0 (false) + ?> + + menu_item_parent) : ?> + ID; + $page_icon = get_field('page_icon', $item->object_id) ?? null; + ?> + + + menu_item_parent) && $menuitems[$key + 1]->menu_item_parent == $item->ID) : ?> +
  • + + + + + + + + + + + + menu_item_parent) : ?> + +
    + + + menu_item_parent === "168") : ?> +
    + + menu_item_parent === "169") : ?> +
    + + + +
      + + +
    • + + type === "taxonomy") : + + $term = get_term_by('id', $item->object_id, 'thematiques'); + $cover = get_field('taxonomy_pictures', "thematiques_" . $item->object_id); + + ?> + + +
      +
      +

      description ?>

      +
      +       + + + + +
      • + + menu_item_parent != $parent_id && $submenu) : ?> +
    +
    + + + + + menu_item_parent) && $menuitems[$count + 1]->menu_item_parent != $parent_id) : ?> +
    • + + + + +
+
+ + + +
\ No newline at end of file diff --git a/template-components/header/menu-renovateur.php b/template-components/header/menu-renovateur.php index 6c8487e..275b6d1 100644 --- a/template-components/header/menu-renovateur.php +++ b/template-components/header/menu-renovateur.php @@ -5,10 +5,6 @@ $menu = wp_get_nav_menu_object($locations[$menu_name]); $menuitems = wp_get_nav_menu_items($menu->term_id, array('order' => 'DESC')); $logoID = get_theme_mod('custom_logo'); $logoSRC = wp_get_attachment_image_src($logoID, 'full'); - -// echo '
';
-// print_r($image);
-// echo '
'; ?> @@ -56,12 +52,22 @@ $logoSRC = wp_get_attachment_image_src($logoID, 'full'); IF NOT A SUBMENU -----------------------------------------------------------*/ if (!$item->menu_item_parent) : ?> - ID; ?> + ID; + $page_icon = get_field('page_icon', $item->object_id) ?? null; + ?> - + menu_item_parent) && $menuitems[$key + 1]->menu_item_parent == $item->ID) : ?>
  • + + + @@ -85,7 +94,7 @@ $logoSRC = wp_get_attachment_image_src($logoID, 'full');
    -