Welcome to little lamb

Code » qmdoc » commit 04eefb2

More style tweaking + add permalink to sections

author Olivier Brunel
2022-12-27 20:43:08 UTC
committer Olivier Brunel
2022-12-27 20:49:34 UTC
parent c3a8bfe5efd4c6732695fe77beecb09b34a9565d

More style tweaking + add permalink to sections

base.htm +3 -2
common.css +29 -0
main.c +6 -3
struct.css +1 -1

diff --git a/base.htm b/base.htm
index 9e4b899..da80b72 100644
--- a/base.htm
+++ b/base.htm
@@ -67,8 +67,9 @@
                 <p>This is the documentation for <strong>foobar</strong>. There will be
                 <em>much talk</em> about foo, bar, and <u>maybe</u> even baz.
             </section>
-            <section id="common_topics">
-                <h1>Common Topics</h1>
+            <section>
+                <h1>Common Topics<span id="common_topics"><a
+                                       href="#common_topics"></a></span></h1>
                 <p>Here we discuss some <span class="highlight">common
                     topics</span> related to
                 <strong>foobar</strong> and its use. They vary, but <s>they all
diff --git a/common.css b/common.css
index 482ccfc..1337a43 100644
--- a/common.css
+++ b/common.css
@@ -22,6 +22,35 @@ main q {
 main a {
     text-decoration: underline;
 }
+main h1 a::before, main h2 a::before, main h3 a::before,
+main h4 a::before, main h5 a::before, main h6 a::before {
+    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAiCAYAAABWQVnHAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5AoRDzABQAmaNwAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAABOUlEQVRIx+2UsU4CQRCGvyUk+ABeBxWUVlbSHckk+AA+go/lI9hr8Udb6OwFC8VKOivMJWczlyybPdDQ3laX2Zl/Z79/50JVVZyyepy4OgHo/yXJzB6AURTaSLoGCMdsNLMnYAoMovAOWEiaHRTw4ktg60W40BCogU2rQFT8IqlM9l6BcSvEqO1tWhxdASD0WoBNgbModvcfGycNMEkTM3sHbszsMcoZAD/Aup+xKvhmQ33osbHnPQOFu1D2kjt/SZoAG6A2s1pS0+XI4RXAsmHT9+AQ+JQ08+Q1cA58J20j6SJlMHZgDVkkzYF7SSMzW7nnO+AtBzHk6Eq69c/amSxcuNWFQcbSPWC5g0JZlitnAPCRPNki9xL3BKqqak66ygzM8lDx3jT6Q0lHdn5s1EP3V+4EOgEAfgElA4h8m56jlAAAAABJRU5ErkJggg==);
+}
+main h1 a, main h2 a, main h3 a, main h4 a, main h5 a, main h6 a {
+    display: none;
+    max-width: 16px;
+    max-height: 24px;
+    margin: -8px 0 0 5px;
+    vertical-align: middle;
+    text-transform: none;
+}
+h1:hover a, h2:hover a, h3:hover a, h4:hover a, h5:hover a, h6:hover a {
+    display: inline-block;
+    text-decoration: none !important;
+}
+main h1 a:hover::after, main h2 a:hover::after, main h3 a:hover::after,
+main h4 a:hover::after, main h5 a:hover::after, main h6 a:hover::after {
+    content: "Permalink to this headline";
+    display: block;
+    padding: 8px;
+    position: absolute;
+    margin: -8px 8px;
+    font-weight: 500;
+    font-size: 14px;
+    background: rgba(0,0,0,.8);
+    color: #fff;
+    border-radius: 4px;
+}
 main kbd {
     display: inline-block;
     height: 24px;
diff --git a/main.c b/main.c
index 72ead33..7dfe740 100644
--- a/main.c
+++ b/main.c
@@ -487,10 +487,13 @@ leave_block(MD_BLOCKTYPE type, void *details, void *ctx_)
                 MD_BLOCK_H_DETAIL *d = details;
                 char buf[UINT32_FMT];
                 buf[uint32_fmt(buf, (uint32) d->level)] = '\0';
-                if (!raw_str(ctx, "<a name=\"")
+                if (!raw_str(ctx, "<span id=\"")
                         || !anchor(ctx, s, l)
-                        || !raw_str(ctx, "\"></a>")
-                        || !raw_str(ctx, "</h") || !raw_str(ctx, buf) || !raw_str(ctx, ">"))
+                        || !raw_str(ctx, "\"><a href=\"#")
+                        || !anchor(ctx, s, l)
+                        || !raw_str(ctx, "\"></a></span></h")
+                        || !raw_str(ctx, buf)
+                        || !raw_str(ctx, ">"))
                     return ERR_PARSER_LEAVE_BLOCK;
 
                 /* TOC */
diff --git a/struct.css b/struct.css
index 4dfda4d..e56ed19 100644
--- a/struct.css
+++ b/struct.css
@@ -49,7 +49,6 @@ header nav {
 }
 header nav li a {
     line-height: 1.1em;
-    font-weight: 400;
     padding: 4px 6px;
     white-space: nowrap;
 }
@@ -68,6 +67,7 @@ header nav > ul > ul > li > a { /* h1 */
     margin-left: 12px;
 }
 header nav > ul > ul > ul > li > a { /* h2 */
+    font-weight: 400;
     margin-left: 24px;
 }
 header nav > ul > ul > ul > ul > li > a { /* h3 */