variours style improvements on parameters page

assets/css/global.scss

@@ -76,11 +76,11 @@ h3, h4 {
 }
 
 h3 {
-  font-size: 1.1rem;
-  color: rgb(var(--v-theme-on-neutral-soft));
+  font-size: 1.3rem;
+  color: rgb(var(--v-theme-on-neutral));
 }
 
 h4 {
-  font-size: 1.05rem;
+  font-size: 1.1rem;
   color: rgb(var(--v-theme-on-neutral));
 }

components/Ui/Form.vue

@@ -34,7 +34,7 @@ de quitter si des données ont été modifiées.
           </v-col>
         </v-row>
       </v-container>
-      <div v-else class="mt-12" />
+      <div v-else class="mt-6" />
 
       <!-- Content -->
       <slot v-bind="{ modelValue }" />
@@ -43,7 +43,7 @@ de quitter si des données ont été modifiées.
       <v-container
         v-if="actionPosition === 'both' || actionPosition === 'bottom'"
         :fluid="true"
-        class="container btnActions mt-6"
+        class="container btnActions"
       >
         <v-row>
           <v-col cols="12" sm="12">

components/Ui/Input/Checkbox.vue

@@ -12,7 +12,7 @@ Case à cocher, à placer dans un composant `UiForm`
     density="compact"
     :error="error || !!fieldViolations"
     :error-messages="errorMessage || fieldViolations ? $t(fieldViolations) : ''"
-    class="py-1"
+    class="checkbox py-1"
     @update:model-value="onUpdate"
   />
 </template>
