uikit 3.8.1-dev.3a43322ca → 3.9.1

package/src/less/components/margin.less

@@ -198,12 +198,12 @@
  .uk-margin-remove-bottom { margin-bottom: 0 !important; }
  .uk-margin-remove-left { margin-left: 0 !important; }
  .uk-margin-remove-right { margin-right: 0 !important; }
- 
+
  .uk-margin-remove-vertical {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
  }
- 
+
  .uk-margin-remove-adjacent + *,
  .uk-margin-remove-first-child > :first-child { margin-top: 0 !important; }
  .uk-margin-remove-last-child > :last-child { margin-bottom: 0 !important; }
@@ -245,6 +245,6 @@
 // Hooks
 // ========================================================================
 
-.hook-margin-misc;
+.hook-margin-misc();
 
 .hook-margin-misc() {}

package/src/less/components/marker.less

@@ -28,20 +28,20 @@
     padding: @marker-padding;
     background: @marker-background;
     color: @marker-color;
-    .hook-marker;
+    .hook-marker();
 }
 
 /* Hover */
 .uk-marker:hover {
     color: @marker-hover-color;
-    .hook-marker-hover;
+    .hook-marker-hover();
 }
 
 
 // Hooks
 // ========================================================================
 
-.hook-marker-misc;
+.hook-marker-misc();
 
 .hook-marker() {}
 .hook-marker-hover() {}
@@ -60,12 +60,12 @@
     .uk-marker {
         background: @inverse-marker-background;
         color: @inverse-marker-color;
-        .hook-inverse-marker;
+        .hook-inverse-marker();
     }
 
     .uk-marker:hover {
         color: @inverse-marker-hover-color;
-        .hook-inverse-marker-hover;
+        .hook-inverse-marker-hover();
     }
 
 }

package/src/less/components/modal.less

@@ -96,7 +96,7 @@
     /* 6 */
     opacity: 0;
     transition: opacity 0.15s linear;
-    .hook-modal;
+    .hook-modal();
 }
 
 /* Phone landscape and bigger */
@@ -161,7 +161,7 @@
     transform: translateY(-100px);
     transition: 0.3s linear;
     transition-property: opacity, transform;
-    .hook-modal-dialog;
+    .hook-modal-dialog();
 }
 
 /*
@@ -202,7 +202,7 @@
     width: 100%;
     max-width: 100%;
     transform: translateY(0);
-    .hook-modal-full;
+    .hook-modal-full();
 }
 
 
@@ -212,21 +212,21 @@
 .uk-modal-body {
     display: flow-root;
     padding: @modal-body-padding-vertical @modal-body-padding-horizontal;
-    .hook-modal-body;
+    .hook-modal-body();
 }
 
 .uk-modal-header {
     display: flow-root;
     padding: @modal-header-padding-vertical @modal-header-padding-horizontal;
     background: @modal-header-background;
-    .hook-modal-header;
+    .hook-modal-header();
 }
 
 .uk-modal-footer {
     display: flow-root;
     padding: @modal-footer-padding-vertical @modal-footer-padding-horizontal;
     background: @modal-footer-background;
-    .hook-modal-footer;
+    .hook-modal-footer();
 }
 
 /*
@@ -244,7 +244,7 @@
 .uk-modal-title {
     font-size: @modal-title-font-size;
     line-height: @modal-title-line-height;
-    .hook-modal-title;
+    .hook-modal-title();
 }
 
 
@@ -258,7 +258,7 @@
     top: @modal-close-position;
     right: @modal-close-position;
     padding: @modal-close-padding;
-    .hook-modal-close;
+    .hook-modal-close();
 }
 
 /*
@@ -272,7 +272,7 @@
  */
 
 [class*='uk-modal-close-']:hover {
-    .hook-modal-close-hover;
+    .hook-modal-close-hover();
 }
 
 /*
@@ -280,11 +280,11 @@
  */
 
 .uk-modal-close-default {
-    .hook-modal-close-default;
+    .hook-modal-close-default();
 }
 
 .uk-modal-close-default:hover {
-    .hook-modal-close-default-hover;
+    .hook-modal-close-default-hover();
 }
 
 /*
@@ -298,12 +298,12 @@
     right: -@modal-close-padding;
     transform: translate(0, -(@modal-close-outside-translate));
     color: @modal-close-outside-color;
-    .hook-modal-close-outside;
+    .hook-modal-close-outside();
 }
 
 .uk-modal-close-outside:hover {
     color: @modal-close-outside-hover-color;
-    .hook-modal-close-outside-hover;
+    .hook-modal-close-outside-hover();
 }
 
 /* Tablet landscape and bigger */
@@ -322,18 +322,18 @@
  */
 
 .uk-modal-close-full {
-    .hook-modal-close-full;
+    .hook-modal-close-full();
 }
 
 .uk-modal-close-full:hover {
-    .hook-modal-close-full-hover;
+    .hook-modal-close-full-hover();
 }
 
 
 // Hooks
 // ========================================================================
 
-.hook-modal-misc;
+.hook-modal-misc();
 
 .hook-modal() {}
 .hook-modal-dialog() {}

package/src/less/components/nav.less

@@ -128,7 +128,7 @@
 
 ul.uk-nav-sub {
     padding: @nav-sublist-padding-vertical 0 @nav-sublist-padding-vertical @nav-sublist-padding-left;
-    .hook-nav-sub;
+    .hook-nav-sub();
 }
 
 /*
@@ -155,7 +155,7 @@ ul.uk-nav-sub {
     .svg-fill(@internal-nav-parent-close-image, "#000", @nav-parent-icon-color);
     background-repeat: no-repeat;
     background-position: 50% 50%;
-    .hook-nav-parent-icon;
+    .hook-nav-parent-icon();
 }
 
 .uk-nav-parent-icon > .uk-parent.uk-open > a::after { .svg-fill(@internal-nav-parent-open-image, "#000", @nav-parent-icon-color); }
@@ -168,7 +168,7 @@ ul.uk-nav-sub {
     padding: @nav-header-padding-vertical @nav-header-padding-horizontal;
     text-transform: @nav-header-text-transform;
     font-size: @nav-header-font-size;
-    .hook-nav-header;
+    .hook-nav-header();
 }
 
 .uk-nav-header:not(:first-child) { margin-top: @nav-header-margin-top; }
@@ -179,7 +179,7 @@ ul.uk-nav-sub {
 
 .uk-nav >.uk-nav-divider {
     margin: @nav-divider-margin-vertical @nav-divider-margin-horizontal;
-    .hook-nav-divider;
+    .hook-nav-divider();
 }
 
 
@@ -187,7 +187,7 @@ ul.uk-nav-sub {
  ========================================================================== */
 
 .uk-nav-default {
-    .hook-nav-default;
+    .hook-nav-default();
 }
 
 /*
@@ -196,19 +196,19 @@ ul.uk-nav-sub {
 
 .uk-nav-default > li > a {
     color: @nav-default-item-color;
-    .hook-nav-default-item;
+    .hook-nav-default-item();
 }
 
 /* Hover */
 .uk-nav-default > li > a:hover {
     color: @nav-default-item-hover-color;
-    .hook-nav-default-item-hover;
+    .hook-nav-default-item-hover();
 }
 
 /* Active */
 .uk-nav-default > li.uk-active > a {
     color: @nav-default-item-active-color;
-    .hook-nav-default-item-active;
+    .hook-nav-default-item-active();
 }
 
 /*
@@ -217,7 +217,7 @@ ul.uk-nav-sub {
 
 .uk-nav-default .uk-nav-header {
     color: @nav-default-header-color;
-    .hook-nav-default-header;
+    .hook-nav-default-header();
 }
 
 /*
@@ -226,7 +226,7 @@ ul.uk-nav-sub {
 
 .uk-nav-default .uk-nav-divider {
     border-top: @nav-default-divider-border-width solid @nav-default-divider-border;
-    .hook-nav-default-divider;
+    .hook-nav-default-divider();
 }
 
 /*
@@ -244,7 +244,7 @@ ul.uk-nav-sub {
  ========================================================================== */
 
 .uk-nav-primary {
-    .hook-nav-primary;
+    .hook-nav-primary();
 }
 
 /*
@@ -255,19 +255,19 @@ ul.uk-nav-sub {
     font-size: @nav-primary-item-font-size;
     line-height: @nav-primary-item-line-height;
     color: @nav-primary-item-color;
-    .hook-nav-primary-item;
+    .hook-nav-primary-item();
 }
 
 /* Hover */
 .uk-nav-primary > li > a:hover {
     color: @nav-primary-item-hover-color;
-    .hook-nav-primary-item-hover;
+    .hook-nav-primary-item-hover();
 }
 
 /* Active */
 .uk-nav-primary > li.uk-active > a {
     color: @nav-primary-item-active-color;
-    .hook-nav-primary-item-active;
+    .hook-nav-primary-item-active();
 }
 
 /*
@@ -276,7 +276,7 @@ ul.uk-nav-sub {
 
 .uk-nav-primary .uk-nav-header {
     color: @nav-primary-header-color;
-    .hook-nav-primary-header;
+    .hook-nav-primary-header();
 }
 
 /*
@@ -285,7 +285,7 @@ ul.uk-nav-sub {
 
 .uk-nav-primary .uk-nav-divider {
     border-top: @nav-primary-divider-border-width solid @nav-primary-divider-border;
-    .hook-nav-primary-divider;
+    .hook-nav-primary-divider();
 }
 
 /*
@@ -327,14 +327,14 @@ ul.uk-nav-sub {
     margin-top: @nav-dividers-margin-top;
     padding-top: @nav-dividers-margin-top;
     border-top: @nav-dividers-border-width solid @nav-dividers-border;
-    .hook-nav-dividers;
+    .hook-nav-dividers();
 }
 
 
 // Hooks
 // ========================================================================
 
-.hook-nav-misc;
+.hook-nav-misc();
 
 .hook-nav-sub() {}
 .hook-nav-parent-icon() {}
@@ -388,7 +388,7 @@ ul.uk-nav-sub {
 
     .uk-nav-parent-icon > .uk-parent > a::after {
         .svg-fill(@internal-nav-parent-close-image, "#000", @inverse-nav-parent-icon-color);
-        .hook-inverse-nav-parent-icon;
+        .hook-inverse-nav-parent-icon();
     }
 
     .uk-nav-parent-icon > .uk-parent.uk-open > a::after { .svg-fill(@internal-nav-parent-open-image, "#000", @inverse-nav-parent-icon-color); }
@@ -399,27 +399,27 @@ ul.uk-nav-sub {
 
     .uk-nav-default > li > a {
         color: @inverse-nav-default-item-color;
-        .hook-inverse-nav-default-item;
+        .hook-inverse-nav-default-item();
     }
 
     .uk-nav-default > li > a:hover {
         color: @inverse-nav-default-item-hover-color;
-        .hook-inverse-nav-default-item-hover;
+        .hook-inverse-nav-default-item-hover();
     }
 
     .uk-nav-default > li.uk-active > a {
         color: @inverse-nav-default-item-active-color;
-        .hook-inverse-nav-default-item-active;
+        .hook-inverse-nav-default-item-active();
     }
 
     .uk-nav-default .uk-nav-header {
         color: @inverse-nav-default-header-color;
-        .hook-inverse-nav-default-header;
+        .hook-inverse-nav-default-header();
     }
 
     .uk-nav-default .uk-nav-divider {
         border-top-color: @inverse-nav-default-divider-border;
-        .hook-inverse-nav-default-divider;
+        .hook-inverse-nav-default-divider();
     }
 
     .uk-nav-default .uk-nav-sub a { color: @inverse-nav-default-sublist-item-color; }
@@ -434,27 +434,27 @@ ul.uk-nav-sub {
 
     .uk-nav-primary > li > a {
         color: @inverse-nav-primary-item-color;
-        .hook-inverse-nav-primary-item;
+        .hook-inverse-nav-primary-item();
     }
 
     .uk-nav-primary > li > a:hover {
         color: @inverse-nav-primary-item-hover-color;
-        .hook-inverse-nav-primary-item-hover;
+        .hook-inverse-nav-primary-item-hover();
     }
 
     .uk-nav-primary > li.uk-active > a {
         color: @inverse-nav-primary-item-active-color;
-        .hook-inverse-nav-primary-item-active;
+        .hook-inverse-nav-primary-item-active();
     }
 
     .uk-nav-primary .uk-nav-header {
         color: @inverse-nav-primary-header-color;
-        .hook-inverse-nav-primary-header;
+        .hook-inverse-nav-primary-header();
     }
 
     .uk-nav-primary .uk-nav-divider {
         border-top-color: @inverse-nav-primary-divider-border;
-        .hook-inverse-nav-primary-divider;
+        .hook-inverse-nav-primary-divider();
     }
 
     .uk-nav-primary .uk-nav-sub a { color: @inverse-nav-primary-sublist-item-color; }
@@ -469,7 +469,7 @@ ul.uk-nav-sub {
 
     .uk-nav.uk-nav-divider > :not(.uk-nav-divider) + :not(.uk-nav-header, .uk-nav-divider) {
         border-top-color: @inverse-nav-dividers-border;
-        .hook-nav-dividers;
+        .hook-nav-dividers();
     }
 
 }
@@ -485,4 +485,4 @@ ul.uk-nav-sub {
 .hook-inverse-nav-primary-item-active() {}
 .hook-inverse-nav-primary-header() {}
 .hook-inverse-nav-primary-divider() {}
-.hook-inverse-nav-dividers() {}
+.hook-inverse-nav-dividers() {}

package/src/less/components/navbar.less

@@ -93,7 +93,7 @@
     display: flex;
     /* 1 */
     position: relative;
