various style improvements on parameters page

assets/css/global.scss

@@ -70,3 +70,15 @@ header .v-toolbar__content {
 .v-application {
   font-size: 0.9rem;
 }
+
+h3, h4 {
+  color: rgb(var(--v-theme-on-neutral-soft));
+}
+
+h3 {
+  font-size: 1.1rem;
+}
+
+h4 {
+  font-size: 1.05rem;
+}

components/Layout/Header.vue

@@ -11,8 +11,13 @@ Contient entre autres le nom de l'organisation, l'accès à l'aide et aux préf
         :icon="isMainMenuOpened ? 'mdi:mdi-menu-open' : 'mdi:mdi-menu'"
         @click="toggleMainMenu"
       />
+
       <div v-else-if="hasParametersMenu && layoutStore.name === 'parameters'">
-        <v-app-bar-nav-icon v-if="mdAndUp" icon="fa fa-gear" />
+        <v-app-bar-nav-icon
+          v-if="mdAndUp"
+          icon="fa fa-gear"
+          @click="redirectToHome"
+        />
         <v-app-bar-nav-icon
           v-else
           :icon="isParametersMenuOpened ? 'mdi:mdi-menu-open' : 'mdi:mdi-menu'"
@@ -70,6 +75,8 @@ import { useDisplay } from 'vuetify'
 import { useMenu } from '~/composables/layout/useMenu'
 import { useOrganizationProfileStore } from '~/stores/organizationProfile'
 import { useLayoutStore } from '~/stores/layout'
+import {useHomeUrl} from '~/composables/utils/useHomeUrl';
+import {useRedirect} from '~/composables/utils/useRedirect';
 
 const organizationProfile = useOrganizationProfileStore()
 const runtimeConfig = useRuntimeConfig()
@@ -89,6 +96,8 @@ const hasParametersMenu = computed(() => hasMenu('Parameters'))
 const isParametersMenuOpened = computed(() => isMenuOpened('Parameters'))
 const toggleParametersMenu = () => toggleMenu('Parameters')
 
+const { redirectToHome } = useRedirect()
+
 const ability = useAbility()
 const showUniversalButton =
   ability.can('manage', 'users') ||

components/Layout/Parameters/Menu.vue

@@ -57,7 +57,7 @@ const displayMenu = computed(() => {
   return menu !== null && hasMenu('Parameters')
 })
 
-const isOpened = computed(() => isMenuOpened('Parameters'))
+const isOpened = computed(() => mdAndUp || isMenuOpened('Parameters'))
 
 const closeMenu = () => {
   setMenuState('Parameters', false)
@@ -120,6 +120,14 @@ onUnmounted(() => {
 :deep(.v-list-item__prepend) {
   margin: 10px 0;
   margin-right: 10px !important;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  width: 32px;
+
+  .v-list-item__spacer {
+    display: none;
+  }
 }
 
 :deep(.v-list-item .v-icon) {
@@ -136,6 +144,7 @@ onUnmounted(() => {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
+  border-radius: 0;
 }
 
 :deep(.cancel-btn .v-btn__prepend) {

components/Layout/Parameters/Table.vue

@@ -167,6 +167,14 @@ const columns: ComputedRef<Array<ColumnDefinition>> = computed(() => {
 </script>
 
 <style scoped lang="scss">
+
+.container {
+  //max-width: 1000px;
+  //margin: 0 auto;
+}
+
+
+
 .v-table {
   width: 100%;
 

components/Layout/SubHeader/ActivityYear.vue

@@ -93,7 +93,7 @@ const setActivityYear = async (event: string) => {
   input {
     font-size: 14px;
     width: 55px !important;
-    padding: 0 !important;
+    padding: 0 2px 0 6px !important;
     margin-top: 0 !important;
     min-height: 24px;
     height: 24px;

composables/utils/useRedirect.ts

@@ -4,19 +4,23 @@ export const useRedirect = () => {
   const runtimeConfig = useRuntimeConfig()
 
   const redirectToLogout = () => {
-    if (!runtimeConfig.baseUrlAdminLegacy) {
+    const baseUrl = runtimeConfig.baseUrlAdminLegacy ?? runtimeConfig.public.baseUrlAdminLegacy
+
+    if (!baseUrl) {
       throw new Error('Configuration error : no redirection target')
     }
-    navigateTo(UrlUtils.join(runtimeConfig.baseUrlAdminLegacy, '#/logout'), {
+    navigateTo(UrlUtils.join(baseUrl, '#/logout'), {
       external: true,
     })
   }
 
   const redirectToHome = () => {
-    if (!runtimeConfig.baseUrlAdminLegacy) {
+    const baseUrl = runtimeConfig.baseUrlAdminLegacy ?? runtimeConfig.public.baseUrlAdminLegacy
+
+    if (!baseUrl) {
       throw new Error('Configuration error : no redirection target')
     }
-    navigateTo(UrlUtils.join(runtimeConfig.baseUrlAdminLegacy, '#/dashboard'), {
+    navigateTo(UrlUtils.join(baseUrl, '#/dashboard'), {
       external: true,
     })
   }

layouts/parameters.vue

@@ -17,7 +17,9 @@
 
         <!-- Page will be rendered here-->
         <v-card class="parameters-page-card">
-          <slot />
+          <div class="inner-container">
+            <slot />
+          </div>
         </v-card>
       </v-main>
 
@@ -37,7 +39,12 @@ layoutStore.name = 'parameters'
 .parameters-page-card {
   background-color: rgb(var(--v-theme-neutral-very-soft));
   color: rgb(var(--v-theme-on-neutral-very-soft));
-  margin: 3%;
   padding: 24px;
+  margin: 2% 3%;
+}
+
+.inner-container {
+  max-width: 1200px;
+  margin: 0 auto;
 }
 </style>

pages/parameters/attendance_booking_reasons/[id].vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>{{ $t('attendanceBookingReason') }}</h2>
+      <h3>{{ $t('attendanceBookingReason') }}</h3>
       <UiFormEdition
         :model="AttendanceBookingReason"
         go-back-route="/parameters/attendances"

pages/parameters/attendance_booking_reasons/new.vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>{{ $t('new_attendance_booking_reason') }}</h2>
+      <h3>{{ $t('new_attendance_booking_reason') }}</h3>
       <UiFormCreation
         :model="AttendanceBookingReason"
         go-back-route="/parameters/attendances"

pages/parameters/cycles/[id].vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>{{ $t('cycle') }}</h2>
+      <h3>{{ $t('cycle') }}</h3>
       <UiFormEdition :model="Cycle" go-back-route="/parameters/teaching">
         <template #default="{ entity }">
           <UiInputText v-model="entity.label" field="label" :rules="rules()" />

pages/parameters/education_timings/[id].vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>{{ $t('educationTiming') }}</h2>
+      <h3>{{ $t('educationTiming') }}</h3>
       <UiFormEdition
         :model="EducationTiming"
         go-back-route="/parameters/education_timings"

pages/parameters/education_timings/new.vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>{{ $t('new_education_timing') }}</h2>
+      <h3>{{ $t('new_education_timing') }}</h3>
       <UiFormCreation
         :model="EducationTiming"
         go-back-route="/parameters/education_timings"

pages/parameters/residence_areas/[id].vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>Éditer la zone de résidence</h2>
+      <h3>Éditer la zone de résidence</h3>
       <UiFormEdition
         :model="ResidenceArea"
         go-back-route="/parameters/residence_areas"

pages/parameters/residence_areas/new.vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer>
     <div>
-      <h2>{{ $t('create_a_new_residence_area') }}</h2>
+      <h3>{{ $t('create_a_new_residence_area') }}</h3>
       <UiFormCreation
         :model="ResidenceArea"
         go-back-route="/parameters/residence_areas"