Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Autogenerate themes from new tokens #30

Merged
merged 3 commits into from
Jun 6, 2023
Merged

Autogenerate themes from new tokens #30

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3fec565
Add info colour styles
benjaminleonard Jun 6, 2023
5625960
Update themes from token file
github-actions[bot] Jun 6, 2023
a12bb02
Bump commit
benjaminleonard Jun 6, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
60 changes: 60 additions & 0 deletions styles/dist/blue.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,18 @@
--surface-inverse-tertiary-rgb: var(--content-tertiary-rgb);
--surface-inverse-tertiary: rgb(var(--surface-inverse-tertiary-rgb));

--surface-info-rgb: var(--theme-info-800-rgb);
--surface-info: rgb(var(--surface-info-rgb));

--surface-info-hover-rgb: var(--theme-info-700-rgb);
--surface-info-hover: rgb(var(--surface-info-hover-rgb));

--surface-info-secondary-rgb: var(--theme-info-200-rgb);
--surface-info-secondary: rgb(var(--surface-info-secondary-rgb));

--surface-info-secondary-hover-rgb: var(--theme-info-300-rgb);
--surface-info-secondary-hover: rgb(var(--surface-info-secondary-hover-rgb));

--content-default-rgb: var(--base-neutral-900-rgb);
--content-default: rgb(var(--content-default-rgb));

Expand Down Expand Up @@ -167,6 +179,18 @@
--content-inverse-secondary-rgb: var(--surface-secondary-rgb);
--content-inverse-secondary: rgb(var(--content-inverse-secondary-rgb));

--content-info-rgb: var(--theme-info-800-rgb);
--content-info: rgb(var(--content-info-rgb));

--content-info-secondary-rgb: var(--theme-info-700-rgb);
--content-info-secondary: rgb(var(--content-info-secondary-rgb));

--content-info-tertiary-rgb: var(--theme-info-600-rgb);
--content-info-tertiary: rgb(var(--content-info-tertiary-rgb));

--content-info-disabled-rgb: var(--theme-info-500-rgb);
--content-info-disabled: rgb(var(--content-info-disabled-rgb));

--stroke-default-rgb: var(--base-neutral-300-rgb);
--stroke-default: rgb(var(--stroke-default-rgb));

Expand Down Expand Up @@ -245,6 +269,18 @@
--stroke-notice-quaternary-rgb: var(--theme-notice-300-rgb);
--stroke-notice-quaternary: rgb(var(--stroke-notice-quaternary-rgb));

--stroke-info-rgb: var(--theme-info-800-rgb);
--stroke-info: rgb(var(--stroke-info-rgb));

--stroke-info-secondary-rgb: var(--theme-info-600-rgb);
--stroke-info-secondary: rgb(var(--stroke-info-secondary-rgb));

--stroke-info-tertiary-rgb: var(--theme-info-400-rgb);
--stroke-info-tertiary: rgb(var(--stroke-info-tertiary-rgb));

--stroke-info-quaternary-rgb: var(--theme-info-300-rgb);
--stroke-info-quaternary: rgb(var(--stroke-info-quaternary-rgb));

--chart-fill-area-primary: rgba(var(--theme-accent-700-rgb), 0.7019607843137254);
--chart-fill-area-secondary: rgba(var(--theme-accent-600-rgb), 0.7019607843137254);
--chart-fill-area-tertiary: rgba(var(--theme-accent-500-rgb), 0.7019607843137254);
Expand Down Expand Up @@ -416,4 +452,28 @@

--theme-notice-800-rgb: var(--base-yellow-800-rgb);
--theme-notice-800: rgb(var(--theme-notice-800-rgb));

--theme-info-100-rgb: var(--base-blue-100-rgb);
--theme-info-100: rgb(var(--theme-info-100-rgb));

--theme-info-200-rgb: var(--base-blue-200-rgb);
--theme-info-200: rgb(var(--theme-info-200-rgb));

--theme-info-300-rgb: var(--base-blue-300-rgb);
--theme-info-300: rgb(var(--theme-info-300-rgb));

--theme-info-400-rgb: var(--base-blue-400-rgb);
--theme-info-400: rgb(var(--theme-info-400-rgb));

--theme-info-500-rgb: var(--base-blue-500-rgb);
--theme-info-500: rgb(var(--theme-info-500-rgb));

--theme-info-600-rgb: var(--base-blue-600-rgb);
--theme-info-600: rgb(var(--theme-info-600-rgb));

--theme-info-700-rgb: var(--base-blue-700-rgb);
--theme-info-700: rgb(var(--theme-info-700-rgb));

--theme-info-800-rgb: var(--base-blue-800-rgb);
--theme-info-800: rgb(var(--theme-info-800-rgb));
}
20 changes: 20 additions & 0 deletions styles/dist/blue.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -378,6 +378,7 @@ graph RL
graph RL
base-blue-100 --> #171821:::base-blue-100
theme-accent-100 --> base-blue-100
theme-info-100 --> base-blue-100

classDef base-blue-100 stroke-width:5,stroke:#171821
```
Expand All @@ -388,7 +389,9 @@ graph RL
graph RL
base-blue-200 --> #1E202D:::base-blue-200
surface-accent-secondary --> theme-accent-200
surface-info-secondary --> theme-info-200
theme-accent-200 --> base-blue-200
theme-info-200 --> base-blue-200

classDef base-blue-200 stroke-width:5,stroke:#1E202D
```
Expand All @@ -399,8 +402,11 @@ graph RL
graph RL
base-blue-300 --> #2D3048:::base-blue-300
surface-accent-secondary-hover --> theme-accent-300
surface-info-secondary-hover --> theme-info-300
stroke-accent-quaternary --> theme-accent-300
stroke-info-quaternary --> theme-info-300
theme-accent-300 --> base-blue-300
theme-info-300 --> base-blue-300

classDef base-blue-300 stroke-width:5,stroke:#2D3048
```
Expand All @@ -411,8 +417,10 @@ graph RL
graph RL
base-blue-400 --> #3C4366:::base-blue-400
stroke-accent-tertiary --> theme-accent-400
stroke-info-tertiary --> theme-info-400
chart-fill-item-quaternary --> theme-accent-400
theme-accent-400 --> base-blue-400
theme-info-400 --> base-blue-400

classDef base-blue-400 stroke-width:5,stroke:#3C4366
```
Expand All @@ -423,8 +431,10 @@ graph RL
graph RL
base-blue-500 --> #515B8F:::base-blue-500
content-accent-disabled --> theme-accent-500
content-info-disabled --> theme-info-500
chart-fill-item-tertiary --> theme-accent-500
theme-accent-500 --> base-blue-500
theme-info-500 --> base-blue-500

classDef base-blue-500 stroke-width:5,stroke:#515B8F
```
Expand All @@ -435,10 +445,13 @@ graph RL
graph RL
base-blue-600 --> #6776BB:::base-blue-600
content-accent-tertiary --> theme-accent-600
content-info-tertiary --> theme-info-600
stroke-accent-secondary --> theme-accent-600
stroke-info-secondary --> theme-info-600
chart-fill-item-secondary --> theme-accent-600
chart-stroke-line-quaternary --> base-blue-600
theme-accent-600 --> base-blue-600
theme-info-600 --> base-blue-600

classDef base-blue-600 stroke-width:5,stroke:#6776BB
```
Expand All @@ -449,10 +462,13 @@ graph RL
graph RL
base-blue-700 --> #788ADD:::base-blue-700
surface-accent-hover --> theme-accent-700
surface-info-hover --> theme-info-700
content-accent-secondary --> theme-accent-700
content-info-secondary --> theme-info-700
chart-fill-item-primary --> theme-accent-700
chart-stroke-line --> theme-accent-700
theme-accent-700 --> base-blue-700
theme-info-700 --> base-blue-700

