From 5a09410a9f0e344c54b4ef546ebd611e91830ebd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment=20Delafontaine?=
 <clment.delafontaine@gmail.com>
Date: Wed, 25 Oct 2023 14:21:19 +0200
Subject: [PATCH] THE-922-NUXT depot national layout + textes longs en deux
 lignes sur les boutons

---
 components/theses/ButtonsList.vue | 14 +++++++++++++-
 components/theses/TheseView.vue   |  6 ++----
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/components/theses/ButtonsList.vue b/components/theses/ButtonsList.vue
index 6544fb71..65dd5ea6 100644
--- a/components/theses/ButtonsList.vue
+++ b/components/theses/ButtonsList.vue
@@ -177,6 +177,7 @@ function closeOverlay() {
   display: grid;
   grid-template-columns: 1fr 1fr 100fr;
   grid-template-rows: 20% 60% 20%;
+  padding: 0 10px;
 
   @media #{ map-get(settings.$display-breakpoints, 'md-and-down')} {
     width: 100%;
@@ -223,6 +224,10 @@ function closeOverlay() {
   justify-content: center;
   flex-direction: column;
 
+  :deep(.v-expansion-panel-title) {
+    min-height: 28px;
+  }
+
   :deep(.v-expansion-panel__shadow) {
     box-shadow: unset;
   }
@@ -234,6 +239,10 @@ function closeOverlay() {
   :deep(.v-expansion-panel-text__wrapper) {
     padding: unset;
   }
+
+  :deep(.v-btn__content) {
+    white-space: break-spaces;
+  }
 }
 
 .buttons-list {
@@ -242,11 +251,14 @@ function closeOverlay() {
   align-items: center;
 
   .v-btn {
-    width: 85%;
     display: inline-flex;
     justify-content: space-between;
     text-transform: none;
     margin-bottom: 1em;
+
+    @media #{ map-get(settings.$display-breakpoints, 'md-and-down')} {
+      width: 85%;
+    }
   }
 }
 
diff --git a/components/theses/TheseView.vue b/components/theses/TheseView.vue
index 0ac80d2f..0ca65743 100644
--- a/components/theses/TheseView.vue
+++ b/components/theses/TheseView.vue
@@ -42,9 +42,8 @@
         <!-- TODO: Semble générer un bug lors de l'hydratation-->
         <ThesesThesisComponent v-if="dataReady" :soutenue="these.status === 'soutenue'" :nnt="props.id" :these="these"
                                :categories="categories"></ThesesThesisComponent>
-        <ClientOnly>
-          <ThesesThesisSkeleton v-if="!dataReady"></ThesesThesisSkeleton>
-        </ClientOnly>
+
+        <ThesesThesisSkeleton v-if="!dataReady"></ThesesThesisSkeleton>
       </div>
     </div>
   </div>
@@ -187,7 +186,6 @@ function sleep(ms) {
   display: grid;
   grid-template-columns: 10fr 103fr 10fr;
   align-items: start;
-  margin-top: 0;
   width: 100%;
 
   @media #{ map-get(settings.$display-breakpoints, 'sm-and-down')} {