54 lines
2.4 KiB
Markdown
54 lines
2.4 KiB
Markdown
# ao3-styles
|
|
|
|
A few style templates and models I'm using for Work Styles in my AO3 profile. They are built on top of the site's default "Basic" style.
|
|
|
|
Styles here cover primarily three aspects:
|
|
|
|
* Supplementing styles (eg.: cursive font) and typographical effects (indentation, small-caps, etc).
|
|
* Prefering Libre / free resources (eg.: Liberation fonts before Microsoft's fonts).
|
|
* Adding styles that emphasize a 1/3rd or 2/3rd column design (tables, floatboxes, etc).
|
|
|
|
|
|
## Installation
|
|
|
|
Create a new CSS file and ``cat`` or copy over the styles from the files you want.
|
|
|
|
Copy the resulting file into a named Work Skin.
|
|
|
|
Adjust as needed.
|
|
|
|
## Usage
|
|
|
|
Decorate the elements of the chapter's HTML with the styles as needed. The [official AO3 FAQ on Work Skins](https://archiveofourown.org/faq/tutorial-creating-a-work-skin?language_id=en) covers the overall procedure.
|
|
|
|
## Contents
|
|
|
|
* [ao3-sitestyle-basicimproved.css] — General layout and typography styles used by default in my stories.
|
|
|
|
Some impirtant class names that are defined:
|
|
|
|
* ``print``: Applied to a ``div``, will format its children ``p`` with spacing between paragraphs.
|
|
* ``flashback`` for flashback sections, has left indent and wavy left border.
|
|
* ``epistolary`` for IU documents, has side margin and straight side borders.
|
|
* ``REDACTED`` for spans of lines and sections that are redacted over.
|
|
* ``EVIL`` for spans of red-speak as it's used in WAAPT.
|
|
* ``newspaper`` for <hX> elements with style.
|
|
* ``newsreel`` for <hX> elements with style.
|
|
* ``font-{fallback}``: styles general font fallbacks (eg.: "sans-serif") preferring Libre fonts where available.
|
|
* ``metric-{font}``: styles text with Libre fonts metric-compatible to proprietary fonts.
|
|
* ``reflink``: styles links so they are distinguishable when they point to select targets such as Wikipedia.
|
|
|
|
## Extensions
|
|
|
|
Each file in ``styles/`` contains a selection of styles that can be added together to realize various effects. These effects include:
|
|
|
|
* ``color-x11.css``: gives class name to X11 / SVG colours. Not needed if colour is used sparingly. (background-colors is pending)
|
|
* ``dl-sidenote.css``: implements paragraph-level footnotes by styling definition lists (``<dl>``).
|
|
* ``ruby.css``: Ruby presentation fallback, obsolete since late 2023.
|
|
* ``terminal.css``: styles content as if it were computer terminal output.
|
|
|
|
|
|
## License
|
|
|
|
Creative Commons **BY-NC-SA 4.0**. See [LICENSE] for details.
|
|
|