fomantic-ui 2.9.1-beta.8 → 2.9.1

package/dist/components/dimmer.css

@@ -1,5 +1,5 @@
 /*!
- * # Fomantic-UI 2.9.1-beta.8+edc5e7e - Dimmer
+ * # Fomantic-UI 2.9.1 - Dimmer
  * https://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -29,24 +29,13 @@
   background: rgba(0, 0, 0, 0.85);
   opacity: 0;
   line-height: 1;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-duration: 0.5s;
-          animation-duration: 0.5s;
-  -webkit-transition: all 0.5s linear;
+  animation-fill-mode: both;
+  animation-duration: 0.5s;
   transition: all 0.5s linear;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
   -webkit-user-select: none;
-     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   will-change: opacity;
@@ -56,10 +45,9 @@
 /* Dimmer Content */
 .ui.dimmer > .content {
   -webkit-user-select: text;
-     -moz-user-select: text;
       -ms-user-select: text;
           user-select: text;
-  color: #FFFFFF;
+  color: #fff;
 }
 
 /* Loose Coupling */
@@ -88,7 +76,7 @@
   scrollbar-track-color: #323232;
   scrollbar-arrow-color: #323232;
   
-/* firefox : first color thumb, second track */
+/* firefox: first color thumb, second track */
   scrollbar-color: rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.1);
 }
 
@@ -108,8 +96,6 @@
 .dimmed.dimmable > .ui.animating.dimmer,
 .dimmed.dimmable > .ui.visible.dimmer,
 .ui.active.dimmer {
-  display: -webkit-box;
-  display: -ms-flexbox;
   display: flex;
   opacity: 1;
 }
@@ -126,10 +112,9 @@
 *******************************/
 
 
-/*--------------
-      Legacy
-  ---------------*/
-
+/* --------------
+        Legacy
+    --------------- */
 
 /* Animating / Active / Visible */
 .dimmed.dimmable > .ui.animating.legacy.dimmer,
@@ -138,33 +123,24 @@
   display: block;
 }
 
-/*--------------
-      Alignment
-  ---------------*/
-
+/* --------------
+        Alignment
+    --------------- */
 .ui[class*="top aligned"].dimmer {
-  -webkit-box-pack: start;
-      -ms-flex-pack: start;
-          justify-content: flex-start;
+  justify-content: flex-start;
 }
 .ui[class*="bottom aligned"].dimmer {
-  -webkit-box-pack: end;
-      -ms-flex-pack: end;
-          justify-content: flex-end;
+  justify-content: flex-end;
 }
 
