m.htmlsanity: apply .m-link-wrap to plain URL links.

diff --git a/doc/css/typography.rst b/doc/css/typography.rst
index 03a6ce15406c4f1b1371eea80c1515515fd222e6..88b0bd970a3fc10d628293892512032d29a36421 100644 (file)
--- a/doc/css/typography.rst
+++ b/doc/css/typography.rst
@@ -443,11 +443,12 @@ in the grid system for aligning and floating blocks in a similar way.
 
 By default, all text is wrapped according to default HTML rules. In order to
 look better on very narrow screens, it's possible to use :html:`­` to
-hyphenate words --- either manually on a case-by-case basis, or using the
-`m.htmlsanity plugin <{filename}/plugins/htmlsanity.rst#hyphenation>`_. The
-:html:`<wbr/>` HTML tag does the same without rendering any hyphens, and
-finally there's a :css:`.m-link-wrap` you can apply to links with long URLs to
-break anywhere:
+hyphenate words. The :html:`<wbr/>` HTML tag does the same without rendering
+any hyphens, and finally there's a :css:`.m-link-wrap` you can apply to links
+with long URLs to break anywhere. Both hyphenation and link wrapping can be
+done either manually on a case-by-case basis, or using the
+`m.htmlsanity plugin <{filename}/plugins/htmlsanity.rst>`_, which can do both
+automatically.
 
 .. code-figure::
 

diff --git a/doc/plugins/htmlsanity.rst b/doc/plugins/htmlsanity.rst
index f6080e81baa5cef53be69d8dc89a3f2cebdcae59..8904046326c57ea5cf69dde760a0bc5466892982 100644 (file)
--- a/doc/plugins/htmlsanity.rst
+++ b/doc/plugins/htmlsanity.rst
@@ -117,6 +117,15 @@ horrible, right?) with a custom HTML5 writer derived from
 -   :abbr:`reST <reStructuredText>` comments are simply ignored, instead of
     being put into :html:`<!-- -->`
 
+Additionally, the following m.css-specific changes are done:
+
+-   Footnotes and footnote references have the :css:`.m-footnote`
+    `styling classes <{filename}/css/typography.rst#footnotes-and-footnote-references>`_
+    applied
+-   Links that are just URLs have :css:`.m-link-wrap` appied `to better wrap on narrow screens <{filename}/css/typography.rst#footnotes-and-footnote-references>`_.
+    Note that it's also possible to apply this and other CSS classes explicitly
+    with the `m.link <{filename}/plugins/links.rst#stylable-links>`_ plugin.
+
 `Typography`_
 =============
 

diff --git a/documentation/test_python/inspect_type_links/inspect_type_links.first.Foo.html b/documentation/test_python/inspect_type_links/inspect_type_links.first.Foo.html
index 3e0e810d07394314344769532b0604426591f74a..95e788b593a3715db3323a33831ed5cb82b06ba6 100644 (file)
--- a/documentation/test_python/inspect_type_links/inspect_type_links.first.Foo.html
+++ b/documentation/test_python/inspect_type_links/inspect_type_links.first.Foo.html
@@ -43,7 +43,7 @@ lead to self; referencing the subclass via <a class="m-doc" href="inspect_type_l
 <p>This is consistent with how Python type annotations inside <em>a class</em> are
 interpreted -- see <a class="m-doc" href="inspect_type_links.first.Foo.html#reference_self_data">reference_self_data</a>, <a class="m-doc" href="inspect_type_links.first.Foo.html#reference_inner_data">reference_inner_data</a>
 and <a class="m-doc" href="inspect_type_links.first.Foo.html#reference_inner_other_data">reference_inner_other_data</a>. Inside <em>function definitions</em> the
-rules are different as per <a href="https://docs.python.org/3/reference/executionmodel.html#resolution-of-names">https://docs.python.org/3/reference/executionmodel.html#resolution-of-names</a>:</p>
+rules are different as per <a class="m-link-wrap" href="https://docs.python.org/3/reference/executionmodel.html#resolution-of-names">https://docs.python.org/3/reference/executionmodel.html#resolution-of-names</a>:</p>
 <blockquote>
 The scope of names defined in a class block is limited to the class
 block; it does not extend to the code blocks of methods</blockquote>

