@rio-cloud/rio-uikit 0.16.0-beta-3 → 0.16.1-beta-1

package/lib/style/css/design/responsive/flexgrid.less

@@ -8,30 +8,30 @@
 .flex-nowrap@{suffix} { flex-wrap: nowrap !important }
 .flex-wrap-reverse@{suffix} { flex-wrap: wrap-reverse !important }
 
-.justify-content-start@{suffix} { justify-content: flex-start !important }
-.justify-content-end@{suffix} { justify-content: flex-end !important }
-.justify-content-center@{suffix} { justify-content: center !important }
-.justify-content-between@{suffix} { justify-content: space-between !important }
 .justify-content-around@{suffix} { justify-content: space-around !important }
+.justify-content-between@{suffix} { justify-content: space-between !important }
+.justify-content-center@{suffix} { justify-content: center !important }
+.justify-content-end@{suffix} { justify-content: flex-end !important }
+.justify-content-start@{suffix} { justify-content: flex-start !important }
 
-.align-items-start@{suffix} { align-items: flex-start !important }
-.align-items-end@{suffix} { align-items: flex-end !important }
-.align-items-center@{suffix} { align-items: center !important }
 .align-items-baseline@{suffix} { align-items: baseline !important }
+.align-items-center@{suffix} { align-items: center !important }
+.align-items-end@{suffix} { align-items: flex-end !important }
+.align-items-start@{suffix} { align-items: flex-start !important }
 .align-items-stretch@{suffix} { align-items: stretch !important }
 
-.align-content-start@{suffix} { align-content: flex-start !important }
-.align-content-end@{suffix} { align-content: flex-end !important }
-.align-content-center@{suffix} { align-content: center !important }
-.align-content-between@{suffix} { align-content: space-between !important }
 .align-content-around@{suffix} { align-content: space-around !important }
+.align-content-between@{suffix} { align-content: space-between !important }
+.align-content-center@{suffix} { align-content: center !important }
+.align-content-end@{suffix} { align-content: flex-end !important }
+.align-content-start@{suffix} { align-content: flex-start !important }
 .align-content-stretch@{suffix} { align-content: stretch !important }
 
 .align-self-auto@{suffix} { align-self: auto !important }
-.align-self-start@{suffix} { align-self: flex-start !important }
-.align-self-end@{suffix} { align-self: flex-end !important }
-.align-self-center@{suffix} { align-self: center !important }
 .align-self-baseline@{suffix} { align-self: baseline !important }
+.align-self-center@{suffix} { align-self: center !important }
+.align-self-end@{suffix} { align-self: flex-end !important }
+.align-self-start@{suffix} { align-self: flex-start !important }
 .align-self-stretch@{suffix} { align-self: stretch !important }
 
 /* Flexbox - Helper */

package/lib/style/css/design/responsive/position.less

@@ -6,14 +6,15 @@
 .position-sticky@{suffix} {
   position: sticky !important;
 
-  &.top-module-content {
-    @media (max-width: @screen-xs-max) {
-      top: -(@ApplicationLayoutBodyPadding*0.5);
-    }
-    @media (min-width: @screen-ls-min) {
-      top: -(@ApplicationLayoutBodyPadding);
-    }
-  }
+  // &.top-module-content {
+  //   @media (max-width: @screen-xs-max) {
+  //     top: -(@ApplicationLayoutBodyPadding*0.5);
+  //   }
+
+  //   @media (min-width: @screen-ls-min) {
+  //     top: -(@ApplicationLayoutBodyPadding);
+  //   }
+  // }
 }
 
 .top-0@{suffix} { top: 0 !important }

package/lib/style/css/design/responsive/sizing.less

