8000 Updated website table of contents styles (#1681) · PrismJS/prism@efdd96c · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Commit efdd96c

Browse files
lukasoppermannRunDevelopment
lukasoppermann
authored and
RunDevelopment
committed
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 parent 55fb0f8 commit efdd96c

File tree

2 files changed

+12
-6
lines changed

2 files changed

+12
-6
lines changed

‎faq.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
position: static;
1414
max-width: 900px;
1515
font-size: 100%;
16-
opacity: 1;
16+
color: black;
1717
}
1818
</style>
1919
<script src="prefixfree.min.js"></script>
@@ -179,4 +179,4 @@ <h1>How can I use different highlighting for tokens with the same name in differ
179179
<script src="code.js"></script>
180180

181181
</body>
182-
</html>
182+
</html>

‎style.css

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -332,10 +332,15 @@ footer {
332332

333333
#toc {
334334
position: fixed;
335-
left: 1%;
336-
max-width: calc(48% - 450px);
335+
bottom: 15px;
336+
max-width: calc(50% - 450px - 40px);
337337
font-size: 80%;
338-
opacity: .3;
338+
z-index: 999;
339+
background: white;
340+
color: rgba(0,0,0,.5);
341+
padding: 0 10px 10px;
342+
border-radius: 0 3px 3px 0;
343+
box-sizing: border-box;
339344
}
340345

341346
@media (max-width: 1200px) {
@@ -345,11 +350,12 @@ footer {
345350
}
346351

347352
#toc:hover {
348-
opacity: 1;
353+
color: rgba(0,0,0,1);
349354
}
350355

351356
#toc h1 {
352357
font-size: 180%;
358+
margin-top: .75rem;
353359
}
354360

355361
#toc li {

0 commit comments

Comments
 (0)
0