|
From: <mi...@us...> - 2022-06-13 12:05:47
|
Revision: 9070
http://sourceforge.net/p/docutils/code/9070
Author: milde
Date: 2022-06-13 12:05:32 +0000 (Mon, 13 Jun 2022)
Log Message:
-----------
Fix some problems with HTML5 stylesheets. Add tests for "tuftig.css".
Ignore footnote back-references, when copying from Firefox.
Small tweaks for tuftig.css.
Modified Paths:
--------------
trunk/docutils/docutils/writers/html5_polyglot/minimal.css
trunk/docutils/docutils/writers/html5_polyglot/tuftig.css
Added Paths:
-----------
trunk/docutils/test/functional/expected/rst_html5_tuftig.html
trunk/docutils/test/functional/input/data/tuftig.css
trunk/docutils/test/functional/input/rst_html5_tuftig.txt
trunk/docutils/test/functional/tests/standalone_rst_html5_tuftig.py
Modified: trunk/docutils/docutils/writers/html5_polyglot/minimal.css
===================================================================
--- trunk/docutils/docutils/writers/html5_polyglot/minimal.css 2022-06-13 12:05:18 UTC (rev 9069)
+++ trunk/docutils/docutils/writers/html5_polyglot/minimal.css 2022-06-13 12:05:32 UTC (rev 9070)
@@ -172,6 +172,7 @@
vertical-align: inherit;
}
+.backrefs { user-select: none; }
.backrefs > a { font-style: italic; }
/* superscript footnotes */
Modified: trunk/docutils/docutils/writers/html5_polyglot/tuftig.css
===================================================================
--- trunk/docutils/docutils/writers/html5_polyglot/tuftig.css 2022-06-13 12:05:18 UTC (rev 9069)
+++ trunk/docutils/docutils/writers/html5_polyglot/tuftig.css 2022-06-13 12:05:32 UTC (rev 9070)
@@ -45,6 +45,7 @@
/* vertical space (parskip) */
p, ol, ul, dl, li,
+h1, h2, h3, h4, h5, h6,
div.line-block,
.topic,
.footnote, .citation,
@@ -52,7 +53,6 @@
margin-top: 0.5em;
margin-bottom: 0.5em;
}
-h1, h2, h3, h4, h5, h6,
dl > dd {
margin-bottom: 0.5em;
}
@@ -110,8 +110,8 @@
margin-bottom: 2em;
font-size: 2.0em;
}
-h2, h3, h4 {
- margin-top: 2.0em;
+section {
+ margin-top: 2em;
}
h2, .contents > p.topic-title {
font-size: 2.2em;
@@ -222,6 +222,9 @@
}
/* Citation list (style as description list) */
+.citation-list {
+ display: contents;
+}
.citation {
padding-left: 1.5em;
}
@@ -469,7 +472,11 @@
}
.citation.align-left {
font-size: 1em;
+ padding-left: 1.5em;
}
+ .citation.align-left .label {
+ margin-left: -1.5em;
+ }
figure > img { /* indent */
margin: 0.5em 2%;
padding-left: 1em;
@@ -478,14 +485,14 @@
/* Margin Elements */
/* Sidebar, Footnotes, Citations, Captions */
aside.sidebar,
+ .citation,
.footnote,
- .citation-list,
figcaption,
/* table > caption, does not work :(*/
.marginal,
.admonition.marginal,
.topic.marginal {
- /* background-color: Lavender; */
+ /* color: red; */
grid-column: margin;
width: auto;
max-width: 55em;
@@ -503,13 +510,15 @@
display: block;
margin: 0.5em 0;
}
- .citation {
+ .citation,
+ .footnote {
padding-left: 0;
}
- .footnote .label,
- .citation .label {
+ .citation .label,
+ .footnote .label {
margin-left: 0;
}
+
/* Fullwidth Elements */
h1.title, p.subtitle,
dl.docinfo,
Added: trunk/docutils/test/functional/expected/rst_html5_tuftig.html
===================================================================
--- trunk/docutils/test/functional/expected/rst_html5_tuftig.html (rev 0)
+++ trunk/docutils/test/functional/expected/rst_html5_tuftig.html 2022-06-13 12:05:32 UTC (rev 9070)
@@ -0,0 +1,141 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<meta name="generator" content="Docutils 0.19b.dev: https://docutils.sourceforge.io/" />
+<title>Special Features of the tuftig.css Stylesheet</title>
+<link rel="stylesheet" href="../input/data/minimal.css" type="text/css" />
+<link rel="stylesheet" href="../input/data/tuftig.css" type="text/css" />
+</head>
+<body>
+<main id="special-features-of-the-tuftig-css-stylesheet">
+<h1 class="title">Special Features of the <cite>tuftig.css</cite> Stylesheet</h1>
+
+<p><span class="docutils literal">tuftig.css</span> is a <a class="reference external" href="http://www.w3.org/TR/CSS3">CSS3</a> style sheet for the output of Docutils’
+HTML5 writer. The rules are inspired by <a class="citation-reference" href="#tufte-css" id="citation-reference-1" role="doc-biblioref">[tufte.css]</a> and
+<a class="citation-reference" href="#tufte-latex" id="citation-reference-2" role="doc-biblioref">[tufte-latex]</a> going back to Edward Tufte’s layout design.</p>
+<div role="list" class="citation-list">
+<div class="citation" id="tufte-css" role="doc-biblioentry">
+<span class="label"><span class="fn-bracket">[</span><a role="doc-backlink" href="#citation-reference-1">tufte.css</a><span class="fn-bracket">]</span></span>
+<p>Dave Liepmann, <cite>Tufte CSS</cite>,
+<a class="reference external" href="https://edwardtufte.github.io/tufte-css/">https://edwardtufte.github.io/tufte-css/</a>.</p>
+</div>
+<div class="citation" id="tufte-latex" role="doc-biblioentry">
+<span class="label"><span class="fn-bracket">[</span><a role="doc-backlink" href="#citation-reference-2">tufte-latex</a><span class="fn-bracket">]</span></span>
+<p>Bil Kleb, Bill Wood and Kevin Godby,
+<cite>A Tufte-Style Book</cite>,
+<a class="reference external" href="https://www.ctan.org/pkg/tufte-latex">https://www.ctan.org/pkg/tufte-latex</a>.</p>
+</div>
+</div>
+<section id="fullwidth-and-margin-objects">
+<h2>Fullwidth and Margin Objects</h2>
+<p class="fullwidth">Block elements (paragraphs, admonitions, topics, figures, tables, …)
+with the “fullwidth” class argument use full text width.</p>
+<table class="booktabs numbered captionbelow fullwidth">
+<caption>A fullwidth table with LaTeX math commands</caption>
+<tbody>
+<tr><td><p><cite>arccos</cite></p></td>
+<td><p><span class="docutils literal">\arccos</span></p></td>
+<td><p><cite>gcd</cite></p></td>
+<td><p><span class="docutils literal">\gcd</span></p></td>
+<td><p><cite>Pr</cite></p></td>
+<td><p><span class="docutils literal">\Pr</span></p></td>
+</tr>
+<tr><td><p><cite>arcsin</cite></p></td>
+<td><p><span class="docutils literal">\arcsin</span></p></td>
+<td><p><cite>hom</cite></p></td>
+<td><p><span class="docutils literal">\hom</span></p></td>
+<td><p><cite>projlim</cite></p></td>
+<td><p><span class="docutils literal">\projlim</span></p></td>
+</tr>
+</tbody>
+</table>
+<figure class="numbered fullwidth">
+<img alt="reStructuredText, the markup syntax" src="../../../docs/user/rst/images/title.svg" style="width: 90%; height: 1.5em;" />
+<figcaption>
+<p>A numbered fullwidth figure.</p>
+</figcaption>
+</figure>
+<p>Block elements (admonitions, figures, tables, …) with the
+“marginal” class argument are set in the right margin (if place permits).</p>
+<p class="marginal">An ordinary paragraph with the “marginal” class argument.</p>
+<p>Tight integration of graphics with text is central to Tufte’s work
+even when those graphics are ancillary to the main body of a text. In
+many of those cases, a margin figure may be most appropriate.</p>
+<figure class="marginal numbered">
+<img alt="../../../docs/user/rst/images/biohazard.png" src="../../../docs/user/rst/images/biohazard.png" style="width: 2em;" />
+<figcaption>
+<p>This is a marginal figure.</p>
+<div class="legend">
+<p>This is the legend.</p>
+</div>
+</figcaption>
+</figure>
+<p>To place an image in the margin, use a marginal figure without caption.</p>
+<figure class="marginal">
+<img alt="../../../docs/user/rst/images/biohazard.png" src="../../../docs/user/rst/images/biohazard.png" style="width: 2em;" />
+</figure>
+<p>Marginal objects are placed to the right of the preceding main text
+block.</p>
+<aside class="admonition marginal note">
+<p class="admonition-title">Note</p>
+<p>This is a “note” type admonition with a block-quote inside.</p>
+<blockquote>
+<p>This is a silly text that is only there to
+demonstrate line wrapping.</p>
+</blockquote>
+</aside>
+<p>By default, citations and footnotes are set in the margin.
+To have them in the main text area (like <a class="citation-reference" href="#testbook" id="citation-reference-3" role="doc-biblioref">[Testbook]</a> and <a class="citation-reference" href="#tb98" id="citation-reference-4" role="doc-biblioref">[tb98]</a> here),
+use the “align-left” class value.</p>
+<div role="list" class="citation-list">
+<div class="citation align-left" id="testbook" role="doc-biblioentry">
+<span class="label"><span class="fn-bracket">[</span><a role="doc-backlink" href="#citation-reference-3">Testbook</a><span class="fn-bracket">]</span></span>
+<p>John Ex Ample, <cite>How to test web pages</cite>, Ontario, 1978.</p>
+</div>
+<div class="citation align-left" id="tb98" lang="de" role="doc-biblioentry">
+<span class="label"><span class="fn-bracket">[</span><a role="doc-backlink" href="#citation-reference-4">tb98</a><span class="fn-bracket">]</span></span>
+<p>Horst Schramm, <cite>Docutils 0.5</cite>, in Testberichte III,
+Leipzig, 1998.</p>
+</div>
+</div>
+<table class="booktabs numbered captionbelow marginal">
+<caption>A marginal table</caption>
+<thead>
+<tr><th class="head"><p>A</p></th>
+<th class="head"><p>B</p></th>
+<th class="head"><p>A or B</p></th>
+</tr>
+</thead>
+<tbody>
+<tr><td><p>False</p></td>
+<td><p>False</p></td>
+<td><p>False</p></td>
+</tr>
+<tr><td><p>True</p></td>
+<td><p>False</p></td>
+<td><p>True</p></td>
+</tr>
+<tr><td><p>False</p></td>
+<td><p>True</p></td>
+<td><p>True</p></td>
+</tr>
+<tr><td><p>True</p></td>
+<td><p>True</p></td>
+<td><p>True</p></td>
+</tr>
+</tbody>
+</table>
+<aside class="footnote superscript align-left" id="not-in-margin" role="note">
+<span class="label"><span class="fn-bracket">[</span>1<span class="fn-bracket">]</span></span>
+<p>The “align-left” class value ensures this footnote is set
+in the main text area.</p>
+</aside>
+</section>
+</main>
+<footer>
+<p><a class="reference external image-reference" href="http://www.w3.org/TR/html5/"><img alt="Conforms to HTML 5" src="http://www.w3.org/html/logo/badge/html5-badge-h-css3-semantics.png" style="width: 88px; height: 31px;" /></a> <a class="reference external image-reference" href="http://validator.w3.org/check?uri=referer"><img alt="Check validity!" src="https://www.w3.org/Icons/ValidatorSuite/vs-blue-190.png" style="width: 88px; height: 31px;" /></a> <a class="reference external image-reference" href="http://jigsaw.w3.org/css-validator/check/referer"><img alt="Valid CSS 2.1!" src="http://jigsaw.w3.org/css-validator/images/vcss" style="width: 88px; height: 31px;" /></a></p>
+</footer>
+</body>
+</html>
Property changes on: trunk/docutils/test/functional/expected/rst_html5_tuftig.html
___________________________________________________________________
Added: svn:eol-style
## -0,0 +1 ##
+native
\ No newline at end of property
Added: svn:keywords
## -0,0 +1 ##
+Author Date Id Revision
\ No newline at end of property
Added: trunk/docutils/test/functional/input/data/tuftig.css
===================================================================
--- trunk/docutils/test/functional/input/data/tuftig.css (rev 0)
+++ trunk/docutils/test/functional/input/data/tuftig.css 2022-06-13 12:05:32 UTC (rev 9070)
@@ -0,0 +1 @@
+link ../../../../docutils/writers/html5_polyglot/tuftig.css
\ No newline at end of file
Property changes on: trunk/docutils/test/functional/input/data/tuftig.css
___________________________________________________________________
Added: svn:eol-style
## -0,0 +1 ##
+native
\ No newline at end of property
Added: svn:keywords
## -0,0 +1 ##
+Author Date Id Revision
\ No newline at end of property
Added: svn:special
## -0,0 +1 ##
+*
\ No newline at end of property
Added: trunk/docutils/test/functional/input/rst_html5_tuftig.txt
===================================================================
--- trunk/docutils/test/functional/input/rst_html5_tuftig.txt (rev 0)
+++ trunk/docutils/test/functional/input/rst_html5_tuftig.txt 2022-06-13 12:05:32 UTC (rev 9070)
@@ -0,0 +1,125 @@
+Special Features of the `tuftig.css` Stylesheet
+===============================================
+
+``tuftig.css`` is a CSS3_ style sheet for the output of Docutils'
+HTML5 writer. The rules are inspired by [tufte.css]_ and
+[tufte-latex]_ going back to Edward Tufte's layout design.
+
+.. [tufte.css] Dave Liepmann, `Tufte CSS`,
+ https://edwardtufte.github.io/tufte-css/.
+.. [tufte-latex] Bil Kleb, Bill Wood and Kevin Godby,
+ `A Tufte-Style Book`,
+ https://www.ctan.org/pkg/tufte-latex.
+
+.. _CSS3: http://www.w3.org/TR/CSS3
+
+
+Fullwidth and Margin Objects
+----------------------------
+
+.. class:: fullwidth
+
+Block elements (paragraphs, admonitions, topics, figures, tables, ...)
+with the "fullwidth" class argument use full text width.
+
+
+.. table:: A fullwidth table with LaTeX math commands
+ :class: numbered colwidths-auto fullwidth
+
+ ========= =========== ========= =========== ============= ================
+ `\arccos` ``\arccos`` `\gcd` ``\gcd`` `\Pr` ``\Pr``
+ `\arcsin` ``\arcsin`` `\hom` ``\hom`` `\projlim` ``\projlim``
+ ========= =========== ========= =========== ============= ================
+
+.. figure:: ../../../docs/user/rst/images/title.svg
+ :alt: reStructuredText, the markup syntax
+ :width: 90%
+ :height: 1.5em
+ :figclass: numbered fullwidth
+
+ A numbered fullwidth figure.
+
+Block elements (admonitions, figures, tables, ...) with the
+"marginal" class argument are set in the right margin (if place permits).
+
+.. class:: marginal
+
+An ordinary paragraph with the "marginal" class argument.
+
+Tight integration of graphics with text is central to Tufte’s work
+even when those graphics are ancillary to the main body of a text. In
+many of those cases, a margin figure may be most appropriate.
+
+.. figure:: ../../../docs/user/rst/images/biohazard.png
+ :figclass: marginal numbered
+ :width: 2em
+
+ This is a marginal figure.
+
+ This is the legend.
+
+To place an image in the margin, use a marginal figure without caption.
+
+.. figure:: ../../../docs/user/rst/images/biohazard.png
+ :figclass: marginal
+ :width: 2em
+
+Marginal objects are placed to the right of the preceding main text
+block.
+
+.. Note:: This is a "note" type admonition with a block-quote inside.
+ :class: marginal
+
+ This is a silly text that is only there to
+ demonstrate line wrapping.
+
+By default, citations and footnotes are set in the margin.
+To have them in the main text area (like [Testbook]_ and [tb98]_ here),
+use the "align-left" class value.
+
+.. class:: align-left
+
+.. [Testbook] John Ex Ample, `How to test web pages`, Ontario, 1978.
+
+.. class:: align-left language-de
+
+.. [tb98] Horst Schramm, `Docutils 0.5`, in Testberichte III,
+ Leipzig, 1998.
+
+.. table:: A marginal table
+ :widths: auto
+ :class: marginal
+
+ ======= ======= ==========
+ A B A or B
+ ======= ======= ==========
+ False False False
+ True False True
+ False True True
+ True True True
+ ======= ======= ==========
+
+.. class:: align-left
+
+.. [#not-in-margin] The "align-left" class value ensures this footnote is set
+ in the main text area.
+
+.. footer:: |HTML 5| |validator| |valid-CSS2|
+
+.. |HTML 5| image:: http://www.w3.org/html/logo/badge/html5-badge-h-css3-semantics.png
+ :height: 31
+ :width: 88
+ :alt: Conforms to HTML 5
+ :target: http://www.w3.org/TR/html5/
+
+.. |validator| image:: https://www.w3.org/Icons/ValidatorSuite/vs-blue-190.png
+ :height: 31
+ :width: 88
+ :alt: Check validity!
+ :target: http://validator.w3.org/check?uri=referer
+
+.. |valid-CSS2| image:: http://jigsaw.w3.org/css-validator/images/vcss
+ :height: 31
+ :width: 88
+ :alt: Valid CSS 2.1!
+ :target: http://jigsaw.w3.org/css-validator/check/referer
Property changes on: trunk/docutils/test/functional/input/rst_html5_tuftig.txt
___________________________________________________________________
Added: svn:eol-style
## -0,0 +1 ##
+native
\ No newline at end of property
Added: svn:keywords
## -0,0 +1 ##
+Author Date Id Revision
\ No newline at end of property
Added: trunk/docutils/test/functional/tests/standalone_rst_html5_tuftig.py
===================================================================
--- trunk/docutils/test/functional/tests/standalone_rst_html5_tuftig.py (rev 0)
+++ trunk/docutils/test/functional/tests/standalone_rst_html5_tuftig.py 2022-06-13 12:05:32 UTC (rev 9070)
@@ -0,0 +1,18 @@
+with open('functional/tests/_standalone_rst_defaults.py') as _f:
+ exec(_f.read())
+
+# Source and destination file names.
+test_source = "rst_html5_tuftig.txt"
+test_destination = "rst_html5_tuftig.html"
+
+# Keyword parameters passed to publish_file.
+writer_name = "html5"
+
+# Settings:
+settings_overrides['smart_quotes'] = 'yes'
+settings_overrides['footnote_references'] = 'superscript'
+settings_overrides['table_style'] = 'booktabs numbered captionbelow'
+# local copy of stylesheets:
+# (Test runs in ``docutils/test/``, we need relative path from there.)
+settings_overrides['stylesheet_dirs'] = ('.', 'functional/input/data')
+settings_overrides['stylesheet_path'] = 'minimal.css, tuftig.css'
Property changes on: trunk/docutils/test/functional/tests/standalone_rst_html5_tuftig.py
___________________________________________________________________
Added: svn:eol-style
## -0,0 +1 ##
+native
\ No newline at end of property
Added: svn:keywords
## -0,0 +1 ##
+Author Date Id Revision
\ No newline at end of property
This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.
|