search

kss-node / kss-node

The Node.js implementation of KSS: a methodology for documenting CSS and generating style guides
http://kss-node.github.io/kss-node/
Other
1.51k stars 280 forks source link

Framework, Typography and Color support #388

Open DaSchTour opened 7 years ago

DaSchTour commented 7 years ago

First of all thanks for this great tool. But there are some small features that are missing for creating a full style guide.

  1. Support for basic typography style. At the moment basic typography style may bleed out to styling of KSS documentation and somehow KSS doesn't recognize such classes at all and doesn't add them to the styleguide.
  2. Displaying color variables. At the moment settings files are also totally ignored and nothing is shown for files containing color variables.
  3. As I'm using foundation-sites as a base for my project it would be great if KSS would support the basics of such frameworks. For example when talking about colors it would be great if KSS could support maps with colors like foundation uses them.
ryuran commented 7 years ago

1 - Support for basic typography style. At the moment basic typography style may bleed out to styling of KSS documentation

Kss builder should style only .kss-* class to avoid conflict of css selectors.

and somehow KSS doesn't recognize such classes at all and doesn't add them to the styleguide. Can you give an example ?

2 - Displaying color variables. At the moment settings files are also totally ignored and nothing is shown for files containing color variables. Kss is based only on comments. So if you add comment to document yours vers it will appear in your doc.

If you want more there are some issues about color documentation with some answers.

3 - As I'm using foundation-sites as a base for my project it would be great if KSS would support the basics of such frameworks. For example when talking about colors it would be great if KSS could support maps with colors like foundation uses them.

You can document it in your kss comment, in your project.

thiagodemellobueno commented 7 years ago

This is a bit more of an issue for a custom builder than KSS core. We've developed a nifty builder, that supports colors, and we have intention of adding type-specimens when we have a breather.

Should it prove useful I can provide a color example (better docs is our current focus) https://github.com/kalamuna/kstat-kss-builder

ryuran commented 7 years ago

@thiagodemellobueno you should look at my way to document colors in KSS. It can give you some idea https://github.com/kss-node/kss-node/issues/50#issuecomment-248027896

airtonix commented 7 years ago 
Support for basic typography style. At the moment basic typography style may bleed out to styling of KSS documentation and somehow KSS doesn't recognize such classes at all and doesn't add them to the styleguide.

You solve this by creating a custom template that wraps your markup in a webcomponent, which in turn shadow doms the markup and includes your site styles.

livingcss does this.