Updated website table of contents styles (#1681) The TOC will now be located at the bottom left and be more friendly to smaller screens.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57
diff --git a/faq.html b/faq.html
index ae32cb6..8d5da68 100644
--- a/faq.html
+++ b/faq.html
@@ -13,7 +13,7 @@
position: static;
max-width: 900px;
font-size: 100%;
- opacity: 1;
+ color: black;
}
</style>
<script src="prefixfree.min.js"></script>
@@ -179,4 +179,4 @@ entity</pre>
<script src="code.js"></script>
</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/style.css b/style.css
index 80a674e..64f79af 100644
--- a/style.css
+++ b/style.css
@@ -332,10 +332,15 @@ footer {
#toc {
position: fixed;
- left: 1%;
- max-width: calc(48% - 450px);
+ bottom: 15px;
+ max-width: calc(50% - 450px - 40px);
font-size: 80%;
- opacity: .3;
+ z-index: 999;
+ background: white;
+ color: rgba(0,0,0,.5);
+ padding: 0 10px 10px;
+ border-radius: 0 3px 3px 0;
+ box-sizing: border-box;
}
@media (max-width: 1200px) {
@@ -345,11 +350,12 @@ footer {
}
#toc:hover {
- opacity: 1;
+ color: rgba(0,0,0,1);
}
#toc h1 {
font-size: 180%;
+ margin-top: .75rem;
}
#toc li {