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.

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

docs: Kzn 1058 how can we style storybook create a poc #3347

Merged
merged 14 commits into from
Mar 9, 2023

Conversation

JakePitman
Copy link
Contributor

@JakePitman JakePitman commented Mar 7, 2023

Why

For the aesthetic.

What

  • Themes our storybook app with CA design tokens

image

image

Out of scope

  • Storybook icons
  • Hover states on left-navbar

These are not modifiable with the create or addons apis, and will require hacks.

@JakePitman JakePitman requested a review from a team as a code owner March 7, 2023 05:12
@JakePitman JakePitman marked this pull request as draft March 7, 2023 05:12
@JakePitman JakePitman changed the title Kzn 1058 how can we style storybook create a poc docs: Kzn 1058 how can we style storybook create a poc Mar 7, 2023
@JakePitman JakePitman marked this pull request as ready for review March 7, 2023 05:45
@gyfchong
Copy link
Contributor

gyfchong commented Mar 7, 2023

Bit of a logo problem
image

@JakePitman JakePitman force-pushed the KZN-1058-how-can-we-style-storybook-create-a-poc branch from b2c1e59 to 7ef3f70 Compare March 7, 2023 23:58
@JakePitman JakePitman force-pushed the KZN-1058-how-can-we-style-storybook-create-a-poc branch from 7ef3f70 to 776c58c Compare March 8, 2023 00:20
@github-actions
Copy link
Contributor

github-actions bot commented Mar 8, 2023

✨ Here is your branch preview! ✨

Last updated for commit 0f0bf8b: docs(storybook theme): add comments explaining css hacks

storybook/main.ts Outdated Show resolved Hide resolved
Copy link
Contributor

@mcwinter07 mcwinter07 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We'll probably want to remove the png version of the logo and the manage.css since we don't use it :) After that, it's a ✅ from me.

storybook/manager.tsx Show resolved Hide resolved
storybook/manager.css Outdated Show resolved Hide resolved
package.json Show resolved Hide resolved
Copy link
Contributor

@mcwinter07 mcwinter07 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🦖 🐜 ! Nice work, let's ship it

@JakePitman JakePitman merged commit 64da7f1 into main Mar 9, 2023
@JakePitman JakePitman deleted the KZN-1058-how-can-we-style-storybook-create-a-poc branch March 9, 2023 03:19
dougmacknz pushed a commit that referenced this pull request Jul 31, 2023
* docs(storybook config): style storybook config

* docs(storybook theme): add Kaizen logo svg

* docs(storybook theme): style subheadings with custom renderLabel prop

* docs(storybook theme): use png instead of svg

* docs(storybook theme): add type dec for theme object

* docs(tailwind theme): prettier fix

* docs(tailwind theme): specify /assets as a static dir

* docs: update root titles and brand image render method

* docs(storybook theme): use 13px and fontweight 600

* docs(storybook theme): change textMutedColor

* docs(storybook theme): add css escape hatch for storybook theme

* docs(storybook theme): remove unused files

* docs(storybook theme): style recently opened header

* docs(storybook theme): add comments explaining css hacks

---------

Co-authored-by: mcwinter07 <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants