Fixes lint style errors

src/app/__tests__/__snapshots__/App.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<App /> renders 1`] = `
 <div
-  className="App"
+  className="app"
 >
   <a
     className="header"

src/app/index.tsx

@@ -15,7 +15,7 @@ interface Route {
 }
 
 const App = ({ route }: Route): JSX.Element => (
-    <div className={styles.App}>
+    <div className={styles.app}>
         <Helmet {...config.APP} />
         <Link to="/" className={styles.header}>
             <img src={logo} alt="Logo" role="presentation" />

src/app/styles.module.scss

@@ -5,21 +5,13 @@ body {
     font-family: "Helvetica-Light", Helvetica, Arial, sans-serif;
 }
 
-.App {
+.app {
     color: $color-white;
 
-    .header {
-        color: inherit;
-        display: block;
-        overflow: auto;
-        padding: 15px;
-        text-decoration: none;
-
-        img {
-            float: left;
-            height: 70px;
-            margin-right: 1em;
-        }
+    img {
+        float: left;
+        height: 70px;
+        margin-right: 1em;
     }
 
     hr {
@@ -28,3 +20,11 @@ body {
         opacity: 0.15;
     }
 }
+
+.header {
+    color: inherit;
+    display: block;
+    overflow: auto;
+    padding: 15px;
+    text-decoration: none;
+}

src/components/AddEnvie/styles.module.scss

@@ -5,10 +5,10 @@
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {

src/components/JeuJavList/styles.module.scss

@@ -5,10 +5,10 @@
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {

src/components/Loading/__tests__/__snapshots__/Loading.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<Loading /> renders 1`] = `
 <div
-  class="Loading"
+  class="loading"
 >
   <p>
     Loading...

src/components/Loading/index.tsx

@@ -1,7 +1,7 @@
 import styles from "./styles.module.scss"
 
 const Loading = (): JSX.Element => (
-    <div className={styles.Loading}>
+    <div className={styles.loading}>
         <p>Loading...</p>
     </div>
 )

src/components/Loading/styles.module.scss

@@ -1,3 +1,3 @@
-.Loading {
+.loading {
     padding: 0 15px;
 }

src/components/MembreInfo/styles.module.scss

@@ -1,9 +1,9 @@
 .membre-card {
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 }

src/components/MembreList/__tests__/__snapshots__/MembreList.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<MembreList /> renders 1`] = `
 <div
-  class="MembreList"
+  class="user-list"
 >
   <h4>
     Membre List

src/components/MembreList/index.tsx

@@ -9,7 +9,7 @@ interface Props {
 }
 
 const MembreList = ({ items }: Props) => (
-    <div className={styles.MembreList}>
+    <div className={styles["user-list"]}>
         <h4>Membre List</h4>
         <ul>
             {items.map(({ id, nom, prenom }) => (

src/components/MembreList/styles.module.scss

@@ -1,14 +1,14 @@
 @import "../../theme/variables";
 
-.UserList {
+.user-list {
     color: $color-white;
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {

src/components/MembreSet/styles.module.scss

@@ -5,10 +5,10 @@
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {

src/pages/Home/Home.tsx

@@ -37,7 +37,7 @@ function useList<Entity>(
 const Home: FC<Props> = (): JSX.Element => {
     const dispatch = useDispatch()
     return (
-        <div className={styles.Home}>
+        <div className={styles.home}>
             <Helmet title="Home" />
             <AddEnvie dispatch={dispatch} />
             {/* {useList((state: AppState) => state.envieList, fetchEnvieListifNeed)()} */}

src/pages/Home/__tests__/__snapshots__/Home.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<Home /> renders an error if loading failed 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
@@ -77,7 +77,7 @@ exports[`<Home /> renders an error if loading failed 1`] = `
 
 exports[`<Home /> renders the <List /> if loading was successful 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
@@ -164,7 +164,7 @@ exports[`<Home /> renders the <List /> if loading was successful 1`] = `
 
 exports[`<Home /> renders the loading status if data invalid 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
@@ -239,7 +239,7 @@ exports[`<Home /> renders the loading status if data invalid 1`] = `
 
 exports[`<Home /> renders the loading status if requesting data 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"

src/pages/Home/styles.module.scss

@@ -1,3 +1,3 @@
-.Home {
+.home {
     padding: 0 15px;
 }

src/pages/MembrePage/MembrePage.tsx

@@ -37,7 +37,7 @@ const MembrePage = ({ match }: Props): JSX.Element => {
     }
 
     return (
-        <div className={styles.Membre}>
+        <div className={styles.membre}>
             <Helmet title="User Info" />
             {renderInfo()}
         </div>

src/pages/MembrePage/__tests__/__snapshots__/MembrePage.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<MembrePage /> renders an error if loading failed 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <p>
     Oops! Failed to load data.
@@ -12,7 +12,7 @@ exports[`<MembrePage /> renders an error if loading failed 1`] = `
 
 exports[`<MembrePage /> renders the <Info /> if loading was successful 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <div>
     <div
@@ -85,7 +85,7 @@ exports[`<MembrePage /> renders the <Info /> if loading was successful 1`] = `
 
 exports[`<MembrePage /> renders the loading status if data invalid 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <p>
     Oops! Failed to load data.
@@ -95,7 +95,7 @@ exports[`<MembrePage /> renders the loading status if data invalid 1`] = `
 
 exports[`<MembrePage /> renders the loading status if requesting data 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <p>
     Loading...

src/pages/MembrePage/styles.module.scss

@@ -1,3 +1,3 @@
-.Membre {
+.membre {
     padding: 0 15px;
 }

src/pages/NotFound/__tests__/__snapshots__/NotFound.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`<NotFound /> renders 1`] = `
 <div
-  class="NotFound"
+  class="not-found"
 >
   <p>
     Oops, Page was not found!

src/pages/NotFound/index.tsx

@@ -13,7 +13,7 @@ const NotFound = ({ staticContext }: Props) => {
     if (staticContext) staticContext.statusCode = 404
 
     return (
-        <div className={styles.NotFound}>
+        <div className={styles["not-found"]}>
             <Helmet title="Oops" />
             <p>Oops, Page was not found!</p>
         </div>

src/pages/NotFound/styles.module.scss

@@ -1,3 +1,3 @@
-.NotFound {
+.not-found {
     padding: 0 15px;
 }