diff --git a/web/themes/custom/fstheme/components/base/main.pcss b/web/themes/custom/fstheme/components/base/main.pcss index d0f54e6..0197a7e 100755 --- a/web/themes/custom/fstheme/components/base/main.pcss +++ b/web/themes/custom/fstheme/components/base/main.pcss @@ -99,12 +99,4 @@ .container-content { @apply md:px-[90px] lg:px-[208px] xl:px-[258px] mx-auto; } - - .main-menu { - @apply flex; - } - - .main-menu li a { - @apply p-[25px] text-[46px] leading-[46px] md:text-[56px] md:leading-[54px] lg:text-[22px] lg:leading-[45px] xl:text-[24px]; - } } diff --git a/web/themes/custom/fstheme/components/base/main.tsx b/web/themes/custom/fstheme/components/base/main.tsx index 30d4aea..33cc5be 100644 --- a/web/themes/custom/fstheme/components/base/main.tsx +++ b/web/themes/custom/fstheme/components/base/main.tsx @@ -1,16 +1,38 @@ -// import { StrictMode } from 'react'; -// import { createRoot } from 'react-dom/client'; import './main.pcss'; -// import ArticleList from '../../src/js/components/ArticleList'; -// const elements = document.querySelectorAll('.article-list'); -// elements.forEach((element) => { -// const root = createRoot(element); -// root.render( -// -// <> -// -// -// -// ); -// }) +class PrimaryMenu { + + primary_menu_wrapper_element: HTMLElement; + primary_menu_element: HTMLElement; + primary_menu_container: HTMLElement; + open_menu_element: HTMLElement | null; + close_menu_element: HTMLElement | null; + + + constructor(element: HTMLElement) { + this.primary_menu_wrapper_element = element; + this.primary_menu_element = element.querySelector('.primary-menu') as HTMLElement; + this.primary_menu_container = element.querySelector('.primary-menu-container') as HTMLElement; + this.open_menu_element = element.querySelector('.js-open-menu'); + this.close_menu_element = element.querySelector('.js-close-menu'); + + if (!this.close_menu_element || !this.primary_menu_element || !this.open_menu_element || !this.primary_menu_container) { + return; + } + + this.close_menu_element.addEventListener('click', () => { + this.primary_menu_element.classList.add('hidden'); + this.primary_menu_container.classList.remove('container'); + }); + + this.open_menu_element.addEventListener('click', () => { + this.primary_menu_element.classList.remove('hidden'); + this.primary_menu_container.classList.add('container'); + }); + } +} + +const primary_menu_element = document.querySelector('.primary-menu-wrapper'); +if (primary_menu_element) { + new PrimaryMenu(primary_menu_element); +} \ No newline at end of file diff --git a/web/themes/custom/fstheme/templates/content/node--article--full.html.twig b/web/themes/custom/fstheme/templates/content/node--article--full.html.twig index 1354ec1..41b3d7f 100644 --- a/web/themes/custom/fstheme/templates/content/node--article--full.html.twig +++ b/web/themes/custom/fstheme/templates/content/node--article--full.html.twig @@ -66,7 +66,7 @@ {{ title_suffix }}
-
+
{{ content.lead }}
diff --git a/web/themes/custom/fstheme/templates/layout/html.html.twig b/web/themes/custom/fstheme/templates/layout/html.html.twig index 4bff179..4a4f933 100644 --- a/web/themes/custom/fstheme/templates/layout/html.html.twig +++ b/web/themes/custom/fstheme/templates/layout/html.html.twig @@ -14,8 +14,8 @@ - -
+ +
{# Keyboard navigation/accessibility link to main content section in page.html.twig. diff --git a/web/themes/custom/fstheme/templates/layout/page.html.twig b/web/themes/custom/fstheme/templates/layout/page.html.twig index 0385aa1..d5f1770 100644 --- a/web/themes/custom/fstheme/templates/layout/page.html.twig +++ b/web/themes/custom/fstheme/templates/layout/page.html.twig @@ -45,16 +45,44 @@ #}
-
+