uikit3-rails 0.1.0

data/assets/stylesheets/theme/_import.less

@@ -0,0 +1,72 @@
+// 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.less";
+@import "button.less";
+
+// Layout
+@import "section.less";
+@import "container.less";
+@import "grid.less";
+@import "card.less";
+
+// Common
+@import "close.less";
+@import "spinner.less";
+@import "totop.less";
+@import "alert.less";
+@import "badge.less";
+@import "label.less";
+@import "overlay.less";
+@import "article.less";
+@import "comment.less";
+@import "search.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";
+
+// JavaScript
+@import "accordion.less";
+@import "drop.less";
+@import "dropdown.less";
+@import "modal.less";
+@import "sticky.less";
+@import "offcanvas.less";
+
+// Optional components
+@import "iconnav.less";
+@import "notification.less";
+@import "tooltip.less";
+@import "placeholder.less";
+@import "progress.less";
+@import "sortable.less";
+
+// Utility
+@import "animation.less";
+@import "width.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";

data/assets/stylesheets/theme/accordion.less

@@ -0,0 +1,76 @@
+//
+// Component: Accordion
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+//
+// New
+//
+
+@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;
+
+    &::after {
+        content: "";
+        width: (@accordion-title-line-height * 1em);
+        height: (@accordion-title-line-height * 1em);
+        float: right;
+        .svg-fill(@internal-accordion-close-image, "#000", @accordion-icon-color);
+        background-repeat: no-repeat;
+        background-position: 50% 50%;
+    }
+
+    .uk-open > &::after { .svg-fill(@internal-accordion-open-image, "#000", @accordion-icon-color); }
+
+}
+
+
+// Content
+// ========================================================================
+
+.hook-accordion-content() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-accordion-misc() {}
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-accordion-item() {}
+
+.hook-inverse-accordion-title() {}
+
+.hook-inverse() {
+
+    .uk-accordion-title::after { .svg-fill(@internal-accordion-close-image, "#000", @inverse-global-color); }
+
+    .uk-open > .uk-accordion-title::after { .svg-fill(@internal-accordion-open-image, "#000", @inverse-global-color); }
+
+}

data/assets/stylesheets/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;
+    }
+
+}

data/assets/stylesheets/theme/align.less

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

data/assets/stylesheets/theme/animation.less

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

data/assets/stylesheets/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() {}

data/assets/stylesheets/theme/background.less

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

data/assets/stylesheets/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() {}

data/assets/stylesheets/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() {}