updates

client/uikit/src/less/theme/_import.less

@@ -0,0 +1,81 @@
+// Base
+@import "variables.less";
+@import "base.less";
+
+// Elements
+@import "link.less";
+@import "heading.less";
+@import "divider.less";
+@import "list.less";
+@import "description-list.less";
+@import "table.less";
+@import "icon.less";
+@import "form-range.less";
+@import "form.less";
+@import "button.less";
+@import "progress.less";
+
+// Layout
+@import "section.less";
+@import "container.less";
+@import "tile.less";
+@import "card.less";
+
+// Common
+@import "close.less";
+@import "spinner.less";
+@import "marker.less";
+@import "totop.less";
+@import "alert.less";
+@import "placeholder.less";
+@import "badge.less";
+@import "label.less";
+@import "overlay.less";
+@import "article.less";
+@import "comment.less";
+@import "search.less";
+
+// JavaScript
+@import "accordion.less";
+@import "drop.less";
+@import "dropdown.less";
+@import "modal.less";
+@import "slider.less";
+@import "sticky.less";
+@import "offcanvas.less";
+@import "leader.less";
+@import "notification.less";
+@import "tooltip.less";
+@import "sortable.less";
+@import "countdown.less";
+
+@import "grid.less";
+
+// Navs
+@import "nav.less";
+@import "navbar.less";
+@import "subnav.less";
+@import "breadcrumb.less";
+@import "pagination.less";
+@import "tab.less";
+@import "slidenav.less";
+@import "dotnav.less";
+@import "thumbnav.less";
+@import "iconnav.less";
+
+@import "lightbox.less";
+
+// Utilities
+@import "animation.less";
+@import "width.less";
+@import "height.less";
+@import "text.less";
+@import "column.less";
+@import "background.less";
+@import "align.less";
+@import "utility.less";
+@import "margin.less";
+@import "padding.less";
+@import "position.less";
+@import "transition.less";
+@import "inverse.less";

client/uikit/src/less/theme/accordion.less

@@ -0,0 +1,82 @@
+//
+// Component: Accordion
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@accordion-icon-margin-left:                   10px;
+@accordion-icon-color:                         @global-color;
+@internal-accordion-open-image:                "../../images/backgrounds/accordion-open.svg";
+@internal-accordion-close-image:               "../../images/backgrounds/accordion-close.svg";
+
+
+// Component
+// ========================================================================
+
+.hook-accordion() {}
+
+
+// Item
+// ========================================================================
+
+.hook-accordion-item() {}
+
+
+// Title
+// ========================================================================
+
+.hook-accordion-title() {
+
+    overflow: hidden;
+
+    &::before {
+        content: "";
+        width: (@accordion-title-line-height * 1em);
+        height: (@accordion-title-line-height * 1em);
+        margin-left: @accordion-icon-margin-left;
+        float: right;
+        .svg-fill(@internal-accordion-close-image, "#000", @accordion-icon-color);
+        background-repeat: no-repeat;
+        background-position: 50% 50%;
+    }
+
+    .uk-open > &::before { .svg-fill(@internal-accordion-open-image, "#000", @accordion-icon-color); }
+
+}
+
+.hook-accordion-title-hover() {}
+
+
+// Content
+// ========================================================================
+
+.hook-accordion-content() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-accordion-misc() {}
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-accordion-item() {}
+
+.hook-inverse-accordion-title() {}
+.hook-inverse-accordion-title-hover() {}
+
+.hook-inverse() {
+
+    .uk-accordion-title::before { .svg-fill(@internal-accordion-close-image, "#000", @inverse-global-color); }
+
+    .uk-open > .uk-accordion-title::before { .svg-fill(@internal-accordion-open-image, "#000", @inverse-global-color); }
+
+}

client/uikit/src/less/theme/alert.less

@@ -0,0 +1,76 @@
+//
+// Component: Alert
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@alert-close-opacity:                           0.4;
+@alert-close-hover-opacity:                     0.8;
+
+
+// Component
+// ========================================================================
+
+.hook-alert() {}
+
+
+// Close
+// ========================================================================
+
+.hook-alert-close() {
+    color: inherit;
+    opacity: @alert-close-opacity;
+}
+
+.hook-alert-close-hover() {
+    color: inherit;
+    opacity: @alert-close-hover-opacity;
+}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-alert-primary() {}
+
+.hook-alert-success() {}
+
+.hook-alert-warning() {}
+
+.hook-alert-danger() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-alert-misc() {
+
+    /*
+     * Content
+     */
+
+    .uk-alert h1,
+    .uk-alert h2,
+    .uk-alert h3,
+    .uk-alert h4,
+    .uk-alert h5,
+    .uk-alert h6 { color: inherit; }
+
+    .uk-alert a:not([class]) {
+        color: inherit;
+        text-decoration: underline;
+    }
+
+    .uk-alert a:not([class]):hover {
+        color: inherit;
+        text-decoration: underline;
+    }
+
+}

client/uikit/src/less/theme/align.less

@@ -0,0 +1,14 @@
+//
+// Component: Align
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-align-misc() {}

client/uikit/src/less/theme/animation.less

@@ -0,0 +1,14 @@
+//
+// Component: Animation
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-animation-misc() {}

client/uikit/src/less/theme/article.less

@@ -0,0 +1,60 @@
+//
+// Component: Article
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@article-meta-link-color:                       @article-meta-color;
+@article-meta-link-hover-color:                 @global-color;
+
+
+// Component
+// ========================================================================
+
+.hook-article() {}
+
+
+// Adjacent sibling
+// ========================================================================
+
+.hook-article-adjacent() {}
+
+
+// Title
+// ========================================================================
+
+.hook-article-title() {}
+
+
+// Meta
+// ========================================================================
+
+.hook-article-meta() {
+
+    a { color: @article-meta-link-color; }
+
+    a:hover {
+        color: @article-meta-link-hover-color;
+        text-decoration: none;
+    }
+
+}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-article-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-article-meta() {}

client/uikit/src/less/theme/background.less

@@ -0,0 +1,14 @@
+//
+// Component: Background
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-background-misc() {}

client/uikit/src/less/theme/badge.less

@@ -0,0 +1,29 @@
+//
+// Component: Badge
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-badge() {}
+
+.hook-badge-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-badge-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-badge() {}
+.hook-inverse-badge-hover() {}

client/uikit/src/less/theme/base.less

@@ -0,0 +1,134 @@
+//
+// Component: Base
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@base-code-padding-horizontal:                  6px;
+@base-code-padding-vertical:                    2px;
+@base-code-background:                          @global-muted-background;
+
+@base-blockquote-color:                         @global-emphasis-color;
+
+@base-blockquote-footer-color:                  @global-color;
+
+@base-pre-padding:                              10px;
+@base-pre-background:                           @global-background;
+@base-pre-border-width:                         @global-border-width;
+@base-pre-border:                               @global-border;
+@base-pre-border-radius:                        3px;
+
+
+// Body
+// ========================================================================
+
+.hook-base-body() {}
+
+
+// Links
+// ========================================================================
+
+.hook-base-link() {}
+
+.hook-base-link-hover() {}
+
+
+// Text-level semantics
+// ========================================================================
+
+.hook-base-code() {
+    padding: @base-code-padding-vertical @base-code-padding-horizontal;
+    background: @base-code-background;
+}
+
+
+// Headings
+// ========================================================================
+
+.hook-base-heading() {}
+
+.hook-base-h1() {}
+
+.hook-base-h2() {}
+
+.hook-base-h3() {}
+
+.hook-base-h4() {}
+
+.hook-base-h5() {}
+
+.hook-base-h6() {}
+
+
+// Horizontal rules
+// ========================================================================
+
+.hook-base-hr() {}
+
+
+// Blockquotes
+// ========================================================================
+
+.hook-base-blockquote() {
+    color: @base-blockquote-color;
+}
+
+.hook-base-blockquote-footer() {
+
+    color: @base-blockquote-footer-color;
+
+    &::before { content: "— "; }
+
+}
+
+
+// Preformatted text
+// ========================================================================
+
+.hook-base-pre() {
+    padding: @base-pre-padding;
+    border: @base-pre-border-width solid @base-pre-border;
+    border-radius: @base-pre-border-radius;
+    background: @base-pre-background;
+}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-base-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+@inverse-base-blockquote-color:                @inverse-global-emphasis-color;
+@inverse-base-blockquote-footer-color:         @inverse-global-color;
+
+.hook-inverse-base-link() {}
+.hook-inverse-base-link-hover() {}
+
+.hook-inverse-base-code() {
+    background: @inverse-global-muted-background;
+}
+
+.hook-inverse-base-heading() {}
+
+.hook-inverse-base-h1() {}
+.hook-inverse-base-h2() {}
+.hook-inverse-base-h3() {}
+.hook-inverse-base-h4() {}
+.hook-inverse-base-h5() {}
+.hook-inverse-base-h6() {}
+
+.hook-inverse-base-blockquote() { color: @inverse-base-blockquote-color; }
+.hook-inverse-base-blockquote-footer() { color: @inverse-base-blockquote-footer-color; }
+
+.hook-inverse-base-hr() {}