classDef base-blue-700 stroke-width:5,stroke:#788ADD
```
Expand All @@ -463,9 +479,13 @@ graph RL
graph RL
base-blue-800 --> #8BA1FF:::base-blue-800
surface-accent --> theme-accent-800
surface-info --> theme-info-800
content-accent --> theme-accent-800
content-info --> theme-info-800
stroke-accent --> theme-accent-800
stroke-info --> theme-info-800
theme-accent-800 --> base-blue-800
theme-info-800 --> base-blue-800

classDef base-blue-800 stroke-width:5,stroke:#8BA1FF
```
Expand Down
60 changes: 60 additions & 0 deletions styles/dist/main.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -233,6 +233,18 @@
--surface-inverse-tertiary-rgb: var(--content-tertiary-rgb);
--surface-inverse-tertiary: rgb(var(--surface-inverse-tertiary-rgb));

--surface-info-rgb: var(--theme-info-800-rgb);
--surface-info: rgb(var(--surface-info-rgb));

--surface-info-hover-rgb: var(--theme-info-700-rgb);
--surface-info-hover: rgb(var(--surface-info-hover-rgb));

--surface-info-secondary-rgb: var(--theme-info-200-rgb);
--surface-info-secondary: rgb(var(--surface-info-secondary-rgb));

--surface-info-secondary-hover-rgb: var(--theme-info-300-rgb);
--surface-info-secondary-hover: rgb(var(--surface-info-secondary-hover-rgb));

--content-default-rgb: var(--base-neutral-900-rgb);
--content-default: rgb(var(--content-default-rgb));

Expand Down Expand Up @@ -320,6 +332,18 @@
--content-inverse-secondary-rgb: var(--surface-secondary-rgb);
--content-inverse-secondary: rgb(var(--content-inverse-secondary-rgb));

--content-info-rgb: var(--theme-info-800-rgb);
--content-info: rgb(var(--content-info-rgb));

--content-info-secondary-rgb: var(--theme-info-700-rgb);
--content-info-secondary: rgb(var(--content-info-secondary-rgb));

--content-info-tertiary-rgb: var(--theme-info-600-rgb);
--content-info-tertiary: rgb(var(--content-info-tertiary-rgb));

--content-info-disabled-rgb: var(--theme-info-500-rgb);
--content-info-disabled: rgb(var(--content-info-disabled-rgb));

--stroke-default-rgb: var(--base-neutral-300-rgb);
--stroke-default: rgb(var(--stroke-default-rgb));

Expand Down Expand Up @@ -398,6 +422,18 @@
--stroke-notice-quaternary-rgb: var(--theme-notice-300-rgb);
--stroke-notice-quaternary: rgb(var(--stroke-notice-quaternary-rgb));

--stroke-info-rgb: var(--theme-info-800-rgb);
--stroke-info: rgb(var(--stroke-info-rgb));

--stroke-info-secondary-rgb: var(--theme-info-600-rgb);
--stroke-info-secondary: rgb(var(--stroke-info-secondary-rgb));

--stroke-info-tertiary-rgb: var(--theme-info-400-rgb);
--stroke-info-tertiary: rgb(var(--stroke-info-tertiary-rgb));

--stroke-info-quaternary-rgb: var(--theme-info-300-rgb);
--stroke-info-quaternary: rgb(var(--stroke-info-quaternary-rgb));

--chart-fill-area-primary: rgba(var(--theme-accent-700-rgb), 0.7019607843137254);
--chart-fill-area-secondary: rgba(var(--theme-accent-600-rgb), 0.7019607843137254);
--chart-fill-area-tertiary: rgba(var(--theme-accent-500-rgb), 0.7019607843137254);
Expand Down Expand Up @@ -570,6 +606,30 @@
--theme-notice-800-rgb: var(--base-yellow-800-rgb);
--theme-notice-800: rgb(var(--theme-notice-800-rgb));

