fix section height error caused by sticky action menu

components/Common/ActionMenu.vue

@@ -131,7 +131,7 @@ const onActionClick = (action: ActionMenuItem) => {
 
 // Menu format lateral (pour affichage écrans larges)
 .sticky-menu.lateral {
-  position: sticky;
+  position: fixed;
   right: 0;
   top: 60%;
   transform: translateY(-50%);

components/Common/Presentation.vue

@@ -2,89 +2,87 @@
 Section "Présentation" d'une page Logiciel
 -->
 <template>
-  <div id="Presentation">
-    <LayoutContainer>
-      <v-row class="center-90">
-
-        <!-- Colonne 1 (sous-titre, illustration logiciels, prix) -->
-        <v-col cols="12" lg="5">
-          <LayoutUISubTitle class="ml-8" >
-            {{ title }}
-          </LayoutUISubTitle>
-
-          <v-img
-            src="/images/logiciels/Opentalent-disponible-su-Multi-support.png"
-            alt="Ordinateur de bureau, ordinateur portable tablette et smartphone montrant le logiciel Opentalent"
-            class="w-100"
-          />
-
-          <div class="pricing-rectangle rectangle-4 ml-6">
-            <div class="logo-circle">
-              <div class="content-flex ml-6">
-                <v-img
-                  :src="logoSrc"
-                  :alt="logoAlt"
-                  class="software-logo"
-                />
-              </div>
+  <LayoutContainer>
+    <v-row class="center-90">
+
+      <!-- Colonne 1 (sous-titre, illustration logiciels, prix) -->
+      <v-col cols="12" lg="5">
+        <LayoutUISubTitle class="ml-8" >
+          {{ title }}
+        </LayoutUISubTitle>
+
+        <v-img
+          src="/images/logiciels/Opentalent-disponible-su-Multi-support.png"
+          alt="Ordinateur de bureau, ordinateur portable tablette et smartphone montrant le logiciel Opentalent"
+          class="w-100"
+        />
+
+        <div class="pricing-rectangle rectangle-4 ml-6">
+          <div class="logo-circle">
+            <div class="content-flex ml-6">
+              <v-img
+                :src="logoSrc"
+                :alt="logoAlt"
+                class="software-logo"
+              />
             </div>
+          </div>
 
-            <div v-if="pricingAmount" class="details">
-              <p class="small-text">
-                {{ pricingFromText }}
-              </p>
-              <p class="big-text">
-                {{ pricingAmount }}
-                <span class="smaller-text">
-                  {{ pricingPeriodText }}
-                </span>
-              </p>
-              <p class="small-text">
-                {{ pricingAnnouncementText }}
-              </p>
-            </div>
-            <div v-else class="details medium-text">
-              {{ pricingAltText }}
-            </div>
+          <div v-if="pricingAmount" class="details">
+            <p class="small-text">
+              {{ pricingFromText }}
+            </p>
+            <p class="big-text">
+              {{ pricingAmount }}
+              <span class="smaller-text">
+                {{ pricingPeriodText }}
+              </span>
+            </p>
+            <p class="small-text">
+              {{ pricingAnnouncementText }}
+            </p>
           </div>
-        </v-col>
-
-        <!-- Colonne 2 (présentation, pictogrammes des fonctionnalités) -->
-        <v-col cols="12" lg="6">
-          <h3>
-            {{ section1title }}
-          </h3>
-
-          <ul class="ml-12 mt-6">
-            <li
-              v-for="item in features"
-              :key="item"
-            >
-              {{ item }}
-            </li>
-          </ul>
-
-          <h3 class="mt-12 ml-6">
-            {{ section2title }}
-          </h3>
-
-          <div class="picto-container">
-            <div
-              v-for="picto in pictos"
-              :key="picto.text"
-              class="picto"
-            >
-              <v-img :src="picto.src" class="img" />
-
-              <p class="text">
-                {{ picto.text }}
-              </p>
-            </div>
+          <div v-else class="details medium-text">
+            {{ pricingAltText }}
+          </div>
+        </div>
+      </v-col>
+
+      <!-- Colonne 2 (présentation, pictogrammes des fonctionnalités) -->
+      <v-col cols="12" lg="6">
+        <h3>
+          {{ section1title }}
+        </h3>
+
+        <ul class="ml-12 mt-6">
+          <li
+            v-for="item in features"
+            :key="item"
+          >
+            {{ item }}
+          </li>
+        </ul>
+
+        <h3 class="mt-12 ml-6">
+          {{ section2title }}
+        </h3>
+
+        <div class="picto-container">
+          <div
+            v-for="picto in pictos"
+            :key="picto.text"
+            class="picto"
+          >
+            <v-img :src="picto.src" class="img" />
+
+            <p class="text">
+              {{ picto.text }}
+            </p>
           </div>
-        </v-col>
-      </v-row>
-    </LayoutContainer>
-  </div>
+        </div>
+      </v-col>
+    </v-row>
+  </LayoutContainer>
 </template>
 
 <script setup lang="ts">