diff --git a/assets/css/style.scss b/assets/css/style.scss
index 57ddf82a98ad19f4d97293a642fea3f8889430e2..246da3b513d7304c313fe0c60d0d2f92232d98ef 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -1,3 +1,40 @@
+// Bootstrap variables customisation
+// Fonts & Typo
+$link-decoration: none;
+$text-muted: var(--text-secondary-color);
+$font-family-base: Montserrat, Helvetica, Arial, serif;
+$small-font-size: 70%;
+
+// Badges
+$badge-font-size: 0.7em;
+
+// Tables;
+$table-border-color: var(--background-color-primary);
+$table-bg: var(--background-color-primary);
+$table-color: var(--text-primary-color);
+$table-hover-bg: rgba(0, 0, 255, 0.075);
+
+// Breadcrumb
+$breadcrumb-bg: var(--background-color-secondary);
+$breadcrumb-active-color: var(--text-primary-color);
+$breadcrumb-divider-color: var(--text-primary-color);
+
+// List-groups
+$list-group-bg: var(--background-color-secondary);
+$list-group-active-bg: rgba(0, 0, 255, 0.075);
+$list-group-active-color: var(--text-primary-color);
+$list-group-color: var(--text-primary-color);
+
+// Cards
+$card-bg: var(--background-color-secondary);
+
+// Mark
+$mark-padding: 0.2em 0;
+$mark-bg: yellow;
+
+// Colors
+$info: #0a8299;
+
@import "font";
@import "bootstrap";
diff --git a/components/badge/Date.vue b/components/badge/Date.vue
index 39e7d79bdb01543f6b075a7506ab891ad2e10826..45463dd18611857cf3cccbd67969e22888a51d3f 100644
--- a/components/badge/Date.vue
+++ b/components/badge/Date.vue
@@ -1,5 +1,5 @@
<template>
- <span class="badge" :class="'badge-' + $options.filters.dateStatus(date)">
+ <span class="badge" :class="'bg-' + $options.filters.dateStatus(date)">
{{ !date ? "N/A" : $d(new Date(date * 1000), styleDate) }}
</span>
</template>
diff --git a/components/badge/Dispo.vue b/components/badge/Dispo.vue
index 885d99e249a0e4c9b42a2da31271372172b793e8..ad4dbaaac63580c510e530e36adc7e66bd2f44a4 100644
--- a/components/badge/Dispo.vue
+++ b/components/badge/Dispo.vue
@@ -2,8 +2,8 @@
<span
class="badge"
:class="{
- 'badge-success': isDispo,
- 'badge-danger': !isDispo
+ 'bg-success': isDispo,
+ 'bg-danger': !isDispo
}">
{{
isDispo
diff --git a/components/badge/Quality.vue b/components/badge/Quality.vue
index 58584e4acc01d80860878faa24ec348375f6110f..e5d84d497621a658d7e24c16d58127b8f21366db 100644
--- a/components/badge/Quality.vue
+++ b/components/badge/Quality.vue
@@ -2,8 +2,8 @@
<span
class="badge"
:class="{
- 'badge-success': quality >= 80,
- 'badge-warning': quality < 80
+ 'bg-success': quality >= 80,
+ 'bg-warning': quality < 80
}">
{{ Math.round(quality * 100) / 100 }}
</span>
diff --git a/components/badge/Status.vue b/components/badge/Status.vue
index 98cf50f5abea699bb09bed99ccb97fa495c8e06a..b8b1d472af8cd49048adf0f7b304ebeb01f24bd7 100644
--- a/components/badge/Status.vue
+++ b/components/badge/Status.vue
@@ -16,22 +16,22 @@ export default {
displayStatus: function (member) {
switch (member.status) {
case "NEWCOMER":
- return { str: this.$i18n.t("statut.newcomer"), class: "badge-info" }
+ return { str: this.$i18n.t("statut.newcomer"), class: "bg-info" }
case "MISSING":
- return { str: this.$i18n.t("statut.missing"), class: "badge-danger" }
+ return { str: this.$i18n.t("statut.missing"), class: "bg-danger" }
case "MEMBER":
if (this.$options.filters.dateStatus(member.limitDate) == "warning") {
- return { str: this.$i18n.t("statut.renew"), class: "badge-warning" }
+ return { str: this.$i18n.t("statut.renew"), class: "bg-warning" }
} else {
return {
str: this.$i18n.t("statut.member"),
- class: "badge-success"
+ class: "bg-success"
}
}
case "REVOKED":
return {
str: this.$i18n.t("statut.revoked"),
- class: "badge-secondary"
+ class: "bg-secondary"
}
default:
return "N/A"
diff --git a/components/btn/Search.vue b/components/btn/Search.vue
index 9ce1721a08b1d3d5982820f92f7c4d98edc1f9c7..c652d0055268501085be575edd9221374016f18e 100644
--- a/components/btn/Search.vue
+++ b/components/btn/Search.vue
@@ -1,11 +1,7 @@
<template>
<div>
<div class="input-group mb-3">
- <div class="input-group-prepend">
- <span class="input-group-text"
- ><outline-search-icon class="icon"
- /></span>
- </div>
+ <span class="input-group-text"><outline-search-icon class="icon" /></span>
<input
type="text"
class="form-control"
@@ -17,9 +13,12 @@
:aria-label="$t('recherche.title')"
aria-describedby="rechHelp" />
</div>
- <small v-if="help" id="rechHelp" class="form-text text-muted text-center">{{
- help
- }}</small>
+ <div
+ v-if="help"
+ id="rechHelp"
+ class="small form-text text-muted text-center">
+ {{ help }}
+ </div>
</div>
</template>
diff --git a/components/btn/Sort.vue b/components/btn/Sort.vue
index 2dde70c3c844e78288b085cfe1700870ae2199e3..97a0b410dc82ab3766050597d4fa00d05ad7ac71 100644
--- a/components/btn/Sort.vue
+++ b/components/btn/Sort.vue
@@ -2,10 +2,10 @@
<div class="btn-sort px-2" tabindex="0">
<span>{{ title }}</span>
<outline-sort-ascending-icon
- class="ml-2 icon flex-shrink-0"
+ class="ms-2 icon flex-shrink-0"
v-if="currentSortDir == 'desc' && currentSort == fieldName" />
<outline-sort-descending-icon
- class="ml-2 icon flex-shrink-0"
+ class="ms-2 icon flex-shrink-0"
v-if="currentSortDir == 'asc' && currentSort == fieldName" />
</div>
</template>
@@ -43,7 +43,7 @@ export default {
align-items: center;
min-height: 50px;
cursor: pointer;
- background: var(--info);
+ background: var(--bs-info);
color: white;
&:focus,
diff --git a/components/member/Card.vue b/components/member/Card.vue
index 1eb76c3c919b4917dc4518b41345b0b5fa303be9..055aac058ecd635c6906297a748b078e5d58bea0 100644
--- a/components/member/Card.vue
+++ b/components/member/Card.vue
@@ -7,7 +7,7 @@
<span class="text-truncate d-inline-block">
{{ hash.uid }}
</span>
- <small><BadgeStatus class="ml-2" :membre="hash" /></small>
+ <small><BadgeStatus class="ms-2" :membre="hash" /></small>
</h2>
<button
id="favori"
diff --git a/components/navigation/Bar.vue b/components/navigation/Bar.vue
index 31b84a8a043c2ee44cc982b71d4817b672ead7b2..48f0c1f9926a64b7bf5b538ad4737b9cd056ff99 100644
--- a/components/navigation/Bar.vue
+++ b/components/navigation/Bar.vue
@@ -2,7 +2,7 @@
<header class="header position-fixed">
<div class="position-relative">
<button
- class="toggle btn border-secondary position-absolute p-1 ml-4"
+ class="toggle btn border-secondary position-absolute p-1 ms-4"
@click="toggleMenu">
<span></span>
</button>
diff --git a/components/navigation/Breadcrumb.vue b/components/navigation/Breadcrumb.vue
index c6a185bcf5075f56320c4d237cdfaed60bf7ce85..76dff42e9b21745945fde772949cc82184012c45 100644
--- a/components/navigation/Breadcrumb.vue
+++ b/components/navigation/Breadcrumb.vue
@@ -14,7 +14,7 @@
</li>
</ol>
<div class="d-flex justify-content-between align-items-center">
- <NavigationLanguage class="mr-3" />
+ <NavigationLanguage class="me-3" />
<BtnTheme />
</div>
</nav>
diff --git a/components/navigation/Language.vue b/components/navigation/Language.vue
index ab88bb45f68314bba47711125699bf3552ad5658..5242802ab4c4d3ced36534aec3710fffc7fcbd3a 100644
--- a/components/navigation/Language.vue
+++ b/components/navigation/Language.vue
@@ -1,7 +1,8 @@
<template>
<div>
<select
- class="form-control"
+ class="form-select"
+ :aria-label="$t('lang')"
@change="saveLocale($event)"
v-model="$i18n.locale">
<option v-for="lang in $i18n.locales" :key="lang.code" :value="lang.code">
diff --git a/components/navigation/menu/Group.vue b/components/navigation/menu/Group.vue
index 99047d2fb1b1bd611fe1424cc7a4014c724484f0..4fa32b5f43418555c6e68eb3b3bad39415c80c70 100644
--- a/components/navigation/menu/Group.vue
+++ b/components/navigation/menu/Group.vue
@@ -1,11 +1,11 @@
<template>
<div class="mb-4">
- <h2 class="small text-muted text-uppercase ml-4 mb-0 pb-2 border-bottom">
+ <h2 class="small text-muted text-uppercase ms-4 mb-0 pb-2 border-bottom">
{{ $t(menu.title) }}
</h2>
<div class="nav navbar-nav list-group list-group-flush">
<NuxtLink
- class="list-group-item list-group-item-action p-0 pl-3 border-0"
+ class="list-group-item list-group-item-action p-0 ps-3 border-0"
:to="localePath(item.path)"
v-for="item in menu.items"
:key="item.path"
diff --git a/i18n/locales/de.json b/i18n/locales/de.json
index 536fdba7821ab4ade65266c7af03e4e8e36cf1c3..b9a20a298e0f235909593adba5f64917f22f89d2 100644
--- a/i18n/locales/de.json
+++ b/i18n/locales/de.json
@@ -11,8 +11,8 @@
"desc": "Dieses Tool ermöglicht es Ihnen, die Bei- und Austritte des Vertrauensnetzes der freien Währung Ğ1 zu verfolgen und ist das Ergebnis einer Zusammenarbeit zwischen verschiedenen Entwicklende und Nutzende der Währung. Zögern Sie nicht, sich bei ihnen mit einer Spende auf den folgenden öffentlichen Schlüssel zu bedanken:",
"developpeurs": "Entwicklung:",
"participants": "Mitwirkende des Projekts:",
- "title": "Apropos",
"testeurs": "Testung:",
+ "title": "Apropos",
"traducteurs": "Ãœbersetzung:"
},
"aurevoir": "Auf Wiedersehen",
@@ -82,12 +82,13 @@
"title": "Meine Favoriten",
"use": "Nur meine Favoriten"
},
- "futuremembers": "Zukünftige Beitritte",
"futureexits": "Zukünfitge Austritte",
+ "futuremembers": "Zukünftige Beitritte",
"infos": "Informationen",
"inout": "Bei- und Austritte des Vertrauensnetz in den 2 letzten Tagen",
"inpreparation": "In Vorbereitung",
"jours": "24 Stunden | {n} Tage",
+ "lang": "Wähle deine Sprache",
"lexique": "Lexikon",
"membre": {
"calculant": {
@@ -167,8 +168,8 @@
"pardate": "Prognosen nach Datum",
"parmembre": "Prognosen nach Mitglieder",
"period": {
- "title": "Suchzeitraum",
- "desc": "Wählen Sie die gewünschte Anzahl an Tagen"
+ "desc": "Wählen Sie die gewünschte Anzahl an Tagen",
+ "title": "Suchzeitraum"
},
"title": "Prognosen"
},
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 641601b52e309c269419916e65684db6f3cec321..f4257f5b16ae0d4cc79874382f9297097abb8918 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -12,8 +12,8 @@
"developpeurs": "Developers :",
"graphql": "GrahQL API",
"participants": "List of project participants :",
- "title": "About",
"testeurs": "Testers :",
+ "title": "About",
"traducteurs": "Translators :"
},
"aurevoir": "Goodbye to",
@@ -83,12 +83,13 @@
"title": "My favourites",
"use": "My favorites only"
},
- "futuremembers": "Future entries",
"futureexits": "Future exits",
+ "futuremembers": "Future entries",
"infos": "Informations",
"inout": "Entries and exits of the web of trust for the last 2 days",
"inpreparation": "In preparation",
"jours": "24h | {n} days",
+ "lang": "Choose your language",
"lexique": "Lexicon",
"membre": {
"calculant": {
@@ -168,8 +169,8 @@
"pardate": "Forecasts by dates",
"parmembre": "Forecasts by members",
"period": {
- "title": "Search period",
- "desc": "Select the desired number of days"
+ "desc": "Select the desired number of days",
+ "title": "Search period"
},
"title": "Forecasts"
},
diff --git a/i18n/locales/es.json b/i18n/locales/es.json
index e453940bbeeea9e2d58b37efc3dbc4aa7b366115..0413411645cac12cd571398ae9a991aa10c0575c 100644
--- a/i18n/locales/es.json
+++ b/i18n/locales/es.json
@@ -12,8 +12,8 @@
"developpeurs": "Desarrolladores :",
"graphql": "GrahQL API",
"participants": "Lista de participantes del proyecto :",
- "title": "A propósito",
"testeurs": "Probadores :",
+ "title": "A propósito",
"traducteurs": "Traductores :"
},
"aurevoir": "Salen",
@@ -83,12 +83,13 @@
"title": "Mis favoritos",
"use": "Solo mis favoritos"
},
- "futuremembers": "Futuras entradas",
"futureexits": "Futuras salidas",
+ "futuremembers": "Futuras entradas",
"infos": "Informaciones",
"inout": "Entradas y salidas de la red de confianza en los últimos 2 dÃas",
"inpreparation": "En preparación",
"jours": "24 horas | {n} dÃas",
+ "lang": "Elige tu idioma",
"lexique": "Léxico",
"membre": {
"calculant": {
@@ -96,8 +97,8 @@
"title": "Miembro calculador"
},
"datelimadhesion": "Fecha lÃmite de membresÃa",
- "datelimrevoc": "Fecha lÃmite de la autorevocación",
"datelimpertestatut": "Pérdida de MembresÃa",
+ "datelimrevoc": "Fecha lÃmite de la autorevocación",
"datemanquecertifs": "Falta de certificaciones",
"desc": "Individuo cuya afiliación está en curso y que ha recibido las 5 certificaciones necesarias que le permitan respetar la regla de distanciamiento. Lo que le permite ser co-creador de la moneda a través de su Dividendo Universal",
"dispo": "Disponible",
@@ -168,8 +169,8 @@
"pardate": "Previsiones por fecha",
"parmembre": "Previsiones por miembros",
"period": {
- "title": "PerÃodo de búsqueda",
- "desc": "Seleccione el número de dÃas deseado"
+ "desc": "Seleccione el número de dÃas deseado",
+ "title": "PerÃodo de búsqueda"
},
"title": "Pronósticos"
},
diff --git a/i18n/locales/fr.json b/i18n/locales/fr.json
index f0235a0be223a3d8ef99f1364db9458f15599a19..69cd8db30da512eac22f2191f2dd589dd11474f0 100644
--- a/i18n/locales/fr.json
+++ b/i18n/locales/fr.json
@@ -89,6 +89,7 @@
"inout": "Entrées et sorties de la toile de confiance des 2 derniers jours",
"inpreparation": "En préparation",
"jours": "24h | {n} jours",
+ "lang": "Choisissez votre langue",
"lexique": "Lexique",
"membre": {
"calculant": {
diff --git a/layouts/default.vue b/layouts/default.vue
index 6e92b150a74d83970777e5ce3ad03f287765efb3..bfdc5cea0988a7a71629dded31f062184a7db8d6 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -70,9 +70,9 @@ export default {
<style lang="scss">
/* Define styles for the default root window element */
:root {
- --text-primary-color: var(--dark);
+ --text-primary-color: var(--bs-dark);
--text-secondary-color: #8a8a8a;
- --background-color-primary: var(--white);
+ --background-color-primary: var(--bs-white);
--background-color-secondary: #e9ecef;
--element-size: 4rem;
--menu-size: 320px;
@@ -80,9 +80,11 @@ export default {
/* Define styles for the root window with dark - mode preference */
:root.dark-theme {
- --text-primary-color: var(--white);
+ --bs-body-bg: var(--bs-dark);
+ --bs-body-color: var(--bs-white);
+ --text-primary-color: var(--bs-white);
--text-secondary-color: #c9c9c9;
- --background-color-primary: var(--dark);
+ --background-color-primary: var(--bs-dark);
--background-color-secondary: #5d6164;
.text-info {
color: #22b2c2 !important;
diff --git a/pages/previsions/index.vue b/pages/previsions/index.vue
index b7babb1db4e0f779a360139272dbfc2d305ff719..ad3009e57a9a56b4659eb402e3bc8f320f091da2 100644
--- a/pages/previsions/index.vue
+++ b/pages/previsions/index.vue
@@ -73,7 +73,7 @@
v-for="date in forecast.forecasts"
:key="date.date">
<div
- class="forecast_date mr-3"
+ class="forecast_date me-3"
v-if="date.date < 9999999999">
{{ $d(new Date(date.date * 1000), "short") }}
{{ $t("time.a") }}
@@ -84,7 +84,7 @@
)
}}
</div>
- <div class="forecast_date mr-3" v-else>N/A</div>
+ <div class="forecast_date me-3" v-else>N/A</div>
<div>{{ Math.round(date.proba * 100) }} %</div>
</div>
</td>
@@ -119,7 +119,7 @@
"
v-for="member in forecast.forecasts"
:key="member.member.uid">
- <div class="mr-3">
+ <div class="me-3">
<span
v-if="
$favourites.list.includes(member.member.uid)