css: ability to remove the underline from links.

This will be a bit harder to do for reST, will need to create a custom
role for it.

diff --git a/css/m-components.css b/css/m-components.css
index 495c11a0101b6d971f4b36fc2d3da51327c2b645..9f0be76ef4a3e9c98e7758f9c7d3832d5e69bdc7 100644 (file)
--- a/css/m-components.css
+++ b/css/m-components.css
@@ -108,6 +108,9 @@ sub { bottom: -0.2rem; }
 a {
   color: var(--link-color);
 }
+a.m-flat {
+  text-decoration: none;
+}
 a:hover, a:focus, a:active {
   color: var(--link-active-color);
 }

diff --git a/css/m-dark+doxygen.compiled.css b/css/m-dark+doxygen.compiled.css
index 85150baf3834de350fe36380513867d369aa83b2..26f98190e8dc10d4dc12333df7826c9079388585 100644 (file)
--- a/css/m-dark+doxygen.compiled.css
+++ b/css/m-dark+doxygen.compiled.css
@@ -467,6 +467,9 @@ sub { bottom: -0.2rem; }
 a {
   color: #5b9dd9;
 }
+a.m-flat {
+  text-decoration: none;
+}
 a:hover, a:focus, a:active {
   color: #a5c9ea;
 }

diff --git a/css/m-dark.compiled.css b/css/m-dark.compiled.css
index b2459dba103d6b2e3fc6638db2fb958927fd305a..ff49b956ea01e76906e3903d150ddd7a246809f5 100644 (file)
--- a/css/m-dark.compiled.css
+++ b/css/m-dark.compiled.css
@@ -467,6 +467,9 @@ sub { bottom: -0.2rem; }
 a {
   color: #5b9dd9;
 }
+a.m-flat {
+  text-decoration: none;
+}
 a:hover, a:focus, a:active {
   color: #a5c9ea;
 }

diff --git a/css/m-light+doxygen.compiled.css b/css/m-light+doxygen.compiled.css
index c7ca76e8d9e08c496f91cc14a519cd5a937d93ea..e156a6738e07ff75e2bc0178d8bd76c4c436df3b 100644 (file)
--- a/css/m-light+doxygen.compiled.css
+++ b/css/m-light+doxygen.compiled.css
@@ -467,6 +467,9 @@ sub { bottom: -0.2rem; }
 a {
   color: #ea7944;
 }
+a.m-flat {
+  text-decoration: none;
+}
 a:hover, a:focus, a:active {
   color: #cb4b16;
 }

diff --git a/css/m-light.compiled.css b/css/m-light.compiled.css
index 2b58d04ee20cfbb21513da06f2f576413838cc02..8a94d1031d5bd75e34329853a061555e5e5334ed 100644 (file)
--- a/css/m-light.compiled.css
+++ b/css/m-light.compiled.css
@@ -467,6 +467,9 @@ sub { bottom: -0.2rem; }
 a {
   color: #ea7944;
 }
+a.m-flat {
+  text-decoration: none;
+}
 a:hover, a:focus, a:active {
   color: #cb4b16;
 }

diff --git a/doc/css/typography.rst b/doc/css/typography.rst
index e96c39e7b8fa195f007cd9a2aedbca426b299fab..948b489d80e92e132fdb7d55ceb4a44eafe1b60d 100644 (file)
--- a/doc/css/typography.rst
+++ b/doc/css/typography.rst
@@ -354,6 +354,15 @@ will have negative margin to make its contents aligned with surrounding text.
     The Components page has additional information about
     `code block styling <{filename}/css/components.rst#code>`_.
 
+`Text alignment`_
+=================
+
+Use :css:`.m-text-left`, :css:`.m-text-right` or :css:`.m-text-center` to
+align text inside its parent element. Use :css:`.m-text-top`,
+:css:`.m-text-middle` and :css:`.m-text-bottom` to align text vertically for
+example in a table cell. See `Floating around <{filename}/css/grid.rst#floating-around>`_
+in the grid system for aligning and floating blocks in a similar way.
+
 `Inline elements`_
 ==================
 
@@ -377,20 +386,29 @@ will have negative margin to make its contents aligned with surrounding text.
         right now</s> oh, there is also <mark>marked text</mark> and
         <code>int a = some_code();</code>.
 
+Links are underlined by default in all `builtin themes <{filename}/css/themes.rst>`_.
+Adding :css:`.m-flat` to the :html:`<a>` element will remove the underline,
+useful where underlines would be too distracting:
+
+.. code-figure::
+
+    .. code:: html
+
+        <p class="m-text-center m-text m-dim">
+          There is a <a href="#" class="m-flat">hidden</a> link.
+        </p>
+
+    .. raw:: html
+
+        <p class="m-text-center m-text m-dim">
+          There is a <a href="#" class="m-flat">hidden</a> link.
+        </p>
+
 .. note-info::
 
     The Components page has additional information about
     `text styling <{filename}/css/components.rst#text>`_.
 
-`Text alignment`_
-=================
-
-Use :css:`.m-text-left`, :css:`.m-text-right` or :css:`.m-text-center` to
-align text inside its parent element. Use :css:`.m-text-top`,
-:css:`.m-text-middle` and :css:`.m-text-bottom` to align text vertically for
-example in a table cell. See `Floating around <{filename}/css/grid.rst#floating-around>`_
-in the grid system for aligning and floating blocks in a similar way.
-
 `Padding`_
 ==========