[HOMEPAGE] fix: title hierarchy

Author: Marie Destandau

homepage/src/components/Footer.astro

@@ -19,7 +19,7 @@ const getLinks = (survey) => [
     // },
     {
         link: 'https://github.com/StateOfJS/Monorepo/issues',
-        k: 'homepage.leave_issue'
+        k: ''
     },
     {
         link: 'https://discord.gg/zRDb35jfrt',

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">

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>{' '}

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 {

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 }} />
     ) : (

homepage/src/stylesheets/_newsletter.scss

@@ -10,6 +10,7 @@
 
 .newsletter-heading {
   margin-bottom: var(--halfspacing);
+  font-size: 1.17em;
 }
 
 .newsletter-details {