reorg bootstrap variable files into folder to prevent confusion

scss/_buttons.scss

@@ -23,7 +23,7 @@
   cursor: pointer;
   background: transparent;
   border: 0;
-  border-radius: $border-radius-base;
+  border-radius: $border-radius;
   outline: none;
   transition: box-shadow 0.2s $mdb-animation-curve-fast-out-linear-in, background-color 0.2s $mdb-animation-curve-default, color 0.2s $mdb-animation-curve-default;
   will-change: box-shadow, transform;
@@ -221,7 +221,7 @@
   }
 
   .dropdown-menu {
-    border-radius: 0 0 $border-radius-base $border-radius-base;
+    border-radius: 0 0 $border-radius $border-radius;
   }
 
   &.btn-group-raised {

scss/_cards.scss

@@ -19,7 +19,7 @@
 //
 //  /**************************************************************************/
 //
-//  border-radius: $border-radius-base;
+//  border-radius: $border-radius;
 //  color: $mdb-card-body-text;
 //  background: $mdb-card-body-background;
 //

scss/_checkboxes.scss

@@ -47,7 +47,7 @@ label.checkbox-inline,
       width: $mdb-checkbox-size;
       height: $mdb-checkbox-size;
       overflow: hidden;
-      border: $border-radius-base solid $mdb-checkbox-border-color;
+      border: $border-radius solid $mdb-checkbox-border-color;
     }
     .check::before {
       position: absolute;

scss/_modal.scss

@@ -5,7 +5,7 @@
 .modal-content {
   @include shadow-z-5();
   border: 0;
-  border-radius: $border-radius-base;
+  border-radius: $border-radius;
   // Modal header
   // Top section of the modal w/ title and dismiss
   .modal-header {

scss/_popover.scss

@@ -4,7 +4,7 @@
   color: $mdb-popover-color;
   background: $mdb-popover-background;
   border: 0;
-  border-radius: $border-radius-base;
+  border-radius: $border-radius;
   @include shadow-z-1();
 }
 

scss/_variables.scss

@@ -1,11 +1,7 @@
 @import "variables/colors";
 
-// Typography elements FIXME: review to see if we actually need these
-$mdb-text-color-light: rgba($white, 0.84) !default; //hsla(0, 0%, 100%, 0.84) !default; // white 0.84 //unquote("rgba(#{$rgb-white}, 0.84)") !default;
 $mdb-text-color-primary: rgba($black, 0.87) !default;
-$mdb-font-weight-base: 400;
-$icon-color: rgba($black, 0.5) !default;
-
+$mdb-text-color-light: rgba($white, 0.84) !default;
 
 // redefine ? TODO: do we need this mdb variant?  This is used as $body-color
 $gray-dark: $mdb-text-color-primary;
@@ -13,22 +9,26 @@ $gray-dark: $mdb-text-color-primary;
 //---
 // Customized BS variables
 $enable-flex: true;
-@import "variables/body";
-@import "variables/brand";
-@import "variables/buttons";
-@import "variables/code";
-@import "variables/forms";
-@import "variables/state";
-@import "variables/type";
-
-
-$border-radius-base: 2px !default;
-$border-radius-small: 1px !default;
+@import "variables/bootstrap/body";
+@import "variables/bootstrap/brand";
+@import "variables/bootstrap/buttons";
+@import "variables/bootstrap/code";
+@import "variables/bootstrap/components";
+@import "variables/bootstrap/forms";
+@import "variables/bootstrap/state";
+@import "variables/bootstrap/type";
 
 
 //---
-// Bootstrap Material Design variables start with mdb-
+// verified in use with refactoring to v4
+$mdb-font-weight-base: 400;
+
+
+//---
+//-- unverified below here
 $mdb-brand-inverse: $indigo !default;
+// Typography elements FIXME: review to see if we actually need these
+$icon-color: rgba($black, 0.5) !default;
 
 // ANIMATION
 $mdb-animation-curve-fast-out-slow-in: cubic-bezier(0.4, 0, 0.2, 1) !default;

scss/mixins/_variations.scss

@@ -53,7 +53,7 @@
 //    }
 //  }
 //  .dropdown-menu {
-//    border-radius: $border-radius-base;
+//    border-radius: $border-radius;
 //    li > a {
 //      font-size: $mdb-dropdown-font-size;
 //      padding: 13px 16px;

scss/plugins/_plugin-nouislider.scss

@@ -91,7 +91,7 @@
 //}
 //
 //.noUi-target {
-//  border-radius: $border-radius-base;
+//  border-radius: $border-radius;
 //}
 //
 //.noUi-horizontal {

scss/plugins/_plugin-selectize.scss

@@ -68,7 +68,7 @@
 //    height: auto;
 //    background-color: #FFF;
 //    box-shadow: 0 1px 3px rgba($black, 0.12), 0 1px 2px rgba($black, 0.24);
-//    border-radius: $border-radius-base;
+//    border-radius: $border-radius;
 //    padding: 0;
 //    margin-top: 3px;
 //    .active {

scss/plugins/_plugin-snackbarjs.scss

@@ -6,7 +6,7 @@
   font-size: 14px;
   color: $mdb-text-color-light;
   background-color: #323232;
-  border-radius: $border-radius-base;
+  border-radius: $border-radius;
   transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0s linear 0.2s, padding 0s linear 0.2s, height 0s linear 0.2s;
   transform: translateY(200%);
 

scss/variables/bootstrap/_components.scss

@@ -0,0 +1,16 @@
+// Components
+//
+// Define common padding and border radius sizes and more.
+
+//$line-height-lg:         (4 / 3) !default;
+//$line-height-sm:         1.5 !default;
+//
+$border-radius:          .125rem !default; // .25rem !default;
+//$border-radius-lg:       .3rem !default;
+$border-radius-sm:       .0625rem !default; // .2rem !default;
+//
+//$component-active-color: #fff !default;
+//$component-active-bg:    $brand-primary !default;
+//
+//$caret-width:            .3em !default;
+//$caret-width-lg:         $caret-width !default;