Skip to content

Commit

Permalink
feat(design)!: remove all deprecated scss files and mixins in `@daffo…
Browse files Browse the repository at this point in the history 
…dil/design` (#2875)

BREAKING CHANGE:
- `uppercase()` mixin has been removed from the codebase. Set the `text-transform` style directly using scss.
- `single-line-ellipsis()` mixin has been removed from the codebase. Use `text-truncate()` instead.
- `@daffodil/design/scss/daff-util` has been replaced with `@daffodil/design/scss/utilities`
- `daff-tyopgraphy.scss` has been replaced with the typography folder.
- `@daffodil/design/scss/daff-global` has been replaced with `@daffodil/design/scss/global`
  • Loading branch information
@xelaint
xelaint committed Jun 20, 2024
1 parent affd3e8 commit 10bd1e9
Show file tree
Hide file tree
Showing 52 changed files with 87 additions and 174 deletions.
4 changes: 2 additions & 2 deletions ...o/src/app/content/why-pwa/components/feature-comparison/feature-comparison.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,11 @@

&__header {
@include comparison-cell();
@include daff.embolden();
align-items: flex-start;
font-size: 0.75rem;
padding: 15px 5px;
@include daff.embolden();
@include daff.uppercase();
text-transform: uppercase;

@include daff.breakpoint(tablet) {
padding: 25px 5px;
Expand Down
2 changes: 1 addition & 1 deletion apps/daffio/src/app/core/footer/footer/footer.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,11 +67,11 @@

&__link {
@include daff.embolden();
@include daff.uppercase();
display: flex;
align-items: center;
gap: 8px;
text-decoration: none;
text-transform: uppercase;
}

&__copyright {
Expand Down
2 changes: 1 addition & 1 deletion apps/daffio/src/app/design/device/iphone/iphone.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// @import 'theme';
// @import 'utilities';
// @use 'utilities' as *;

// $phoneColor: daff-map-deep-get($theme, "core.base");
// $phoneShadow: daff-illuminate($phoneColor, $daff-neutral, 3);
Expand Down
6 changes: 3 additions & 3 deletions ...-notification/components/add-to-cart-notification/add-to-cart-notification.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';
@import 'utilities';
@use 'utilities' as *;

.demo-add-to-cart-notification {
background-color: demo-theme.$white;
Expand All @@ -12,9 +12,9 @@
}

&__header {
margin-bottom: 25px;
@include embolden();
@include uppercase();
margin-bottom: 25px;
text-transform: uppercase;
}

&__check-icon {
Expand Down
2 changes: 1 addition & 1 deletion ...components/add-to-cart-notification/components/product-added/product-added.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';
@import 'utilities';
@use 'utilities' as *;

.demo-product-added {
display: grid;
Expand Down
4 changes: 2 additions & 2 deletions apps/demo/src/app/cart/components/cart-item-count/cart-item-count.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@import 'utilities';
@import 'theme';
@use 'utilities' as *;
@use 'demo-theme' as *;

.demo-cart-item-count {
color: daff-color($daff-neutral, 80);
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/cart/components/cart-item/cart-item.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';
@import 'utilities';
@use 'utilities' as *;

.demo-cart-item {
display: grid;
Expand Down
9 changes: 5 additions & 4 deletions apps/demo/src/app/cart/components/cart-sidebar/cart-sidebar.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@import 'utilities';
@import 'theme';
@use 'utilities' as *;
@use 'demo-theme' as *;
@use '../../../../scss/mixins/dividers' as *;

.demo-cart-sidebar {
&__summary {
Expand All @@ -11,9 +12,9 @@
}

&__title {
display: none;
@include embolden();
@include uppercase();
display: none;
text-transform: uppercase;

@include breakpoint(big-tablet) {
display: block;
Expand Down
5 changes: 3 additions & 2 deletions apps/demo/src/app/cart/components/cart-summary-wrapper/cart-summary-wrapper.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@import 'utilities';
@import 'theme';
@use 'utilities' as *;
@use 'demo-theme' as *;
@use '../../../../scss/mixins/dividers' as *;

.demo-cart-summary-wrapper {
display: grid;
Expand Down
5 changes: 3 additions & 2 deletions apps/demo/src/app/cart/components/cart-summary/cart-summary.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@import 'utilities';
@import 'theme';
@use 'utilities' as *;
@use 'demo-theme' as *;
@use '../../../../scss/mixins/dividers' as *;

.demo-cart-summary {
display: flex;
Expand Down
4 changes: 2 additions & 2 deletions apps/demo/src/app/cart/components/cart-totals-item/cart-totals-item.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

:host {
display: block;
Expand All @@ -14,7 +14,7 @@
}

&.emphasize { /* stylelint-disable-line selector-class-pattern */
@include uppercase();
@include embolden();
text-transform: uppercase;
}
}
7 changes: 4 additions & 3 deletions apps/demo/src/app/cart/components/cart/cart.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@import 'utilities';
@import 'theme';
@use 'utilities' as *;
@use 'demo-theme' as *;
@use '../../../../scss/mixins/dividers' as *;

:host {
display: grid;
Expand All @@ -26,7 +27,7 @@

&__title {
@include embolden();
@include uppercase();
text-transform: uppercase;
}

&__item-count {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/cart/components/minicart-item/minicart-item.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';
@import 'utilities';
@use 'utilities' as *;

:host {
display: grid;
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/cart/pages/cart-view/cart-view.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;
@import 'theme';

.demo-cart-view {
Expand Down
2 changes: 1 addition & 1 deletion ...app/checkout/components/forms/address/components/address-form/address-form.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-address-form {
display: grid;
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/checkout/components/payment/billing-summary/billing-summary.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-billing-summary {
font-size: $small-font-size;
Expand Down
6 changes: 3 additions & 3 deletions apps/demo/src/app/checkout/components/payment/payment-form/payment-form.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-payment-form {
display: flex;
Expand All @@ -10,9 +10,9 @@
}

&__title {
margin-bottom: 15px;
@include embolden();
@include uppercase();
margin-bottom: 15px;
text-transform: uppercase;
}

&__subtitle {
Expand Down
2 changes: 1 addition & 1 deletion ...s/payment/payment-info-form/components/payment-info-form/payment-info-form.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-payment-info-form {
display: grid;
Expand Down
10 changes: 5 additions & 5 deletions apps/demo/src/app/checkout/components/payment/payment-summary/payment-summary.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-payment-summary {
font-size: $small-font-size;
Expand All @@ -21,10 +21,10 @@
}

&__title {
@include embolden();
margin-bottom: 5px;
grid-area: title;
@include embolden();
@include uppercase();
text-transform: uppercase;
}

&__method-title {
Expand Down Expand Up @@ -55,9 +55,9 @@
}

&__title {
@include embolden();
font-size: 1rem;
margin-bottom: 15px;
@include embolden();
@include uppercase();
text-transform: uppercase;
}
}
6 changes: 3 additions & 3 deletions ...mo/src/app/checkout/components/shipping-address/form/shipping-address-form.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-shipping-address-form {
display: flex;
flex-direction: column;

&__title {
margin-bottom: 15px;
@include embolden();
@include uppercase();
margin-bottom: 15px;
text-transform: uppercase;
}

&__button {
Expand Down
6 changes: 3 additions & 3 deletions .../app/checkout/components/shipping-address/summary/shipping-address-summary.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-shipping-address-summary {
font-size: $small-font-size;
Expand All @@ -21,10 +21,10 @@
}

&__title {
@include embolden();
font-size: 1rem;
margin-bottom: 15px;
@include embolden();
@include uppercase();
text-transform: uppercase;
grid-area: title;
}

Expand Down
6 changes: 3 additions & 3 deletions apps/demo/src/app/checkout/components/shipping/shipping-form/shipping-form.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-shipping-form {
display: flex;
flex-direction: column;

&__title {
margin-bottom: 15px;
@include embolden();
@include uppercase();
margin-bottom: 15px;
text-transform: uppercase;
}

&__button {
Expand Down
2 changes: 1 addition & 1 deletion ...nts/shipping/shipping-options/components/shipping-options/shipping-options.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;
@import 'theme';

.demo-checkout-shipping-options {
Expand Down
6 changes: 3 additions & 3 deletions ...emo/src/app/checkout/components/shipping/shipping-summary/shipping-summary.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-checkout-shipping-summary {
font-size: $small-font-size;
Expand All @@ -21,10 +21,10 @@
}

&__title {
@include embolden();
font-size: 1rem;
margin-bottom: 15px;
@include embolden();
@include uppercase();
text-transform: uppercase;
grid-area: title;
}

Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;
@import 'theme';

.demo-checkout {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/core/footer/footer.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

:host {
display: block;
Expand Down
7 changes: 4 additions & 3 deletions apps/demo/src/app/core/header/components/header/header.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
@import 'utilities';
@import 'theme';
@use 'utilities' as *;
@use 'demo-theme' as *;
@use '../../../../../scss/mixins/dividers' as *;

.demo-header {
padding: 0;
@include section-divider;
@include section-divider();

&__menu {
border-right: 1px solid daff-color($daff-neutral, 20);
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/core/sidebar/components/sidebar-list/sidebar-list.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;
@import 'theme';

.demo-sidebar-list {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/core/sidebar/containers/sidebar/sidebar.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';
@import 'utilities';
@use 'utilities' as *;

.demo-sidebar {
padding: 75px 25px 0;
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/misc/help-box/help-box.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;
@import 'theme';

.demo-help-box {
Expand Down
6 changes: 3 additions & 3 deletions apps/demo/src/app/misc/not-found/not-found.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-not-found {
padding-top: 50px;
Expand All @@ -8,9 +8,9 @@
}

&__text {
@include embolden();
margin-bottom: 50px;
text-align: center;
@include embolden();
@include uppercase();
text-transform: uppercase;
}
}
4 changes: 2 additions & 2 deletions apps/demo/src/app/newsletter/newsletter.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';
@import 'utilities';
@use 'utilities' as *;

:host {
display: block;
Expand Down Expand Up @@ -33,10 +33,10 @@

&__title {
@include embolden();
@include uppercase();
font-size: 1.5rem;
margin: 0;
padding-bottom: 15px;
text-transform: uppercase;
}

&__right {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/product/components/add-to-cart/add-to-cart.component.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import 'utilities';
@use 'utilities' as *;

.demo-add-to-cart {
display: inline-block;
Expand Down
Loading

0 comments on commit 10bd1e9

Please sign in to comment.