Commit a0d4ab94 authored by deing's avatar deing

Change ToC

parent b6f0296c
body body
main main
width: 75ch width: 75ch
margin: 0 auto 0 auto margin: 0 auto 0 auto
\ No newline at end of file a#toc-open, a#toc-close
display: none
\ No newline at end of file
...@@ -3,27 +3,19 @@ ...@@ -3,27 +3,19 @@
main main
width: 100% width: 100%
padding: 0 padding: 0
details.toc aside#toc + article
margin-top: 2.5rem
aside#toc
display: none
aside#toc:target
display: block
position: fixed position: fixed
background-color: #44475a background-color: #44475a
top: 0 top: 0
left: 0 left: 0
width: 100% width: 100%
summary h2
list-style: none display: none
padding: .5rem
text-align: center
color: #f8f8f2
&::before
content: '» Tap here for '
&::after
content: ' «'
&[open] summary
font-weight: bold
&::before
content: '« Tap here to close '
&::after
content: ' »'
ul ul
li li
display: inline-block display: inline-block
...@@ -32,9 +24,19 @@ ...@@ -32,9 +24,19 @@
color: #bd93f9 color: #bd93f9
li > ul > li > ul > li > a li > ul > li > ul > li > a
color: #8be9fd color: #8be9fd
a#toc-open, a#toc-close
padding: .5rem
display: block
width: 100%
text-align: center
background-color: #44475a
color: #f8f8f2
a#toc-open
position: fixed
top: 0
left: 0
a#toc-close
font-weight: bold
article article
margin-top: 2.5rem
display: block display: block
max-width: 70ch max-width: 70ch
h2 \ No newline at end of file
text-align: left
\ No newline at end of file
...@@ -76,7 +76,7 @@ body ...@@ -76,7 +76,7 @@ body
display: inline display: inline
hr hr
display: none display: none
details.toc aside#toc
width: 30ch width: 30ch
position: fixed position: fixed
top: 1rem top: 1rem
...@@ -89,7 +89,7 @@ body ...@@ -89,7 +89,7 @@ body
list-style-type: none list-style-type: none
li li li li
padding-left: 1ch padding-left: 1ch
summary h2
text-transform: uppercase text-transform: uppercase
font-size: 1rem font-size: 1rem
margin: 0 margin: 0
......
...@@ -16,10 +16,12 @@ ...@@ -16,10 +16,12 @@
<body> <body>
<main> <main>
$if(includetoc)$ $if(includetoc)$
<details class="toc"> <a href="#toc" id="toc-open">Tap here to open Table of Contents</a>
<summary>Table of Contents</summary> <aside id="toc">
<h2>Table of Contents</h2>
<a href="" id="toc-close">Tap here to close Table of Contents</a>
$toc$ $toc$
</details> </aside>
$endif$ $endif$
<article> <article>
$body$ $body$
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment