-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(docs): moved from sass vars to css vars in docs
- Loading branch information
Showing
21 changed files
with
222 additions
and
266 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
17 changes: 8 additions & 9 deletions
17
apps/docs/src/app/components/docs-example-source/_docs-example-source-theme.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
14 changes: 7 additions & 7 deletions
14
apps/docs/src/app/components/docs-live-example-viewer/_docs-live-example-viewer-theme.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,22 +1,22 @@ | ||
| @use 'sass:map'; | ||
|
|
||
| @use '../dist/components/core/styles/typography'; | ||
| @use '../dist/components/core/styles/common/tokens'; | ||
|
|
||
| @mixin kbq-docs-live-example-viewer-theme($theme) { | ||
| $background: map.get($theme, background); | ||
| /* stylelint-disable no-unknown-custom-properties */ | ||
|
|
||
| @mixin kbq-docs-live-example-viewer-theme() { | ||
| .docs-live-example__container { | ||
| border: 1px solid map.get($background, contrast-fade); | ||
| border: 1px solid var(--kbq-background-contrast-fade); | ||
| } | ||
|
|
||
| .docs-live-example__footer { | ||
| border-top: 1px solid map.get($background, contrast-fade); | ||
| border-top: 1px solid var(--kbq-background-contrast-fade); | ||
| } | ||
| } | ||
|
|
||
| @mixin kbq-docs-live-example-viewer-typography($config) { | ||
| @mixin kbq-docs-live-example-viewer-typography() { | ||
| .docs-live-example__footer, | ||
| .docs-live-example__footer .kbq-link { | ||
| @include typography.kbq-typography-level-to-styles($config, text-big); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, text-big); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,32 +1,32 @@ | ||
| @use 'sass:map'; | ||
|
|
||
| @use '../dist/components/core/styles/typography'; | ||
| @use '../dist/components/core/styles/common/tokens'; | ||
|
|
||
| @mixin kbq-docs-footer-theme($theme) { | ||
| $foreground: map.get($theme, foreground); | ||
| /* stylelint-disable no-unknown-custom-properties */ | ||
|
|
||
| @mixin kbq-docs-footer-theme() { | ||
| .docs-footer__label, | ||
| .kbq-dropdown__group-header .kbq-caps-compact-strong { | ||
| color: map.get($foreground, contrast-secondary); | ||
| color: var(--kbq-foreground-contrast-secondary); | ||
| } | ||
| } | ||
|
|
||
| @mixin kbq-docs-footer-typography($config) { | ||
| @mixin kbq-docs-footer-typography() { | ||
| .docs-footer__label { | ||
| @include typography.kbq-typography-level-to-styles($config, text-normal); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, text-normal); | ||
| } | ||
|
|
||
| .docs-footer__control { | ||
| @include typography.kbq-typography-level-to-styles($config, text-big); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, text-big); | ||
| } | ||
|
|
||
| .docs-dropdown { | ||
| .kbq-dropdown-item__text { | ||
| @include typography.kbq-typography-level-to-styles($config, text-big); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, text-big); | ||
| } | ||
|
|
||
| .kbq-dropdown-item__caption { | ||
| @include typography.kbq-typography-level-to-styles($config, text-normal); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, text-normal); | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,23 +1,22 @@ | ||
| @use 'sass:map'; | ||
|
|
||
| @use '../dist/components/core/styles/theming'; | ||
| @use '../dist/components/core/styles/typography'; | ||
| @use '../dist/components/core/styles/common/tokens'; | ||
|
|
||
| @mixin kbq-docs-navbar-theme($theme) { | ||
| $background: map.get($theme, background); | ||
| $foreground: map.get($theme, foreground); | ||
| /* stylelint-disable no-unknown-custom-properties */ | ||
|
|
||
| @mixin kbq-docs-navbar-theme() { | ||
| .docs-navbar { | ||
| background: map.get($background, bg); | ||
| background: var(--kbq-background-bg); | ||
|
|
||
| .docs-navbar__github-icon svg { | ||
| fill: map.get($foreground, contrast); | ||
| fill: var(--kbq-foreground-contrast); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| @mixin kbq-docs-navbar-typography($config) { | ||
| @mixin kbq-docs-navbar-typography() { | ||
| .docs-sidenav { | ||
| @include typography.kbq-typography-level-to-styles($config, subheading); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, subheading); | ||
| } | ||
| } |
6 changes: 3 additions & 3 deletions
6
apps/docs/src/app/components/page-not-found/_page-not-found-theme.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,9 @@ | ||
| @use 'sass:map'; | ||
|
|
||
| @mixin kbq-docs-page-not-found-theme($theme) { | ||
| $background: map.get($theme, background); | ||
| /* stylelint-disable no-unknown-custom-properties */ | ||
|
|
||
| @mixin kbq-docs-page-not-found-theme() { | ||
| .page-not-found { | ||
| background: map.get($background, bg); | ||
| background: var(--kbq-background-bg); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,51 +1,49 @@ | ||
| @use 'sass:map'; | ||
|
|
||
| @use '../dist/components/core/styles/theming'; | ||
| @use '../dist/components/core/styles/typography'; | ||
| @use '../dist/components/core/styles/common/tokens'; | ||
|
|
||
| @mixin kbq-docs-sidenav-theme($theme) { | ||
| $background: map.get($theme, background); | ||
| $foreground: map.get($theme, foreground); | ||
| $states-background: map.get(map.get($theme, states), background); | ||
| /* stylelint-disable no-unknown-custom-properties */ | ||
|
|
||
| @mixin kbq-docs-sidenav-theme() { | ||
| .docs-sidenav { | ||
| background-color: map.get($background, bg-secondary); | ||
| background-color: var(--kbq-background-bg-secondary); | ||
|
|
||
| .docs-sidenav__header-text path { | ||
| fill: map.get($foreground, contrast); | ||
| fill: var(--kbq-foreground-contrast); | ||
| } | ||
|
|
||
| .kbq-tree-option:hover { | ||
| background: map.get($states-background, transparent-hover); | ||
| background: var(--kbq-states-background-transparent-hover); | ||
| } | ||
|
|
||
| .kbq-tree-option.kbq-selected, | ||
| .kbq-tree-option.kbq-selected:hover { | ||
| background: map.get($states-background, transparent-active); | ||
| background: var(--kbq-states-background-transparent-active); | ||
| } | ||
| } | ||
|
|
||
| @media (width <= 768px) { | ||
| .docs-sidenav { | ||
| background-color: map.get($background, bg); | ||
| background-color: var(--kbq-background-bg); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| @mixin kbq-docs-sidenav-typography($config) { | ||
| @mixin kbq-docs-sidenav-typography() { | ||
| .docs-sidenav { | ||
| .docs-sidenav__category-text { | ||
| @include typography.kbq-typography-level-to-styles($config, subheading); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, subheading); | ||
| } | ||
| } | ||
|
|
||
| .docs-navbar__anchor .kbq-button { | ||
| @include typography.kbq-typography-level-to-styles($config, text-big); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, text-big); | ||
| } | ||
|
|
||
| @media (width <= 768px) { | ||
| .docs-sidenav__category { | ||
| @include typography.kbq-typography-level-to-styles($config, title); | ||
| @include tokens.kbq-typography-level-to-styles_css-variables(typography, title); | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.