diff --git a/plugins/m/htmlsanity.py b/plugins/m/htmlsanity.py
index 70df7f659f3584dc0e5ca1c1013146cd9c8b4006..ce734f28cb2c51d73756f161865887978fbb11e5 100644 (file)
--- a/plugins/m/htmlsanity.py
+++ b/plugins/m/htmlsanity.py
@@ -370,6 +370,15 @@ class SaneHtmlTranslator(HTMLTranslator):
         # why?!?!
         #if not isinstance(node.parent, nodes.TextElement):
             #assert len(node) == 1 and isinstance(node[0], nodes.image)
+
+        # If the link is a plain URL without explicitly specified title, apply
+        # m-link-wrap so it doesn't leak out of the view on narrow screens.
+        # This can be disabled by explicitly providing the URL also as a title
+        # --- then the node will have a name attribute and we'll skip in that
+        # case.
+        if len(node.children) == 1 and isinstance(node.children[0], nodes.Text) and 'name' not in node and 'refuri' in node and node.children[0] == node['refuri']:
+            node['classes'] += ['m-link-wrap']
+
         self.body.append(self.starttag(node, 'a', '', **atts))
 
     def depart_reference(self, node):

diff --git a/plugins/m/test/gh/page.html b/plugins/m/test/gh/page.html
index 9f9f39760a4288d08c769684904edae4c2773358..1b1772a7048cad2b8c816080564cc724be32ad7b 100644 (file)
--- a/plugins/m/test/gh/page.html
+++ b/plugins/m/test/gh/page.html
@@ -28,10 +28,10 @@
 <li>Repository link: <a href="https://github.com/mosra/m.css">mosra/m.css</a></li>
 <li>Commit link: <a href="https://github.com/mosra/m.css/commit/4d362223f107cffd8731a0ea031f9353a0a2c7c4">mosra/m.css&#64;4d36222</a></li>
 <li>Issue/PR link: <a href="https://github.com/mosra/magnum/issues/123">mosra/magnum#123</a></li>
-<li>Tree link: <a href="https://github.com/mosra/m.css/tree/next">https://github.com/mosra/m.css/tree/next</a></li>
-<li>Tag link: <a href="https://github.com/mosra/magnum/releases/tag/snapshot-2015-05">https://github.com/mosra/magnum/releases/tag/snapshot-2015-05</a></li>
-<li>File link: <a href="https://github.com/mosra/m.css/tree/master/css/m-dark.css">https://github.com/mosra/m.css/tree/master/css/m-dark.css</a></li>
-<li>Arbitrary link: <a href="https://github.com/mosra/magnum/graphs/contributors">https://github.com/mosra/magnum/graphs/contributors</a></li>
+<li>Tree link: <a class="m-link-wrap" href="https://github.com/mosra/m.css/tree/next">https://github.com/mosra/m.css/tree/next</a></li>
+<li>Tag link: <a class="m-link-wrap" href="https://github.com/mosra/magnum/releases/tag/snapshot-2015-05">https://github.com/mosra/magnum/releases/tag/snapshot-2015-05</a></li>
+<li>File link: <a class="m-link-wrap" href="https://github.com/mosra/m.css/tree/master/css/m-dark.css">https://github.com/mosra/m.css/tree/master/css/m-dark.css</a></li>
+<li>Arbitrary link: <a class="m-link-wrap" href="https://github.com/mosra/magnum/graphs/contributors">https://github.com/mosra/magnum/graphs/contributors</a></li>
 <li><a href="https://github.com/getpelican/pelican">Link with custom title</a></li>
 <li>Flat link: <a class="m-flat" href="https://github.com/mosra">&#64;mosra</a></li>
 </ul>

diff --git a/plugins/m/test/htmlsanity_content/page.html b/plugins/m/test/htmlsanity_content/page.html
index cb60caf4f201a9e42552ae14b187e390cf93797a..432335070caa118e19607df32a8d96c835c4e166 100644 (file)
--- a/plugins/m/test/htmlsanity_content/page.html
+++ b/plugins/m/test/htmlsanity_content/page.html
@@ -77,7 +77,7 @@ content<br />
 <h2><a href="#id6">Section title</a></h2>
 <p>An <em>emphasised text</em>, <strong>strong text</strong> and a <code>literal</code>. Link to
 <a href="https://google.com">Google</a>, <a href="#a-heading">the heading below</a> or just an
-URL as-is: <a href="https://mcss.mosra.cz/">https://mcss.mosra.cz/</a>. <a href="mailto:mosra&#64;centrum.cz">E-mail</a>. A footnote
+URL as-is: <a class="m-link-wrap" href="https://mcss.mosra.cz/">https://mcss.mosra.cz/</a>. <a href="mailto:mosra&#64;centrum.cz">E-mail</a>. A footnote
 reference on a single thing <a class="m-footnote" href="#id4" id="id1">1</a> and more things <a class="m-footnote" href="#id4" id="id2">1</a> <a class="m-footnote" href="#id5" id="id3">2</a></p>
 <dl class="m-footnote">
 <dt id="id4">1.</dt>
