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

Add scoped font sizes #52

Open
ArmorDarks opened this issue Apr 29, 2016 · 0 comments
Open

Add scoped font sizes #52

ArmorDarks opened this issue Apr 29, 2016 · 0 comments
Milestone

Comments

@ArmorDarks
Copy link
Owner

Yet to be decided do we really need it.

We could allow to define specific for certain scopes font sizes, which will generated all needed sets of helpers classes.

Like that:

$ekzo-font-sizes: (

  text: (
    base: 14px, // used for vertical rhythm calculation; = .text--base, .font-size--base, .line-height--base
    '-':  12px, // = .text-,  .font-size-,  .line-height-
    '--': 10px, // = .text--, .font-size--, .line-height--
  ),

  headings: (
    h1: 36px, // = h1, .h1, .font-size--h1, .line-height--h1
    h2: 30px, // = h2, .h2, .font-size--h2, .line-height--h2
    h3: 24px, // = h3, .h3, .font-size--h3, .line-height--h3
    h4: 21px, // = h4, .h4, .font-size--h4, .line-height--h4
    h5: 18px, // = h5, .h5, .font-size--h5, .line-height--h5
    h6: 16px, // = h6, .h6, .font-size--h6, .line-height--h6
  ),

  extra-headings: (
    \+\+: 96px, // = .extra-h\+\+\+, .font-size\+\+\+, .line-height\+\+\+
    \+:   72px, // = .extra-h\+\+,   .font-size\+\+,   .line-height\+\+
    base:   44px, // = .extra-h\+,     .font-size\+,     .line-height\+
  ),

  buttons: (), // = .btn--*name*

  // --------> here magic happens
  blog: (
    text: 20px,
    headings: ()
  )
  // --------> here magic ends

) !default;
@ArmorDarks ArmorDarks modified the milestone: backlog Jan 23, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant