css._notes.scss Maven / Gradle / Ivy
The newest version!
/**
* @var $notes-placement
*
* @brief Notes placement
*
* Placement of notes
*
* Notes, i.e. elements that are referenced by an element with `epub:type` "noteref", can be rendered
* either at bottom of the page on which they occur (on which they are referenced), at the end of the
* block in which they occur, at the end of the volume in which they occur, or at the end of the
* book. Elements with `epub:type` "note", "footnote", "endnote" or "rearnote" that are not referenced
* by a noteref are not rendered.
*
* Note references can be styled using a `a[epub|type~='noteref']` rule. Notes that are placed at the
* end of the block can be styled with a `[epub|type~='notes'], [epub|type~='footnotes'],
* [epub|type~='endnotes'], [epub|type~='rearnotes']` rule. Notes that are placed at the bottom of the
* page or at the end of a chapter, volume or the end of the book can be styled with a
* `a[epub|type~='noteref']::alternate` rule. A title can be inserted at the beginning of an endnotes
* section using a `.endnotes-section::-obfl-on-collection-start` rule. Example:
*
* ~~~css
* .endnotes-section::-obfl-on-collection-start {
* content: "Notes in this volume";
* text-align: center;
* margin-bottom: 1;
* }
* ~~~
*
*
*
* bottom-of-page
* At the bottom of the page
*
* Notes are rendered in the [`@footnotes`](http://braillespecs.github.io/braille-css/#the-footnotes-area)
* area of the page on which they occur.
*
* There is a built-in fallback mechanism: if a note does not fit on a page, e.g. because it is too
* big, or there are too many other notes on that page, all notes in the whole book will be rendered at
* the end of the volume in which they occur.
*
* The footnotes area can be styled using a `@footnotes` rule. Example:
*
* ~~~css
* @page {
* @footnotes {
* border-top: ⠤;
* max-height: 20;
* }
* }
* ~~~
*
* end-of-block
* At the end of the block
*
* Notes are rendered after the block (e.g. paragraph) in which they occur.
*
* end-of-chapter
* At the end of the chapter
*
* Notes are rendered at the end of the chapter (`level1`, `level2`, `level3`, `level4`, `level5`,
* `level6`,) in which they occur.
*
* end-of-volume
* At the end of the volume
*
* Notes are rendered in the [`@end`](http://braillespecs.github.io/braille-css/#the-footnotes-area) area of
* the volume in which they occur.
*
* end-of-book
* At the end of the book
*
* Notes are rendered in the [`@end`](http://braillespecs.github.io/braille-css/#the-footnotes-area) area of
* the last volume.
*
* Notes can be grouped by volume using a
* [`.endnotes-section::-obfl-on-volume-start`](http://braillespecs.github.io/braille-css/obfl#extending-the-display-property-with--obfl-list-of-references)
* rule. Example:
*
* ~~~css
* .endnotes-section::-obfl-on-volume-start {
* content: "Notes in volume " -obfl-evaluate("$started-volume-number");
* margin: 1 0;
* }
* ~~~
*
* custom
* Custom handling
*
* Special handling of notes is disabled. Notes are rendered as specified in custom style sheets.
*
*
*
*/
$notes-placement: end-of-book !default;
$chapter-selector: "level1, level2, level3, level4, level5, level6";
@if $notes-placement != custom {
/*
* - Move note elements if notes-placement is "end-of-block",
* - otherwise generate a div element to contain all the notes and to attach a title.
*/
@xslt "notes.xsl" {
notes-placement: $notes-placement;
endnotes-section-class: "endnotes-section";
chapter-selector: $chapter-selector;
}
@if $notes-placement == end-of-block {
} @else {
noteref::alternate {
display: block;
content: target-content(attr(idref));
}
// notes that are not referenced are not rendered
note {
display: none;
}
.endnotes-section {
display: -obfl-list-of-references;
@if $notes-placement != end-of-chapter {
flow: endnotes-container;
}
&::after {
@if $notes-placement == end-of-chapter {
content: flow(endnotes);
} @else if $notes-placement == end-of-book {
content: flow(endnotes, document);
} @else {
content: flow(endnotes, volume);
}
}
}
@if $notes-placement == bottom-of-page {
noteref::alternate {
flow: footnotes;
}
@page {
@footnotes {
content: flow(footnotes, page);
-obfl-fallback-collection: endnotes;
}
}
} @else {
noteref::alternate {
flow: endnotes;
}
}
@if $notes-placement == end-of-book {
@volume:last {
@end {
content: flow(endnotes-container, document);
}
}
} @else if $notes-placement != end-of-chapter {
@volume {
@end {
content: flow(endnotes-container, document);
}
}
}
}
}