Skip to content

Commit

Permalink
refactor(design, daffio)!: update daff-gray palette name to `daff-n…
Browse files Browse the repository at this point in the history 
…eutral` (#2736)
  • Loading branch information
@xelaint
xelaint committed Jan 23, 2024
1 parent 4d7498f commit b219d31
Show file tree
Hide file tree
Showing 49 changed files with 188 additions and 188 deletions.
6 changes: 3 additions & 3 deletions apps/daffio/src/app/api/components/api-list/api-list-theme.scss
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
@use 'theme' as daff-theme;

@mixin daffio-api-list-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, "core.base");
$base-contrast: daff-theme.daff-map-deep-get($theme, "core.base-contrast");

Expand All @@ -16,7 +16,7 @@
}

&:hover {
color: daff-theme.daff-illuminate($base-contrast, $gray, 3);
color: daff-theme.daff-illuminate($base-contrast, $neutral, 3);
}
}

Expand All @@ -27,7 +27,7 @@
}

&:after {
background: daff-theme.daff-illuminate($base, $gray, 2);
background: daff-theme.daff-illuminate($base, $neutral, 2);
}
}
}
Expand Down
8 changes: 4 additions & 4 deletions apps/daffio/src/app/core/footer/footer/footer-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,16 @@
@use 'sass:map';

@mixin daffio-footer-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: daff-theme.daff-map-deep-get($theme, 'core.base-contrast');
$secondary: map.get($theme, secondary);

.daffio-footer {
border-top: 1px solid daff-theme.daff-illuminate($base, $gray, 2);
border-top: 1px solid daff-theme.daff-illuminate($base, $neutral, 2);

&__copyright {
color: daff-theme.daff-illuminate($base-contrast, $gray, 3);
color: daff-theme.daff-illuminate($base-contrast, $neutral, 3);
}

&__link,
Expand All @@ -20,7 +20,7 @@
transition: color 0.3s;

&:hover {
color: daff-theme.daff-illuminate($base-contrast, $gray, 3);
color: daff-theme.daff-illuminate($base-contrast, $neutral, 3);
}
}
}
Expand Down
8 changes: 4 additions & 4 deletions apps/daffio/src/app/core/footer/simple-footer/simple-footer-theme.scss
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
@use 'theme' as daff-theme;

@mixin daffio-simple-footer-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: daff-theme.daff-map-deep-get($theme, 'core.base-contrast');

.daffio-simple-footer {
border-top: 1px solid daff-theme.daff-illuminate($base, $gray, 2);
border-top: 1px solid daff-theme.daff-illuminate($base, $neutral, 2);

&__copyright {
color: daff-theme.daff-illuminate($base-contrast, $gray, 4);
color: daff-theme.daff-illuminate($base-contrast, $neutral, 4);
}

&__link {
color: daff-theme.daff-text-contrast($base);
transition: color 0.3s;

&:hover {
color: daff-theme.daff-illuminate($base-contrast, $gray, 3);
color: daff-theme.daff-illuminate($base-contrast, $neutral, 3);
}
}
}
Expand Down
6 changes: 3 additions & 3 deletions apps/daffio/src/app/core/sidebar/components/sidebar-footer/sidebar-footer-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,16 @@
@use 'theme' as daff-theme;

@mixin daffio-sidebar-footer-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: daff-theme.daff-map-deep-get($theme, 'core.base-contrast');
$primary: map.get($theme, primary);

.daffio-sidebar-footer {
background: daff-theme.daff-illuminate($base, $gray, 2);
background: daff-theme.daff-illuminate($base, $neutral, 2);

&:hover {
background: daff-theme.daff-illuminate($base, $gray, 3);
background: daff-theme.daff-illuminate($base, $neutral, 3);
}
}
}
6 changes: 3 additions & 3 deletions apps/daffio/src/app/core/sidebar/containers/sidebar-viewport/sidebar-viewport-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,17 @@
@use 'theme' as daff-theme;

@mixin daffio-sidebar-viewport-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: daff-theme.daff-map-deep-get($theme, 'core.base-contrast');
$primary: map.get($theme, primary);

.daffio-sidebar-viewport {
&__get-started {
background: daff-theme.daff-illuminate($base, $gray, 2);
background: daff-theme.daff-illuminate($base, $neutral, 2);

&:hover {
background: daff-theme.daff-illuminate($base, $gray, 3);
background: daff-theme.daff-illuminate($base, $neutral, 3);
}
}
}
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
Expand Up @@ -2,7 +2,7 @@
// @import 'utilities';

// $phoneColor: daff-map-deep-get($theme, "core.base");
// $phoneShadow: daff-illuminate($phoneColor, $daff-gray, 3);
// $phoneShadow: daff-illuminate($phoneColor, $daff-neutral, 3);

// .iphone {
// background: $phoneColor;
Expand Down
6 changes: 3 additions & 3 deletions apps/daffio/src/app/docs/components/table-of-contents/table-of-contents-theme.scss
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
@use 'theme' as daff-theme;

@mixin daffio-table-of-contents-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, "core.base");
$base-contrast: daff-theme.daff-map-deep-get($theme, "core.base-contrast");

.daffio-table-of-contents {
&__item {
color: daff-theme.daff-illuminate($base-contrast, $gray, 4);
color: daff-theme.daff-illuminate($base-contrast, $neutral, 4);

&:first-of-type {
border-bottom: 1px solid daff-theme.daff-illuminate($base, $gray, 3);
border-bottom: 1px solid daff-theme.daff-illuminate($base, $neutral, 3);
}
}
}
Expand Down
4 changes: 2 additions & 2 deletions apps/daffio/src/app/newsletter/newsletter-theme.scss
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
@use 'theme' as daff-theme;

@mixin daffio-newsletter-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: daff-theme.daff-map-deep-get($theme, 'core.base-contrast');

.newsletter {
&__input {
border-color: daff-theme.daff-color($gray, 30);
border-color: daff-theme.daff-color($neutral, 30);
}
}
}
2 changes: 1 addition & 1 deletion 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
Expand Up @@ -2,6 +2,6 @@
@import 'theme';

.demo-cart-item-count {
color: daff-color($daff-gray, 80);
color: daff-color($daff-neutral, 80);
font-size: $small-font-size;
}
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
Expand Up @@ -56,7 +56,7 @@
}

&__change {
color: demo-theme.daff-color(demo-theme.$gray, 80);
color: demo-theme.daff-color(demo-theme.$neutral, 80);
margin-top: 15px;

> a {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/cart/components/cart-summary/cart-summary.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@

&__item-count {
float: right;
color: daff-color($daff-gray, 80);
color: daff-color($daff-neutral, 80);
font-size: $small-font-size;
}
}
4 changes: 2 additions & 2 deletions apps/demo/src/app/cart/components/minicart-item/minicart-item.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@

&__info {
font-size: $small-font-size;
color: demo-theme.daff-color(demo-theme.$gray, 90);
color: demo-theme.daff-color(demo-theme.$neutral, 90);
line-height: 1.25rem;
}

Expand All @@ -46,7 +46,7 @@

> * {
font-size: $small-font-size;
color: demo-theme.daff-color(demo-theme.$gray);
color: demo-theme.daff-color(demo-theme.$neutral);
text-decoration: underline;

&:last-child {
Expand Down
6 changes: 3 additions & 3 deletions apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,10 @@

&__shipping {
padding: 25px 0;
border-bottom: 1px solid daff-color($daff-gray, 20);
border-bottom: 1px solid daff-color($daff-neutral, 20);

@include breakpoint(big-tablet) {
border-top: 1px solid daff-color($daff-gray, 20);
border-top: 1px solid daff-color($daff-neutral, 20);
}
}

Expand All @@ -53,7 +53,7 @@

&__mobile-cart {
display: block;
border-top: 1px solid daff-color($daff-gray, 20);
border-top: 1px solid daff-color($daff-neutral, 20);

@include breakpoint(big-tablet) {
display: none;
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/core/header/components/header/header.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
@include section-divider;

&__menu {
border-right: 1px solid daff-color($daff-gray, 20);
border-right: 1px solid daff-color($daff-neutral, 20);
padding: 15px;
}

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
Expand Up @@ -2,7 +2,7 @@
@import 'theme';

.demo-help-box {
border: 1px solid daff-color($daff-gray, 20);
border: 1px solid daff-color($daff-neutral, 20);
padding: 25px;

&__title {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/newsletter/newsletter.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

:host {
display: block;
background: demo-theme.daff-color(demo-theme.$gray, 100);
background: demo-theme.daff-color(demo-theme.$neutral, 100);
color: demo-theme.$white;
padding: 50px 25px;
margin: 0;
Expand Down
4 changes: 2 additions & 2 deletions apps/demo/src/app/product/components/product/product.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
}

&__brand {
color: daff-color($daff-gray, 80);
color: daff-color($daff-neutral, 80);
font-size: $medium-font-size;
font-weight: normal;
}
Expand Down Expand Up @@ -84,7 +84,7 @@
}

&__accordion {
border-top: 1px solid daff-color($daff-gray, 20);
border-top: 1px solid daff-color($daff-neutral, 20);
margin: 50px 0 0;

a {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/thank-you/components/thank-you/thank-you.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@

@include breakpoint(big-tablet) {
padding: 50px 0;
border-top: 1px solid daff-color($daff-gray, 20);
border-top: 1px solid daff-color($daff-neutral, 20);
}

&__title {
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/app/thank-you/pages/thank-you-view.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@

&__mobile-cart {
display: block;
border-top: 1px solid daff-color($daff-gray, 20);
border-top: 1px solid daff-color($daff-neutral, 20);

@include breakpoint(big-tablet) {
display: none;
Expand Down
2 changes: 1 addition & 1 deletion apps/demo/src/scss/demo-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,4 +9,4 @@ $theme: daff-theme.daff-configure-theme($primary, $secondary, $tertiary, 'light'

$black: daff-theme.daff-map-deep-get($theme, 'core.black');
$white: daff-theme.daff-map-deep-get($theme, 'core.white');
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
2 changes: 1 addition & 1 deletion apps/demo/src/scss/mixins/_dividers.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use 'demo-theme';

@mixin section-divider($size: 1px, $color: demo-theme.daff-color(demo-theme.$gray, 20)) {
@mixin section-divider($size: 1px, $color: demo-theme.daff-color(demo-theme.$neutral, 20)) {
border-bottom: solid 1px $color;
}
4 changes: 2 additions & 2 deletions apps/design-land/src/app/core/code-preview/component/code-preview-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,11 @@


@mixin code-preview-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$primary: map.get(daff-theme.$theme, primary);
$font-color: daff-theme.daff-map-deep-get($theme, 'core.font-color');
$border: 1px solid daff-theme.daff-illuminate($base, $gray, 2);
$border: 1px solid daff-theme.daff-illuminate($base, $neutral, 2);

.design-land-code-preview {
&__content {
Expand Down
8 changes: 4 additions & 4 deletions apps/design-land/src/app/core/sidebar-viewport/sidebar-viewport-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,21 +2,21 @@
@use 'theme' as daff-theme;

@mixin sidebar-viewport-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: daff-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: daff-theme.daff-map-deep-get($theme, 'core.base-contrast');
$primary: map.get($theme, primary);

.design-land-sidebar-viewport {
&__sidebar {
border-right: 1px solid daff-theme.daff-illuminate($base, $gray, 2);
border-right: 1px solid daff-theme.daff-illuminate($base, $neutral, 2);
}

&__get-started-button {
background: daff-theme.daff-illuminate($base, $gray, 1);
background: daff-theme.daff-illuminate($base, $neutral, 1);

&:hover {
background: daff-theme.daff-illuminate($base, $gray, 2);
background: daff-theme.daff-illuminate($base, $neutral, 2);
}
}

Expand Down
6 changes: 3 additions & 3 deletions apps/design-land/src/app/typography/typography-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,16 @@
@use 'theme' as daff-theme;

@mixin typography-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');

.dl-typography {
&__typescale-card {
border: 1px solid daff-theme.daff-color($gray, 20);
border: 1px solid daff-theme.daff-color($neutral, 20);
}

&__desktop-subheading,
&__mobile-subheading {
color: daff-theme.daff-color($gray);
color: daff-theme.daff-color($neutral);
}
}
}
4 changes: 2 additions & 2 deletions libs/branding/src/lib/logo/logo-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@
@use 'theme' as daff-theme;

@mixin daff-logo-theme($theme) {
$gray: daff-theme.daff-map-deep-get($theme, 'core.gray');
$neutral: daff-theme.daff-map-deep-get($theme, 'core.neutral');
$base: branding-theme.daff-map-deep-get($theme, 'core.base');
$base-contrast: branding-theme.daff-map-deep-get($theme, 'core.base-contrast');

.daff-branding-logo {
fill: daff-theme.daff-illuminate($base-contrast, $gray, 1);
fill: daff-theme.daff-illuminate($base-contrast, $neutral, 1);
}
}
Loading

0 comments on commit b219d31

Please sign in to comment.