michael/MusicTopus
1
0
Fork 0
forked from dbroqua/MusicTopus
Code Pull requests Activity

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

Browse source
This commit is contained in:
Damien Broqua 2025-03-29 11:17:21 +01:00
parent b0dc6d820d
commit e321691daf
2 changed files with 54 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
sass/index.scss
View file

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

34
views/pages/mon-compte/ma-collection/statistiques.ejs
View file

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