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

Polish: typography #3716

Open
Tracked by #3705
asvae opened this issue Aug 20, 2023 · 1 comment
Open
Tracked by #3705

Polish: typography #3716

asvae opened this issue Aug 20, 2023 · 1 comment
Labels
d3: medium No cheats. Monsters a bit faster. docs packages/docs storybook Relates to storybook v4: must have This is something really user want to have

Comments

@asvae
Copy link
Member

asvae commented Aug 20, 2023

There are a couple of problems with current typography implementation.

We switched to tailwind out of the box, so we want to remove all helpers that do not fit. Doesn't mean vuestic should have no style helper, more of we want to be strategic when we decide what to leave (what benefit it has compared to tailwind).

Here an example of helper, I believe, we can safely delete:

image

Tailwind has all of that and much much more.

Docs

  • In typography docs we have no mention of ability to make typography global, which would be ideal for starter app. This has to be added in some form very close to the top of the page.
  • We don't have docs page for content at all, which is a great way to style your html.

Stories

  • We don't have stories for typography classes, only for content. So these are very untested.
  • For va-content we want to test that it doesn't conflict with any of our components. I suggest the following comparizon approach:
    <Default>
    <va-content>
      <Default>
    <va-content>
    
    Default with and without va-content should look exactly the same.

Other

  • We might want to remove typography helper altogether, but that has to go with major version (vuestic 2.0), as that's a very breaking change. Even for small typography change we want a breaking change notification.
@asvae asvae mentioned this issue Aug 20, 2023
77 tasks
@asvae asvae added docs packages/docs storybook Relates to storybook v4: must have This is something really user want to have d3: medium No cheats. Monsters a bit faster. labels Aug 20, 2023
@m0ksem
Copy link
Collaborator

m0ksem commented Aug 20, 2023

Typography must be splitted in two modules: typography helpers, typography components.

Components - classes like va-h1, va-code, va-unordered, etc.
Helpers - classes like va-uppercase, va-bold, etc.

Possible imports:

default:

vuestic/css - includes all typography modules

// or

vuestic/styles/typography - helpers and elements 

// or

vuestic/styles/typography/helpers - only helpers
vuestic/styles/typography/elements - only components or elements, whatever you call it

First two already implemented

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
d3: medium No cheats. Monsters a bit faster. docs packages/docs storybook Relates to storybook v4: must have This is something really user want to have
Projects
None yet
Development

No branches or pull requests

2 participants