Skip to content
Snippets Groups Projects
Commit 93f6e22a authored by Ivica Puljic's avatar Ivica Puljic
Browse files

Issue #3487357 by pivica: Remove all deprecated SASS variables

parent 4d528889
Branches 2.x
No related tags found
1 merge request!10Resolved all deprecated notes and some todos.
......@@ -54,13 +54,6 @@ $theme-colors: (
dark: $gray-800
) !default;
// Porting compatibility layer from Bootstrap alpha6 to beta1.
// @todo - refactor and remove.
$gray-dark: map-get($colors, 'gray-dark') !default;
$gray: map-get($colors, 'gray') !default; // @todo - map-get($colors, 'gray')
$gray-light: map-get($theme-colors, 'gray-light') !default;
$gray-lighter: $gray-200 !default;
$gray-lightest: $gray-100 !default;
// Options
//
......@@ -139,9 +132,9 @@ $region-content-footer-margin: $container-spacer-y !default;
// Components
$body-bg: $white !default;
$body-color: $gray-dark !default;
$body-color: map-get($colors, 'gray-dark') !default;
$border-color: $gray-lighter !default;
$border-color: $gray-200 !default;
$border-radius: $spacer / 4 !default;
$disabled-color: $gray-600 !default;
......@@ -159,7 +152,7 @@ $shadow-dark: map-merge(
);
// Table
$table-head-bg: $gray-lightest !default;
$table-head-bg: $gray-100 !default;
$table-bg-hover: #f7fcff !default;
// Links
......@@ -206,7 +199,7 @@ $field-label-inline-breakpoint: 'sm' !default;
$block-spacer-y: $spacer !default;
// Header (navbar) region.
$header-bg: $gray-lighter !default;
$header-bg: $gray-200 !default;
$header-color: false !default;
$header-border-color: rgba($black, .1) !default;
$header-grid-gutter-width: $grid-gutter-width !default;
......@@ -228,8 +221,6 @@ $header-top-color: $header-color !default;
$header-top-font-size: $font-size-sm !default;
$header-top-link-padding-x: $nav-link-padding-x/2 !default;
$header-top-link-padding-y: $nav-link-padding-y !default;
// DEPRECIATED - use x/y combination from above instead.
$header-top-link-padding: $header-top-link-padding-y $header-top-link-padding-x !default;
$header-top-link-color: $header-link-color !default;
$header-top-link-hover-color: $header-link-hover-color !default;
$header-top-link-active-color: $header-link-active-color !default;
......@@ -252,26 +243,19 @@ $header-top-link-active-border-color: $header-top-link-active-color !default;
// or much stronger out of the box responsive support for a logo inside of a
// brand region.
$brand-logo-width: auto !default;
// Max allowed logo dimensions.
// DEPRECIATED $brand-logo-max-width, instead use
// $navbar-brand-responsive-widths map set.
$brand-logo-max-width: 350px !default;
// Max allowed logo height.
$brand-logo-max-height: 100px !default;
// Path color of a SVG logo version.
$brand-logo-svg-color: $body-color !default;
$brand-logo-hover-svg-color: false !default;
// Limit navbar brand region max width.
// DEPRECIATED $navbar-brand-max-width, instead use
// $navbar-brand-responsive-widths map set.
$navbar-brand-max-width: 75% !default;
// Navbar brand responsive widths.
$navbar-brand-responsive-widths: () !default;
@if ($navbar-brand-responsive-widths) {
$navbar-brand-responsive-widths: bs-map-merge((
xs: $navbar-brand-max-width,
$responsive-break: $brand-logo-max-width,
xs: 75%,
$responsive-break: 350px,
), $navbar-brand-responsive-widths);
}
......@@ -311,7 +295,7 @@ $navbar-border-bottom-width: 1px !default;
$navbar-border-bottom: $navbar-border-bottom-width solid $header-border-color !default;
// Lets define again toggler icon so we can change the icon.
// @todo - this is a bit messy, problem is that we are defining header-* vars
// and Bootstrap is defining them as navbar-*. If we wan't to keep header-* vars
// and Bootstrap is defining them as navbar-*. If we want to keep header-* vars
// we should override all relative navbar-* vars.
$navbar-toggler-color: $header-link-color !default;
$navbar-toggler-bg-color: false !default;
......@@ -351,8 +335,6 @@ $navbar-small-dropdown-menu-hover-bg: transparent !default;
$navbar-small-dropdown-menu-active-bg: transparent !default;
$navbar-small-dropdown-link-padding-x: 0.5rem !default;
$navbar-small-dropdown-link-padding-y: 0.5rem !default;
// DEPRECIATED - use x/y combination from above instead.
$navbar-small-dropdown-link-padding: $navbar-small-dropdown-link-padding-y $navbar-small-dropdown-link-padding-x !default;
// Dropdown
$dropdown-link-color: $link-color !default;
......@@ -360,7 +342,7 @@ $dropdown-link-hover-color: $link-hover-color !default;
// Footer region.
$footer-spacer-y: 2 * $spacer !default;
$footer-bg: $gray-lighter !default;
$footer-bg: $gray-200 !default;
$footer-border: false !default;
$footer-color: $body-color !default;
$footer-heading-color: $footer-color !default;
......@@ -399,5 +381,5 @@ $content-box-shadow: (
5: (0: 0 19px 38px rgba($black, 0.30), 1: 0 15px 12px rgba($black, 0.22))
) !default;
$node-preview-container-bg: lighten($gray-lighter, 5%) !default;
$node-preview-container-bg: lighten($gray-200, 5%) !default;
$node-preview-container-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.3333) !default;
......@@ -418,11 +418,6 @@ function bs_bootstrap_preprocess_block(&$variables) {
$logo_attributes['width'] = $image->getWidth();
$logo_attributes['height'] = $image->getHeight();
}
// Keep the old site_logo_alt_text for compatibility with older
// custom themes that are using site_logo_alt_text.
// @TODO - remove for 2.x version.
$variables['site_logo_alt_text'] = t('Site logo');
}
$variables['logo_attributes'] = new Attribute($logo_attributes);
......
......@@ -17,5 +17,4 @@
// Mixins.
@import "mixin/icons";
@import "mixin/util";
@import "mixin/svg";
@import "bootstrap/scss/mixins";
......@@ -7,6 +7,8 @@
// @todo With the moving assets to bs_lib (https://www.drupal.org/node/2890739)
// this should maybe be refactored and this should go to bs_lib/progress
// component?
// @note - no need to do this because this utilities does not exist in B5.3, and
// this will be removed when we port to BS5.
@import "bootstrap/scss/utilities/background";
@import "bootstrap/scss/utilities/sizing";
......
......@@ -44,9 +44,7 @@
}
}
// @TODO - not sure why are we even supporting case where details can be
// inlined - do we have this kind of a case in views exposed filters or
// somewhere else? Consider to remove this in future.
// BEF contrib module details option.
> details.form-group {
flex: 1 0 100%;
// We need to dynamically lower width for one $spacer unit because details
......
......@@ -331,8 +331,6 @@
.nav-links {
.is-active > a:not(.btn) {
color: $navbar-offcanvas-link-active-color;
//@include style-link($navbar-offcanvas-link-active-color, $navbar-offcanvas-link-active-color);
}
}
......
......@@ -100,7 +100,9 @@ body.toolbar-fixed .toolbar-oriented .toolbar-bar {
}
height: auto;
max-width: 100%;
max-height: if($brand-logo-max-height, $brand-logo-max-height, 100%);
@if $brand-logo-max-height {
max-height: $brand-logo-max-height;
}
// Fix iPhone Safari problem when logo height is bigger then
// $brand-logo-max-height.
object-fit: contain;
......@@ -193,8 +195,7 @@ body.toolbar-fixed .toolbar-oriented .toolbar-bar {
}
}
// For sidebar main navigation we want for all links the same design so we
// need to reset some rules that can come from dropdown menu.
// Second level dropdown menu items in main sidebar navigation.
.navmenu {
.dropdown-menu {
margin-top: 0;
......
// Function to create an optimized svg url.
// Depreciated, use Bootstrap escape-svg() instead.
// @TODO remove in 2.x
@function svg-url($svg) {
@warn "Function svg-url is depreciated and will be removed in 2.x version. Please use Bootstrap escape-svg instead.";
@return escape-svg($svg);
}
// Background svg mixin.
@mixin background-svg($svg) {
@warn "Function background-svg is depreciated and will be removed in 2.x version. Please use url(escape-svg($svg)) instead.";
background-image: url(escape-svg($svg));
}
......@@ -25,14 +25,14 @@
}
// Style a link.
// TODO for 2.x version this mixin should probably be removed. Color part should
// go to callers which should just adjust CSS vars. Text decoration was here
// just so support style-nav-link() and now that part is moved there.
@mixin style-link($color, $hover-color, $active-color: $hover-color, $text-decoration: $link-decoration, $text-hover-decoration: $link-hover-decoration, $link-disabled-color: $nav-link-disabled-color) {
@mixin style-link($color, $hover-color, $active-color: $hover-color, $text-decoration: false, $text-hover-decoration: false, $link-disabled-color: false) {
--#{$prefix}link-color: #{$color};
--#{$prefix}link-hover-color: #{$hover-color};
--bsb-link-active-color: #{$active-color};
--bsb-link-disabled-color: #{$link-disabled-color};
@if $link-disabled-color {
--bsb-link-disabled-color: #{$link-disabled-color};
}
@if $text-decoration {
text-decoration: $text-decoration;
......@@ -46,8 +46,8 @@
}
}
// We don't have always active class so lets use them both for now unit
// we figure can we fix this with just one class @todo.
// Bootstrap is using active and Drupal is using is-active CSS class.
// @todo - should we unify this and use only one CSS class?
&.is-active,
&.active {
--#{$prefix}link-color: var(--bsb-link-active-color);
......@@ -66,11 +66,6 @@
// Style a menu navigation link.
@mixin style-nav-link($color, $hover-color, $active-color: $hover-color, $text-decoration: $link-decoration, $text-hover-decoration: $nav-link-hover-text-decoration, $link-hover-border-width: $nav-link-hover-border-width, $link-hover-border-color: $nav-link-hover-border-color, $link-active-border-color: $nav-link-active-border-color, $link-disabled-color: $nav-link-disabled-color) {
// If $link-hover-border-width is defined this means we are using border
// bottom hover animation and not simple text-decoration underline.
//@include style-link($color, $hover-color, $active-color: $hover-color, $text-decoration: if($link-hover-border-width, false, $text-decoration), $text-hover-decoration: if($link-hover-border-width, false, $text-hover-decoration));
--#{$prefix}nav-link-color: #{$color};
--#{$prefix}nav-link-hover-color: #{$hover-color};
--#{$prefix}nav-link-disabled-color: #{$active-color};
......
......@@ -11,7 +11,7 @@ sass:
# Theme colors override.
primary: '$blue'
secondary: '$gray-light'
secondary: 'map-get($theme-colors, "gray-light")'
theme-colors:
primary: '$primary'
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment