Add viewport dimensions for modals

joomla · May 10, 2016 · 67029d7 · 67029d7
1 parent 0eafccc
commit 67029d7
Showing 1 changed file with 29 additions and 0 deletions.
diff --git a/media/jui/less/modals.joomla.less b/media/jui/less/modals.joomla.less
@@ -33,4 +33,33 @@ div.modal {
 .modal-batch {
   overflow-y: visible;
 }
+// Modal viewport dimensions
+.modal-body[class^="jviewport-height"],
+.modal-body[class*="jviewport-height"] {
+  max-height: none;
+}
+.jviewport-height {
+  &10 { height: 10vh; }
+  &20 { height: 20vh; }
+  &30 { height: 30vh; }
+  &40 { height: 40vh; }
+  &50 { height: 50vh; }
+  &60 { height: 60vh; }
+  &70 { height: 70vh; }
+  &80 { height: 80vh; }
+  &90 { height: 90vh; }
+  &100 { height: 100vh; }
+}
+div.modal.jviewport-width {
+  &10 { width: 10vw; margin-left: -5vw; }
+  &20 { width: 20vw; margin-left: -10vw; }
+  &30 { width: 30vw; margin-left: -15vw; }
+  &40 { width: 40vw; margin-left: -20vw; }
+  &50 { width: 50vw; margin-left: -25vw; }
+  &60 { width: 60vw; margin-left: -30vw; }
+  &70 { width: 70vw; margin-left: -35vw; }
+  &80 { width: 80vw; margin-left: -40vw; }
+  &90 { width: 90vw; margin-left: -45vw; }
+  &100 { width: 100vw; margin-left: -50vw; }
+}
 // < Joomla JUI