Merge pull request #402 from picturepan2/0.5.1 v0.5.1

0.5.1

13 files changed, 53 insertions, 16 deletions

diff --git a/src/_autocomplete.scss b/src/_autocomplete.scss
index 0101493..279fa03 100644
--- a/src/_autocomplete.scss
+++ b/src/_autocomplete.scss
@@ -33,4 +33,15 @@
     top: 100%;
     width: 100%;
   }
+
+  &.autocomplete-oneline {
+    .form-autocomplete-input {
+      flex-wrap: nowrap;
+      overflow-x: auto;
+    }
+
+    .chip {
+      flex: 1 0 auto;
+    }
+  }
 }
diff --git a/src/_calendars.scss b/src/_calendars.scss
index e94bb39..a05621f 100644
--- a/src/_calendars.scss
+++ b/src/_calendars.scss
@@ -4,7 +4,6 @@
   border-radius: $border-radius;
   display: block;
   min-width: 280px;
-  text-align: center;
 
   .calendar-nav {
     align-items: center;
@@ -34,6 +33,7 @@
     border-bottom: $border-width solid $border-color;
     color: $gray-color;
     font-size: $font-size-sm;
+    text-align: center;
   }
 
   .calendar-body {
@@ -196,7 +196,6 @@
       margin: $unit-h auto;
       overflow: hidden;
       padding: 3px 4px;
-      text-align: left;
       text-overflow: ellipsis;
       white-space: nowrap;
     }
diff --git a/src/_carousels.scss b/src/_carousels.scss
index fe873c5..55dc31c 100644
--- a/src/_carousels.scss
+++ b/src/_carousels.scss
@@ -6,6 +6,7 @@
   position: relative;
   width: 100%;
   -webkit-overflow-scrolling: touch;
+  z-index: $zindex-0;
 
   .carousel-container {
     height: 100%;
@@ -45,7 +46,7 @@
       top: 50%;
       transition: all .4s ease;
       transform: translateY(-50%);
-      z-index: $zindex-2;
+      z-index: $zindex-1;
     }
     .item-prev {
       left: 1rem;
@@ -80,7 +81,7 @@
     position: absolute;
     transform: translateX(-50%);
     width: 10rem;
-    z-index: $zindex-2;
+    z-index: $zindex-1;
 
     .nav-item {
       color: rgba($gray-color-light, .5);
diff --git a/src/_forms.scss b/src/_forms.scss
index acd34ad..a0b6ee1 100644
--- a/src/_forms.scss
+++ b/src/_forms.scss
@@ -165,6 +165,7 @@ textarea.form-input {
     top: 50%;
     transform: translateY(-50%);
     width: $control-icon-size;
+    z-index: $zindex-0 + 1;
   }
 }
 
@@ -521,5 +522,6 @@ input {
 
   .form-group {
     display: flex;
+    flex-wrap: wrap;
   }
 }
diff --git a/src/_menus.scss b/src/_menus.scss
index 957eea9..5bc5ef8 100644
--- a/src/_menus.scss
+++ b/src/_menus.scss
@@ -8,7 +8,7 @@
   min-width: $control-width-xs;
   padding: $unit-2;
   transform: translateY($layout-spacing-sm);
-  z-index: $zindex-1;
+  z-index: $zindex-3;
 
   &.menu-nav {
     background: transparent;
@@ -40,6 +40,12 @@
       }
     }
 
+    .form-checkbox,
+    .form-radio,
+    .form-switch {
+      margin: $unit-h 0;
+    }
+
     & + .menu-item {
       margin-top: $unit-1;
     }
diff --git a/src/_modals.scss b/src/_modals.scss
index 9a29eb6..59a7e4e 100644
--- a/src/_modals.scss
+++ b/src/_modals.scss
@@ -62,7 +62,6 @@
   border-radius: $border-radius;
   display: block;
   padding: 0 $unit-4;
