Add PostCSS import theme plugin

[yhatt]

This PR will add PostCSS import theme plugin. It recognizes @import 'theme'; rule in theme and could import the other plugin that is added to ThemeSet instance.

/* @theme base */
section {
  width: 960px;
  height: 720px;

  background: silver;
}

/* @theme wide */

@import 'base';

section {
  width: 1280px;
}

themeSet.pack('wide') returns the imported style when these themes are added to the ThemeSet instance. In this case, you can see the slide for widescreen.

We might prepare another syntax @import-theme to avoid preprocessing by Sass.

ToDo

• Implement import logic
• Support nested import
• Raise error on detecting circular import
• [ ] Fix section size plugin to recognize the slide size defined in a final section rule after imported
• Fix ThemeSet#getThemeProp to fallback into imported themes
• Add more test cases

[yhatt]

According to the CSS specification, @import must precede all other types of rules, except @charset rules.

So we can parse @import rule(s) when the theme is added and use as fallback themes on calling ThemeSet#getThemeProp. I have thought its implementation is not too difficult.

[yhatt]

OK, we are ready to use the theme import feature!

@import will replace from the definition into the specified theme contents. It could make a based theme customize easily.

To get along with CSS preprocessors like Sass, we provide alternative syntax @import-theme too.

/* @theme wide */

@import-theme 'base';

section {
  width: 1280px;
}

Sass's @import will resolve file path and remove the definition. Preprocessor's optimization about the order of @ rule might break the defined order. @marpit-theme can define theme(s) to add into the beginning of CSS.

---

We must write a section about @import on README.md

Remaining

• Update README.md
• Update CHANGELOG.md