semantic-ui-sass 2.3.1.2 → 2.4.4.0

data/app/assets/stylesheets/semantic-ui/modules/_embed.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Video
+ * # Semantic UI 2.4.2 - Video
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_modal.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Modal
+ * # Semantic UI 2.4.2 - Modal
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -14,6 +14,7 @@
 *******************************/
 
 .ui.modal {
+  position: absolute;
   display: none;
   z-index: 1001;
   text-align: left;
@@ -184,31 +185,31 @@
 
 
 /* Modal Width */
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.modal {
     width: 95%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: $tablet-breakpoint) {
   .ui.modal {
     width: 88%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: $computer-breakpoint) {
   .ui.modal {
     width: 850px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1200px) {
+@media only screen and (min-width: $large-monitor-breakpoint) {
   .ui.modal {
     width: 900px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1920px) {
+@media only screen and (min-width: $widescreen-monitor-breakpoint) {
   .ui.modal {
     width: 950px;
     margin: 0em 0em 0em 0em;
@@ -216,7 +217,7 @@
 }
 
 /* Tablet and Mobile */
-@media only screen and (max-width: 991px) {
+@media only screen and (max-width: $largest-tablet-screen) {
   .ui.modal > .header {
     padding-right: 2.25rem;
   }
@@ -228,7 +229,7 @@
 }
 
 /* Mobile */
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.modal > .header {
     padding: 0.75rem 1rem !important;
     padding-right: 2.25rem !important;
@@ -320,8 +321,21 @@
   color: rgba(0, 0, 0, 0.85);
 }
 
+/* Resort to margin positioning if legacy */
+.ui.legacy.modal,
+.ui.legacy.page.dimmer > .ui.modal {
+  top: 50%;
+  left: 50%;
+}
+.ui.legacy.page.dimmer > .ui.scrolling.modal,
+.ui.page.dimmer > .ui.scrolling.legacy.modal,
+.ui.top.aligned.legacy.page.dimmer > .ui.modal,
+.ui.top.aligned.dimmer > .ui.legacy.modal {
+  top: auto;
+}
+
 /* Tablet and Mobile */
-@media only screen and (max-width: 991px) {
+@media only screen and (max-width: $largest-tablet-screen) {
   .ui.basic.modal > .close {
     color: #FFFFFF;
   }
@@ -356,6 +370,21 @@
 .modals.dimmer[class*="top aligned"] .modal {
   margin: 5vh auto;
 }
+@media only screen and (max-width: $largest-mobile-screen) {
+  .modals.dimmer[class*="top aligned"] .modal {
+    margin: 1rem auto;
+  }
+}
+
+/* Legacy Top Aligned */
+.legacy.modals.dimmer[class*="top aligned"] {
+  padding-top: 5vh;
+}
+@media only screen and (max-width: $largest-mobile-screen) {
+  .legacy.modals.dimmer[class*="top aligned"] {
+    padding-top: 1rem;
+  }
+}
 
 /*--------------
     Scrolling
@@ -379,7 +408,7 @@
   position: fixed;
 }
 .modals.dimmer .ui.scrolling.modal {
-  margin: 1rem auto !important;
+  margin: 1rem auto;
 }
 
 /* Undetached Scrolling */
@@ -398,7 +427,7 @@
 
 /* Scrolling Content */
 .ui.modal .scrolling.content {
-  max-height: calc(70vh);
+  max-height: calc(80vh - 10em);
   overflow: auto;
 }
 
@@ -408,12 +437,8 @@
 
 .ui.fullscreen.modal {
   width: 95% !important;
-  left: 0em !important;
   margin: 1em auto;
 }
-.ui.fullscreen.scrolling.modal {
-  left: 0em !important;
-}
 .ui.fullscreen.modal > .header {
   padding-right: 2.25rem;
 }
@@ -437,31 +462,31 @@
 }
 
 /* Mini Modal Width */
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.mini.modal {
     width: 95%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: $tablet-breakpoint) {
   .ui.mini.modal {
     width: 35.2%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: $computer-breakpoint) {
   .ui.mini.modal {
     width: 340px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1200px) {
+@media only screen and (min-width: $large-monitor-breakpoint) {
   .ui.mini.modal {
     width: 360px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1920px) {
+@media only screen and (min-width: $widescreen-monitor-breakpoint) {
   .ui.mini.modal {
     width: 380px;
     margin: 0em 0em 0em 0em;
@@ -474,31 +499,31 @@
 }
 
 /* Tiny Modal Width */
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.tiny.modal {
     width: 95%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: $tablet-breakpoint) {
   .ui.tiny.modal {
     width: 52.8%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: $computer-breakpoint) {
   .ui.tiny.modal {
     width: 510px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1200px) {
+@media only screen and (min-width: $large-monitor-breakpoint) {
   .ui.tiny.modal {
     width: 540px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1920px) {
+@media only screen and (min-width: $widescreen-monitor-breakpoint) {
   .ui.tiny.modal {
     width: 570px;
     margin: 0em 0em 0em 0em;
@@ -511,31 +536,31 @@
 }
 
 /* Small Modal Width */
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.small.modal {
     width: 95%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: $tablet-breakpoint) {
   .ui.small.modal {
     width: 70.4%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: $computer-breakpoint) {
   .ui.small.modal {
     width: 680px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1200px) {
+@media only screen and (min-width: $large-monitor-breakpoint) {
   .ui.small.modal {
     width: 720px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1920px) {
+@media only screen and (min-width: $widescreen-monitor-breakpoint) {
   .ui.small.modal {
     width: 760px;
     margin: 0em 0em 0em 0em;
@@ -546,31 +571,31 @@
 .ui.large.modal > .header {
   font-size: 1.6em;
 }
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.large.modal {
     width: 95%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: $tablet-breakpoint) {
   .ui.large.modal {
     width: 88%;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: $computer-breakpoint) {
   .ui.large.modal {
     width: 1020px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1200px) {
+@media only screen and (min-width: $large-monitor-breakpoint) {
   .ui.large.modal {
     width: 1080px;
     margin: 0em 0em 0em 0em;
   }
 }
-@media only screen and (min-width: 1920px) {
+@media only screen and (min-width: $widescreen-monitor-breakpoint) {
   .ui.large.modal {
     width: 1140px;
     margin: 0em 0em 0em 0em;

data/app/assets/stylesheets/semantic-ui/modules/_nag.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Nag
+ * # Semantic UI 2.4.2 - Nag
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_popup.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Popup
+ * # Semantic UI 2.4.2 - Popup
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -669,7 +669,7 @@
 .ui[class*="very wide"].popup {
   max-width: 550px;
 }
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.wide.popup,
   .ui[class*="very wide"].popup {
     max-width: 250px;

data/app/assets/stylesheets/semantic-ui/modules/_progress.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Progress Bar
+ * # Semantic UI 2.4.2 - Progress Bar
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_rating.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Rating
+ * # Semantic UI 2.4.2 - Rating
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_search.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Search
+ * # Semantic UI 2.4.2 - Search
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -61,6 +61,8 @@
   -webkit-transform-origin: center top;
           transform-origin: center top;
   white-space: normal;
+  text-align: left;
+  text-transform: none;
   background: #FFFFFF;
   margin-top: 0.5em;
   width: 18em;
@@ -424,7 +426,7 @@
       Mobile
 ---------------*/
 
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.search .results {
     max-width: calc(100vw - 2rem);
   }

data/app/assets/stylesheets/semantic-ui/modules/_shape.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Shape
+ * # Semantic UI 2.4.2 - Shape
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Sidebar
+ * # Semantic UI 2.4.2 - Sidebar
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Sticky
+ * # Semantic UI 2.4.2 - Sticky
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_tab.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Tab
+ * # Semantic UI 2.4.2 - Tab
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/modules/_transition.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Transition
+ * # Semantic UI 2.4.2 - Transition
  * http://github.com/semantic-org/semantic-ui/
  *
  *

data/app/assets/stylesheets/semantic-ui/views/_ad.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Ad
+ * # Semantic UI 2.4.2 - Ad
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -223,7 +223,7 @@
 .ui.mobile.ad {
   display: none;
 }
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.mobile.ad {
     display: block;
   }

data/app/assets/stylesheets/semantic-ui/views/_card.scss

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.3.1 - Item
+ * # Semantic UI 2.4.2 - Item
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -787,7 +787,7 @@ a.ui.card:hover,
 
 
 /* Mobile Only */
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.two.doubling.cards {
     margin-left: 0em;
     margin-right: 0em;
@@ -872,7 +872,7 @@ a.ui.card:hover,
 }
 
 /* Tablet Only */
-@media only screen and (min-width: 768px) and (max-width: 991px) {
+@media only screen and (min-width: $tablet-breakpoint) and (max-width: $largest-tablet-screen) {
   .ui.two.doubling.cards {
     margin-left: 0em;
     margin-right: 0em;
@@ -960,7 +960,7 @@ a.ui.card:hover,
       Stackable
 --------------------*/
 
-@media only screen and (max-width: 767px) {
+@media only screen and (max-width: $largest-mobile-screen) {
   .ui.stackable.cards {
     display: block !important;
   }