Skip to content

Commit f6c5eed

Browse files
authored
fix(timezone): added missing tokens (#353)
1 parent f4e8bad commit f6c5eed

File tree

12 files changed

+13061
-4
lines changed

12 files changed

+13061
-4
lines changed

apps/docs/scripts/build-tokens.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,14 +66,16 @@ const themeColorNames = ['default-theme'];
6666

6767
for (const skin of [kbq]) {
6868
const koobiqTokensProps = `node_modules/@koobiq/design-tokens/web/properties/**/*.json5`;
69+
const koobiqTokensComponents = `node_modules/@koobiq/design-tokens/web/components/**/*.json5`;
6970

7071
for (const theme of themeColorNames) {
7172
themesConfig.push({
7273
skin,
7374
name: theme,
7475
buildPath: [
7576
koobiqTokensProps,
76-
`apps/docs/src/styles/${skin}/${theme}/properties/**/*.json5`
77+
`apps/docs/src/styles/${skin}/${theme}/properties/**/*.json5`,
78+
koobiqTokensComponents
7779
],
7880
outputPath: `apps/docs/src/styles/${skin}/${theme}/`
7981
});

apps/docs/src/styles/koobiq/default-theme/_variables.scss

Lines changed: 3255 additions & 0 deletions
Large diffs are not rendered by default.

apps/docs/src/styles/koobiq/default-theme/css-tokens-dark.css

Lines changed: 1015 additions & 0 deletions
Large diffs are not rendered by default.

apps/docs/src/styles/koobiq/default-theme/css-tokens-font.css

Lines changed: 794 additions & 0 deletions
Large diffs are not rendered by default.

apps/docs/src/styles/koobiq/default-theme/css-tokens-light.css

Lines changed: 998 additions & 0 deletions
Large diffs are not rendered by default.

apps/docs/src/styles/koobiq/default-theme/css-tokens.css

Lines changed: 454 additions & 0 deletions
Large diffs are not rendered by default.

apps/docs/src/styles/koobiq/default-theme/index.d.ts

Lines changed: 3255 additions & 0 deletions
Large diffs are not rendered by default.

apps/docs/src/styles/koobiq/default-theme/js/index.js

Lines changed: 3255 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/components-dev/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121

2222
<title>Dev Example</title>
2323
</head>
24-
<body class="kbq-app-background kbq-theme-light">
24+
<body class="kbq-app-background koobiq kbq-theme-light">
2525
<app></app>
2626
</body>
2727
</html>

packages/components-dev/main.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
@use '@koobiq/icons/fonts/kbq-icons';
22

3-
@use '../components/core/styles/theming/prebuilt/light-theme';
4-
//@use '../components/core/styles/theming/prebuilt/dark-theme';
3+
@use '../components/core/styles/theming/prebuilt/theme';
54

65
@use '../components/core/styles/visual/layout';
76

7+
@use 'apps/docs/src/styles/koobiq/default-theme/css-tokens.css';
88
@use 'apps/docs/src/styles/koobiq/default-theme/css-tokens-light.css';
99
//@use 'apps/docs/src/styles/koobiq/default-theme/css-tokens-dark.css';
1010

packages/components/timezone/timezone-option-tokens.scss

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,26 @@
11
/* stylelint-disable no-unknown-custom-properties */
22

33
.kbq-timezone-select__panel {
4+
--kbq-option-size-horizontal-padding: var(--kbq-size-m);
5+
--kbq-option-size-height: var(--kbq-size-3xl);
6+
--kbq-option-size-border-width: 2px;
7+
--kbq-select-size-single-padding-left: var(--kbq-size-m);
8+
--kbq-select-size-single-padding-right: var(--kbq-size-xxs);
9+
--kbq-select-size-single-padding-vertical: var(--kbq-size-xs);
10+
--kbq-select-size-single-content-gap: var(--kbq-size-xxs);
11+
--kbq-select-size-multiple-padding-left: var(--kbq-size-xxs);
12+
--kbq-select-size-multiple-padding-right: var(--kbq-size-xxs);
13+
--kbq-select-size-multiple-padding-vertical: var(--kbq-size-xxs);
14+
--kbq-select-size-multiple-content-gap: var(--kbq-size-xxs);
15+
--kbq-select-panel-size-border-radius: var(--kbq-size-s);
16+
--kbq-select-panel-size-max-height: 256px;
17+
--kbq-select-panel-font-default-font-size: var(--kbq-typography-text-normal-font-size);
18+
--kbq-select-panel-font-default-line-height: var(--kbq-typography-text-normal-line-height);
19+
--kbq-select-panel-font-default-letter-spacing: var(--kbq-typography-text-normal-letter-spacing);
20+
--kbq-select-panel-font-default-font-weight: var(--kbq-typography-text-normal-font-weight);
21+
--kbq-select-panel-font-default-font-family: var(--kbq-typography-text-normal-font-family);
22+
--kbq-select-panel-font-default-text-transform: var(--kbq-typography-text-normal-text-transform);
23+
--kbq-select-panel-font-default-font-feature-settings: var(--kbq-typography-text-normal-font-feature-settings);
424
--kbq-timezone-option-size-padding: 6px 10px;
525
--kbq-timezone-option-size-column-gap: 16px;
626
--kbq-timezone-option-size-height: auto;
@@ -41,12 +61,16 @@
4161
}
4262

4363
:where(.kbq-light, .theme-light, .kbq-theme-light) {
64+
--kbq-select-panel-dropdown-background: var(--kbq-background-card);
65+
--kbq-select-panel-dropdown-shadow: var(--kbq-shadow-popup);
4466
--kbq-timezone-option-text: var(--kbq-foreground-contrast);
4567
--kbq-timezone-option-caption: var(--kbq-foreground-contrast-secondary);
4668
--kbq-timezone-option-optgroup-label: var(--kbq-foreground-contrast-secondary);
4769
}
4870

4971
:where(.kbq-dark, .theme-dark, .kbq-theme-dark) {
72+
--kbq-select-panel-dropdown-background: var(--kbq-background-card);
73+
--kbq-select-panel-dropdown-shadow: var(--kbq-shadow-popup);
5074
--kbq-timezone-option-text: var(--kbq-foreground-contrast);
5175
--kbq-timezone-option-caption: var(--kbq-foreground-contrast-secondary);
5276
--kbq-timezone-option-optgroup-label: var(--kbq-foreground-contrast-secondary);

tools/tokens/utils.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,11 @@ const filter = {
2424
'option-action': [
2525
'kbq-list-font-text-line-height'
2626
],
27+
'timezone-option': [
28+
'kbq-select-size',
29+
'kbq-select-panel',
30+
'kbq-option-size'
31+
],
2732
tag: [
2833
'kbq-tag-list',
2934
'tag-input-font'

0 commit comments

Comments
 (0)