-    .hook-navbar;
+    .hook-navbar();
 }
 
 
@@ -102,7 +102,7 @@
 
 .uk-navbar-container:not(.uk-navbar-transparent) {
     background: @navbar-background;
-    .hook-navbar-container;
+    .hook-navbar-container();
 }
 
 // Color Mode
@@ -241,7 +241,7 @@
 
 .uk-navbar-nav > li > a {
     color: @navbar-nav-item-color;
-    .hook-navbar-nav-item;
+    .hook-navbar-nav-item();
 }
 
 /*
@@ -252,19 +252,19 @@
 .uk-navbar-nav > li:hover > a,
 .uk-navbar-nav > li > a[aria-expanded="true"] {
     color: @navbar-nav-item-hover-color;
-    .hook-navbar-nav-item-hover;
+    .hook-navbar-nav-item-hover();
 }
 
 /* OnClick */
 .uk-navbar-nav > li > a:active {
     color: @navbar-nav-item-onclick-color;
-    .hook-navbar-nav-item-onclick;
+    .hook-navbar-nav-item-onclick();
 }
 
 /* Active */
 .uk-navbar-nav > li.uk-active > a {
     color: @navbar-nav-item-active-color;
-    .hook-navbar-nav-item-active;
+    .hook-navbar-nav-item-active();
 }
 
 
