new card elements

scss/_variables.scss

@@ -217,6 +217,8 @@ $card-border-radius: $border-radius !default;
 $card-cap-bg: $body-bg !default;
 
 $card-active-border-color: $blue !default;
+$card-status-size: 2px !default;
+$card-group-margin: 1.5rem !default;
 
 //close
 $close-font-weight: 400 !default;

scss/tabler.scss

@@ -12,7 +12,6 @@
 @import "fonts/webfonts";
 
 @import "layout/core";
-@import "layout/grid";
 @import "layout/navbar";
 @import "layout/page";
 
@@ -25,6 +24,7 @@
 @import "ui/cards";
 @import "ui/dropdowns";
 @import "ui/empty";
+@import "ui/grid";
 @import "ui/highlight";
 @import "ui/icons";
 @import "ui/inputs";

scss/ui/_cards.scss

@@ -1,8 +1,18 @@
 .card {
-  margin-bottom: 1.5rem;
+  margin-bottom: $card-group-margin;
   box-shadow: rgba(0, 0, 0, 0.04) 0 2px 4px 0;
 }
 
+.card-group {
+  margin-bottom: $card-group-margin;
+}
+
+.card-inactive {
+  box-shadow: none;
+  opacity: .8;
+  pointer-events: none;
+}
+
 .card-link {
   color: inherit;
 
@@ -136,7 +146,7 @@ Card status
  */
 .card-status-top {
   position: absolute;
-  height: 3px;
+  height: $card-status-size;
   border-radius: $card-border-radius $card-border-radius 0 0;
   top: 0;
   right: 0;
@@ -148,7 +158,7 @@ Card status
   right: auto;
   bottom: 0;
   height: 100%;
-  width: 3px;
+  width: 2px;
   border-radius: $card-border-radius 0 0 $card-border-radius;
 }
 
@@ -157,7 +167,7 @@ Card status
   bottom: 0;
   width: 100%;
   top: initial;
-  height: 3px;
+  height: 2px;
   border-radius: 0 0 $card-border-radius $card-border-radius;
 }
 

scss/ui/_grid.scss

@@ -2,6 +2,10 @@
   @include make-container-breakpoints();
 }
 
+.col-separator {
+  border-left: 1px solid $border-color;
+}
+
 .row-deck {
   > .col,
   > [class*='col-'] {

scss/ui/forms/_input.custom.scss

@@ -45,3 +45,8 @@ Bootstrap color input
     border: none;
   }
 }
+
+.form-check-input {
+  background: $white;
+  transition: .3s background-position, .3s background-color;
+}