client/uikit/src/less/theme/breadcrumb.less

@@ -0,0 +1,45 @@
+//
+// Component: Breadcrumb
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-breadcrumb() {}
+
+
+// Items
+// ========================================================================
+
+.hook-breadcrumb-item() {}
+
+.hook-breadcrumb-item-hover() {}
+
+.hook-breadcrumb-item-disabled() {}
+
+.hook-breadcrumb-item-active() {}
+
+.hook-breadcrumb-divider() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-breadcrumb-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-breadcrumb-item() {}
+.hook-inverse-breadcrumb-item-hover() {}
+.hook-inverse-breadcrumb-item-disabled() {}
+.hook-inverse-breadcrumb-item-active() {}
+
+.hook-inverse-breadcrumb-divider() {}

client/uikit/src/less/theme/button.less

@@ -0,0 +1,211 @@
+//
+// Component: Button
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@button-line-height:                            @global-control-height - (@button-border-width * 2);
+@button-small-line-height:                      @global-control-small-height - (@button-border-width * 2);
+@button-large-line-height:                      @global-control-large-height - (@button-border-width * 2);
+
+@button-font-size:                              @global-small-font-size;
+@button-large-font-size:                        @global-small-font-size;
+
+@button-default-background:                     transparent;
+@button-default-hover-background:               transparent;
+@button-default-active-background:              transparent;
+
+@button-disabled-background:                    transparent;
+
+@button-text-hover-color:                       @global-emphasis-color;
+
+//
+// New
+//
+
+@button-text-transform:                         uppercase;
+
+@button-border-width:                           @global-border-width;
+
+@button-default-border:                         @global-border;
+@button-default-hover-border:                   darken(@global-border, 20%);
+@button-default-active-border:                  darken(@global-border, 30%);
+
+@button-disabled-border:                        @global-border;
+
+@button-text-border-width:                      @global-border-width;
+@button-text-border:                            @button-text-hover-color;
+
+
+// Component
+// ========================================================================
+
+.hook-button() {
+    text-transform: @button-text-transform;
+    transition: 0.1s ease-in-out;
+    transition-property: color, background-color, border-color;
+}
+
+.hook-button-hover() {}
+
+.hook-button-active() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-button-default() { border: @button-border-width solid @button-default-border; }
+
+.hook-button-default-hover() { border-color: @button-default-hover-border; }
+
+.hook-button-default-active() { border-color: @button-default-active-border; }
+
+//
+// Primary
+//
+
+.hook-button-primary() { border: @button-border-width solid transparent; }
+
+.hook-button-primary-hover() {}
+
+.hook-button-primary-active() {}
+
+//
+// Secondary
+//
+
+.hook-button-secondary() { border: @button-border-width solid transparent; }
+
+.hook-button-secondary-hover() {}
+
+.hook-button-secondary-active() {}
+
+//
+// Danger
+//
+
+.hook-button-danger() { border: @button-border-width solid transparent; }
+
+.hook-button-danger-hover() {}
+
+.hook-button-danger-active() {}
+
+
+// Disabled
+// ========================================================================
+
+.hook-button-disabled() { border-color: @button-disabled-border; }
+
+
+// Size modifiers
+// ========================================================================
+
+.hook-button-small() {}
+
+.hook-button-large() {}
+
+
+// Text modifier
+// ========================================================================
+
+.hook-button-text() {
+
+    position: relative;
+
+    &::before {
+        content: "";
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        right: 100%;
+        border-bottom: @button-text-border-width solid @button-text-border;
+        transition: right 0.3s ease-out;
+    }
+
+}
+
+.hook-button-text-hover() {
+
+    &::before { right: 0; }
+
+}
+
+.hook-button-text-disabled() {
+
+    &::before { display: none; }
+
+}
+
+
+// Link modifier
+// ========================================================================
+
+.hook-button-link() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-button-misc() {
+
+    /* Group
+     ========================================================================== */
+
+    /*
+     * Collapse border
+     */
+
+    .uk-button-group > .uk-button:nth-child(n+2),
+    .uk-button-group > div:nth-child(n+2) .uk-button { margin-left: -@button-border-width; }
+
+    /*
+     * Create position context to superimpose the successor elements border
+     * Known issue: If you use an `a` element as button and an icon inside,
+     * the active state will not work if you click the icon inside the button
+     * Workaround: Just use a `button` or `input` element as button
+     */
+
+    .uk-button-group .uk-button:hover,
+    .uk-button-group .uk-button:active,
+    .uk-button-group .uk-button.uk-active {
+        position: relative;
+        z-index: 1;
+    }
+
+}
+
+
+// Inverse
+// ========================================================================
+
+@inverse-button-default-background:            transparent;
+@inverse-button-default-color:                 @inverse-global-emphasis-color;
+@inverse-button-default-hover-background:      transparent;
+@inverse-button-default-hover-color:           @inverse-global-emphasis-color;
+@inverse-button-default-active-background:     transparent;
+@inverse-button-default-active-color:          @inverse-global-emphasis-color;
+
+@inverse-button-text-hover-color:              @inverse-global-emphasis-color;
+
+.hook-inverse-button-default() { border-color: @inverse-global-color; }
+.hook-inverse-button-default-hover() { border-color: @inverse-global-emphasis-color; }
+.hook-inverse-button-default-active() { border-color: @inverse-global-emphasis-color; }
+
+.hook-inverse-button-primary() {}
+.hook-inverse-button-primary-hover() {}
+.hook-inverse-button-primary-active() {}
+
+.hook-inverse-button-secondary() {}
+.hook-inverse-button-secondary-hover() {}
+.hook-inverse-button-secondary-active() {}
+
+.hook-inverse-button-text() {
+    &::before { border-bottom-color: @inverse-global-emphasis-color; }
+}
+.hook-inverse-button-text-hover() {}
+.hook-inverse-button-text-disabled() {}
+
+.hook-inverse-button-link() {}

client/uikit/src/less/theme/card.less

