#99 - Affichage des statistiques : rien ne va plus !

sass/index.scss

@@ -1,5 +1,9 @@
 @import '../node_modules/knacss/sass/knacss.scss';
 
+table {
+  table-layout: unset;
+}
+
 // SPÉCIFIQUE AU SITE
 @import './fonts';
 @import './colors';

src/routes/index.js

@@ -57,7 +57,7 @@ router
                 }
                 return res.redirect(url);
             }
-            return res.redirect("/");
+            return res.redirect("/ma-collection");
         }
     );
 
@@ -79,7 +79,7 @@ if (registrationOpen) {
             try {
                 await Auth.register(req);
 
-                res.redirect("/");
+                res.redirect("/ajouter-un-album");
             } catch (err) {
                 res.redirect("/inscription");
             }

views/index.ejs

@@ -258,7 +258,7 @@
                 <br />
                 Le code source est sous licence <a href="https://www.gnu.org/licenses/gpl-3.0-standalone.html" target="_blank" rel="noopener noreferrer">GNU GPL-3.0-or-later <i class="icon-link"></i></a> et disponible sur <a href="https://forge.darkou.fr/contact/MusicTopus" target="_blank">forge.darkou.fr <i class="icon-link"></i></a>.
                 <br />
-                Fait avec <span role="img" aria-label="amour">❤️</span> à Bordeaux. <img src="/img/emoji-lmhf.svg" class="lmhf" alt="lmhf" alt="Love Music, Hate Fascism" title="Love Music, Hate Fascism" />
+                Fait avec <span role="img" aria-label="amour">❤️</span> à Bordeaux depuis 2022 ! <img src="/img/emoji-lmhf.svg" class="lmhf" alt="lmhf" alt="Love Music, Hate Fascism" title="Love Music, Hate Fascism" />
             </p>
         </footer>
     </body>

views/pages/mon-compte/ma-collection/statistiques.ejs

@@ -1,17 +1,18 @@
-<main class="layout-maxed ma-collection-details" id="ma-collection-statistiques">
+<!-- <main class="layout-maxed ma-collection-details" id="ma-collection-statistiques"> -->
+<main class="layout-maxed collection" id="mon-compte">
     <h1>
         Mes statistiques
     </h1>
 
-    <div class="grid grid-cols-1 md:grid-cols-2 gap-10 mb-10">
-        <div class="md:col-span-2 box">
+    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10 mb-10">
+        <div class="md:col-span-2 lg:col-span-3 box">
             <h2>Mon top 10</h2>
             <table>
                 <thead>
                     <tr>
-                            <th style="width: 60px;"></th>
+                        <th></th>
                         <th>Artiste</th>
-                            <th style="width: 100px;">Albums</th>
+                        <th>Albums</th>
                     </tr>
                 </thead>
                 <tbody>
@@ -41,28 +42,41 @@
             <canvas id="byFormats"></canvas>
         </div>
 
-        <div><!-- histoire de faire un break --></div>
-
-        <div class="box">
+        <div class="box col-span-full">
             <h2><%= page.currentYear.year %> (<%= page.currentYear.total %> ajout<%= page.currentYear.total > 1 ? 's' : '' %>)</h2>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
+                <div>
                     <h3>Genres</h3>
                     <canvas id="currentYearGenres"></canvas>
+                </div>
+                <div>
                     <h3>Styles</h3>
                     <canvas id="currentYearStyles"></canvas>
+                </div>
+                <div>
                     <h3>Formats</h3>
                     <canvas id="currentYearFormats"></canvas>
                 </div>
-
-        <div class="box">
+            </div>
+        </div>
+        <div class="box col-span-full">
             <h2><%= page.lastYear.year %> (<%= page.lastYear.total %> ajout<%= page.lastYear.total > 1 ? 's' : '' %>)</h2>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
+                <div>
                     <h3>Genres</h3>
                     <canvas id="lastYearGenres"></canvas>
+                </div>
+                <div>
                     <h3>Styles</h3>
                     <canvas id="lastYearStyles"></canvas>
+                </div>
+                <div>
                     <h3>Formats</h3>
                     <canvas id="lastYearFormats"></canvas>
                 </div>
             </div>
+        </div>
+    </div>
 </main>
 
 <script>