diff --git a/.stylelintrc b/.stylelintrc index 17c057466..9326b8199 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -4,12 +4,31 @@ ], "rules": { "declaration-no-important": null, + "declaration-property-value-disallowed-list": { + "border": "none", + "outline": "none" + }, "function-disallowed-list": [ "calc", "lighten", "darken" ], "keyframes-name-pattern": null, + "property-disallowed-list": [ + "border-radius", + "border-top-left-radius", + "border-top-right-radius", + "border-bottom-right-radius", + "border-bottom-left-radius", + "transition" + ], + "scss/dollar-variable-default": [ + true, + { + "ignore": "local" + } + ], + "scss/selector-no-union-class-name": true, "selector-max-class": null, "selector-max-combinators": null, "selector-max-compound-selectors": null, diff --git a/gulpfile.js b/gulpfile.js index c025a2f38..ba1745ffc 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -168,7 +168,7 @@ const serve = () => { // Clean const cleanDist = () => del([paths.dist.base]) -const lintDistScss = () => src([paths.src.scss + '/**/*.scss']) +const lintDistScss = () => src([paths.src.scss + '/**/*.scss'], ['./.temp/**/*.css']) .pipe(gulpStylelint({ failAfterError: false, reporters: [ diff --git a/src/partials/_head.html b/src/partials/_head.html index b9f35fe0f..971988c95 100644 --- a/src/partials/_head.html +++ b/src/partials/_head.html @@ -4,7 +4,7 @@ - + diff --git a/src/partials/dashboard/_topbar.html b/src/partials/dashboard/_topbar.html index 4d00435fb..6162c8e0a 100644 --- a/src/partials/dashboard/_topbar.html +++ b/src/partials/dashboard/_topbar.html @@ -27,7 +27,7 @@
  • - 3 + 3
    @@ -91,7 +91,7 @@
  • - 15 + 15
    15 Notifications diff --git a/src/scss/_bootstrap-variables.scss b/src/scss/_bootstrap-variables.scss index 23ede7e92..28a3be1e4 100644 --- a/src/scss/_bootstrap-variables.scss +++ b/src/scss/_bootstrap-variables.scss @@ -724,7 +724,7 @@ $table-border-color: $border-color !default; $table-striped-order: odd !default; -$table-group-separator-color: currentColor !default; +$table-group-separator-color: currentcolor !default; $table-caption-color: $text-muted !default; diff --git a/src/scss/_brand-container.scss b/src/scss/_brand-container.scss index 2b6229805..31c25248c 100644 --- a/src/scss/_brand-container.scss +++ b/src/scss/_brand-container.scss @@ -12,7 +12,7 @@ overflow: hidden; font-size: $navbar-brand-font-size; white-space: nowrap; - transition: width $lte-transition-speed $lte-transition-fn; + @include transition(width $lte-transition-speed $lte-transition-fn); .brand-link { grid-area: brand-link; diff --git a/src/scss/_cards.scss b/src/scss/_cards.scss index eaeb630b0..fa2b1ce81 100644 --- a/src/scss/_cards.scss +++ b/src/scss/_cards.scss @@ -378,12 +378,12 @@ html.maximized-card { // Todo list element > li { - @include border-radius(2px); padding: 10px; margin-bottom: 2px; color: $gray-700; background-color: $gray-100; border-left: 2px solid $gray-200; + @include border-radius(2px); &:last-of-type { margin-bottom: 0; diff --git a/src/scss/_custom-utilities.scss b/src/scss/_custom-utilities.scss index 8a88f1460..aa02036fb 100644 --- a/src/scss/_custom-utilities.scss +++ b/src/scss/_custom-utilities.scss @@ -1,20 +1,25 @@ -// Utilities +// Custom Utilities -// util-opacity -$utilities: ( - "opacity": ( - property: opacity, - values: ( - 0: 0, - 20: .2, - 30: .3, - 40: .4, - 50: .5, - 60: .6, - 70: .7, - 80: .8, - 90: .9, - 100: 1, +$utilities: () !default; +// stylelint-disable-next-line scss/dollar-variable-default +$utilities: map-merge( + ( + // util-opacity + "opacity": ( + property: opacity, + values: ( + 0: 0, + 20: .2, + 30: .3, + 40: .4, + 50: .5, + 60: .6, + 70: .7, + 80: .8, + 90: .9, + 100: 1, + ) ) - ) + ), + $utilities ); diff --git a/src/scss/_direct-chat.scss b/src/scss/_direct-chat.scss index 077d70aee..f87eb95c9 100644 --- a/src/scss/_direct-chat.scss +++ b/src/scss/_direct-chat.scss @@ -48,7 +48,7 @@ .direct-chat-messages, .direct-chat-contacts { - transition: transform .5s ease-in-out; + @include transition(transform .5s ease-in-out); } .direct-chat-text { diff --git a/src/scss/_dropdown.scss b/src/scss/_dropdown.scss index 3cb5a11a4..ddb5cbfd3 100644 --- a/src/scss/_dropdown.scss +++ b/src/scss/_dropdown.scss @@ -240,6 +240,6 @@ height: $lte-sidebar-user-image-width; margin-top: -2px; // margin-right: 10px; - border-radius: 50%; + @include border-radius(50%); } } diff --git a/src/scss/_info-box.scss b/src/scss/_info-box.scss index 6ba115557..ef264322e 100644 --- a/src/scss/_info-box.scss +++ b/src/scss/_info-box.scss @@ -25,16 +25,13 @@ } .info-box-icon { - @if $enable-rounded { - border-radius: $border-radius; - } - display: flex; align-items: center; justify-content: center; width: 70px; font-size: 1.875rem; text-align: center; + @include border-radius($border-radius); > img { max-width: 100%; diff --git a/src/scss/_layout-fixed.scss b/src/scss/_layout-fixed.scss index b7bf5beb2..e1ec71653 100644 --- a/src/scss/_layout-fixed.scss +++ b/src/scss/_layout-fixed.scss @@ -16,7 +16,7 @@ .content-wrapper, .main-footer { margin-left: $lte-sidebar-width; - transition: $lte-transition-speed $lte-transition-fn; + @include transition($lte-transition-speed $lte-transition-fn); } &.sidebar-collapse { diff --git a/src/scss/_main-header.scss b/src/scss/_main-header.scss index 2ae0e68bd..bf451ae38 100644 --- a/src/scss/_main-header.scss +++ b/src/scss/_main-header.scss @@ -27,7 +27,6 @@ right: 5px; padding: 2px 4px; font-size: .6rem; - font-weight: 300; } .layout-navbar-fixed { diff --git a/src/scss/_main-sidebar.scss b/src/scss/_main-sidebar.scss index 30b231bca..8f487461d 100644 --- a/src/scss/_main-sidebar.scss +++ b/src/scss/_main-sidebar.scss @@ -57,7 +57,7 @@ .hold-transition { .main-sidebar { - transition: none !important; + @include transition(none !important); animation: none !important; } } diff --git a/src/scss/_miscellaneous.scss b/src/scss/_miscellaneous.scss index 23f04310d..0bc0fd033 100644 --- a/src/scss/_miscellaneous.scss +++ b/src/scss/_miscellaneous.scss @@ -40,7 +40,7 @@ padding-left: 0; border-right: 0; border-left: 0; - border-radius: 0; + @include border-radius(0); } } @@ -296,8 +296,8 @@ height: add(100%, (2 * $card-spacer-x)); margin-top: -$card-spacer-x; margin-left: -$card-spacer-x; - border-top-left-radius: 0; - border-top-right-radius: 0; + @include border-top-start-radius(0); + @include border-top-end-radius(0); &.dark { color: $white; } @@ -468,7 +468,7 @@ blockquote { padding: $lte-button-padding-y-xs * 2 $lte-button-padding-x-xs * 2; font-size: $lte-button-font-size-xs; font-weight: 400; - border-radius: $lte-button-border-radius-xs; + @include border-radius($lte-button-border-radius-xs); } .badge-btn.badge-pill { diff --git a/src/scss/_small-box.scss b/src/scss/_small-box.scss index b3154c5ae..e90ad1c0a 100644 --- a/src/scss/_small-box.scss +++ b/src/scss/_small-box.scss @@ -101,7 +101,7 @@ top: 15px; right: 15px; font-size: 90px; - transition: transform $lte-transition-speed linear; + @include transition(transform $lte-transition-speed linear); &.inner-icon { top: 20px; @@ -114,7 +114,7 @@ top: 15px; right: 15px; font-size: 70px; - transition: transform $lte-transition-speed linear; + @include transition(transform $lte-transition-speed linear); } } diff --git a/src/scss/_table.scss b/src/scss/_table.scss index a13b0046b..27230d821 100644 --- a/src/scss/_table.scss +++ b/src/scss/_table.scss @@ -84,7 +84,7 @@ cursor: pointer; i.expandable-table-caret { - transition: transform $lte-transition-speed linear; + @include transition(transform $lte-transition-speed linear); } &[aria-expanded="true"] { td i.expandable-table-caret { diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss index 5cc5ebdf8..773c1055f 100644 --- a/src/scss/_variables.scss +++ b/src/scss/_variables.scss @@ -68,7 +68,7 @@ $lte-sidebar-custom-padding-y: .5rem !default; $lte-sidebar-transition: min-width $lte-transition-speed $lte-transition-fn, max-width $lte-transition-speed $lte-transition-fn, margin-left $lte-transition-speed $lte-transition-fn, - margin-right $lte-transition-speed $lte-transition-fn; + margin-right $lte-transition-speed $lte-transition-fn !default; // margin-top $lte-transition-speed $lte-transition-fn, // transform $lte-transition-speed $lte-transition-fn; @@ -112,7 +112,7 @@ $lte-sidebar-user-image-width: $lte-sidebar-nav-icon-width + ($nav-link-paddi // SIDEBAR HORIZONTAL // -------------------------------------------------------- -$lte-sidebar-horizontal-width: 100%; +$lte-sidebar-horizontal-width: 100% !default; $lte-sidebar-horizontal-height: 80px !default; // CONTROL SIDEBAR @@ -136,16 +136,16 @@ $lte-main-header-height-sm: add($lte-main-header-height-sm-inner, $lt // -------------------------------------------------------- // Dark sidebar -$lte-header-dark-bg: $dark; -$lte-header-dark-color: $white; -$lte-header-mobile-dark-bg: $dark; -$lte-header-mobile-dark-color: $white; +$lte-header-dark-bg: $dark !default; +$lte-header-dark-color: $white !default; +$lte-header-mobile-dark-bg: $dark !default; +$lte-header-mobile-dark-color: $white !default; // Light sidebar -$lte-header-light-bg: $white; -$lte-header-light-color: $dark; -$lte-header-mobile-light-bg: $light; -$lte-header-mobile-light-color: $dark; +$lte-header-light-bg: $white !default; +$lte-header-light-color: $dark !default; +$lte-header-mobile-light-bg: $light !default; +$lte-header-mobile-light-color: $dark !default; // Content padding $lte-content-padding-y: 0 !default; @@ -174,8 +174,8 @@ $lte-main-footer-color: tint-color($gray-700, 25%) !default; // BRAND LINK // -------------------------------------------------------- -$lte-brand-link-padding-y: $navbar-brand-padding-y + $navbar-padding-y; -$lte-brand-link-border-buttom: 1px; +$lte-brand-link-padding-y: $navbar-brand-padding-y + $navbar-padding-y !default; +$lte-brand-link-border-buttom: 1px !default; // Cards diff --git a/src/scss/bootstrap-dark/_placeholders.scss b/src/scss/bootstrap-dark/_placeholders.scss index 689d9af64..f89d08b19 100644 --- a/src/scss/bootstrap-dark/_placeholders.scss +++ b/src/scss/bootstrap-dark/_placeholders.scss @@ -1,5 +1,5 @@ .placeholder { - background-color: currentColor; + background-color: currentcolor; opacity: $placeholder-opacity-max-alt; } diff --git a/src/scss/bootstrap-dark/_reboot.scss b/src/scss/bootstrap-dark/_reboot.scss index 85219e7ee..6ae005b41 100644 --- a/src/scss/bootstrap-dark/_reboot.scss +++ b/src/scss/bootstrap-dark/_reboot.scss @@ -19,7 +19,7 @@ body { hr { color: $hr-color-alt; // 1 - // background-color: currentColor; + // background-color: currentcolor; opacity: $hr-opacity-alt; } diff --git a/src/scss/bootstrap-dark/_variables-alt.scss b/src/scss/bootstrap-dark/_variables-alt.scss index a5f51ce66..0818ef867 100644 --- a/src/scss/bootstrap-dark/_variables-alt.scss +++ b/src/scss/bootstrap-dark/_variables-alt.scss @@ -413,7 +413,7 @@ $table-hover-bg-alt: rgba($white-alt, $table-hover-bg-factor-alt) ! $table-border-factor-alt: .1 !default; $table-border-color-alt: $border-color-alt !default; -$table-group-separator-color-alt: currentColor !default; +$table-group-separator-color-alt: currentcolor !default; $table-caption-color-alt: $text-muted-alt !default; diff --git a/src/scss/bootstrap-dark/helpers/_vr.scss b/src/scss/bootstrap-dark/helpers/_vr.scss index aae254695..fac86b51a 100644 --- a/src/scss/bootstrap-dark/helpers/_vr.scss +++ b/src/scss/bootstrap-dark/helpers/_vr.scss @@ -1,6 +1,6 @@ // from commit [aee169d19](https://github.com/twbs/bootstrap/commit/aee169d19288d78330be2df0960ea8924353f84f) .vr { - background-color: currentColor; + background-color: currentcolor; opacity: $hr-opacity-alt; } diff --git a/src/scss/pages/_login_and_register.scss b/src/scss/pages/_login_and_register.scss index 7580de17e..4735935e7 100644 --- a/src/scss/pages/_login_and_register.scss +++ b/src/scss/pages/_login_and_register.scss @@ -84,9 +84,9 @@ color: #777; background-color: transparent; border-left: 0; - border-top-right-radius: $border-radius; - border-bottom-right-radius: $border-radius; - transition: $input-transition; + @include border-top-end-radius($border-radius); + @include border-bottom-end-radius($border-radius); + @include transition($input-transition); } } }