aigis-styleguide / aigis

CSS Styleguide Generator

Home Page:http://aigis-styleguide.github.io/aigis/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Import README.md into CSS file?

jarodtaylor opened this issue · comments

I know that I can just add the documentation to README.md and tell Aigis to look for the documentation inside of the aigis_config.yml with:

source_type: .md

Unfortunately, it makes the README.md look like this in Github:

screen shot 2017-08-03 at 4 07 18 pm

I'd rather keep the README.md markdown file clean with markdown only, and would prefer to document the CSS with the YAML.

For example, this is my folder structure:

src/
   styles/
      typography/
         index.css
         README.md

src/styles/typography/index.css

/*
---
name: Typography
category:
  - settings
  - settings/typography
---
*/

src/styles/typography/README.md

--alpha-font-size: 2.25rem;
--beta-font-size: 1.625rem;
--gamma-font-size: 1.5rem;
--delta-font-size: 1.25rem;
--epsilon-font-size: 1rem;
--zeta-font-size: 0.875rem;
--small-font-size: 0.75rem;
--tiny-font-size: 0.6875rem;

--alpha-line-height: 3rem;
--beta-line-height: 2.25rem;
--gamma-line-height: 1.875rem;
--delta-line-height: 1.875rem;
--epsilon-line-height: 1.5rem;
--zeta-line-height: 1.5rem;
--small-line-height: 1.125rem;
--tiny-line-height: 1.125rem;

--serif-font: 'Domaine Text', 'Domaine Display', serif;
--serif-alt-font: 'Domaine Display', 'Domaine Text', serif;
--sans-serif-font: 'Open Sans', sans-serif;
--serif-letter-spacing: 0.03125rem;
--sans-serif-letter-spacing: 0.01875rem;

I've seen other styleguide generators do this. Basically in your CSS file you tell it where to get the documentation. For instance:

src/styles/typography/index.css

/*
---
name: Typography
category:
  - settings
  - settings/typography
import: README.md
---
*/

Is this possible to do with Aigis?