From d725f378f19978d4eaa07c06e8912e14837980ed Mon Sep 17 00:00:00 2001 From: Kevin Ross Date: Thu, 10 Dec 2015 11:53:55 -0600 Subject: [PATCH] reorg bootstrap variable files into folder to prevent confusion --- scss/_buttons.scss | 4 +-- scss/_cards.scss | 2 +- scss/_checkboxes.scss | 2 +- scss/_modal.scss | 2 +- scss/_popover.scss | 2 +- scss/_variables.scss | 34 ++++++++++---------- scss/mixins/_variations.scss | 2 +- scss/plugins/_plugin-nouislider.scss | 2 +- scss/plugins/_plugin-selectize.scss | 2 +- scss/plugins/_plugin-snackbarjs.scss | 2 +- scss/variables/{ => bootstrap}/_body.scss | 0 scss/variables/{ => bootstrap}/_brand.scss | 0 scss/variables/{ => bootstrap}/_buttons.scss | 0 scss/variables/{ => bootstrap}/_code.scss | 0 scss/variables/bootstrap/_components.scss | 16 +++++++++ scss/variables/{ => bootstrap}/_forms.scss | 0 scss/variables/{ => bootstrap}/_state.scss | 0 scss/variables/{ => bootstrap}/_type.scss | 0 18 files changed, 43 insertions(+), 27 deletions(-) rename scss/variables/{ => bootstrap}/_body.scss (100%) rename scss/variables/{ => bootstrap}/_brand.scss (100%) rename scss/variables/{ => bootstrap}/_buttons.scss (100%) rename scss/variables/{ => bootstrap}/_code.scss (100%) create mode 100644 scss/variables/bootstrap/_components.scss rename scss/variables/{ => bootstrap}/_forms.scss (100%) rename scss/variables/{ => bootstrap}/_state.scss (100%) rename scss/variables/{ => bootstrap}/_type.scss (100%) diff --git a/scss/_buttons.scss b/scss/_buttons.scss index c5dcdf0b..3243531e 100644 --- a/scss/_buttons.scss +++ b/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 { diff --git a/scss/_cards.scss b/scss/_cards.scss index 0a22ffd6..75d6e971 100644 --- a/scss/_cards.scss +++ b/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; // diff --git a/scss/_checkboxes.scss b/scss/_checkboxes.scss index 84301777..5a02714a 100644 --- a/scss/_checkboxes.scss +++ b/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; diff --git a/scss/_modal.scss b/scss/_modal.scss index 2e2dafbb..c61fb56d 100644 --- a/scss/_modal.scss +++ b/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 { diff --git a/scss/_popover.scss b/scss/_popover.scss index f24f73b2..905e2f82 100644 --- a/scss/_popover.scss +++ b/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(); } diff --git a/scss/_variables.scss b/scss/_variables.scss index 5d1191b2..e9ae1f2f 100644 --- a/scss/_variables.scss +++ b/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; diff --git a/scss/mixins/_variations.scss b/scss/mixins/_variations.scss index dfa89a94..627275c1 100644 --- a/scss/mixins/_variations.scss +++ b/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; diff --git a/scss/plugins/_plugin-nouislider.scss b/scss/plugins/_plugin-nouislider.scss index 84293380..939b201b 100644 --- a/scss/plugins/_plugin-nouislider.scss +++ b/scss/plugins/_plugin-nouislider.scss @@ -91,7 +91,7 @@ //} // //.noUi-target { -// border-radius: $border-radius-base; +// border-radius: $border-radius; //} // //.noUi-horizontal { diff --git a/scss/plugins/_plugin-selectize.scss b/scss/plugins/_plugin-selectize.scss index e258d5e7..b188cb6a 100644 --- a/scss/plugins/_plugin-selectize.scss +++ b/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 { diff --git a/scss/plugins/_plugin-snackbarjs.scss b/scss/plugins/_plugin-snackbarjs.scss index 0341fc16..c91ce337 100644 --- a/scss/plugins/_plugin-snackbarjs.scss +++ b/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%); diff --git a/scss/variables/_body.scss b/scss/variables/bootstrap/_body.scss similarity index 100% rename from scss/variables/_body.scss rename to scss/variables/bootstrap/_body.scss diff --git a/scss/variables/_brand.scss b/scss/variables/bootstrap/_brand.scss similarity index 100% rename from scss/variables/_brand.scss rename to scss/variables/bootstrap/_brand.scss diff --git a/scss/variables/_buttons.scss b/scss/variables/bootstrap/_buttons.scss similarity index 100% rename from scss/variables/_buttons.scss rename to scss/variables/bootstrap/_buttons.scss diff --git a/scss/variables/_code.scss b/scss/variables/bootstrap/_code.scss similarity index 100% rename from scss/variables/_code.scss rename to scss/variables/bootstrap/_code.scss diff --git a/scss/variables/bootstrap/_components.scss b/scss/variables/bootstrap/_components.scss new file mode 100644 index 00000000..ff03bdbc --- /dev/null +++ b/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; diff --git a/scss/variables/_forms.scss b/scss/variables/bootstrap/_forms.scss similarity index 100% rename from scss/variables/_forms.scss rename to scss/variables/bootstrap/_forms.scss diff --git a/scss/variables/_state.scss b/scss/variables/bootstrap/_state.scss similarity index 100% rename from scss/variables/_state.scss rename to scss/variables/bootstrap/_state.scss diff --git a/scss/variables/_type.scss b/scss/variables/bootstrap/_type.scss similarity index 100% rename from scss/variables/_type.scss rename to scss/variables/bootstrap/_type.scss