fix(modal/popover): overflowing surface

ovh · Mar 15, 2024 · 0c5d298 · 0c5d298
1 parent f33385c
commit 0c5d298
Showing 1 changed file with 32 additions and 3 deletions.
diff --git a/packages/components/src/modal/src/index.html b/packages/components/src/modal/src/index.html
@@ -69,23 +69,52 @@
   </osds-modal>
   <osds-modal
     id="modal-3"
-    color="success"
+    color="error"
     headline="On Vous Héberge ?"
     dismissible="true"
     masked="true"
   >
     <osds-text color="text">
       OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).
     </osds-text>
-    <osds-select class="w-20" id="select7">
+    <osds-select class="w-20" id="select7" style="margin-top:20px">
       <span slot="placeholder"><i>Select</i> Country</span>
       <osds-select-group>Group title</osds-select-group>
       <osds-select-option value="1">hezh <strong>Value 1</strong></osds-select-option>
       <osds-select-option value="2">A value 2 way toooooooooooooooooooo long for a select but</osds-select-option>
       <osds-select-option value="3">Value 3</osds-select-option>
     </osds-select>
     <osds-button slot="actions" color="default" href="https://www.ovh.com/fr/" target="_blank">En savoir plus</osds-button>
-    <osds-button slot="actions" color="success" href="https://www.ovh.com/fr/" target="_blank">On m'héberge</osds-button>
+    <osds-button slot="actions" color="error" href="https://www.ovh.com/fr/" target="_blank">On m'héberge</osds-button>
+  </osds-modal>
+  <osds-modal
+    id="modal-4"
+    color="warning"
+    headline="On Vous Héberge ?"
+    dismissible="true"
+    masked="true"
+  >
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-text size="800" color="text">OVHcloud, anciennement OVH, est une entreprise française. Elle pratique initialement de l'hébergement de serveur, et est un fournisseur d'accès à Internet (FAI), puis opérateur de télécommunications pour les entreprises. Elle se développe, à la fin des années 2010, dans le cloud computing (informatique en nuage).</osds-text>
+    <osds-select class="w-20" id="select7" style="margin-top:20px">
+      <span slot="placeholder"><i>Select</i> Country</span>
+      <osds-select-group>Group title</osds-select-group>
+      <osds-select-option value="1">Test <strong>Value 1</strong></osds-select-option>
+      <osds-select-option value="2">A value way toooooooooooooooooooo long for a select</osds-select-option>
+      <osds-select-option value="3">Value 3</osds-select-option>
+    </osds-select>
+    <osds-button slot="actions" color="default" href="https://www.ovh.com/fr/" target="_blank">En savoir plus</osds-button>
+    <osds-button slot="actions" color="warning" href="https://www.ovh.com/fr/" target="_blank">On m'héberge</osds-button>
   </osds-modal>
 </body>