@@ -94,22 +94,3 @@ each(@sizes-vw, {
 .sizing-vh(height; @suffix);
 .sizing-vh(min-height; @suffix);
 .sizing-vh(max-height; @suffix);
-
-// ApplicationLayout viewport height
-.ApplicationLayoutHeader@{suffix} {
-  ~ .ApplicationLayoutBody,
-  ~ .ApplicationLayoutSidebar {
-    .sizing-vh(height; @suffix; @navbar-height);
-    .sizing-vh(min-height; @suffix; @navbar-height);
-  }
-
-  ~ .ApplicationLayoutBody .module-content {
-    @media (max-width: @screen-ls) {
-      .sizing-vh(height; @suffix; @navbar-height + @ApplicationLayoutBodyPadding*0.5);
-    }
-
-    @media (min-width: @screen-ls) {
-      .sizing-vh(height; @suffix; @navbar-height + @ApplicationLayoutBodyPadding);
-    }
-  }
-}

package/lib/style/css/design/sizing.less

@@ -0,0 +1,18 @@
+// ApplicationLayout viewport height
+.ApplicationLayoutHeader {
+  ~ .ApplicationLayoutBody,
+  ~ .ApplicationLayoutSidebar {
+    .sizing-vh(height; ~''; @navbar-height);
+    .sizing-vh(min-height; ~''; @navbar-height);
+  }
+
+  ~ .ApplicationLayoutBody .module-content {
+    @media (max-width: @screen-xs) {
+      .sizing-vh(height; ~''; @navbar-height + @ApplicationLayoutBodyPadding*0.5);
+    }
+
+    @media (min-width: @screen-xs) {
+      .sizing-vh(height; ~''; @navbar-height + @ApplicationLayoutBodyPadding);
+    }
+  }
+}

package/lib/style/css/design/visibility.less

@@ -0,0 +1,186 @@
+.show {
+  display: block !important;
+  opacity: 1;
+}
+
+.invisible {
+  visibility: hidden;
+}
+
+.hidden, .hide {
+  display: none !important;
+}
+
+html .hidden-empty:empty {
+  display: none !important;
+}
+
+.hidden-print {
+  @media print {
+    display: none !important;
+  }
+}
+
+.visible-print {
+  display: none !important;
+
+  @media print {
+    display: block !important;
+  }
+
+  &-inline {
+    display: none !important;
+
+    @media print {
+      display: inline !important;
+    }
+  }
+}
+
+// visible only
+
+@media (min-width: @screen-ls-min) {
+  .visible-xs {
+    // "-ls" because UIKIT xs and UIKIT ls are the same
+    // but the website.css uses -ls as the mobile breakpoint
+    display: none !important;
+  }
+}
+
+.visible-ls {
+  @media (max-width: @screen-xs-max) {
+    display: none !important;
+  }
+
+  @media (min-width: @screen-sm-min) {
+    display: none !important;
+  }
+}
+
+.visible-sm {
+  @media (max-width: @screen-ls-max) {
+    display: none !important;
+  }
+
+  @media (min-width: @screen-md-min) {
+    display: none !important;
+  }
+}
+
+.visible-md {
+  @media (max-width: @screen-sm-max) {
+    display: none !important;
+  }
+
+  @media (min-width: @screen-lg-min) {
+    display: none !important;
+  }
+}
+
+.visible-lg {
+  @media (max-width: @screen-md-max) {
+    display: none !important;
+  }
+
+  @media (min-width: @screen-xl-min) {
+    display: none !important;
+  }
+}
+
+.visible-xl {
+  @media (max-width: @screen-xl-min) {
+    display: none !important;
+  }
+}
+
+// hidden only
+
+.hidden-xs {
+  // "-ls" because UIKIT xs and UIKIT ls are the same
+  // but the website.css uses -ls as the mobile breakpoint
+  @media (max-width: @screen-ls) {
+    display: none !important;
+  }
+}
+
+.hidden-ls {
+  @media (min-width: @screen-ls-min) and (max-width: @screen-ls-max) {
+    display: none !important;
+  }
+}
+
+.hidden-sm {
+  @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
+    display: none !important;
+  }
+}
+
+.hidden-md {
+  @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
+    display: none !important;
+  }
+}
+
+.hidden-lg {
+  @media (min-width: @screen-lg-min) and (max-width: @screen-lg-max) {
+    display: none !important;
+  }
+}
+
+.hidden-xl {
+  @media (min-width: @screen-xl) {
+    display: none !important;
+  }
+}
+
+// visible from
+
+.visible-min-ls {
+  @media (max-width: @screen-sm-min) {
+    display: none !important;
+  }
+}
+
+.visible-min-sm {
+  @media (max-width: @screen-md-min) {
+    display: none !important;
+  }
+}
+
+.visible-min-md {
+  @media (max-width: @screen-lg-min) {
+    display: none !important;
+  }
+}
+
+.visible-min-lg {
+  @media (max-width: @screen-xl-min) {
+    display: none !important;
+  }
+}
+
+// hidden from
+
+.hidden-min-ls {
+  @media (min-width: @screen-ls-min) {
+    display: none !important;
+  }
+}
+
+.hidden-min-sm {
+  @media (min-width: @screen-sm-min) {
+    display: none !important;
+  }
+}
+
+.hidden-min-md {
+  @media (min-width: @screen-md-min) {
+    display: none !important;
+  }
+}
+
+.hidden-min-lg {
+  @media (min-width: @screen-lg-min) {
+    display: none !important;
+  }
+}

package/lib/style/css/filter/_imports.less

@@ -0,0 +1 @@
+@import (less) "blur.less";

package/lib/style/css/filter/blur.less

@@ -0,0 +1,17 @@
+.blur {
+    &-0 { filter: blur(0) }
+    &-1 { filter: blur(1px) }
+    &-2 { filter: blur(2px) }
+    &-3 { filter: blur(3px) }
+    &-4 { filter: blur(4px) }
+    &-5 { filter: blur(5px) }
+    &-6 { filter: blur(6px) }
+    &-7 { filter: blur(7px) }
+    &-8 { filter: blur(8px) }
+    &-9 { filter: blur(9px) }
+    &-10 { filter: blur(10px) }
+    &-20 { filter: blur(20px) }
+    &-30 { filter: blur(30px) }
+    &-40 { filter: blur(40px) }
+    &-50 { filter: blur(50px) }
+}

package/lib/style/fonts/rioglyph/rioglyph.less

@@ -2,7 +2,7 @@
 
 @font-face {
 	font-family: "rioglyph";
-	src: url("rioglyph.woff?14b6680c6235c42a26bca0913e1eea27") format("woff");
+	src: url("rioglyph.woff?e23ee3a7ff7e24c90f6028227ebcb825") format("woff");
     font-weight: normal;
     font-style: normal;
 }
@@ -274,6 +274,11 @@
 .hover-rioglyph-cog:hover:before {
 	content: "\e96c";
 }
+@rioglyph-color-swatch: "\f18e";
+.rioglyph-color-swatch:before,
+.hover-rioglyph-color-swatch:hover:before {
+	content: "\f18e";
+}
 @rioglyph-comment: "\e111";
 .rioglyph-comment:before,
 .hover-rioglyph-comment:hover:before {
@@ -329,6 +334,11 @@
 .hover-rioglyph-csv:hover:before {
 	content: "\f155";
 }
+@rioglyph-currency-euro: "\f18f";
+.rioglyph-currency-euro:before,
+.hover-rioglyph-currency-euro:hover:before {
+	content: "\f18f";
+}
 @rioglyph-damages: "\f12a";
 .rioglyph-damages:before,
 .hover-rioglyph-damages:hover:before {