@@ -0,0 +1,223 @@
+//
+// Component: Card
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@card-hover-background:                        @global-background;
+
+@card-default-background:                      @global-background;
+@card-default-hover-background:                @card-default-background;
+
+@card-primary-hover-background:                @card-primary-background;
+
+@card-secondary-hover-background:              @card-secondary-background;
+
+//
+// New
+//
+
+@card-badge-border-radius:                     2px;
+@card-badge-text-transform:                    uppercase;
+
+@card-hover-box-shadow:                        @global-large-box-shadow;
+
+@card-default-box-shadow:                      @global-medium-box-shadow;
+@card-default-hover-box-shadow:                @global-large-box-shadow;
+
+@card-default-header-border-width:             @global-border-width;
+@card-default-header-border:                   @global-border;
+
+@card-default-footer-border-width:             @global-border-width;
+@card-default-footer-border:                   @global-border;
+
+@card-primary-box-shadow:                      @global-medium-box-shadow;
+@card-primary-hover-box-shadow:                @global-large-box-shadow;
+
+@card-secondary-box-shadow:                    @global-medium-box-shadow;
+@card-secondary-hover-box-shadow:              @global-large-box-shadow;
+
+
+// Component
+// ========================================================================
+
+.hook-card() { transition: box-shadow 0.1s ease-in-out; }
+
+
+// Sections
+// ========================================================================
+
+.hook-card-body() {}
+
+.hook-card-header() {}
+
+.hook-card-footer() {}
+
+
+// Media
+// ========================================================================
+
+.hook-card-media() {}
+
+.hook-card-media-top() {}
+
+.hook-card-media-bottom() {}
+
+.hook-card-media-left() {}
+
+.hook-card-media-right() {}
+
+
+// Title
+// ========================================================================
+
+.hook-card-title() {}
+
+
+// Badge
+// ========================================================================
+
+.hook-card-badge() {
+    border-radius: @card-badge-border-radius;
+    text-transform: @card-badge-text-transform;
+}
+
+
+// Hover modifier
+// ========================================================================
+
+.hook-card-hover() { box-shadow: @card-hover-box-shadow; }
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-card-default() { box-shadow: @card-default-box-shadow; }
+
+.hook-card-default-title() {}
+
+.hook-card-default-hover() { box-shadow: @card-default-hover-box-shadow; }
+
+.hook-card-default-header() { border-bottom: @card-default-header-border-width solid @card-default-header-border; }
+
+.hook-card-default-footer() { border-top: @card-default-footer-border-width  solid @card-default-footer-border; }
+
+//
+// Primary
+//
+
+.hook-card-primary() { box-shadow: @card-primary-box-shadow; }
+
+.hook-card-primary-title() {}
+
+.hook-card-primary-hover() { box-shadow: @card-primary-hover-box-shadow; }
+
+//
+// Secondary
+//
+
+.hook-card-secondary() { box-shadow: @card-secondary-box-shadow; }
+
+.hook-card-secondary-title() {}
+
+.hook-card-secondary-hover() { box-shadow: @card-secondary-hover-box-shadow; }
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-card-misc() {
+
+    /*
+     * Default
+     */
+
+    .uk-card-body > .uk-nav-default {
+        margin-left: -@card-body-padding-horizontal;
+        margin-right: -@card-body-padding-horizontal;
+    }
+    .uk-card-body > .uk-nav-default:only-child {
+        margin-top: (-@card-body-padding-vertical + 15px);
+        margin-bottom: (-@card-body-padding-vertical + 15px);
+    }
+
+    .uk-card-body > .uk-nav-default > li > a,
+    .uk-card-body > .uk-nav-default .uk-nav-header,
+    .uk-card-body > .uk-nav-default .uk-nav-divider {
+        padding-left: @card-body-padding-horizontal;
+        padding-right: @card-body-padding-horizontal;
+    }
+
+    .uk-card-body > .uk-nav-default .uk-nav-sub { padding-left: @nav-sublist-deeper-padding-left + @card-body-padding-horizontal; }
+
+
+    /* Desktop and bigger */
+    @media (min-width: @breakpoint-large) {
+
+        .uk-card-body > .uk-nav-default {
+            margin-left: -@card-body-padding-horizontal-l;
+            margin-right: -@card-body-padding-horizontal-l;
+        }
+        .uk-card-body > .uk-nav-default:only-child {
+            margin-top: (-@card-body-padding-vertical-l + 15px);
+            margin-bottom: (-@card-body-padding-vertical-l + 15px);
+        }
+
+        .uk-card-body > .uk-nav-default > li > a,
+        .uk-card-body > .uk-nav-default .uk-nav-header,
+        .uk-card-body > .uk-nav-default .uk-nav-divider {
+            padding-left: @card-body-padding-horizontal-l;
+            padding-right: @card-body-padding-horizontal-l;
+        }
+
+        .uk-card-body > .uk-nav-default .uk-nav-sub { padding-left: @nav-sublist-deeper-padding-left + @card-body-padding-horizontal-l; }
+
+    }
+
+    /*
+     * Small
+     */
+
+    .uk-card-small > .uk-nav-default {
+        margin-left: -@card-small-body-padding-horizontal;
+        margin-right: -@card-small-body-padding-horizontal;
+    }
+    .uk-card-small > .uk-nav-default:only-child {
+        margin-top: (-@card-small-body-padding-vertical + 15px);
+        margin-bottom: (-@card-small-body-padding-vertical + 15px);
+    }
+
+    .uk-card-small > .uk-nav-default > li > a,
+    .uk-card-small > .uk-nav-default .uk-nav-header,
+    .uk-card-small > .uk-nav-default .uk-nav-divider {
+        padding-left: @card-small-body-padding-horizontal;
+        padding-right: @card-small-body-padding-horizontal;
+    }
+
+    .uk-card-small > .uk-nav-default .uk-nav-sub { padding-left: @nav-sublist-deeper-padding-left + @card-small-body-padding-horizontal; }
+
+    /*
+     * Large
+     */
+
+    /* Desktop and bigger */
+    @media (min-width: @breakpoint-large) {
+
+        .uk-card-large > .uk-nav-default { margin: 0; }
+        .uk-card-large > .uk-nav-default:only-child { margin: 0; }
+
+        .uk-card-large > .uk-nav-default > li > a,
+        .uk-card-large > .uk-nav-default .uk-nav-header,
+        .uk-card-large > .uk-nav-default .uk-nav-divider {
+            padding-left: 0;
+            padding-right: 0;
+        }
+
+        .uk-card-large > .uk-nav-default .uk-nav-sub { padding-left: @nav-sublist-deeper-padding-left; }
+
+    }
+
+}

client/uikit/src/less/theme/close.less

@@ -0,0 +1,32 @@
+//
+// Component: Close
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-close() {
+    transition: 0.1s ease-in-out;
+    transition-property: color, opacity;
+}
+
+.hook-close-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-close-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-close() {}
+.hook-inverse-close-hover() {}

client/uikit/src/less/theme/column.less

@@ -0,0 +1,14 @@
+//
+// Component: Column
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-column-misc() {}

client/uikit/src/less/theme/comment.less

@@ -0,0 +1,72 @@
+//
+// Component: Comment
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@comment-primary-padding:                       @global-gutter;
+@comment-primary-background:                    @global-muted-background;
+
+
+// Component
+// ========================================================================
+
+.hook-comment() {}
+
+
+// Sections
+// ========================================================================
+
+.hook-comment-body() {}
+
+.hook-comment-header() {}
+
+
+// Title
+// ========================================================================
+
+.hook-comment-title() {}
+
+
+// Meta
+// ========================================================================
+
+.hook-comment-meta() {}
+
+
+// Avatar
+// ========================================================================
+
+.hook-comment-avatar() {}
+
+
+// List
+// ========================================================================
+
+.hook-comment-list-adjacent() {}
+
+.hook-comment-list-sub() {}
+
+.hook-comment-list-sub-adjacent() {}
+
+
+// Style modifier
+// ========================================================================
+
+.hook-comment-primary() {
+    padding: @comment-primary-padding;
+    background-color: @comment-primary-background;
+}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-comment-misc() {}

client/uikit/src/less/theme/container.less

@@ -0,0 +1,14 @@
+//
+// Component: Container
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-container-misc() {}

client/uikit/src/less/theme/countdown.less

@@ -0,0 +1,53 @@
+//
+// Component: Countdown
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-countdown() {}
+
+
+// Item
+// ========================================================================
+
+.hook-countdown-item() {}
+
+
+// Number
+// ========================================================================
+
+.hook-countdown-number() {}
+
+
+// Separator
+// ========================================================================
+
+.hook-countdown-separator() {}
+
+
+// Label
+// ========================================================================
+
+.hook-countdown-label() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-countdown-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-countdown-item() {}
+.hook-inverse-countdown-number() {}
+.hook-inverse-countdown-separator() {}
+.hook-inverse-countdown-label() {}

