You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

41 lines
1.4 KiB

4 years ago
////
Custom Themes
Creating a theme
This document is included in:
- user-manual
////
You can create your own themes to apply to your documents.
Themes go in the [.path]_sass/_ folder.
To create a new theme, let's call it `hipster`, start by creating two new files:
[.path]_sass/hipster.scss_::
* Imports the theme settings, which includes default variables and resets
* Imports the AsciiDoc components
* Defines any explicit customization
[.path]_sass/settings/_hipster.scss_::
* Sets variables that customize Foundation 4 and the AsciiDoc CSS components
Here's a minimal version of [.path]_sass/hipster.scss_:
[source,scss]
----
@import "settings/hipster";
@import "components/asciidoc";
@import "components/awesome-icons";
----
NOTE: You don't have to include the underscore prefix when importing files.
NOTE: The `awesome-icons` component is only applicable to HTML generated by Asciidoctor > 0.1.2 with the `icons` attribute set to `font`.
You can add any explicit customization below the import lines.
The variables you can set in [.path]_sass/settings/_hipster.scss_ are a combination of the {factory-ref}/blob/master/sass/settings/_settings.scss.dist[Foundation 4 built-in global settings] and {factory-ref}/blob/master/sass/settings/_defaults.scss[global settings and imports for the AsciiDoc components].
Once you've created your custom theme, it's time to apply it to your document.