diff --git a/.env b/.env index 9a6a6329..bcdcf632 100644 --- a/.env +++ b/.env @@ -1,5 +1,6 @@ NUXT_APP_API=http://localhost:8990/api/v1/ -NUXT_APP_API=https://beta.theses.fr/api/v1/ +NUXT_APP_API=https://theses.fr/api/v1/ NUXT_APP_APIREF=https://apicom.sudoc.fr/wsReferentiels/v1/ -NUXT_IS_MAINTENANCE=false NUXT_MAINTENANCE_MESSAGE="

Nous nous excusons pour tout inconvénient que cela pourrait causer.


Vous pouvez suivre le compte Twitter de l'ABES pour le suivi des travaux : https://twitter.com/com_abes


Nous vous remercions pour votre patience et nous revenons bientôt !

" +NUXT_IS_MAINTENANCE=false + diff --git a/README.md b/README.md index 841fe1d7..aa23c6d8 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ # theses-front [![build-test-pubtodockerhub](https://github.com/abes-esr/theses-front/actions/workflows/build-test-pubtodockerhub.yml/badge.svg)](https://github.com/abes-esr/theses-front/actions/workflows/build-test-pubtodockerhub.yml) [![Docker Pulls](https://img.shields.io/docker/pulls/abesesr/theses.svg)](https://hub.docker.com/r/abesesr/theses/) -Le moteur de recherche theses.fr recense l’ensemble des thèses de doctorat soutenues en France depuis 1985, les sujets de thèse préparés au sein des établissements de l’enseignement supérieur français, et les personnes impliquées dans la recherche doctorale française. +Le moteur de recherche theses.fr recense l’ensemble des thèses de doctorat soutenues en France depuis 1985, les sujets de thèse préparés au sein des établissements de l’enseignement supérieur français, et les personnes impliquées dans la recherche doctorale française. Ce dépôt héberge le code source de l'interface utilisateur du site theses.fr. @@ -14,16 +14,16 @@ L'application complète peut être déployée via Docker à l'aide du dépôt ht ## Architecture technique L'interface est développée en Vue JS 3, à l'aide du framework NuxtJS 3, qui permet de tirer profit du Server Side Rendering pour certaines pages. Le projet utilise également la bibliothèque de composants Vuetify. -Le projet est ensuite déployé dans un container docker, dans le SI de l'Abes (le docker compose est disponible [ici](https://github.com/abes-esr/theses-docker) ) +Le projet est ensuite déployé dans un container docker, dans le SI de l'Abes (le docker compose est disponible [ici](https://github.com/abes-esr/theses-docker)) -Les données affichées par cet interface sont obtenues en interrogeant les API theses.fr : -* https://github.com/abes-esr/theses-api-recherche pour la recherche et l'affichage de theses -* https://github.com/abes-esr/theses-api-export pour les exports des theses en différents formats (CSV, XML, BIBTEX, etc) +Les données affichées par cette interface sont obtenues en interrogeant les API theses.fr : +* https://github.com/abes-esr/theses-api-recherche pour la recherche et l'affichage de thèses +* https://github.com/abes-esr/theses-api-export pour les exports des thèses en différents formats (CSV, XML, BIBTEX, etc) * https://github.com/abes-esr/theses-api-diffusion pour la mise à disposition des documents (PDFs et autres) ## Utilisation du projet -### Installation des dépendances +### Installation des dépendances ```bash # npm @@ -48,7 +48,7 @@ Build et packaging de l'application pour la production : npm run build ``` -Plus d'infos sur le déploiement dans la documentation de Nuxt 3 [deployment documentation](https://nuxt.com/docs/getting-started/deployment) . +Plus d'infos sur le déploiement dans la documentation de Nuxt 3 [deployment documentation](https://nuxt.com/docs/getting-started/deployment). ### Mode maintenance @@ -66,7 +66,7 @@ Une fois la maintenance terminée, effectuer la manipulation inverse, remettre ` > [!NOTE] > Le .env mentionné ici est le .env utilisé par le docker-compose.yml, pas le .env local du projet Nuxt -> +> > Aucune page n'est accessible lorsque le mode maintenance est activé (sauf la page de maintenance). Toutes les autres routes sont redirigées vers cette page. -> -> Egalement, lorsque le mode maintenance est désactivée, il n'est pas possible d'aller sur /maintenance, cela vous redirigera vers la page d'accueil. +> +> Également, lorsque le mode maintenance est désactivée, il n'est pas possible d'aller sur /maintenance, cela vous redirigera vers la page d'accueil. diff --git a/app.vue b/app.vue index d972432d..781a234c 100644 --- a/app.vue +++ b/app.vue @@ -45,13 +45,19 @@ const theme = useTheme(); const themesNames = ref({ "light": "abesLightTheme", - "dark": "abesDarkTheme" + "dark": "abesDarkTheme", + "inverted": "abesInvertedTheme" }); const { mobile } = useDisplay(); const skipLink =ref(null); const colorMode = useColorMode({ + attribute: 'theme', + modes: { + // couleurs personnalisées + inverted: 'inverted' + }, onChanged(color) { theme.global.name.value = themesNames.value[color]; } @@ -541,7 +547,7 @@ a:hover, a:active { color: inherit; text-decoration: none; - font-weight: 500; + font-weight: 600; } .skiplink:not(:focus) { diff --git a/components/common/DomainSelector.vue b/components/common/DomainSelector.vue index f985c9a9..62c7f526 100644 --- a/components/common/DomainSelector.vue +++ b/components/common/DomainSelector.vue @@ -1,29 +1,36 @@ @@ -162,7 +179,7 @@ header { } .language-accessibility-toolbar { - display: grid; // dé-commenter si on active le bouton accessibilité + display: grid; grid-template-columns: 1fr 20px 3fr; margin: 0 30px 0; @@ -172,9 +189,10 @@ header { } .languages-btn { - grid-column-start: 3; // 3 si on active le bouton accessibilité + grid-column-start: 3; max-height: 36px; align-self: center; + display: inline-flex; @media #{ map-get(settings.$display-breakpoints, 'md-and-down')} { grid-column-start: 2; @@ -184,6 +202,11 @@ header { padding: 0 5px; } } + + .v-divider { + height: 1.5em; + align-self: center; + } } .logos-droite { diff --git a/components/common/HeaderMobile.vue b/components/common/HeaderMobile.vue index b3244054..8ebe0dab 100644 --- a/components/common/HeaderMobile.vue +++ b/components/common/HeaderMobile.vue @@ -40,24 +40,24 @@
-
-
- - - - - - - - - - +
+
+ FR + + EN + + ES +
@@ -115,10 +115,11 @@ {{ $t("access.params") }}
    -
    • +
    • -
    • +
    • +