@@ -273,7 +273,7 @@
 
 .uk-navbar-item {
     color: @navbar-item-color;
-    .hook-navbar-item;
+    .hook-navbar-item();
 }
 
 /*
@@ -288,14 +288,14 @@
 
 .uk-navbar-toggle {
     color: @navbar-toggle-color;
-    .hook-navbar-toggle;
+    .hook-navbar-toggle();
 }
 
 .uk-navbar-toggle:hover,
 .uk-navbar-toggle[aria-expanded="true"] {
     color: @navbar-toggle-hover-color;
     text-decoration: none;
-    .hook-navbar-toggle-hover;
+    .hook-navbar-toggle-hover();
 }
 
 /*
@@ -304,12 +304,12 @@
  */
 
 .uk-navbar-toggle-icon {
-    .hook-navbar-toggle-icon;
+    .hook-navbar-toggle-icon();
 }
 
 /* Hover */
 :hover > .uk-navbar-toggle-icon {
-    .hook-navbar-toggle-icon-hover;
+    .hook-navbar-toggle-icon-hover();
 }
 
 
@@ -318,7 +318,7 @@
 
 .uk-navbar-subtitle {
     font-size: @navbar-subtitle-font-size;
-    .hook-navbar-subtitle;
+    .hook-navbar-subtitle();
 }
 
 
@@ -326,15 +326,15 @@
  ========================================================================== */
 
 .uk-navbar-primary {
-    .hook-navbar-primary;
+    .hook-navbar-primary();
 }
 
 .uk-navbar-transparent {
-    .hook-navbar-transparent;
+    .hook-navbar-transparent();
 }
 
 .uk-navbar-sticky {
-    .hook-navbar-sticky;
+    .hook-navbar-sticky();
 }
 
 
@@ -362,7 +362,7 @@
     padding: @navbar-dropdown-padding;
     background: @navbar-dropdown-background;
     color: @navbar-dropdown-color;
-    .hook-navbar-dropdown;
+    .hook-navbar-dropdown();
 }
 
 /* Show */