@@ -85,6 +85,16 @@ reference on a single thing <a class="m-footnote" href="#id4" id="id1">1</a> and
 <dt id="id5">2</a>.</dt>
 <dd><span class="m-footnote"><a href="#id3">^</a></span> Second thing description</dd>
 </dl>
+<div class="m-row">
+<div class="m-col-m-4 m-push-m-4 m-col-t-6 m-push-t-3 m-nopady">
+<p>A link that gets auto-wrapped:</p>
+<p><a class="m-link-wrap" href="http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk">http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk</a></p>
+<p>A link that doesn't, because the title is different:</p>
+<p><a href="http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk">llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk</a></p>
+<p>A link that also doesn't, because the title is the same, but specified explicitly:</p>
+<p><a href="http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk">http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk</a></p>
+</div>
+</div>
 <section id="section-title-with-link">
 <h3><a href="#section-title-with-link">Section title with link</a></h3>
 <p>A line:</p>

diff --git a/plugins/m/test/htmlsanity_content/page.rst b/plugins/m/test/htmlsanity_content/page.rst
index 156d8f967cb8c3e6377b25bbd6bc94b4423e5ec4..393206d65d09f6e5f108fea977a8a12509e81f3f 100644 (file)
--- a/plugins/m/test/htmlsanity_content/page.rst
+++ b/plugins/m/test/htmlsanity_content/page.rst
@@ -53,6 +53,22 @@ reference on a single thing [1]_ and more things [1]_ [2]_
 .. [1] A footnote description
 .. [2] Second thing description
 
+.. container:: m-row
+
+    .. container:: m-col-m-4 m-push-m-4 m-col-t-6 m-push-t-3 m-nopady
+
+        A link that gets auto-wrapped:
+
+        http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk
+
+        A link that doesn't, because the title is different:
+
+        `llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk <http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk>`_
+
+        A link that also doesn't, because the title is the same, but specified explicitly:
+
+        `http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk <http://llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.co.uk>`_
+
 `Section title with link`_
 --------------------------
 

diff --git a/plugins/m/test/htmlsanity_typography/page.html b/plugins/m/test/htmlsanity_typography/page.html
index 0736a62650f48642850fca625adb425391bddd14..54941807c8782e9bedc068180cde9011f9fbbbf0 100644 (file)
--- a/plugins/m/test/htmlsanity_typography/page.html
+++ b/plugins/m/test/htmlsanity_typography/page.html
@@ -58,7 +58,7 @@ ver&shy;ba&shy;tim blocks:</p>
 ei&shy;ther:</p>
 <ul>
 <li><a href="mailto:info&#64;magnum.graphics">info&#64;magnum.graphics</a></li>
-<li><a href="https://magnum.graphics">https://magnum.graphics</a></li>
+<li><a class="m-link-wrap" href="https://magnum.graphics">https://magnum.graphics</a></li>
 <li><a href="#links">Links</a> with&shy;out re&shy;fu&shy;ri should not give an er&shy;ror</li>
 </ul>
 </section>

diff --git a/plugins/m/test/link/page.html b/plugins/m/test/link/page.html
index 01980c9802033a07caee40b6c9762c635281ac09..6f1055e50649df8a08735328a063b8d2770d4867 100644 (file)
--- a/plugins/m/test/link/page.html
+++ b/plugins/m/test/link/page.html
@@ -24,9 +24,9 @@
         <h1>m.link</h1>
 <!-- content -->
 <ul>
-<li>URL with no title: <a href="https://mcss.mosra.cz">https://mcss.mosra.cz</a></li>
+<li>URL with no title: <a class="m-link-wrap" href="https://mcss.mosra.cz">https://mcss.mosra.cz</a></li>
 <li>URL with a title: <a href="https://mcss.mosra.cz">m.css</a></li>
-<li>Link with a class: <a class="m-flat m-text m-strong" href="https://twitter.com/czmosra">https://twitter.com/czmosra</a></li>
+<li>Link with a class: <a class="m-flat m-text m-strong m-link-wrap" href="https://twitter.com/czmosra">https://twitter.com/czmosra</a></li>
 </ul>
 <!-- /content -->
       </div>