client/uikit/src/less/theme/description-list.less

@@ -0,0 +1,36 @@
+//
+// Component: Description list
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@description-list-term-font-size:                      @global-small-font-size;
+@description-list-term-font-weight:                    normal;
+@description-list-term-text-transform:                 uppercase;
+
+
+// Component
+// ========================================================================
+
+.hook-description-list-term() {
+    font-size: @description-list-term-font-size;
+    font-weight: @description-list-term-font-weight;
+    text-transform: @description-list-term-text-transform;
+}
+
+.hook-description-list-description() {}
+
+
+// Style modifier
+// ========================================================================
+
+.hook-description-list-divider-term() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-description-list-misc() {}

client/uikit/src/less/theme/divider.less

@@ -0,0 +1,49 @@
+//
+// Component: Divider
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Icon
+// ========================================================================
+
+.hook-divider-icon() {}
+
+.hook-divider-icon-line() {}
+
+.hook-divider-icon-line-left() {}
+
+.hook-divider-icon-line-right() {}
+
+
+// Small
+// ========================================================================
+
+.hook-divider-small() {}
+
+
+// Vertical
+// ========================================================================
+
+.hook-divider-vertical() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-divider-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-divider-icon() {}
+.hook-inverse-divider-icon-line() {}
+
+.hook-inverse-divider-small() {}
+
+.hook-inverse-divider-vertical() {}

client/uikit/src/less/theme/dotnav.less

@@ -0,0 +1,57 @@
+//
+// Component: Dotnav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@dotnav-item-background:                             transparent;
+
+//
+// New
+//
+
+@dotnav-item-border-width:                           1px;
+
+@dotnav-item-border:                                 fade(@global-color, 40%);
+@dotnav-item-hover-border:                           transparent;
+@dotnav-item-onclick-border:                         transparent;
+@dotnav-item-active-border:                          transparent;
+
+
+// Component
+// ========================================================================
+
+.hook-dotnav() {}
+
+.hook-dotnav-item() {
+    border: @dotnav-item-border-width solid @dotnav-item-border;
+    transition: 0.2s ease-in-out;
+    transition-property: background-color, border-color;
+}
+
+.hook-dotnav-item-hover() { border-color: @dotnav-item-hover-border; }
+
+.hook-dotnav-item-onclick() { border-color: @dotnav-item-onclick-border; }
+
+.hook-dotnav-item-active() { border-color: @dotnav-item-active-border; }
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-dotnav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+@inverse-dotnav-item-background:                     transparent;
+
+.hook-inverse-dotnav() {}
+.hook-inverse-dotnav-item() { border-color: fade(@inverse-global-color, 90%); }
+.hook-inverse-dotnav-item-hover() { border-color: transparent; }
+.hook-inverse-dotnav-item-onclick() { border-color: transparent; }
+.hook-inverse-dotnav-item-active() { border-color: transparent; }

client/uikit/src/less/theme/drop.less

@@ -0,0 +1,14 @@
+//
+// Component: Drop
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-drop-misc() {}

client/uikit/src/less/theme/dropdown.less

@@ -0,0 +1,45 @@
+//
+// Component: Dropdown
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@dropdown-padding:                              25px;
+@dropdown-background:                           @global-background;
+
+//
+// New
+//
+
+@dropdown-nav-font-size:                        @global-small-font-size;
+
+@dropdown-box-shadow:                           0 5px 12px rgba(0,0,0,0.15);
+
+
+// Component
+// ========================================================================
+
+.hook-dropdown() { box-shadow: @dropdown-box-shadow; }
+
+
+// Nav
+// ========================================================================
+
+.hook-dropdown-nav() { font-size: @dropdown-nav-font-size; }
+
+.hook-dropdown-nav-item() {}
+
+.hook-dropdown-nav-item-hover() {}
+
+.hook-dropdown-nav-header() {}
+
+.hook-dropdown-nav-divider() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-dropdown-misc() {}

client/uikit/src/less/theme/form-range.less

@@ -0,0 +1,45 @@
+//
+// Component: Form Range
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@form-range-thumb-background:                   @global-background;
+
+//
+// New
+//
+
+@form-range-thumb-border-width:                 @global-border-width;
+@form-range-thumb-border:                       darken(@global-border, 10%);
+
+@form-range-track-border-radius:                500px;
+
+
+// Component
+// ========================================================================
+
+.hook-form-range() {}
+
+
+// Thumb
+// ========================================================================
+
+.hook-form-range-thumb() { border: @form-range-thumb-border-width solid @form-range-thumb-border; }
+
+
+// Track
+// ========================================================================
+
+.hook-form-range-track() { border-radius: @form-range-track-border-radius; }
+
+.hook-form-range-track-focus() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-form-range-misc() {}

client/uikit/src/less/theme/form.less

@@ -0,0 +1,146 @@
+//
+// Component: Form
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@form-line-height:                              @form-height - (2* @form-border-width);
+
+@form-background:                               @global-background;
+@form-focus-background:                         @global-background;
+
+@form-small-line-height:                        @form-small-height - (2* @form-border-width);
+@form-large-line-height:                        @form-large-height - (2* @form-border-width);
+
+@form-radio-background:                         transparent;
+
+@form-stacked-margin-bottom:                    5px;
+
+//
+// New
+//
+
+@form-border-width:                             @global-border-width;
+@form-border:                                   @global-border;
+
+@form-focus-border:                             @global-primary-background;
+
+@form-disabled-border:                          @global-border;
+
+@form-danger-border:                            @global-danger-background;
+@form-success-border:                           @global-success-background;
+
+@form-blank-focus-border:                       @global-border;
+@form-blank-focus-border-style:                 solid;
+
+@form-radio-border-width:                       @global-border-width;
+@form-radio-border:                             darken(@global-border, 10%);
+
+@form-radio-focus-border:                       @global-primary-background;
+
+@form-radio-checked-border:                     transparent;
+
+@form-radio-disabled-border:                    @global-border;
+
+@form-label-color:                              @global-emphasis-color;
+@form-label-font-size:                          @global-small-font-size;
+
+
+// Component
+// ========================================================================
+
+.hook-form() {
+    border: @form-border-width solid @form-border;
+    transition: 0.2s ease-in-out;
+    transition-property: color, background-color, border;
+}
+
+.hook-form-single-line() {}
+
+.hook-form-multi-line() {}
+
+.hook-form-focus() { border-color: @form-focus-border; }
+
+.hook-form-disabled() { border-color: @form-disabled-border; }
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-form-danger() { border-color: @form-danger-border; }
+
+.hook-form-success() { border-color: @form-success-border; }
+
+.hook-form-blank() { border-color: transparent; }
+
+.hook-form-blank-focus() {
+    border-color: @form-blank-focus-border;
+    border-style: @form-blank-focus-border-style;
+}
+
+
+// Radio and checkbox
+// ========================================================================
+
+.hook-form-radio() {
+    border: @form-radio-border-width solid @form-radio-border;
+    transition: 0.2s ease-in-out;
+    transition-property: background-color, border;
+}
+
+.hook-form-radio-focus() { border-color: @form-radio-focus-border; }
+
+.hook-form-radio-checked() { border-color: @form-radio-checked-border; }
+
+.hook-form-radio-checked-focus() {}
+
+.hook-form-radio-disabled() { border-color: @form-radio-disabled-border; }
+
+
+// Legend
+// ========================================================================
+
+.hook-form-legend() {}
+
+
+// Label
+// ========================================================================
+
+.hook-form-label() {
+    color: @form-label-color;
+    font-size: @form-label-font-size;
+}
+
+
+// Layout
+// ========================================================================
+
+.hook-form-stacked-label() {}
+
+.hook-form-horizontal-label() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-form-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+@inverse-form-label-color:                      @inverse-global-emphasis-color;
+
+.hook-inverse-form() { border-color: @inverse-global-border; }
+.hook-inverse-form-focus() { border-color: @inverse-global-color; }
+
+.hook-inverse-form-radio() { border-color: @inverse-global-border; }
+.hook-inverse-form-radio-focus() { border-color: @inverse-global-color; }
+
+.hook-inverse-form-radio-checked() { border-color: @inverse-global-color; }
+.hook-inverse-form-radio-checked-focus() {}
+
+.hook-inverse-form-label() { color: @inverse-form-label-color; }

client/uikit/src/less/theme/grid.less

@@ -0,0 +1,28 @@
+//
+// Component: Grid
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Divider
+// ========================================================================
+
+.hook-grid-divider-horizontal() {}
+.hook-grid-divider-vertical() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-grid-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-grid-divider-horizontal() {}
+.hook-inverse-grid-divider-vertical() {}

client/uikit/src/less/theme/heading.less

@@ -0,0 +1,67 @@
+//
+// Component: Heading
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-heading-small() {}
+
+.hook-heading-medium() {}
+
+.hook-heading-large() {}
+
+.hook-heading-xlarge() {}
+
+.hook-heading-2xlarge() {}
+
+
+// Divider
+// ========================================================================
+
+.hook-heading-divider() {}
+
+
+// Bullet
+// ========================================================================
+
+.hook-heading-bullet() {}
+
+
+// Line
+// ========================================================================
+
+.hook-heading-line() {}
+
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-heading-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-heading-small() {}
+
+.hook-inverse-heading-medium() {}
+
+.hook-inverse-heading-large() {}
+
+.hook-inverse-heading-xlarge() {}
+
+.hook-inverse-heading-2xlarge() {}
+
+.hook-inverse-heading-divider() {}
+
+.hook-inverse-heading-bullet() {}
+
+.hook-inverse-heading-line() {}

client/uikit/src/less/theme/height.less

@@ -0,0 +1,14 @@
+//
+// Component: Height
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-height-misc() {}

client/uikit/src/less/theme/icon.less

@@ -0,0 +1,53 @@
+//
+// Component: Icon
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Style modifiers
+// ========================================================================
+
+//
+// Link
+//
+
+.hook-icon-link() {}
+
+.hook-icon-link-hover() {}
+
+.hook-icon-link-active() {}
+
+//
+// Button
+//
+
+.hook-icon-button() {
+    transition: 0.1s ease-in-out;
+    transition-property: color, background-color;
+}
+
+.hook-icon-button-hover() {}
+
+.hook-icon-button-active() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-icon-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-icon-link() {}
+.hook-inverse-icon-link-hover() {}
+.hook-inverse-icon-link-active() {}
+
+.hook-inverse-icon-button() {}
+.hook-inverse-icon-button-hover() {}
+.hook-inverse-icon-button-active() {}

client/uikit/src/less/theme/iconnav.less

@@ -0,0 +1,44 @@
+//
+// Component: Iconnav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@subnav-item-font-size:                         @global-small-font-size;
+
+
+// Component
+// ========================================================================
+
+.hook-iconnav() {}
+
+.hook-iconnav-item() {
+    font-size: @subnav-item-font-size;
+    transition: 0.1s ease-in-out;
+    transition-property: color, background-color;
+}
+
+.hook-iconnav-item-hover() {}
+
+.hook-iconnav-item-active() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-iconnav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-iconnav-item() {}
+.hook-inverse-iconnav-item-hover() {}
+.hook-inverse-iconnav-item-active() {}

client/uikit/src/less/theme/inverse.less

@@ -0,0 +1,14 @@
+//
+// Component: Inverse
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-inverse() {}

client/uikit/src/less/theme/label.less

@@ -0,0 +1,46 @@
+//
+// Component: Label
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@label-border-radius:                           2px;
+@label-text-transform:                          uppercase;
+
+
+// Component
+// ========================================================================
+
+.hook-label() {
+    border-radius: @label-border-radius;
+    text-transform: @label-text-transform;
+}
+
+
+// Color modifiers
+// ========================================================================
+
+.hook-label-success() {}
+
+.hook-label-warning() {}
+
+.hook-label-danger() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-label-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-label() {}

client/uikit/src/less/theme/leader.less

@@ -0,0 +1,26 @@
+//
+// Component: Leader
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-leader() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-leader-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-leader() {}

client/uikit/src/less/theme/lightbox.less

@@ -0,0 +1,50 @@
+//
+// Component: Lightbox
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-lightbox() {}
+
+
+// Item
+// ========================================================================
+
+.hook-lightbox-item() {}
+
+
+// Toolbar
+// ========================================================================
+
+.hook-lightbox-toolbar() {}
+
+
+// Toolbar Icon
+// ========================================================================
+
+.hook-lightbox-toolbar-icon() {}
+
+.hook-lightbox-toolbar-icon-hover() {}
+
+
+// Button
+// ========================================================================
+
+.hook-lightbox-button() {}
+
+.hook-lightbox-button-hover() {}
+
+.hook-lightbox-button-active() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-lightbox-misc() {}

client/uikit/src/less/theme/link.less

@@ -0,0 +1,55 @@
+//
+// Component: Link
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Muted
+// ========================================================================
+
+.hook-link-muted() {}
+
+.hook-link-muted-hover() {}
+
+
+// Text
+// ========================================================================
+
+.hook-link-text() {}
+
+.hook-link-text-hover() {}
+
+
+// Heading
+// ========================================================================
+
+.hook-link-heading() {}
+
+.hook-link-heading-hover() {}
+
+
+// Reset
+// ========================================================================
+
+.hook-link-reset() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-link-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-link-muted() {}
+.hook-inverse-link-muted-hover() {}
+
+.hook-inverse-link-text-hover() {}
+
+.hook-inverse-link-heading-hover() {}

client/uikit/src/less/theme/list.less

@@ -0,0 +1,50 @@
+//
+// Component: List
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@list-striped-border-width:                     @global-border-width;
+@list-striped-border:                           @global-border;
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-list-divider() {}
+
+.hook-list-striped() {
+
+    &:nth-of-type(odd) {
+        border-top: @list-striped-border-width solid @list-striped-border;
+        border-bottom: @list-striped-border-width solid @list-striped-border;
+    }
+
+}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-list-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-list-divider() {}
+.hook-inverse-list-striped() {
+
+    &:nth-of-type(odd) {
+        border-top-color: @inverse-global-border;
+        border-bottom-color: @inverse-global-border;
+    }
+
+}

client/uikit/src/less/theme/margin.less

@@ -0,0 +1,14 @@
+//
+// Component: Margin
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-margin-misc() {}

client/uikit/src/less/theme/marker.less

@@ -0,0 +1,31 @@
+//
+// Component: Marker
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-marker() {
+    border-radius: 500px;
+}
+
+.hook-marker-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-marker-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-marker() {}
+.hook-inverse-marker-hover() {}

client/uikit/src/less/theme/modal.less

@@ -0,0 +1,89 @@
+//
+// Component: Modal
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@modal-header-background:                       @modal-dialog-background;
+@modal-footer-background:                       @modal-dialog-background;
+
+//
+// New
+//
+
+@modal-header-border-width:                    @global-border-width;
+@modal-header-border:                          @global-border;
+
+@modal-footer-border-width:                    @global-border-width;
+@modal-footer-border:                          @global-border;
+
+@modal-close-full-padding:                     @global-margin;
+@modal-close-full-background:                  @modal-dialog-background;
+
+
+// Component
+// ========================================================================
+
+.hook-modal() {}
+
+
+// Dialog
+// ========================================================================
+
+.hook-modal-dialog() {}
+
+
+// Full
+// ========================================================================
+
+.hook-modal-full() {}
+
+
+// Sections
+// ========================================================================
+
+.hook-modal-header() { border-bottom: @modal-header-border-width solid @modal-header-border; }
+
+.hook-modal-body() {}
+
+.hook-modal-footer() { border-top: @modal-footer-border-width solid @modal-footer-border; }
+
+
+// Title
+// ========================================================================
+
+.hook-modal-title() {}
+
+
+// Close
+// ========================================================================
+
+.hook-modal-close() {}
+
+.hook-modal-close-hover() {}
+
+.hook-modal-close-default() {}
+
+.hook-modal-close-default-hover() {}
+
+.hook-modal-close-outside() {}
+
+.hook-modal-close-outside-hover() {}
+
+.hook-modal-close-full() {
+    top: 0;
+    right: 0;
+    padding: @modal-close-full-padding;
+    background: @modal-close-full-background;
+}
+
+.hook-modal-close-full-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-modal-misc() {}