@@ -93,7 +93,16 @@ const onUpdate = (event: boolean) => {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+
+.checkbox {
+  margin-top: -4px;
+  margin-bottom: 8px;
+}
+
+:deep(.v-input__control) {
+  max-height: 32px;
+}
 
 :deep(.v-label) {
   padding-left: 8px;

components/Ui/Input/DatePicker.vue

@@ -117,13 +117,13 @@ const onUpdate = (event: string) => {
 .label {
   position: absolute;
   color: #8e8e8e;
-  top: -0.7rem; /* Ajustez la valeur pour que le label chevauche la bordure */
-  left: 0.75rem; /* Assurez-vous qu'il est légèrement à l'intérieur */
-  background-color: white; /* Assurez-vous que la couleur de fond corresponde au fond du composant */
-  padding: 0 0.3rem; /* Ajoute un peu d'espace autour du texte */
-  font-size: 0.8rem; /* Réduisez légèrement la taille du texte */
-  z-index: 1; /* Assurez-vous que le label est au premier plan */
-  transition: color 0.2s, font-size 0.2s, top 0.2s; /* Pour donner un effet lors de l'interaction */
+  top: -0.7rem;
+  left: 0.75rem;
+  background-color: rgb(var(--v-theme-surface));
+  padding: 0 0.3rem;
+  font-size: 0.8rem;
+  z-index: 1;
+  transition: color 0.2s, font-size 0.2s, top 0.2s;
 
 }
 

i18n/lang/fr.json

@@ -653,9 +653,11 @@
   "parameters_super_admin_page": "Compte super-admin",
   "super_admin_breadcrumbs": "Compte super-admin",
   "an_error_happened": "Une erreur s'est produite",
+  "your_opentalent_website": "Votre site web",
   "your_opentalent_website_address_is": "L'adresse de votre site Opentalent est",
   "record_a_new_subdomain": "Enregistrer un nouveau sous-domaine",
   "your_subdomains": "Vos sous-domaines",
+  "other_website": "Autre site internet",
   "Not Found": "Données non trouvée",
   "subdomains_breadcrumbs": "Sous-domaines",
   "new_breadcrumbs": "Nouveau",

layouts/parameters.vue

@@ -40,7 +40,8 @@ layoutStore.name = 'parameters'
   background-color: rgb(var(--v-theme-neutral-very-soft));
   color: rgb(var(--v-theme-on-neutral-very-soft));
   padding: 24px;
-  margin: 2% 3%;
+  margin: 2% auto;
+  max-width: 1200px;
 }
 
 .inner-container {

pages/parameters/website.vue

@@ -10,6 +10,10 @@
     >
       <v-row>
         <v-col cols="12">
+          <h4 class="flex-grow-1 align-self-center">
+            {{ $t('your_opentalent_website') }}
+          </h4>
+
           <div class="section-header">
             <div class="flex-grow-1 align-self-center">
               <span>{{ $t('your_opentalent_website_address_is') }} : </span>
@@ -19,49 +23,49 @@
                 </a>
               </strong>
             </div>
+          </div>
 
-            <div v-if="!organizationProfile.isCmf">
-              <v-btn
-                v-if="!parameters.desactivateOpentalentSiteWeb"
-                color="error"
-                @click="showWebsiteDeactivationDialog = true"
-              >
-                {{ $t('deactivateOpentalentSiteWeb') }}
-              </v-btn>
-              <v-btn v-else color="primary" @click="reactivateWebsite">
-                {{ $t('reactivateOpentalentSiteWeb') }}
-              </v-btn>
-
-              <LazyLayoutDialog :show="showWebsiteDeactivationDialog">
-                <template #dialogTitle>
-                  {{ $t('please_confirm') }}
-                </template>
-                <template #dialogText>
-                  <v-col>
-                    <div>
-                      {{
-                        $t(
-                          'yourOpentalentWebsiteWillBeDeactivatedOnceYouLlHaveSaved',
-                        )
-                      }}.
-                    </div>
-                    <span>{{ $t('doYouWantToContinue') }} ?</span>
-                  </v-col>
-                </template>
-                <template #dialogBtn>
-                  <v-btn
-                    class="theme-neutral-soft mr-4"
-                    @click="showWebsiteDeactivationDialog = false"
-                  >
-                    {{ $t('cancel') }}
-                  </v-btn>
-
-                  <v-btn class="theme-primary" @click="onDialogYesBtnClick">
-                    {{ $t('yes') }}
-                  </v-btn>
-                </template>
-              </LazyLayoutDialog>
-            </div>
+          <div v-if="!organizationProfile.isCmf" class="my-6">
+            <v-btn
+              v-if="!parameters.desactivateOpentalentSiteWeb"
+              color="error"
+              @click="showWebsiteDeactivationDialog = true"
+            >
+              {{ $t('deactivateOpentalentSiteWeb') }}
+            </v-btn>
+            <v-btn v-else color="primary" @click="reactivateWebsite">
+              {{ $t('reactivateOpentalentSiteWeb') }}
+            </v-btn>
+
+            <LazyLayoutDialog :show="showWebsiteDeactivationDialog">
+              <template #dialogTitle>
+                {{ $t('please_confirm') }}
+              </template>
+              <template #dialogText>
+                <v-col>
+                  <div>
+                    {{
+                      $t(
+                        'yourOpentalentWebsiteWillBeDeactivatedOnceYouLlHaveSaved',
+                      )
+                    }}.
+                  </div>
+                  <span>{{ $t('doYouWantToContinue') }} ?</span>
+                </v-col>
+              </template>
+              <template #dialogBtn>
+                <v-btn
+                  class="theme-neutral-soft mr-4"
+                  @click="showWebsiteDeactivationDialog = false"
+                >
+                  {{ $t('cancel') }}
+                </v-btn>
+
+                <v-btn class="theme-primary" @click="onDialogYesBtnClick">
+                  {{ $t('yes') }}
+                </v-btn>
+              </template>
+            </LazyLayoutDialog>
           </div>
 
           <!-- les publicationDirectors sont des entités Access -->
@@ -78,14 +82,6 @@
               <h4 class="flex-grow-1 align-self-center">
                 {{ $t('your_subdomains') }}
               </h4>
-
-              <v-btn
-                :disabled="!canAddNewSubdomain"
-                class="my-5"
-                @click="onAddSubdomainClick"
-              >
-                {{ $t('record_a_new_subdomain') }}
-              </v-btn>
             </div>
 
             <UiLoadingPanel v-if="subdomainsPending" />
@@ -114,10 +110,24 @@
                 </tbody>
               </v-table>
               <span v-else>{{ $t('no_recorded_subdomain') }}</span>
+
+              <div>
+                <v-btn
+                  :disabled="!canAddNewSubdomain"
+                  class="my-5"
+                  @click="onAddSubdomainClick"
+                >
+                  {{ $t('record_a_new_subdomain') }}
+                </v-btn>
+              </div>
             </div>
           </div>
 
-          <div>
+          <div class="mt-6">
+            <h4 class="flex-grow-1 align-self-center">
+              {{ $t('other_website') }}
+            </h4>
+
             <UiInputText
               v-model="parameters.otherWebsite"
               field="otherWebsite"