uikit3-rails 0.1.0

data/assets/stylesheets/theme/close.less

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

data/assets/stylesheets/theme/column.less

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

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

data/assets/stylesheets/theme/container.less

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

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

data/assets/stylesheets/theme/divider.less

@@ -0,0 +1,41 @@
+//
+// 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() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-divider-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-divider-icon() {}
+.hook-inverse-divider-icon-line() {}
+
+.hook-inverse-divider-small() {}

data/assets/stylesheets/theme/dotnav.less

@@ -0,0 +1,41 @@
+//
+// Component: Dotnav
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+
+// Component
+// ========================================================================
+
+.hook-dotnav() {}
+
+.hook-dotnav-item() {
+    -webkit-transition: background-color 0.2s ease-in-out;
+    transition: background-color 0.2s ease-in-out;
+}
+
+.hook-dotnav-item-hover() {}
+
+.hook-dotnav-item-onclick() {}
+
+.hook-dotnav-item-active() {}
+
+
+// Miscellaneous
+// ========================================================================
+
+.hook-dotnav-misc() {}
+
+
+// Inverse
+// ========================================================================
+
+.hook-inverse-dotnav() {}
+.hook-inverse-dotnav-item() {}
+.hook-inverse-dotnav-item-hover() {}
+.hook-inverse-dotnav-item-onclick() {}
+.hook-inverse-dotnav-item-active() {}

data/assets/stylesheets/theme/drop.less

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

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

data/assets/stylesheets/theme/form.less

@@ -0,0 +1,150 @@
+//
+// 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:                 dashed;
+
+@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;
+    -webkit-transition: 0.2s ease-in-out;
+    transition: 0.2s ease-in-out;
+    -webkit-transition-property: color, background-color, border;
+    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;
+    -webkit-transition: 0.2s ease-in-out;
+    transition: 0.2s ease-in-out;
+    -webkit-transition-property: background-color, border;
+    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; }