client/uikit/src/less/theme/nav.less

@@ -0,0 +1,102 @@
+//
+// Component: Nav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@nav-default-font-size:                         @global-small-font-size;
+
+
+// Sublists
+// ========================================================================
+
+.hook-nav-sub() {}
+
+
+// Parent icon modifier
+// ========================================================================
+
+.hook-nav-parent-icon() {}
+
+
+// Header
+// ========================================================================
+
+.hook-nav-header() {}
+
+
+// Divider
+// ========================================================================
+
+.hook-nav-divider() {}
+
+
+// Default style modifier
+// ========================================================================
+
+.hook-nav-default() { font-size: @nav-default-font-size; }
+
+.hook-nav-default-item() {}
+
+.hook-nav-default-item-hover() {}
+
+.hook-nav-default-item-active() {}
+
+.hook-nav-default-header() {}
+
+.hook-nav-default-divider() {}
+
+
+// Primary style modifier
+// ========================================================================
+
+.hook-nav-primary() {}
+
+.hook-nav-primary-item() {}
+
+.hook-nav-primary-item-hover() {}
+
+.hook-nav-primary-item-active() {}
+
+.hook-nav-primary-header() {}
+
+.hook-nav-primary-divider() {}
+
+
+// Style modifier
+// ========================================================================
+
+.hook-nav-dividers() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-nav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-nav-parent-icon() {}
+
+.hook-inverse-nav-default-item() {}
+.hook-inverse-nav-default-item-hover() {}
+.hook-inverse-nav-default-item-active() {}
+.hook-inverse-nav-default-header() {}
+.hook-inverse-nav-default-divider() {}
+
+.hook-inverse-nav-primary-item() {}
+.hook-inverse-nav-primary-item-hover() {}
+.hook-inverse-nav-primary-item-active() {}
+.hook-inverse-nav-primary-header() {}
+.hook-inverse-nav-primary-divider() {}
+
+.hook-inverse-nav-dividers() {}

client/uikit/src/less/theme/navbar.less

@@ -0,0 +1,179 @@
+//
+// Component: Navbar
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@navbar-nav-item-font-size:                     @global-small-font-size;
+
+@navbar-dropdown-margin:                        15px;
+@navbar-dropdown-padding:                       25px;
+@navbar-dropdown-background:                    @global-background;
+@navbar-dropdown-grid-gutter-horizontal:        (@navbar-dropdown-padding * 2);
+
+//
+// New
+//
+
+@navbar-nav-item-text-transform:                uppercase;
+
+@navbar-dropdown-nav-font-size:                 @global-small-font-size;
+
+@navbar-dropdown-box-shadow:                    0 5px 12px rgba(0,0,0,0.15);
+
+@navbar-dropbar-box-shadow:                     0 5px 7px rgba(0, 0, 0, 0.05);
+
+@navbar-dropdown-grid-divider-border-width:     @global-border-width;
+@navbar-dropdown-grid-divider-border:           @navbar-dropdown-nav-divider-border;
+
+
+// Component
+// ========================================================================
+
+.hook-navbar() {}
+
+
+// Container
+// ========================================================================
+
+.hook-navbar-container() {}
+
+
+// Nav
+// ========================================================================
+
+.hook-navbar-nav-item() {
+    text-transform: @navbar-nav-item-text-transform;
+    transition: 0.1s ease-in-out;
+    transition-property: color, background-color;
+}
+
+.hook-navbar-nav-item-hover() {}
+
+.hook-navbar-nav-item-onclick() {}
+
+.hook-navbar-nav-item-active() {}
+
+
+// Item
+// ========================================================================
+
+.hook-navbar-item() {}
+
+
+// Toggle
+// ========================================================================
+
+.hook-navbar-toggle() {}
+
+.hook-navbar-toggle-hover() {}
+
+.hook-navbar-toggle-icon() {}
+
+.hook-navbar-toggle-icon-hover() {}
+
+
+// Subtitle
+// ========================================================================
+
+.hook-navbar-subtitle() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-navbar-primary() {}
+
+.hook-navbar-transparent() {}
+
+.hook-navbar-sticky() {}
+
+
+// Dropdown
+// ========================================================================
+
+.hook-navbar-dropdown() { box-shadow: @navbar-dropdown-box-shadow; }
+
+.hook-navbar-dropdown-dropbar() { box-shadow: none; }
+
+
+// Dropdown nav
+// ========================================================================
+
+.hook-navbar-dropdown-nav() { font-size: @navbar-dropdown-nav-font-size; }
+
+.hook-navbar-dropdown-nav-item() {}
+
+.hook-navbar-dropdown-nav-item-hover() {}
+
+.hook-navbar-dropdown-nav-header() {}
+
+.hook-navbar-dropdown-nav-divider() {}
+
+
+// Dropbar
+// ========================================================================
+
+.hook-navbar-dropbar() {}
+
+.hook-navbar-dropbar-slide() { box-shadow: @navbar-dropbar-box-shadow; }
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-navbar-misc() {
+
+    /*
+     * Navbar
+     */
+
+    .uk-navbar-container > .uk-container .uk-navbar-left {
+        margin-left: -@navbar-nav-item-padding-horizontal;
+        margin-right: -@navbar-nav-item-padding-horizontal;
+    }
+    .uk-navbar-container > .uk-container .uk-navbar-right { margin-right: -@navbar-nav-item-padding-horizontal; }
+
+    /*
+     * Grid Divider
+     */
+
+    .uk-navbar-dropdown-grid > * { position: relative; }
+
+    .uk-navbar-dropdown-grid > :not(.uk-first-column)::before {
+        content: "";
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: (@navbar-dropdown-grid-gutter-horizontal / 2);
+        border-left: @navbar-dropdown-grid-divider-border-width solid @navbar-dropdown-grid-divider-border;
+    }
+
+    /* Vertical */
+    .uk-navbar-dropdown-grid.uk-grid-stack > .uk-grid-margin::before {
+        content: "";
+        position: absolute;
+        top: -(@navbar-dropdown-grid-gutter-vertical / 2);
+        left: @navbar-dropdown-grid-gutter-horizontal;
+        right: 0;
+        border-top: @navbar-dropdown-grid-divider-border-width solid @navbar-dropdown-grid-divider-border;
+    }
+
+}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-navbar-nav-item() {}
+.hook-inverse-navbar-nav-item-hover() {}
+.hook-inverse-navbar-nav-item-onclick() {}
+.hook-inverse-navbar-nav-item-active() {}
+
+.hook-inverse-navbar-item() {}
+
+.hook-inverse-navbar-toggle() {}
+.hook-inverse-navbar-toggle-hover() {}

client/uikit/src/less/theme/notification.less

@@ -0,0 +1,44 @@
+//
+// Component: Notification
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-notification() {}
+
+
+// Message
+// ========================================================================
+
+.hook-notification-message() {}
+
+
+// Close
+// ========================================================================
+
+.hook-notification-close() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-notification-message-primary() {}
+
+.hook-notification-message-success() {}
+
+.hook-notification-message-warning() {}
+
+.hook-notification-message-danger() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-notification-misc() {}

client/uikit/src/less/theme/offcanvas.less

@@ -0,0 +1,32 @@
+//
+// Component: Off-canvas
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Bar
+// ========================================================================
+
+.hook-offcanvas-bar() {}
+
+
+// Close
+// ========================================================================
+
+.hook-offcanvas-close() {}
+
+
+// Overlay
+// ========================================================================
+
+.hook-offcanvas-overlay() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-offcanvas-misc() {}

client/uikit/src/less/theme/overlay.less