-/*--------------
-        Page
-  ---------------*/
-
+/* --------------
+          Page
+    --------------- */
 .ui.page.dimmer {
   position: fixed;
-  -webkit-transform-style: '';
-          transform-style: '';
-  -webkit-perspective: 2000px;
-          perspective: 2000px;
-  -webkit-transform-origin: center center;
-          transform-origin: center center;
+  transform-style: "";
+  perspective: 2000px;
+  transform-origin: center center;
 }
 .ui.page.dimmer.modals {
   -moz-perspective: none;
@@ -177,22 +153,16 @@ body.dimmable > .dimmer {
   position: fixed;
 }
 
-/*--------------
-      Blurring
-  ---------------*/
-
+/* --------------
+        Blurring
+    --------------- */
 @supports (not (-webkit-backdrop-filter: none)) and (not ((-webkit-backdrop-filter: none) or (backdrop-filter: none))) {
   .blurring.dimmable > :not(.dimmer) {
-    -webkit-filter: initial;
-            filter: initial;
-    -webkit-transition: 800ms -webkit-filter ease;
-    transition: 800ms -webkit-filter ease;
+    filter: initial;
     transition: 800ms filter ease;
-    transition: 800ms filter ease, 800ms -webkit-filter ease;
   }
   .blurring.dimmed.dimmable > :not(.dimmer):not(.popup) {
-    -webkit-filter: blur(5px) grayscale(0.7);
-            filter: blur(5px) grayscale(0.7);
+    filter: blur(5px) grayscale(0.7);
   }
 }
 
@@ -206,10 +176,9 @@ body.dimmable > .dimmer {
   background: rgba(255, 255, 255, 0.6);
 }
 
-/*--------------
-      Aligned
-  ---------------*/
-
+/* --------------
+        Aligned
+    --------------- */
 .ui.dimmer > .top.aligned.content > * {
   vertical-align: top;
 }
@@ -217,10 +186,9 @@ body.dimmable > .dimmer {
   vertical-align: bottom;
 }
 
-/*--------------
-      Shades
-  ---------------*/
-
+/* --------------
+        Shades
+    --------------- */
 .medium.medium.medium.medium.medium.dimmer {
   background: rgba(0, 0, 0, 0.65);
 }
@@ -231,22 +199,20 @@ body.dimmable > .dimmer {
   background: rgba(0, 0, 0, 0.25);
 }
 
-/*--------------
-      Inverted
-  ---------------*/
-
+/* --------------
+        Inverted
+    --------------- */
 .ui.inverted.dimmer {
   background: rgba(255, 255, 255, 0.85);
 }
 .ui.inverted.dimmer > .content,
 .ui.inverted.dimmer > .content > * {
-  color: #000000;
+  color: #000;
 }
 
-/*--------------
-     Inverted Shades
-    ---------------*/
-
+/* --------------
+         Inverted Shades
+        --------------- */
 .medium.medium.medium.medium.medium.inverted.dimmer {
   background: rgba(255, 255, 255, 0.65);
 }
@@ -257,10 +223,9 @@ body.dimmable > .dimmer {
   background: rgba(255, 255, 255, 0.25);
 }
 
-/*--------------
-       Simple
-  ---------------*/
-
+/* --------------
+         Simple
+    --------------- */
 
 /* Displays without javascript */
 .ui.simple.dimmer {
@@ -287,10 +252,9 @@ body.dimmable > .dimmer {
   background: rgba(255, 255, 255, 0.85);
 }
 
-/*--------------
-       Partially
-  ----------------*/
-
+/* --------------
+         Partially
+    ---------------- */
 .ui[class*="top dimmer"],
 .ui[class*="center dimmer"],
 .ui[class*="bottom dimmer"] {
@@ -303,7 +267,6 @@ body.dimmable > .dimmer {
 .ui[class*="center dimmer"] {
   top: 50%;
   transform: translateY(-50%);
-  -webkit-transform: translateY(calc(-50% - 0.5px));
 }
 .ui.segment > .ui.ui[class*="top dimmer"] {
   border-bottom-left-radius: 0;
@@ -317,137 +280,58 @@ body.dimmable > .dimmer {
   border-top-right-radius: 0;
 }
 .ui[class*="center dimmer"].transition[class*="fade up"].in {
-  -webkit-animation-name: fadeInUpCenter;
-          animation-name: fadeInUpCenter;
+  animation-name: fadeInUpCenter;
 }
 .ui[class*="center dimmer"].transition[class*="fade down"].in {
-  -webkit-animation-name: fadeInDownCenter;
-          animation-name: fadeInDownCenter;
+  animation-name: fadeInDownCenter;
 }
 .ui[class*="center dimmer"].transition[class*="fade up"].out {
-  -webkit-animation-name: fadeOutUpCenter;
-          animation-name: fadeOutUpCenter;
+  animation-name: fadeOutUpCenter;
 }
 .ui[class*="center dimmer"].transition[class*="fade down"].out {
-  -webkit-animation-name: fadeOutDownCenter;
-          animation-name: fadeOutDownCenter;
+  animation-name: fadeOutDownCenter;
 }
 .ui[class*="center dimmer"].bounce.transition {
-  -webkit-animation-name: bounceCenter;
-          animation-name: bounceCenter;
-}
-@-webkit-keyframes fadeInUpCenter {
-  0% {
-    opacity: 0;
-    transform: translateY(-40%);
-    -webkit-transform: translateY(calc(-40% - 0.5px));
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
-  }
+  animation-name: bounceCenter;
 }
 @keyframes fadeInUpCenter {
   0% {
     opacity: 0;
     transform: translateY(-40%);
-    -webkit-transform: translateY(calc(-40% - 0.5px));
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
-  }
-}
-@-webkit-keyframes fadeInDownCenter {
-  0% {
-    opacity: 0;
-    transform: translateY(-60%);
-    -webkit-transform: translateY(calc(-60% - 0.5px));
   }
   100% {
     opacity: 1;
     transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
   }
 }
 @keyframes fadeInDownCenter {
   0% {
     opacity: 0;
     transform: translateY(-60%);
-    -webkit-transform: translateY(calc(-60% - 0.5px));
   }
   100% {
     opacity: 1;
     transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
-  }
-}
-@-webkit-keyframes fadeOutUpCenter {
-  0% {
-    opacity: 1;
-    transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
-  }
-  100% {
-    opacity: 0;
-    transform: translateY(-45%);
-    -webkit-transform: translateY(calc(-45% - 0.5px));
   }
 }
 @keyframes fadeOutUpCenter {
   0% {
     opacity: 1;
     transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
   }
   100% {
     opacity: 0;
     transform: translateY(-45%);
-    -webkit-transform: translateY(calc(-45% - 0.5px));
-  }
-}
-@-webkit-keyframes fadeOutDownCenter {
-  0% {
-    opacity: 1;
-    transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
-  }
-  100% {
-    opacity: 0;
-    transform: translateY(-55%);
-    -webkit-transform: translateY(calc(-55% - 0.5px));
   }
 }
 @keyframes fadeOutDownCenter {
   0% {
     opacity: 1;
     transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
   }
   100% {
     opacity: 0;
     transform: translateY(-55%);
-    -webkit-transform: translateY(calc(-55% - 0.5px));
-  }
-}
-@-webkit-keyframes bounceCenter {
-  0%,
-  20%,
-  50%,
-  80%,
-  100% {
-    transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
-  }
-  40% {
-    -webkit-transform: translateY(calc(-50% - 30px));
-            transform: translateY(calc(-50% - 30px));
-  }
-  60% {
-    -webkit-transform: translateY(calc(-50% - 15px));
-            transform: translateY(calc(-50% - 15px));
   }
 }
 @keyframes bounceCenter {
@@ -457,15 +341,12 @@ body.dimmable > .dimmer {
   80%,
   100% {
     transform: translateY(-50%);
-    -webkit-transform: translateY(calc(-50% - 0.5px));
   }
   40% {
-    -webkit-transform: translateY(calc(-50% - 30px));
-            transform: translateY(calc(-50% - 30px));
+    transform: translateY(calc(-50% - 30px));
   }
   60% {
-    -webkit-transform: translateY(calc(-50% - 15px));
-            transform: translateY(calc(-50% - 15px));
+    transform: translateY(calc(-50% - 15px));
   }
 }