Skip to content

Commit

Permalink
feat(box-shadow): remove deprecated layer, use box-shadow mixin (#5126)
Browse files Browse the repository at this point in the history
  • Loading branch information
@tw15egan @asudoh
tw15egan authored and asudoh committed Jan 22, 2020
1 parent a04a3d5 commit aed0ea2
Show file tree
Hide file tree
Showing 17 changed files with 17 additions and 139 deletions.
3 changes: 1 addition & 2 deletions packages/components/src/components/copy-button/_copy-button.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@
@import '../../globals/scss/vars';
@import '../../globals/scss/typography';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layer';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';
@import '../button/button';
Expand Down Expand Up @@ -36,7 +35,7 @@
}

&:before {
@include layer('overlay');
@include box-shadow;
@include type-style('body-short-01');
top: 1.1rem;
padding: $spacing-02;
Expand Down
5 changes: 2 additions & 3 deletions packages/components/src/components/data-table/_data-table-inline-edit-cell.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@

@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/layer';
@import '../../globals/scss/layout';
@import '../../globals/scss/vars';

Expand Down Expand Up @@ -206,7 +205,7 @@
$size--edit-actions--height: 3rem;

.#{$prefix}--data-table__edit-actions {
@include layer('overlay');
@include box-shadow;

display: flex;
justify-content: flex-end;
Expand Down Expand Up @@ -291,7 +290,7 @@
}

.#{$prefix}--data-table__error-text {
@include layer('overlay');
@include box-shadow;

position: absolute;
top: rem(-1px);
Expand Down
3 changes: 1 addition & 2 deletions packages/components/src/components/date-picker/_date-picker.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
@import '../../globals/scss/css--reset';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/layer';
@import '../form/form';
@import 'flatpickr.scss';

Expand Down Expand Up @@ -157,7 +156,7 @@

.#{$prefix}--date-picker__calendar,
.flatpickr-calendar.open {
@include layer('pop-out');
@include box-shadow;
background-color: $ui-01;
display: flex;
flex-direction: column;
Expand Down
7 changes: 3 additions & 4 deletions packages/components/src/components/dropdown/_dropdown.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@

@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layer';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';
@import '../../globals/scss/layout';
Expand Down Expand Up @@ -119,7 +118,7 @@
}

.#{$prefix}--dropdown--open .#{$prefix}--dropdown-list {
@include layer('overlay');
@include box-shadow;
}

.#{$prefix}--dropdown--light {
Expand Down Expand Up @@ -167,7 +166,7 @@
.#{$prefix}--dropdown-list {
@include reset;
@include focus-outline('reset');
@include layer('overlay');
@include box-shadow;
@include type-style('body-short-01');
background-color: $ui-01;
display: flex;
Expand Down Expand Up @@ -395,7 +394,7 @@

.#{$prefix}--dropdown--inline.#{$prefix}--dropdown--open:focus
.#{$prefix}--dropdown-list {
@include layer('overlay');
@include box-shadow;
}

.#{$prefix}--dropdown--inline .#{$prefix}--dropdown-link {
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/list-box/_list-box.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
@import '../../globals/scss/css--helpers';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layout';
@import '../../globals/scss/layer';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';

Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/modal/_modal.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layout';
@import '../../globals/scss/layer';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';

Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/notification/_inline-notification.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@

@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layer';
@import '../../globals/scss/layout';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/notification/_toast-notification.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
//-----------------------------

@import '../../globals/scss/vars';
@import '../../globals/scss/layer';
@import '../../globals/scss/layout';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/helper-mixins';
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/overflow-menu/_overflow-menu.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/css--reset';
@import '../../globals/scss/layer';
@import '../../globals/scss/layout';
@import '../../globals/scss/typography';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/slider/_slider.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@

@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layer';
@import '../../globals/scss/typography';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../form/form';
Expand Down
3 changes: 1 addition & 2 deletions packages/components/src/components/tabs/_tabs.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@

@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layer';
@import '../../globals/scss/layout';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';

Expand Down Expand Up @@ -104,7 +103,7 @@
}

.#{$prefix}--tabs__nav {
@include layer('overlay');
@include box-shadow;
margin: 0;
padding: 0;
position: absolute;
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/components/tile/_tile.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@

@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/layer';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';

Expand Down
7 changes: 3 additions & 4 deletions packages/components/src/components/tooltip/_tooltip.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@
//

@import '../../globals/scss/vars';
@import '../../globals/scss/layer';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/tooltip';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
Expand Down Expand Up @@ -53,7 +52,7 @@
}

&::after {
@include layer('overlay');
@include box-shadow;
min-width: rem(24px);
max-width: rem(208px);
height: rem(24px);
Expand Down Expand Up @@ -164,7 +163,7 @@

.#{$prefix}--tooltip--definition__bottom,
.#{$prefix}--tooltip--definition__top {
@include layer('overlay');
@include box-shadow;
position: absolute;
z-index: 1;
display: none;
Expand Down Expand Up @@ -349,7 +348,7 @@
}

.#{$prefix}--tooltip {
@include layer('overlay');
@include box-shadow;
@include reset;
position: absolute;
display: none;
Expand Down
17 changes: 4 additions & 13 deletions packages/components/src/globals/scss/_helper-mixins.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,27 +43,18 @@

/// Adds placeholder text color
/// @access public
/// @param {String} $size ['small'] - Size of box shadow
/// @example @include placeholder-colors;
/// @group global-helpers
@mixin placeholder-colors {
color: $text-03;
}

/// Adds small or large box shadow
/// Adds box shadow
/// @access public
/// @param {String} $size ['small'] - size of box shadow
/// @example @include box-shadow(); @include box-shadow('large');
/// @example @include box-shadow;
/// @group global-helpers
@mixin box-shadow($size: 'small') {
// Large - For dropdowns
@if ($size == 'large') {
box-shadow: 6px 6px 6px 0 $box-shadow;
}

@if ($size == 'small') {
box-shadow: 0px 3px 3px 0 $box-shadow;
}
@mixin box-shadow {
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

/// Adds outline styles depending on specific type
Expand Down
93 changes: 0 additions & 93 deletions packages/components/src/globals/scss/_layer.scss
View file

This file was deleted.

4 changes: 2 additions & 2 deletions packages/components/src/globals/scss/_tooltip.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
// LICENSE file in the root directory of this source tree.
//

@import 'layer';
@import 'helper-mixins';

// Tooltip
// Tooltip caret visual styles
Expand All @@ -26,7 +26,7 @@
/// @access public
/// @group tooltip
@mixin tooltip--content($tooltip-type: 'icon') {
@include layer('overlay');
@include box-shadow;
width: max-content;
max-width: rem(208px);
height: auto;
Expand Down
7 changes: 0 additions & 7 deletions packages/components/src/globals/scss/styles.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,6 @@ $css--helpers: true !default;
/// @group feature-flags
$css--body: true !default;

/// If true, the `layer()` mixin sets `box-shadow` values
/// @access public
/// @type Bool
/// @group feature-flags
$css--use-layer: true !default;

/// If true, include reset CSS
/// @access public
/// @type Bool
Expand Down Expand Up @@ -73,7 +67,6 @@ $css--use-experimental-grid-fallback: false !default;
@import 'theme';
@import 'mixins';
@import 'layout';
@import 'layer';
@import 'spacing';
@import 'typography';
@import './vendor/@carbon/elements/scss/import-once/import-once';
Expand Down

0 comments on commit aed0ea2

Please sign in to comment.