@@ -0,0 +1,33 @@
+//
+// Component: Overlay
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-overlay() {}
+
+// Icon
+// ========================================================================
+
+.hook-overlay-icon() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-overlay-default() {}
+
+.hook-overlay-primary() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-overlay-misc() {}

client/uikit/src/less/theme/padding.less

@@ -0,0 +1,14 @@
+//
+// Component: Padding
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-padding-misc() {}

client/uikit/src/less/theme/pagination.less

@@ -0,0 +1,41 @@
+//
+// Component: Pagination
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-pagination() {}
+
+
+// Items
+// ========================================================================
+
+.hook-pagination-item() { transition: color 0.1s ease-in-out; }
+
+.hook-pagination-item-hover() {}
+
+.hook-pagination-item-active() {}
+
+.hook-pagination-item-disabled() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-pagination-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-pagination-item() {}
+.hook-inverse-pagination-item-hover() {}
+.hook-inverse-pagination-item-active() {}
+.hook-inverse-pagination-item-disabled() {}

client/uikit/src/less/theme/placeholder.less

@@ -0,0 +1,29 @@
+//
+// Component: Placeholder
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@placeholder-background:                        transparent;
+
+//
+// New
+//
+
+@placeholder-border-width:                      @global-border-width;
+@placeholder-border:                            @global-border;
+
+
+// Component
+// ========================================================================
+
+.hook-placeholder() { border: @placeholder-border-width dashed @placeholder-border; }
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-placeholder-misc() {}

client/uikit/src/less/theme/position.less

@@ -0,0 +1,14 @@
+//
+// Component: Position
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-position-misc() {}

client/uikit/src/less/theme/progress.less

@@ -0,0 +1,27 @@
+//
+// Component: Progress
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@progress-border-radius:                        500px;
+
+
+// Component
+// ========================================================================
+
+.hook-progress() {
+    border-radius: @progress-border-radius;
+    overflow: hidden;
+}
+
+.hook-progress-bar() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-progress-misc() {}

client/uikit/src/less/theme/search.less

@@ -0,0 +1,81 @@
+//
+// Component: Search
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@search-default-background:                         transparent;
+
+//
+// New
+//
+
+@search-default-border-width:                       @global-border-width;
+@search-default-border:                             @global-border;
+
+@search-default-focus-border:                       @global-primary-background;
+
+
+// Component
+// ========================================================================
+
+.hook-search-input() {}
+
+
+// Default modifiers
+// ========================================================================
+
+.hook-search-default-input() { border: @search-default-border-width solid @search-default-border; }
+
+.hook-search-default-input-focus() { border-color: @search-default-focus-border; }
+
+
+// Navbar modifiers
+// ========================================================================
+
+.hook-search-navbar-input() {}
+
+.hook-search-navbar-input-focus() {}
+
+
+// Large modifiers
+// ========================================================================
+
+.hook-search-large-input() {}
+
+.hook-search-large-input-focus() {}
+
+
+// Toggle
+// ========================================================================
+
+.hook-search-toggle() {}
+
+.hook-search-toggle-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-search-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+@inverse-search-default-background:            transparent;
+
+.hook-inverse-search-default-input() { border-color: @inverse-global-border; }
+.hook-inverse-search-default-input-focus() {}
+
+.hook-inverse-search-navbar-input() {}
+.hook-inverse-search-navbar-input-focus() {}
+
+.hook-inverse-search-large-input() {}
+.hook-inverse-search-large-input-focus() {}
+
+.hook-inverse-search-toggle() {}
+.hook-inverse-search-toggle-hover() {}

client/uikit/src/less/theme/section.less

@@ -0,0 +1,32 @@
+//
+// Component: Section
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-section() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-section-default() {}
+
+.hook-section-muted() {}
+
+.hook-section-primary() {}
+
+.hook-section-secondary() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-section-misc() {}

client/uikit/src/less/theme/slidenav.less

@@ -0,0 +1,52 @@
+//
+// Component: Slidenav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-slidenav() { transition: color 0.1s ease-in-out; }
+
+.hook-slidenav-hover() {}
+
+.hook-slidenav-active() {}
+
+
+// Icon modifier
+// ========================================================================
+
+.hook-slidenav-previous() {}
+
+.hook-slidenav-next() {}
+
+
+// Size modifier
+// ========================================================================
+
+.hook-slidenav-large() {}
+
+
+// Container
+// ========================================================================
+
+.hook-slidenav-container() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-slidenav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-slidenav() {}
+.hook-inverse-slidenav-hover() {}
+.hook-inverse-slidenav-active() {}

client/uikit/src/less/theme/slider.less

@@ -0,0 +1,14 @@
+//
+// Component: Slider
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-slider-misc() {}

client/uikit/src/less/theme/sortable.less

@@ -0,0 +1,38 @@
+//
+// Component: Sortable
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-sortable() {}
+
+
+// Drag
+// ========================================================================
+
+.hook-sortable-drag() {}
+
+
+// Placeholder
+// ========================================================================
+
+.hook-sortable-placeholder() {}
+
+
+// Empty
+// ========================================================================
+
+.hook-sortable-empty() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-sortable-misc() {}

client/uikit/src/less/theme/spinner.less

@@ -0,0 +1,14 @@
+//
+// Component: Spinner
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-spinner-misc() {}

client/uikit/src/less/theme/sticky.less

@@ -0,0 +1,14 @@
+//
+// Component: Sticky
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-sticky-misc() {}

client/uikit/src/less/theme/subnav.less

@@ -0,0 +1,79 @@
+//
+// Component: Subnav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@subnav-item-font-size:                         @global-small-font-size;
+@subnav-item-text-transform:                    uppercase;
+
+
+// Component
+// ========================================================================
+
+.hook-subnav() {}
+
+.hook-subnav-item() {
+    font-size: @subnav-item-font-size;
+    text-transform: @subnav-item-text-transform;
+    transition: 0.1s ease-in-out;
+    transition-property: color, background-color;
+}
+
+.hook-subnav-item-hover() {}
+
+.hook-subnav-item-active() {}
+
+
+// Divider modifier
+// ========================================================================
+
+.hook-subnav-divider() {}
+
+
+// Pill modifier
+// ========================================================================
+
+.hook-subnav-pill-item() {}
+
+.hook-subnav-pill-item-hover() {}
+
+.hook-subnav-pill-item-onclick() {}
+
+.hook-subnav-pill-item-active() {}
+
+
+// Disabled
+// ========================================================================
+
+.hook-subnav-item-disabled() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-subnav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-subnav-item() {}
+.hook-inverse-subnav-item-hover() {}
+.hook-inverse-subnav-item-active() {}
+
+.hook-inverse-subnav-divider() {}
+
+.hook-inverse-subnav-pill-item() {}
+.hook-inverse-subnav-pill-item-hover() {}
+.hook-inverse-subnav-pill-item-onclick() {}
+.hook-inverse-subnav-pill-item-active() {}
+
+.hook-inverse-subnav-item-disabled() {}

client/uikit/src/less/theme/tab.less

@@ -0,0 +1,138 @@
+//
+// Component: Tab
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@tab-border-width:                              @global-border-width;
+@tab-border:                                    @global-border;
+
+@tab-item-border-width:                         @global-border-width;
+@tab-item-font-size:                            @global-small-font-size;
+@tab-item-text-transform:                       uppercase;
+
+@tab-item-active-border:                        @global-primary-background;
+
+
+// Component
+// ========================================================================
+
+.hook-tab() {
+
+    position: relative;
+
+    &::before {
+        content: "";
+        position: absolute;
+        bottom: 0;
+        left: @tab-margin-horizontal;
+        right: 0;
+        border-bottom: @tab-border-width solid @tab-border;
+    }
+
+}
+
+
+// Items
+// ========================================================================
+
+.hook-tab-item() {
+    border-bottom: @tab-item-border-width solid transparent;
+    font-size: @tab-item-font-size;
+    text-transform: @tab-item-text-transform;
+    transition: color 0.1s ease-in-out;
+}
+
+.hook-tab-item-hover() {}
+
+.hook-tab-item-active() { border-color: @tab-item-active-border; }
+
+.hook-tab-item-disabled() {}
+
+
+// Position modifiers
+// ========================================================================
+
+.hook-tab-bottom() {
+
+    &::before {
+        top: 0;
+        bottom: auto;
+    }
+
+}
+
+.hook-tab-bottom-item() {
+    border-top: @tab-item-border-width solid transparent;
+    border-bottom: none;
+}
+
+.hook-tab-left() {
+
+    &::before {
+        top: 0;
+        bottom: 0;
+        left: auto;
+        right: 0;
+        border-left: @tab-border-width solid @tab-border;
+        border-bottom: none;
+    }
+
+}
+
+.hook-tab-left-item() {
+    border-right: @tab-item-border-width solid transparent;
+    border-bottom: none;
+}
+
+.hook-tab-right() {
+
+    &::before {
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: auto;
+        border-left: @tab-border-width solid @tab-border;
+        border-bottom: none;
+    }
+
+}
+
+.hook-tab-right-item() {
+    border-left: @tab-item-border-width solid transparent;
+    border-bottom: none;
+}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-tab-misc() {
+
+    .uk-tab .uk-dropdown { margin-left: (@tab-margin-horizontal + @tab-item-padding-horizontal) }
+
+}
+
+
+// Inverse
+// ========================================================================
+
+@inverse-tab-border:                        @inverse-global-border;
+
+.hook-inverse-tab() {
+
+    &::before { border-color: @inverse-tab-border; }
+
+}
+
+.hook-inverse-tab-item() {}
+.hook-inverse-tab-item-hover() {}
+.hook-inverse-tab-item-active() { border-color: @inverse-global-primary-background; }
+.hook-inverse-tab-item-disabled() {}

client/uikit/src/less/theme/table.less

@@ -0,0 +1,86 @@
+//
+// Component: Table
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@table-header-cell-font-size:                   @global-small-font-size;
+@table-header-cell-font-weight:                 normal;
+@table-header-cell-color:                       @global-muted-color;
+
+//
+// New
+//
+
+@table-striped-border-width:                    @global-border-width;
+@table-striped-border:                          @global-border;
+
+
+// Component
+// ========================================================================
+
+.hook-table-header-cell() { text-transform: uppercase; }
+
+.hook-table-cell() {}
+
+.hook-table-footer() {  }
+
+.hook-table-caption() {}
+
+.hook-table-row-active() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-table-divider() {}
+
+.hook-table-striped() {
+    border-top: @table-striped-border-width solid @table-striped-border;
+    border-bottom: @table-striped-border-width solid @table-striped-border;
+}
+
+.hook-table-hover() {}
+
+
+// Size modifier
+// ========================================================================
+
+.hook-table-small() {}
+
+.hook-table-large() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-table-misc() {
+
+    .uk-table tbody tr { transition: background-color 0.1s linear; }
+
+    .uk-table-striped > tr:nth-of-type(even):last-child,
+    .uk-table-striped tbody tr:nth-of-type(even):last-child { border-bottom: @table-striped-border-width solid @table-striped-border; }
+
+}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-table-header-cell() {}
+.hook-inverse-table-caption() {}
+.hook-inverse-table-row-active() {}
+.hook-inverse-table-divider() {}
+.hook-inverse-table-striped() {
+    border-top-color: @inverse-global-border;
+    border-bottom-color: @inverse-global-border;
+}
+.hook-inverse-table-hover() {}
+
+.hook-inverse() {
+    .uk-table-striped > tr:nth-of-type(even):last-child,
+    .uk-table-striped tbody tr:nth-of-type(even):last-child { border-bottom-color: @inverse-global-border; }
+}

client/uikit/src/less/theme/text.less

@@ -0,0 +1,59 @@
+//
+// Component: Text
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@text-meta-link-color:                          @text-meta-color;
+@text-meta-link-hover-color:                    @global-color;
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-text-lead() {}
+
+.hook-text-meta() {
+
+    a { color: @text-meta-link-color; }
+
+    a:hover {
+        color: @text-meta-link-hover-color;
+        text-decoration: none;
+    }
+
+}
+
+
+// Size modifiers
+// ========================================================================
+
+.hook-text-small() {}
+
+.hook-text-large() {}
+
+
+// Background modifier
+// ========================================================================
+
+.hook-text-background() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-text-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-text-lead() {}
+.hook-inverse-text-meta() {}

client/uikit/src/less/theme/thumbnav.less

@@ -0,0 +1,61 @@
+//
+// Component: Thumbnav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@thumbnav-item-background:                      fade(@global-background, 40%);
+@thumbnav-item-hover-background:                transparent;
+@thumbnav-item-active-background:               transparent;
+
+
+// Component
+// ========================================================================
+
+.hook-thumbnav() {}
+
+.hook-thumbnav-item() {
+
+    position: relative;
+
+    &::after {
+        content: "";
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        background: @thumbnav-item-background;
+        transition: background-color 0.1s ease-in-out;
+    }
+
+}
+
+.hook-thumbnav-item-hover() {
+    &::after { background-color: @thumbnav-item-hover-background; }
+}
+
+.hook-thumbnav-item-active() {
+    &::after { background-color: @thumbnav-item-active-background; }
+}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-thumbnav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-thumbnav-item() {}
+.hook-inverse-thumbnav-item-hover() {}
+.hook-inverse-thumbnav-item-active() {}

client/uikit/src/less/theme/tile.less

@@ -0,0 +1,52 @@
+//
+// Component: Tile
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-tile() {}
+
+
+// Style modifiers
+// ========================================================================
+
+.hook-tile-default() {}
+
+.hook-tile-default-hover() {}
+
+//
+// Muted
+//
+
+.hook-tile-muted() {}
+
+.hook-tile-muted-hover() {}
+
+//
+// Primary
+//
+
+.hook-tile-primary() {}
+
+.hook-tile-primary-hover() {}
+
+//
+// Secondary
+//
+
+.hook-tile-secondary() {}
+
+.hook-tile-secondary-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-tile-misc() {}

client/uikit/src/less/theme/tooltip.less

@@ -0,0 +1,20 @@
+//
+// Component: Tooltip
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-tooltip() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-tooltip-misc() {}

client/uikit/src/less/theme/totop.less

@@ -0,0 +1,32 @@
+//
+// Component: Totop
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-totop() { transition: color 0.1s ease-in-out; }
+
+.hook-totop-hover() {}
+
+.hook-totop-active() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-icon-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-totop() {}
+.hook-inverse-totop-hover() {}
+.hook-inverse-totop-active() {}

client/uikit/src/less/theme/transition.less

@@ -0,0 +1,14 @@
+//
+// Component: Transition
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-transition-misc() {}

client/uikit/src/less/theme/utility.less

@@ -0,0 +1,52 @@
+//
+// Component: Utility
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Panel
+// ========================================================================
+
+.hook-panel-scrollable() {}
+
+
+// Box-shadow bottom
+// ========================================================================
+
+.hook-box-shadow-bottom() {}
+
+
+// Drop cap
+// ========================================================================
+
+.hook-dropcap() {
+    // Prevent line wrap
+    margin-bottom: -2px;
+}
+
+
+// Logo
+// ========================================================================
+
+.hook-logo() {}
+
+.hook-logo-hover() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-utility-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-dropcap() {}
+
+.hook-inverse-logo() {}
+.hook-inverse-logo-hover() {}

client/uikit/src/less/theme/variables.less

@@ -0,0 +1,36 @@
+//
+// Component: Variables
+//
+// ========================================================================
+
+
+// Global variables
+// ========================================================================
+
+//
+// Typography
+//
+
+//
+// Colors
+//
+
+//
+// Backgrounds
+//
+
+//
+// Borders
+//
+
+//
+// Spacings
+//
+
+//
+// Controls
+//
+
+//
+// Z-index
+//

client/uikit/src/less/theme/width.less

@@ -0,0 +1,14 @@
+//
+// Component: Width
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-width-misc() {}