From 4a44b911dc4e48f96d648a0d2b368d500a5c147b Mon Sep 17 00:00:00 2001
From: Adel SIDI AHMED <adelsidiahmed2020@gmail.com>
Date: Tue, 12 Dec 2023 11:52:53 +0100
Subject: [PATCH 1/2] Use modules css for credits pages

---
 src/components/h1.module.scss |  1 +
 src/components/h2.module.scss |  3 ++-
 src/components/h3.module.scss |  2 +-
 src/components/h3.tsx         |  2 +-
 src/components/h4.tsx         |  2 +-
 src/components/h5.tsx         |  2 +-
 src/components/h6.tsx         |  2 +-
 src/pages/credits.module.scss |  8 ++++++++
 src/pages/credits.tsx         | 15 ++++-----------
 9 files changed, 20 insertions(+), 17 deletions(-)
 create mode 100644 src/pages/credits.module.scss

diff --git a/src/components/h1.module.scss b/src/components/h1.module.scss
index 2e79d83d..0be142b3 100644
--- a/src/components/h1.module.scss
+++ b/src/components/h1.module.scss
@@ -6,4 +6,5 @@
     font-weight: bold;
     margin: 0 0 calc(var(--vRythm) * 2) 0;
     text-align: center;
+
 }
\ No newline at end of file
diff --git a/src/components/h2.module.scss b/src/components/h2.module.scss
index 1d082ebf..28c6f1b7 100644
--- a/src/components/h2.module.scss
+++ b/src/components/h2.module.scss
@@ -3,6 +3,7 @@
     font-family: var(--headingFont);
     font-size: var(--greatFontSize);
     line-height: var(--greatLineHeight);
-    font-weigth: normal;
+    font-weight: normal;
     margin: var(--vRythm) 0 0 0;
+    
   }
\ No newline at end of file
diff --git a/src/components/h3.module.scss b/src/components/h3.module.scss
index 0b992529..02626191 100644
--- a/src/components/h3.module.scss
+++ b/src/components/h3.module.scss
@@ -3,6 +3,6 @@
     font-size: var(--bigFontSize);
     line-height: var(--bigLineHeight);
     text-decoration: underline;
-    font-weigth: normal;
+    font-weight: normal;
     margin: var(--vRythm) 0 0 0;
   }
\ No newline at end of file
diff --git a/src/components/h3.tsx b/src/components/h3.tsx
index 99a2fe48..65db2efa 100644
--- a/src/components/h3.tsx
+++ b/src/components/h3.tsx
@@ -3,7 +3,7 @@ const Heading3 = ({
   children,
   ...props
 }: { children: React.ReactNode } & React.HTMLAttributes<HTMLElement>) => (
-  <h3 className={`${styles.root}$`} {...props}>
+  <h3 className={styles.root} {...props}>
     {children}
       </h3>
 );
