From ac5a0d18b9722e21509cf061871bf458c5a30553 Mon Sep 17 00:00:00 2001
From: Marie Destandau <marie@ototoi.fr>
Date: Thu, 7 Sep 2023 13:46:16 +0200
Subject: [PATCH 1/3] [HOMEPAGE] refactor: add landmark and list to header nav

---
 homepage/src/components/OtherSurveys.astro | 25 ++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)
diff --git a/homepage/src/components/OtherSurveys.astro b/homepage/src/components/OtherSurveys.astro
index 3e55e5a7d..67525ce8c 100644
--- a/homepage/src/components/OtherSurveys.astro
+++ b/homepage/src/components/OtherSurveys.astro
@@ -4,14 +4,16 @@ const { survey, surveys, locale } = Astro.props
 const otherSurveys = surveys.filter(s => s.id !== survey.id)
 ---
 
-<div class="other-surveys">
-  <div class="other-surveys-inner">
+<header class="other-surveys">
+  <nav class="other-surveys-inner">
     <T locale={locale} k="homepage.other_surveys" />
+    <ul class="other-surveys-list">
     {otherSurveys.map(
-    ({name, domain})=> (<a class="other-survey-link" href={`https://${domain}`}>{name}</a>)
+    ({name, domain})=> (<li class="other-survey-item"><a class="other-survey-link" href={`https://${domain}`}>{name}</a></li>)
     )}
