feat: ajout datatables

Fixes #3
This commit is contained in:
Kazhnuz Klappsthul 2023-05-28 13:50:25 +02:00
parent f1f1ab01c3
commit dcad3b8081
5 changed files with 272 additions and 56 deletions

View File

@ -13,8 +13,10 @@
{#- Uncomment this if youd like folks to know that you used Eleventy to build your site! #}
<meta name="generator" content="{{ eleventy.generator }}">
<script src="/js/datatables.js"></script>
{%- css %}{% include "public/css/index.css" %}{% endcss %}
{%- css %}{% include "public/css/datatables.css" %}{% endcss %}
<style>{% getBundle "css" %}</style>
</head>
@ -50,5 +52,25 @@
<footer><a href="https://creativecommons.org/licenses/by-sa/4.0/"><img src="/img/cc-by-sa.png" /><span class="visually-hidden">Tout le contenu de cette page est sous licence Creatve Common Attribution - Partage à l'identique.</span></a></footer>
<!-- Current page: {{ page.url | htmlBaseUrl }} -->
<script>
const myTable = document.querySelector("#dataTable table");
console.log(myTable);
if (myTable) {
let labels = {
placeholder: "Chercher...",
searchTitle: "Chercher dans le tableau",
perPage: "lignes par page",
noRows: "Aucune lignée trouvée",
info: "Résultats {start} à {end} sur {rows}",
noResults: "Aucun résultat ne correspond à votre recherche",
};
let dataTable = new simpleDatatables.DataTable("#dataTable table", {
labels,
});
}
</script>
</body>
</html>

View File

@ -14,9 +14,7 @@ parent: Les équipements
> [!NOTE]
> Pour des raisons de gameplay, les personnages sont limité à deux accessoires. Si vous vous demandez pourquoi le personnage ne peut pas avoir des lunettes, des chaussures et un slip à la fois, dites vous que dans les faits, oui il a un superbe slip magnifique et vos baskets qui vous empêcheront d'entrer en boite de nuit.
<!-- tabs:start -->
### ** Statistiques **
<div id="dataTable">
| Accessoire | Effet | Prix |
|:----------:|:------|:----:|
@ -31,22 +29,13 @@ parent: Les équipements
| Collier mignon | +15 en REL | 650 |
| Monocle ultime | +15 en PER | 650 |
| Anneau de contrôle satanique | +15% CHA/VOL contre démons | 750 |
### ** Protection **
| Accessoire | Effet | Prix |
|:----------:|:------|:----:|
| Débardeur d'acier | +3 armure physique | 750 |
| Joli clochette | +3 armure magique | 750 |
| Lunettes de soleil swag | +3 armure mental | 750 |
| Lunettes Optic Grosbill | Protège de tout malus en perception | 750 |
### ** Divers **
| Accessoire | Effet | Prix |
|:----------:|:------|:----:|
| Masque de terreur | En cas de jet de panique, 1D4. Si 4, un allié fait aussi un jet de panique. Sinon, un ennemi le fait | 1500 |
| Slip divin | +20 aux jets de survies | 2550 |
| Toge Ancienne de Cultiste | Boost de SAG + 10% de résistance mentale à la métaphysique | 1000 |
| Toge Ancienne de Frontière | Boost de INT + 10% de métaphysique | 1000 |
| Toge Ancienne de Frontière | Boost de INT + 10% de métaphysique | 1000 |
</div>

View File

@ -13,54 +13,42 @@ models:
Dans tout JDR, les mobs sont une partie intégrante de ce qu'on peut rencontrer. DanseRonce utilise un système d'espèce pour construire ses créatures. Il est à noter que les créatures ne sont pas forcément des êtres sans intelligences, cela peut aussi concerner des créatures capables de raisons.
## Grands groupes
## Types de créatures
> [!DANGER]
> Toutes les créatures reçoivent x2 (x4 si faiblesse à l'éclat) par les attaques d'anomie, sauf les êtres anomique qui reçoivent x1, et les DernierSouffle qui reçoivent x0.5.
### Créatures biologiques
<div id="dataTable">
| Créatures | Spécificités | Faiblesses | Résistances | Immunité |
|:---------:|:------------:|:----------:|:-----------:|:--------:|
| Humanoïdes | Peut manier des armes | | | |
| Bêtes | Des griffes et des crocs | Metal, Chaos, Glace | Air | |
| Reptiles | | Glace, Ombre | Feu, Lumière | |
| Aquatique | Peuvent respirer sous l'eau | Foudre, Végétal | Eau, Feu | |
| Végétaux | C dé salad lol | Feu, Metal, Poison | Eau, Végétal | |
| Insectes | | Terre, Feu, Glace | Ordre | |
| Aerien | | Air, Glace | Terre, Espace | |
### Créatures non-biologiques
| Créatures | Type | Spécificités | Faiblesses | Résistances | Immunité |
|:---------:|:----:|:------------:|:----------:|:-----------:|:--------:|
| Humanoïdes | Biologique | Peut manier des armes | | | |
| Bêtes | Biologique | Des griffes et des crocs | Metal, Chaos, Glace | Air | |
| Reptiles | Biologique | | Glace, Ombre | Feu, Lumière | |
| Aquatique | Biologique | Peuvent respirer sous l'eau | Foudre, Végétal | Eau, Feu | |
| Végétaux | Biologique | | Feu, Metal, Poison | Eau, Végétal | |
| Insectes | Biologique | | Terre, Feu, Glace | Ordre | |
| Aerien | Biologique | | Air, Glace | Terre, Espace | |
| Machines | Non-biologique | Ne sont pas soumis aux besoins vitaux normaux | Eau, Foudre, Chaos | Metal, Végétal, Énergie | Poison |
| Minéraloïdes | Non-biologique | Armure naturelle élevée | Eau, Temps | Foudre, Feu, Air | Poison |
| Créature de glace | Non-biologique | | Feu, Lumière, Énergie | Glace | |
| Volutes | Non-biologique | Créatures gazeuses | Végétal, Air, Foudre | Terre, Metal, Temps | Poison |
| Gelatineux | Non-biologique | Créatures liquides et semi-liquide | Metal, Vegetal, Son | Force, Poison, Eau | |
| Feufolets | Non-biologique | Créatures de feu | Eau, Terre | Glace | Feu |
| Démons | Magique | Liés au chaos | Ordre, Lumière | Chaos, Ombre | |
| Mort-vivant | Magique | Des corps maintenu par la magie | Lumière | Ombre | |
| Parasite | Magique | Peuvent parasiter d'autres créatures | Feu, Ordre | Végétal | Chaos |
| Calorique | Magique | Créatures d'énergie pure | | | Poison |
| Psychiques | Magique | Créatures avec une forte puissance mentales | Ombre, Force, Son | Esprit | |
| Âmes | Magique | Des êtres d'esprit, sans corps | Tout ce qui est métaphysique, Eclat | Son, Esprit | Tout ce qui est physique, Force, Poison |
| Titans | Paradoxal | Peuvent être lié élémentairement | *Divers* + Éclat | *Divers* | *Divers* |
| Effacés | Paradoxal | Liés au néant | Énergie, Éclat | Chaos, Ombre | Néant |
| Célèste | Paradoxal | Lié à l'ordre | Ombre, Chaos | Lumière, Énergie, Ordre | |
| Irrégularité | Anomique | Des êtres corrompus par l'anomie | *Divers* + Anomie | *Divers* + Eclat, Paradoxe | *Divers* |
| Aberration | Anomique | Des êtres transformé par l'anomie | | Eclat, Paradoxe | Anomie |
| Créatures | Spécificités | Faiblesses | Résistances | Immunité |
|:---------:|:------------:|:----------:|:-----------:|:--------:|
| Machines | Ne sont pas soumis aux besoins vitaux normaux | Eau, Foudre, Chaos | Metal, Végétal, Énergie | Poison |
| Minéraloïdes | Armure naturelle élevée | Eau, Temps | Foudre, Feu, Air | Poison |
| Créature de glace | | Feu, Lumière, Énergie | Glace | |
| Volutes | Créatures gazeuses | Végétal, Air, Foudre | Terre, Metal, Temps | Poison |
| Gelatineux | Créatures liquides et semi-liquide | Metal, Vegetal, Son | Force, Poison, Eau | |
| Feufolets | Créatures de feu | Eau, Terre | Glace | Feu |
### Créatures magiques
| Créatures | Spécificités | Faiblesses | Résistances | Immunité |
|:---------:|:------------:|:----------:|:-----------:|:--------:|
| Démons | Liés au chaos | Ordre, Lumière | Chaos, Ombre | |
| Mort-vivant | Des corps maintenu par la magie | Lumière | Ombre | |
| Parasite | Peuvent parasiter d'autres créatures | Feu, Ordre | Végétal | Chaos |
| Calorique | Créatures d'énergie pure | | | Poison |
| Psychiques | Créatures avec une forte puissance mentales | Ombre, Force, Son | Esprit | |
| Âmes | Des êtres d'esprit, sans corps | Tout ce qui est métaphysique, Eclat | Son, Esprit | Tout ce qui est physique, Force, Poison |
### Créatures paradoxales
| Créatures | Spécificités | Faiblesses | Résistances | Immunité |
|:---------:|:------------:|:----------:|:-----------:|:--------:|
| Titans | Peuvent être lié élémentairement | *Divers* + Éclat | *Divers* | *Divers* |
| Effacés | Liés au néant | Énergie, Éclat | Chaos, Ombre | Néant |
| Célèste | Lié à l'ordre | Ombre, Chaos | Lumière, Énergie, Ordre | |
| Irrégularité | Des êtres corrompus par l'anomie | <Divers> + Anomie | <Divers> + Eclat, Paradoxe | <Divers> |
| Aberration | Des êtres transformé par l'anomie | | Eclat, Paradoxe | Anomie |
</div>
## Familiers

209
public/css/datatables.css Normal file
View File

@ -0,0 +1,209 @@
.datatable-top,
.datatable-bottom {
padding: 8px 10px;
}
.datatable-top>nav:first-child,
.datatable-top>div:first-child,
.datatable-bottom>nav:first-child,
.datatable-bottom>div:first-child {
float: left;
}
.datatable-top>nav:last-child,
.datatable-top>div:last-child,
.datatable-bottom>nav:last-child,
.datatable-bottom>div:last-child {
float: right;
}
.datatable-selector {
padding: 6px;
border-radius: 6px;
border:0;
background-color: rgba(255,255,255,0.2);
color:var(--text-color)
}
.datatable-input {
padding: 6px 12px;
background-color:rgba(255, 255, 255, 0.2);
color: var(--text-color);
border:none;
border-radius:6px;
}
.datatable-info {
margin: 7px 0;
}
/* PAGER */
.datatable-pagination ul {
margin: 0;
padding-left: 0;
}
.datatable-pagination li {
list-style: none;
float: left;
}
.datatable-pagination li.datatable-hidden {
visibility: hidden;
}
.datatable-pagination a {
border: 1px solid transparent;
float: left;
margin-left: 2px;
padding: 6px 12px;
position: relative;
text-decoration: none;
cursor: pointer;
border-radius: 6px;
}
.datatable-pagination a:hover {
background-color: rgba(255, 255, 255, 0.2);
}
.datatable-pagination .datatable-active a,
.datatable-pagination .datatable-active a:focus,
.datatable-pagination .datatable-active a:hover {
background-color: rgba(255, 255, 255, 0.2);
cursor: default;
}
.datatable-pagination .datatable-ellipsis a,
.datatable-pagination .datatable-disabled a,
.datatable-pagination .datatable-disabled a:focus,
.datatable-pagination .datatable-disabled a:hover {
pointer-events: none;
cursor: default;
}
.datatable-pagination .datatable-disabled a,
.datatable-pagination .datatable-disabled a:focus,
.datatable-pagination .datatable-disabled a:hover {
cursor: not-allowed;
opacity: 0.4;
}
.datatable-pagination .datatable-pagination a {
font-weight: bold;
}
/* TABLE */
.datatable-table {
max-width: 100%;
width: 100%;
border-spacing: 0;
border-collapse: separate;
}
.datatable-table>tbody>tr>td,
.datatable-table>tbody>tr>th,
.datatable-table>tfoot>tr>td,
.datatable-table>tfoot>tr>th,
.datatable-table>thead>tr>td,
.datatable-table>thead>tr>th {
vertical-align: top;
padding: 8px 10px;
}
.datatable-table>thead>tr>th {
vertical-align: bottom;
text-align: left;
}
.datatable-table>tfoot>tr>th {
vertical-align: bottom;
text-align: left;
}
.datatable-table th {
vertical-align: bottom;
text-align: left;
}
.datatable-table th a {
text-decoration: none;
color: inherit;
}
.datatable-sorter,
.datatable-filter {
display: inline-block;
height: 100%;
position: relative;
width: 100%;
}
.datatable-sorter::before,
.datatable-sorter::after {
content: "";
height: 0;
width: 0;
position: absolute;
right: 4px;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
opacity: 0.2;
}
.datatable-sorter::before {
border-top: 4px solid var(--text-color);
bottom: 0px;
}
.datatable-sorter::after {
border-bottom: 4px solid var(--text-color);
border-top: 4px solid transparent;
top: 0px;
}
.datatable-ascending .datatable-sorter::after,
.datatable-descending .datatable-sorter::before,
.datatable-ascending .datatable-filter::after,
.datatable-descending .datatable-filter::before {
opacity: 0.6;
}
.datatable-filter::before {
content: "";
position: absolute;
right: 4px;
opacity: 0.2;
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-radius: 50%;
border-top: 10px solid var(--text-color);
top: 25%;
}
.datatable-filter-active .datatable-filter::before {
opacity: 0.6;
}
.datatable-empty {
text-align: center;
}
.datatable-top::after,
.datatable-bottom::after {
clear: both;
content: " ";
display: table;
}
table.datatable-table:focus tr.datatable-cursor>td:first-child {
border-left: 3px var(--text-color) solid;
}
table.datatable-table:focus {
outline: solid 1px black;
outline-offset: -1px;
}

8
public/js/datatables.js Normal file

File diff suppressed because one or more lines are too long