diff --git a/src/components/h4.tsx b/src/components/h4.tsx
index 621aab5b..147ca44e 100644
--- a/src/components/h4.tsx
+++ b/src/components/h4.tsx
@@ -3,7 +3,7 @@ const Heading4 = ({
   children,
   ...props
 }: { children: React.ReactNode } & React.HTMLAttributes<HTMLElement>) => (
-  <h4 className={`${styles.root}$`} {...props}>
+  <h4 className={styles.root} {...props}>
     {children}
     
   </h4>
diff --git a/src/components/h5.tsx b/src/components/h5.tsx
index afb588d8..35c7cb4a 100644
--- a/src/components/h5.tsx
+++ b/src/components/h5.tsx
@@ -3,7 +3,7 @@ const Heading5 = ({
   children,
   ...props
 }: { children: React.ReactNode } & React.HTMLAttributes<HTMLElement>) => (
-  <h5 className={`${styles.root}$`} {...props}>
+  <h5 className={styles.root} {...props}>
     {children}
     
   </h5>
diff --git a/src/components/h6.tsx b/src/components/h6.tsx
index c804d905..28745eda 100644
--- a/src/components/h6.tsx
+++ b/src/components/h6.tsx
@@ -3,7 +3,7 @@ const Heading6 = ({
   children,
   ...props
 }: { children: React.ReactNode } & React.HTMLAttributes<HTMLElement>) => (
-  <h6 className={`${styles.root}$`} {...props}>
+  <h6 className={styles.root} {...props}>
     {children}
   </h6>
 );
diff --git a/src/pages/credits.module.scss b/src/pages/credits.module.scss
new file mode 100644
index 00000000..6710f0ac
--- /dev/null
+++ b/src/pages/credits.module.scss
@@ -0,0 +1,8 @@
+.root img {
+    float: left;
+    height: 6rem;
+    width: 6rem;
+    margin: 0 2rem 1.5rem 0;
+    border-radius: 50px;
+    box-shadow: 5px 5px 2px 1px #c1a008;
+  }
\ No newline at end of file
diff --git a/src/pages/credits.tsx b/src/pages/credits.tsx
index 73cb7411..4e6571c1 100644
--- a/src/pages/credits.tsx
+++ b/src/pages/credits.tsx
@@ -7,6 +7,7 @@ import Strong from '../components/strong';
 import Anchor from '../components/a';
 import { Octokit } from '@octokit/rest';
 import Article from '../components/article';
+import style from './credits.module.scss';
 import type { GetStaticProps } from 'next';
 
 export type Contributors = Awaited<
@@ -32,6 +33,7 @@ const Page = ({ entries }: Props) => {
     <Layout
       title="Les contributeurs du site"
       description="Découvrez les personnes qui ont créé le site de ChtiJS."
+      
     >
       <ContentBlock>
         <Heading1>Les contributeurs du site</Heading1>
@@ -40,7 +42,7 @@ const Page = ({ entries }: Props) => {
             Découvrez les personnes qui ont créé le site de ChtiJS.
           </Strong>
         </Paragraph>
-        <div>
+        <div className={style.root}>
           {entries.map((entry) => (
             <Article key={entry.id}>
               <img src={entry.avatar_url} alt={`Avatar de ${entry.name}`} />
@@ -83,16 +85,7 @@ const Page = ({ entries }: Props) => {
           ))}
         </div>
       </ContentBlock>
-      <style jsx>{`
-        img {
-          float: left;
-          height: 6rem;
-          width: 6rem;
-          margin: 0 2rem 1.5rem 0;
-          border-radius: 50px;
-          box-shadow: 5px 5px 2px 1px #c1a008;
-        }
-      `}</style>
+      
     </Layout>
   );
 };

From 07910ce83dd223cdd143f6cf47072e6a2ed4874c Mon Sep 17 00:00:00 2001
From: Adel SIDI AHMED <adelsidiahmed2020@gmail.com>
Date: Tue, 12 Dec 2023 12:01:12 +0100
Subject: [PATCH 2/2] Fx formatting in h2 and h3 styles, update class name in
 credits page

---
 src/components/blockquote.module.scss | 14 ++++++-------
 src/components/h1.module.scss         | 17 +++++++--------
 src/components/h2.module.scss         | 15 +++++++-------
 src/components/h3.module.scss         | 14 ++++++-------
 src/components/h4.module.scss         | 10 ++++-----
 src/components/h5.module.scss         | 10 ++++-----
 src/components/h6.module.scss         | 10 ++++-----
 src/components/tootList.module.scss   | 30 +++++++++++++--------------
 src/pages/credits.module.scss         | 14 ++++++-------
 src/pages/credits.tsx                 |  4 ++--
 10 files changed, 68 insertions(+), 70 deletions(-)

diff --git a/src/components/blockquote.module.scss b/src/components/blockquote.module.scss
index 0af88f96..34d6a3b9 100644
--- a/src/components/blockquote.module.scss
+++ b/src/components/blockquote.module.scss
@@ -1,8 +1,8 @@
 .root {
-    font-family: var(--writingFont);
-    font-size: var(--greatFontSize);
-    line-height: var(--greatLineHeight);
-    margin: 0 0 var(--vRythm) 0;
-    padding: 0 0 0 var(--gutter);
-    border-left: var(--border) solid var(--green2);
-  }
\ No newline at end of file
+  font-family: var(--writingFont);
+  font-size: var(--greatFontSize);
+  line-height: var(--greatLineHeight);
+  margin: 0 0 var(--vRythm) 0;
+  padding: 0 0 0 var(--gutter);
+  border-left: var(--border) solid var(--green2);
+}
diff --git a/src/components/h1.module.scss b/src/components/h1.module.scss
index 0be142b3..664fffbc 100644
--- a/src/components/h1.module.scss
+++ b/src/components/h1.module.scss
@@ -1,10 +1,9 @@
 .root {
-    color: var(--primary);
-    font-family: var(--headingFont);
-    font-size: var(--giantFontSize);
-    line-height: var(--giantLineHeight);
-    font-weight: bold;
-    margin: 0 0 calc(var(--vRythm) * 2) 0;
-    text-align: center;
-
-}
\ No newline at end of file
+  color: var(--primary);
+  font-family: var(--headingFont);
+  font-size: var(--giantFontSize);
+  line-height: var(--giantLineHeight);
+  font-weight: bold;
+  margin: 0 0 calc(var(--vRythm) * 2) 0;
+  text-align: center;
+}
diff --git a/src/components/h2.module.scss b/src/components/h2.module.scss
index 28c6f1b7..b572c42a 100644
--- a/src/components/h2.module.scss
+++ b/src/components/h2.module.scss
@@ -1,9 +1,8 @@
 .root {
-    color: var(--quinary);
-    font-family: var(--headingFont);
-    font-size: var(--greatFontSize);
-    line-height: var(--greatLineHeight);
-    font-weight: normal;
-    margin: var(--vRythm) 0 0 0;
-    
-  }
\ No newline at end of file
+  color: var(--quinary);
+  font-family: var(--headingFont);
+  font-size: var(--greatFontSize);
+  line-height: var(--greatLineHeight);
+  font-weight: normal;
+  margin: var(--vRythm) 0 0 0;
+}
diff --git a/src/components/h3.module.scss b/src/components/h3.module.scss
index 02626191..bb0d9672 100644
--- a/src/components/h3.module.scss
+++ b/src/components/h3.module.scss
@@ -1,8 +1,8 @@
 .root {
-    font-family: var(--headingFont);
-    font-size: var(--bigFontSize);
-    line-height: var(--bigLineHeight);
-    text-decoration: underline;
-    font-weight: normal;
-    margin: var(--vRythm) 0 0 0;
-  }
\ No newline at end of file
+  font-family: var(--headingFont);
+  font-size: var(--bigFontSize);
+  line-height: var(--bigLineHeight);
+  text-decoration: underline;
+  font-weight: normal;
+  margin: var(--vRythm) 0 0 0;
+}
diff --git a/src/components/h4.module.scss b/src/components/h4.module.scss
index 29d4ad64..5642fe9e 100644
--- a/src/components/h4.module.scss
+++ b/src/components/h4.module.scss
@@ -1,6 +1,6 @@
 .root {
-    font-family: var(--headingFont);
-    font-size: var(--bigFontSize);
-    line-height: var(--bigLineHeight);
-    margin: 0 0 var(--vRythm) 0;
-  }
\ No newline at end of file
+  font-family: var(--headingFont);
+  font-size: var(--bigFontSize);
+  line-height: var(--bigLineHeight);
+  margin: 0 0 var(--vRythm) 0;
+}
diff --git a/src/components/h5.module.scss b/src/components/h5.module.scss
index 9a680274..1b8a0d62 100644
--- a/src/components/h5.module.scss
+++ b/src/components/h5.module.scss
@@ -1,6 +1,6 @@
 .root {
-    font-family: var(--headingFont);
-    font-size: var(--mediumFontSize);
-    line-height: var(--mediumLineHeight);
-    margin: 0 0 var(--vRythm) 0;
-  }
\ No newline at end of file
+  font-family: var(--headingFont);
+  font-size: var(--mediumFontSize);
+  line-height: var(--mediumLineHeight);
+  margin: 0 0 var(--vRythm) 0;
+}
diff --git a/src/components/h6.module.scss b/src/components/h6.module.scss
index 9a680274..1b8a0d62 100644
--- a/src/components/h6.module.scss
+++ b/src/components/h6.module.scss
@@ -1,6 +1,6 @@
 .root {
-    font-family: var(--headingFont);
-    font-size: var(--mediumFontSize);
-    line-height: var(--mediumLineHeight);
-    margin: 0 0 var(--vRythm) 0;
-  }
\ No newline at end of file
+  font-family: var(--headingFont);
+  font-size: var(--mediumFontSize);
+  line-height: var(--mediumLineHeight);
+  margin: 0 0 var(--vRythm) 0;
+}
diff --git a/src/components/tootList.module.scss b/src/components/tootList.module.scss
index 16114cde..26ea7e1d 100644
--- a/src/components/tootList.module.scss
+++ b/src/components/tootList.module.scss
@@ -1,31 +1,31 @@
 .root {
-    margin: 0 0 var(--vRythm) 0;
+  margin: 0 0 var(--vRythm) 0;
 }
 
 .toot :global(a) {
-color: #205370;
+  color: #205370;
 }
 
 .toot :global(p) {
-margin-left: 2%;
+  margin-left: 2%;
 }
 
 .toot :global(a):hover {
-color: #14171a;
+  color: #14171a;
 }
 
 .tootList {
-margin-top: var(--vRythm);
-display: flex;
-flex-direction: row;
-gap: var(--gutter);
+  margin-top: var(--vRythm);
+  display: flex;
+  flex-direction: row;
+  gap: var(--gutter);
 }
 
 .toot {
-border-style: solid;
-border-color: var(--grey);
-border-width: var(--borderSize);
-border-radius: var(--borderRadius);
-width: var(--block);
-padding: calc(var(--vRythm) / 2) calc(var(--gutter) / 2);
-}
\ No newline at end of file
+  border-style: solid;
+  border-color: var(--grey);
+  border-width: var(--borderSize);
+  border-radius: var(--borderRadius);
+  width: var(--block);
+  padding: calc(var(--vRythm) / 2) calc(var(--gutter) / 2);
+}
diff --git a/src/pages/credits.module.scss b/src/pages/credits.module.scss
index 6710f0ac..d692915b 100644
--- a/src/pages/credits.module.scss
+++ b/src/pages/credits.module.scss
@@ -1,8 +1,8 @@
 .root img {
-    float: left;
-    height: 6rem;
-    width: 6rem;
-    margin: 0 2rem 1.5rem 0;
-    border-radius: 50px;
-    box-shadow: 5px 5px 2px 1px #c1a008;
-  }
\ No newline at end of file
+  float: left;
+  height: 6rem;
+  width: 6rem;
+  margin: 0 2rem 1.5rem 0;
+  border-radius: 50px;
+  box-shadow: 5px 5px 2px 1px #c1a008;
+}
diff --git a/src/pages/credits.tsx b/src/pages/credits.tsx
index 4e6571c1..86b416e2 100644
--- a/src/pages/credits.tsx
+++ b/src/pages/credits.tsx
@@ -7,7 +7,7 @@ import Strong from '../components/strong';
 import Anchor from '../components/a';
 import { Octokit } from '@octokit/rest';
 import Article from '../components/article';
-import style from './credits.module.scss';
+import styles from './credits.module.scss';
 import type { GetStaticProps } from 'next';
 
 export type Contributors = Awaited<
@@ -42,7 +42,7 @@ const Page = ({ entries }: Props) => {
             Découvrez les personnes qui ont créé le site de ChtiJS.
           </Strong>
         </Paragraph>
-        <div className={style.root}>
+        <div className={styles.root}>
           {entries.map((entry) => (
             <Article key={entry.id}>
               <img src={entry.avatar_url} alt={`Avatar de ${entry.name}`} />