-  </div>
-</div>
+    </ul>
+  </nav>
+</header>
 
 <style lang="scss">
   .other-surveys {
@@ -24,13 +26,23 @@ const otherSurveys = surveys.filter(s => s.id !== survey.id)
   .other-surveys-inner {
     width: 100%;
     margin: 0 auto;
+    display: flex;
+    justify-content: center;
 
     @media screen and (max-width: 666px) {
       font-size: var(--small-font);
+      flex-wrap: wrap;
     }
   }
 
-  .other-survey-link {
+  .other-surveys-list {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    padding: 0;
+  }
+
+  .other-survey-item {
     display: inline-block;
     margin-left: var(--doublespacing);
 
@@ -38,4 +50,5 @@ const otherSurveys = surveys.filter(s => s.id !== survey.id)
       margin-left: var(--halfspacing);
     }
   }
+
 </style>
\ No newline at end of file

From 6a4cfac9495fb8ece099d6193a7077148a543bba Mon Sep 17 00:00:00 2001
From: Marie Destandau <marie@ototoi.fr>
Date: Thu, 7 Sep 2023 13:48:01 +0200
Subject: [PATCH 2/3] [HOMEPAGE] refactor: add main landmark

---
 homepage/src/layouts/DefaultLayout.astro | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/homepage/src/layouts/DefaultLayout.astro b/homepage/src/layouts/DefaultLayout.astro
index a05f35eb4..9fadbcd74 100644
--- a/homepage/src/layouts/DefaultLayout.astro
+++ b/homepage/src/layouts/DefaultLayout.astro
@@ -48,9 +48,9 @@ const variables = `
   <body>
       <OtherSurveys locale={locale} surveys={surveys} survey={survey} />
       <div class="layout">
-        <div>
+        <main>
         <slot />
-        </div>
+        </main>
         {survey.partners && <Partners {...Astro.props} />}
         <Footer {...Astro.props} />
       </div>

From 65e51b602fbbf5c3c58bdfab187d95fb4fd3f65e Mon Sep 17 00:00:00 2001
From: Marie Destandau <marie@ototoi.fr>
Date: Thu, 7 Sep 2023 14:38:31 +0200
Subject: [PATCH 3/3] [HOMEPAGE] fix: title hierarchy

---
 homepage/src/components/LanguageSwitcher.astro |  8 ++++----
 homepage/src/components/Newsletter.tsx         | 10 +++-------
 homepage/src/components/SurveyEdition.astro    | 16 +++++++++-------
 homepage/src/components/T.tsx                  |  2 +-
 homepage/src/stylesheets/_newsletter.scss      |  1 +
 5 files changed, 18 insertions(+), 19 deletions(-)

diff --git a/homepage/src/components/LanguageSwitcher.astro b/homepage/src/components/LanguageSwitcher.astro
index 4e4ed920f..87e34a541 100644
--- a/homepage/src/components/LanguageSwitcher.astro
+++ b/homepage/src/components/LanguageSwitcher.astro
@@ -6,9 +6,9 @@ const { pathname } = canonicalUrl
 ---
 
 <div class="language-switcher">
-    <h3 class="language-switcher-heading">
+    <p class="language-switcher-heading">
         <T locale={locale} k="languages.available_languages" />
-    </h3>
+    </p>
     <ul>
         {
             locales.map(({ id, label }) => (
@@ -18,11 +18,11 @@ const { pathname } = canonicalUrl
             ))
         }
     </ul>
-    <h4>
+    <p>
         <a href="https://github.com/StateOfJS/locale-en-US">
             <T locale={locale} k="languages.help_us_translate" />
         </a>
-    </h4>
+    </p>
 </div>
 
 <style lang="scss">
diff --git a/homepage/src/components/Newsletter.tsx b/homepage/src/components/Newsletter.tsx
index 9f7f5ebae..19dcd1284 100644
--- a/homepage/src/components/Newsletter.tsx
+++ b/homepage/src/components/Newsletter.tsx
@@ -3,11 +3,7 @@ import { useI18n } from '../helpers/i18nContext'
 import '../stylesheets/_newsletter.scss'
 import T from './T'
 
-import {
-    getStringTranslator,
-    Locale,
-} from '../helpers/translator'
-
+import { getStringTranslator, Locale } from '../helpers/translator'
 
 const getEOConfig = listId => ({
     emailOctopusUrl: `https://emailoctopus.com/lists/${listId}/members/embedded/1.3/add`,
@@ -59,9 +55,9 @@ export default function Newsletter({ listId, locale }) {
 
     return (
         <div className="newsletter">
-            <h3 className="newsletter-heading">
+            <h2 className="newsletter-heading">
                 <T locale={locale} k="newsletter.stay_tuned" />
-            </h3>
+            </h2>
             <p className="newsletter-details">
                 <T locale={locale} k="newsletter.leave_your_email" />
             </p>{' '}
diff --git a/homepage/src/components/SurveyEdition.astro b/homepage/src/components/SurveyEdition.astro
index fadf44ef2..6fecec4b4 100644
--- a/homepage/src/components/SurveyEdition.astro
+++ b/homepage/src/components/SurveyEdition.astro
@@ -24,16 +24,15 @@ if (isOpen) {
 
 <div class:list={['survey-edition', { 'survey-edition-last': isLast }]}>
     <div class="survey-edition-card" style={`background: ${background};`}>
+       
         {
-            marker && (
-                <h4 class="survey-edition-status">
+            marker ? (
+                    <h2 class="survey-edition-title"><span class="survey-edition-status">
                     <T locale={locale} k={marker} />
-                </h4>
-            )
+                </span><span class="survey-edition-year">{year}</span></h2>
+            ) : <h3 class="survey-edition-year">{year}</h3>
         }
 
-        <h4 class="survey-edition-year">{year}</h4>
-
         <a class="image-wrapper" href={mainLink}
             ><span class="image-inner" style={`background-image: url(${imageUrl})`}></span>
         </a>
@@ -81,7 +80,9 @@ if (isOpen) {
         overflow: hidden;
         margin-bottom: var(--quarterspacing);
     }
-
+    .survey-edition-title {
+        font-size: var(--medium-font);
+    }
     .survey-edition-status,
     .survey-edition-year {
         position: absolute;
@@ -100,6 +101,7 @@ if (isOpen) {
 
     .survey-edition-year {
         right: 0;
+        font-size: var(--medium-font);
     }
 
     .image-wrapper {
diff --git a/homepage/src/components/T.tsx b/homepage/src/components/T.tsx
index cc72cfaa0..12f8a473d 100644
--- a/homepage/src/components/T.tsx
+++ b/homepage/src/components/T.tsx
@@ -68,7 +68,7 @@ export default function T({
     props.className = classNames.join(' ')
 
     return md ? (
-        <div {...props} dangerouslySetInnerHTML={{ __html: translation }} />
+        <p {...props} dangerouslySetInnerHTML={{ __html: translation }} />
     ) : html ? (
         <span {...props} dangerouslySetInnerHTML={{ __html: translation }} />
     ) : (
diff --git a/homepage/src/stylesheets/_newsletter.scss b/homepage/src/stylesheets/_newsletter.scss
index 47d5d91ac..f027a20b0 100644
--- a/homepage/src/stylesheets/_newsletter.scss
+++ b/homepage/src/stylesheets/_newsletter.scss
@@ -10,6 +10,7 @@
 
 .newsletter-heading {
   margin-bottom: var(--halfspacing);
+  font-size: 1.17em;
 }
 
 .newsletter-details {