@@ -137,7 +138,9 @@ import { useColorMode } from '@vueuse/core' const theme = useTheme(); const { locale } = useI18n(); const isReady = ref(false); -const changeContrast = ref(false); +const route = useRoute(); +const router = useRouter(); +const selectedThemeSwitch = ref(''); // Elements du DOM const expandedMenu = ref(null); @@ -145,18 +148,25 @@ const expandedSearchBar = ref(null); const themesNames = ref({ "light": "abesLightTheme", - "dark": "abesDarkTheme" + "dark": "abesDarkTheme", + "inverted": "abesInvertedTheme" }); const colorMode = useColorMode({ + attribute: 'theme', + modes: { + // couleurs personnalisées + inverted: 'inverted' + }, onChanged(color) { theme.global.name.value = themesNames.value[color]; } }); onBeforeMount(() => { - // Etat par défaut du switch - changeContrast.value = useColorMode().value === 'dark'; + // Etat initial du switch + theme.global.name.value = themesNames.value[colorMode.value]; + selectedThemeSwitch.value = colorMode.value; isReady.value = true; }); @@ -235,6 +245,11 @@ onMounted(() => { function setLanguage(lang) { localStorage.setItem("language", lang); locale.value = lang; + + if (/\/(fr|en|es)\//.test(route.path)) { + const newPath = route.path.replace(/\/(fr|en|es)\//, `/${lang}/`); + router.push(newPath); + } } //Paramètres d'accessibilité @@ -246,8 +261,11 @@ const justification = useState('justification'); /** * Watchers */ -watch(changeContrast, newValue => { - colorMode.value = newValue ? 'dark' : 'light'; +// Détecter les changements de switch pour changer le thème +watch(() => selectedThemeSwitch.value, () => { + if(selectedThemeSwitch.value === false) + selectedThemeSwitch.value = "light"; + colorMode.value = selectedThemeSwitch.value; }); onMounted(() => { @@ -349,10 +367,22 @@ onMounted(() => { .languages-btn-container { padding-top: 10px; + display: inline-flex; + margin-bottom: 10px; + width: fit-content; + justify-self: center; + + :deep(.v-btn--size-small) { + font-size: unset; + min-width: unset; + width: 2.3em; + } +} + +.languages-btn-layout-wrapper { width: 100%; - display: grid; - grid-template-columns: 3fr 2fr; - height: 35px; + display: inline-grid; + grid-template-columns: 1fr 1fr; } .languages-btn { diff --git a/components/common/Keywords.vue b/components/common/Keywords.vue index fcbec806..3e12de46 100644 --- a/components/common/Keywords.vue +++ b/components/common/Keywords.vue @@ -4,23 +4,23 @@
mdi-list-box -

{{ $t('motcle') }}

+

{{ $t('motcle') }}

-
+

{{ $t("motCleControle") }}

- + mdi-information-outline - Informations sur les mots clés + {{ $t("infoKeywords") }}
- {{ $t("motCleControleDescription") }} idRef. + {{ $t("motCleControleDescription") }} idRef.
{{ $t('access.fermer') }} @@ -28,9 +28,8 @@
-
-
+
-
+

{{ $t("motCleLibres") }}

-
+