-  text-align: left;
 
   .modal-header {
     padding: $unit-4;
diff --git a/src/_off-canvas.scss b/src/_off-canvas.scss
index a85d9fe..27dd7cd 100644
--- a/src/_off-canvas.scss
+++ b/src/_off-canvas.scss
@@ -10,24 +10,33 @@ $off-canvas-breakpoint: $size-lg !default;
 
   .off-canvas-toggle {
     display: block;
-    left: $layout-spacing;
     position: absolute;
     top: $layout-spacing;
     transition: none;
     z-index: $zindex-0;
+    @if $rtl == true {
+      right: $layout-spacing;
+    } @else {
+      left: $layout-spacing;
+    }
   }
 
   .off-canvas-sidebar {
     background: $bg-color;
     bottom: 0;
-    left: 0;
     min-width: 10rem;
     overflow-y: auto;
     position: fixed;
     top: 0;
-    transform: translateX(-100%);
     transition: transform .25s ease;
-    z-index: $zindex-3;
+    z-index: $zindex-2;
+    @if $rtl == true {
+      right: 0;
+      transform: translateX(100%);
+    } @else {
+      left: 0;
+      transform: translateX(-100%);
+    }
   }
 
   .off-canvas-content {
@@ -59,7 +68,7 @@ $off-canvas-breakpoint: $size-lg !default;
     &:target ~ .off-canvas-overlay,
     &.active ~ .off-canvas-overlay {
       display: block;
-      z-index: $zindex-2;
+      z-index: $zindex-1;
     }
   }
 }
diff --git a/src/_popovers.scss b/src/_popovers.scss
index 78c86aa..34ac7bd 100644
--- a/src/_popovers.scss
+++ b/src/_popovers.scss
@@ -12,7 +12,7 @@
     transform: translate(-50%, -50%) scale(0);
     transition: transform .2s ease;
     width: $control-width-sm;
-    z-index: $zindex-4;
+    z-index: $zindex-3;
   }
 
   *:focus + .popover-container,
diff --git a/src/_tables.scss b/src/_tables.scss
index 074301f..732718c 100644
--- a/src/_tables.scss
+++ b/src/_tables.scss
@@ -2,8 +2,12 @@
 .table {
   border-collapse: collapse;
   border-spacing: 0;
-  text-align: left;
   width: 100%;
+  @if $rtl == true {
+    text-align: right;
+  } @else {
+    text-align: left;
+  }
 
   &.table-striped {
     tbody {
diff --git a/src/_variables.scss b/src/_variables.scss
index 1e328cc..87fd981 100644
--- a/src/_variables.scss
+++ b/src/_variables.scss
@@ -1,5 +1,8 @@
 // Core variables
-$version: "0.5.0";
+$version: "0.5.1";
+
+// Core features
+$rtl: false !default;
 
 // Core colors
 $primary-color: #5755d9 !default;
diff --git a/src/mixins/_button.scss b/src/mixins/_button.scss
index 338e8e3..c90a94b 100644
--- a/src/mixins/_button.scss
+++ b/src/mixins/_button.scss
@@ -19,7 +19,10 @@
     color: $light-color;
   }
   &.loading {
-    @extend .btn-primary.loading;
+    &::after {
+      border-bottom-color: $light-color;
+      border-left-color: $light-color;
+    }
   }
 }
 
diff --git a/src/spectre-exp.scss b/src/spectre-exp.scss
index ebbad57..9ba75ff 100644
--- a/src/spectre-exp.scss
+++ b/src/spectre-exp.scss
@@ -4,6 +4,7 @@
 
 /*! Spectre.css Experimentals v#{$version} | MIT License | github.com/picturepan2/spectre */
 // Experimentals
+@import "autocomplete";
 @import "calendars";
 @import "carousels";
 @import "comparison-sliders";
diff --git a/src/spectre.scss b/src/spectre.scss
index 42502a6..c0d9001 100644
--- a/src/spectre.scss
+++ b/src/spectre.scss
@@ -23,7 +23,6 @@
 
 // Components
 @import "accordions";
-@import "autocomplete";
 @import "avatars";
 @import "badges";
 @import "breadcrumbs";