commit: d1344350842af60c2564fec2ccf2790110d8d3f6
parent: d5c3946ad53f5564489f01d67beb4df606079c3e
author: Chris Noxz <chris@noxz.tech>
date: Sat, 21 Sep 2019 11:38:40 +0200
Implement table of contents
2 files changed, 43 insertions(+), 7 deletions(-)
diff --git a/noxz.tech/guides/mathematics/index.md b/noxz.tech/guides/mathematics/index.md
@@ -6,10 +6,16 @@ knowledge. I will instead explain how these, so called, tricks work using
logic and reason. So this topic is not for the savvy hackers or mathematicians
out there.
-Fractions
----------
+{:: class="toc"}
+{- class="toc-title"}Contents{--}
++ 1 [Fractions](#math-fractions)
+ + 1.1 [The fraction flip when dividing](#math-fractions-flip)
+{::}
-### The fraction flip when dividing
+{- id="math-fractions"}Fractions{--}
+------------------------------------
+
+### {- id="math-fractions-flip"}The fraction flip when dividing{--}
Many of you have probably been taught the trick of flipping the right fraction
in a division to instead use simpler multiplication. This is how it works:
diff --git a/noxz.tech/pub/style.css b/noxz.tech/pub/style.css
@@ -48,23 +48,23 @@ a:hover {
h1 {
border-bottom : 1px solid #cacaca;
- margin : 1em 1ex 1em 0;
+ margin : 1em 0 1em 0;
padding : 0 0 0.75em 0;
font-size : 1.4em;
}
h2 {
- margin : 1em 1ex 0.5ex 0;
+ margin : 1em 0 0.5ex 0;
font-size : 1.3em;
}
h3 {
- margin : 1em 1ex 0.5ex 0;
+ margin : 1em 0 0.5ex 0;
font-size : 1.0em;
}
h4 {
- margin : 1em 1ex 0.5ex 0;
+ margin : 1em 0 0.5ex 0;
font-size : 0.9em;
}
@@ -222,6 +222,36 @@ ul.repo-log li .log-date {
padding-right : 10px;
}
+/* table of contents */
+.toc {
+ background-color: #f3f1f9;
+ padding : 0.5em 2em 2em;
+ overflow : auto;
+}
+
+.toc .toc-title {
+ font-weight : 700;
+}
+
+.toc>ul,
+.toc>ul ul {
+ list-style-type : none;
+ list-style : none;
+ margin : 0;
+ padding : 0;
+}
+
+.toc>ul ul {
+ padding-left : 1.5em;
+}
+
+.toc li {
+ list-style-type : none;
+ list-style : none;
+ margin : 0;
+ padding : 0;
+}
+
/* math extensions (alternative to MathML) */
.math {