--theme-info-100-rgb: var(--base-blue-100-rgb);
--theme-info-100: rgb(var(--theme-info-100-rgb));

--theme-info-200-rgb: var(--base-blue-200-rgb);
--theme-info-200: rgb(var(--theme-info-200-rgb));

--theme-info-300-rgb: var(--base-blue-300-rgb);
--theme-info-300: rgb(var(--theme-info-300-rgb));

--theme-info-400-rgb: var(--base-blue-400-rgb);
--theme-info-400: rgb(var(--theme-info-400-rgb));

--theme-info-500-rgb: var(--base-blue-500-rgb);
--theme-info-500: rgb(var(--theme-info-500-rgb));

--theme-info-600-rgb: var(--base-blue-600-rgb);
--theme-info-600: rgb(var(--theme-info-600-rgb));

--theme-info-700-rgb: var(--base-blue-700-rgb);
--theme-info-700: rgb(var(--theme-info-700-rgb));

--theme-info-800-rgb: var(--base-blue-800-rgb);
--theme-info-800: rgb(var(--theme-info-800-rgb));

--border-radius-sm: 0.125rem;
--border-radius: 0.1875rem;
--border-radius-lg: 0.375rem;
Expand Down
20 changes: 20 additions & 0 deletions styles/dist/main.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -402,6 +402,7 @@ graph RL
```mermaid
graph RL
base-blue-100 --> #171821:::base-blue-100
theme-info-100 --> base-blue-100

classDef base-blue-100 stroke-width:5,stroke:#171821
```
Expand All @@ -411,6 +412,8 @@ graph RL
```mermaid
graph RL
base-blue-200 --> #1E202D:::base-blue-200
surface-info-secondary --> theme-info-200
theme-info-200 --> base-blue-200

classDef base-blue-200 stroke-width:5,stroke:#1E202D
```
Expand All @@ -420,6 +423,9 @@ graph RL
```mermaid
graph RL
base-blue-300 --> #2D3048:::base-blue-300
surface-info-secondary-hover --> theme-info-300
stroke-info-quaternary --> theme-info-300
theme-info-300 --> base-blue-300

classDef base-blue-300 stroke-width:5,stroke:#2D3048
```
Expand All @@ -429,6 +435,8 @@ graph RL
```mermaid
graph RL
base-blue-400 --> #3C4366:::base-blue-400
stroke-info-tertiary --> theme-info-400
theme-info-400 --> base-blue-400

classDef base-blue-400 stroke-width:5,stroke:#3C4366
```
Expand All @@ -438,6 +446,8 @@ graph RL
```mermaid
graph RL
base-blue-500 --> #515B8F:::base-blue-500
content-info-disabled --> theme-info-500
theme-info-500 --> base-blue-500

classDef base-blue-500 stroke-width:5,stroke:#515B8F
```
Expand All @@ -447,7 +457,10 @@ graph RL
```mermaid
graph RL
base-blue-600 --> #6776BB:::base-blue-600
content-info-tertiary --> theme-info-600
stroke-info-secondary --> theme-info-600
chart-stroke-line-quaternary --> base-blue-600
theme-info-600 --> base-blue-600

classDef base-blue-600 stroke-width:5,stroke:#6776BB
```
Expand All @@ -457,6 +470,9 @@ graph RL
```mermaid
graph RL
base-blue-700 --> #788ADD:::base-blue-700
surface-info-hover --> theme-info-700
content-info-secondary --> theme-info-700
theme-info-700 --> base-blue-700

classDef base-blue-700 stroke-width:5,stroke:#788ADD
```
Expand All @@ -466,6 +482,10 @@ graph RL
```mermaid
graph RL
base-blue-800 --> #8BA1FF:::base-blue-800
surface-info --> theme-info-800
content-info --> theme-info-800
stroke-info --> theme-info-800
theme-info-800 --> base-blue-800

classDef base-blue-800 stroke-width:5,stroke:#8BA1FF
```
Expand Down
Loading