[GitHub] [jena-site] kinow commented on a diff in pull request #144: Create an automatic Table of Contents, position it as a sidebar (larg…

["kinow (via GitHub)" <gi...@apache.org>]

kinow commented on code in PR #144:
URL: https://github.com/apache/jena-site/pull/144#discussion_r1096778461


##########
layouts/_default/single.html:
##########
@@ -1,3 +1,15 @@
 {{ define "main" }}
-	{{ .Content }}
+<main class="d-flex flex-xl-row flex-column">
+  <aside class="text-muted align-self-start mb-3 px-2 d-xl-none d-block">
+    <h2 class="h6 my-2">On this page</h2>
+    {{ .TableOfContents }}
+  </aside>

Review Comment:
   This one is displayed when the viewport is not extra large (because of the `d-xl-none`).



##########
source/tutorials/rdf_api.md:
##########
@@ -29,26 +29,7 @@ model.</p>
 all the examples used in this tutorial can be downloaded from
 <a href="//jena.apache.org/download/index.cgi"><code>jena.apache.org/download/index.cgi</code></a>.</p>
 
-<p></p>
-
-<h2>Table of Contents</h2>
-<ol>
-  <li><a href="#ch-Introduction">Introduction</a></li>
-  <li><a href="#ch-Statements">Statements</a></li>
-  <li><a href="#ch-Writing-RDF">Writing RDF</a></li>
-  <li><a href="#ch-Reading-RDF">Reading RDF</a></li>
-  <li><a href="#ch-Prefixes">Controlling Prefixes</a></li>
-  <li><a href="#ch-Jena-RDF-Packages">Jena RDF Packages</a></li>
-  <li><a href="#ch-Navigating-a-Model">Navigating a Model</a></li>
-  <li><a href="#ch-Querying-a-Model">Querying a Model</a></li>
-  <li><a href="#ch-Operations-on-Models">Operations on Models</a></li>
-  <li><a href="#ch-Containers">Containers</a></li>
-  <li><a href="#ch-More-about-Literals-and-Datatypes">More about Literals and
-    Datatypes</a></li>
-  <li><a href="#ch-Glossary">Glossary</a></li>
-</ol>
-
-<h2><a id="ch-Introduction">Introduction</a></h2>
+## Introduction {# id="ch-Introduction" }

Review Comment:
   This was the only annoying part of this issue (otherwise I would have submitted it on Saturday). Hugo's `TableOfContents` doesn't appear to work with HTML tags, only when you use Markdown (it uses Goldmark library to traverse an AST, but I assume it's a Markdown ASF? :confused: Didn't investigate much).
   
   Only learned how to specify an ID today from [this comment in an issue](https://github.com/gohugoio/hugo/issues/8383#issuecomment-821996828).



##########
layouts/_default/single.html:
##########
@@ -1,3 +1,15 @@
 {{ define "main" }}
-	{{ .Content }}
+<main class="d-flex flex-xl-row flex-column">
+  <aside class="text-muted align-self-start mb-3 px-2 d-xl-none d-block">
+    <h2 class="h6 my-2">On this page</h2>
+    {{ .TableOfContents }}
+  </aside>
+  <article class="flex-column me-lg-4">
+    {{ .Content }}
+  </article>
+  <aside class="text-muted align-self-start mb-3 mb-xl-5 px-2 d-none d-xl-flex flex-column sticky-top">

Review Comment:
   And this one is displayed only when the viewport is large (because of the `d-none d-xl-flex` combination).



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: dev-unsubscribe@jena.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org