@@ -409,7 +409,7 @@
 .uk-navbar-dropdown-dropbar {
     margin-top: @navbar-dropdown-dropbar-margin-top;
     margin-bottom: @navbar-dropdown-dropbar-margin-bottom;
-    .hook-navbar-dropdown-dropbar;
+    .hook-navbar-dropdown-dropbar();
 }
 
 
@@ -418,7 +418,7 @@
  ========================================================================== */
 
 .uk-navbar-dropdown-nav {
-    .hook-navbar-dropdown-nav;
+    .hook-navbar-dropdown-nav();
 }
 
 /*
@@ -427,19 +427,19 @@
 
 .uk-navbar-dropdown-nav > li > a {
     color: @navbar-dropdown-nav-item-color;
-    .hook-navbar-dropdown-nav-item;
+    .hook-navbar-dropdown-nav-item();
 }
 
 /* Hover */
 .uk-navbar-dropdown-nav > li > a:hover {
     color: @navbar-dropdown-nav-item-hover-color;
-    .hook-navbar-dropdown-nav-item-hover;
+    .hook-navbar-dropdown-nav-item-hover();
 }
 
 /* Active */
 .uk-navbar-dropdown-nav > li.uk-active > a {
     color: @navbar-dropdown-nav-item-active-color;
-    .hook-navbar-dropdown-nav-item-active;
+    .hook-navbar-dropdown-nav-item-active();
 }
 
 /*
@@ -448,7 +448,7 @@
 
 .uk-navbar-dropdown-nav .uk-nav-header {
     color: @navbar-dropdown-nav-header-color;
-    .hook-navbar-dropdown-nav-header;
+    .hook-navbar-dropdown-nav-header();
 }
 
 /*
@@ -457,7 +457,7 @@
 
 .uk-navbar-dropdown-nav .uk-nav-divider {
     border-top: @navbar-dropdown-nav-divider-border-width solid @navbar-dropdown-nav-divider-border;
-    .hook-navbar-dropdown-nav-divider;
+    .hook-navbar-dropdown-nav-divider();
 }
 
 /*
@@ -476,7 +476,7 @@
 
 .uk-navbar-dropbar {
     background: @navbar-dropbar-background;
-    .hook-navbar-dropbar;
+    .hook-navbar-dropbar();
 }
 
 /*
@@ -488,14 +488,14 @@
     z-index: @navbar-dropbar-z-index;
     left: 0;
     right: 0;
-    .hook-navbar-dropbar-slide;
+    .hook-navbar-dropbar-slide();
 }
 
 
 // Hooks
 // ========================================================================
 
-.hook-navbar-misc;
+.hook-navbar-misc();
 
 .hook-navbar() {}
 .hook-navbar-container() {}
@@ -540,39 +540,39 @@
 
     .uk-navbar-nav > li > a {
         color: @inverse-navbar-nav-item-color;
-        .hook-inverse-navbar-nav-item;
+        .hook-inverse-navbar-nav-item();
     }
 
     .uk-navbar-nav > li:hover > a,
     .uk-navbar-nav > li > a[aria-expanded="true"] {
         color: @inverse-navbar-nav-item-hover-color;
-        .hook-inverse-navbar-nav-item-hover;
+        .hook-inverse-navbar-nav-item-hover();
     }
 
     .uk-navbar-nav > li > a:active {
         color: @inverse-navbar-nav-item-onclick-color;
-        .hook-inverse-navbar-nav-item-onclick;
+        .hook-inverse-navbar-nav-item-onclick();
     }
 
     .uk-navbar-nav > li.uk-active > a {
         color: @inverse-navbar-nav-item-active-color;
-        .hook-inverse-navbar-nav-item-active;
+        .hook-inverse-navbar-nav-item-active();
     }
 
     .uk-navbar-item {
         color: @inverse-navbar-item-color;
-        .hook-inverse-navbar-item;
+        .hook-inverse-navbar-item();
     }
 
     .uk-navbar-toggle {
         color: @inverse-navbar-toggle-color;
-        .hook-inverse-navbar-toggle;
+        .hook-inverse-navbar-toggle();
     }
 
     .uk-navbar-toggle:hover,
     .uk-navbar-toggle[aria-expanded="true"] {
         color: @inverse-navbar-toggle-hover-color;
-        .hook-inverse-navbar-toggle-hover;
+        .hook-inverse-navbar-toggle-hover();
     }
 
 }