Skip to content

Commit 3f6e294

Browse files
fanixus96fanixus96
authored
Merge pull request #18 from pikinier20/scaladoc/content-floating-menu
table of content
2 parents 9524c52 + 46353b8 commit 3f6e294

File tree

14 files changed

+221
-25
lines changed

14 files changed

+221
-25
lines changed

‎docs/_layouts/main.html

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,27 @@
55
extraCSS:
66
- css/content-contributors.css
77
---
8+
89
<div id="content-wrapper">
910
{{ content }}
11+
<div id="footer" class="body-small mobile-footer">
12+
<div class="left-container">"Generated with"</div>
13+
<div class="right-container">
14+
<a href="https://github.com/lampepfl/dotty">
15+
<button class="icon-button gh"></button>
16+
</a>
17+
<a href="https://twitter.com/scala_lang">
18+
<button class="icon-button twitter"></button>
19+
</a>
20+
<a href="https://discord.com/invite/scala">
21+
<button class="icon-button discord"></button>
22+
</a>
23+
<a href="https://gitter.im/scala/scala">
24+
<button class="icon-button gitter"></button>
25+
</a>
26+
<div class="text">"© 2002-2021 · LAMP/EPFL"</div>
27+
</div>
28+
<div cls="text-mobile"></div>
29+
"© 2002-2021 · LAMP/EPFL"
30+
</div>
1031
</div>

‎docs/_layouts/static-site-main.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
layout: main
33
---
44

5-
<div class="container">
5+
<div class="site-container">
66
<div id="site-header"></div>
77
{% if page.movedTo %}
88
<aside class="warning">

‎scaladoc/resources/dotty_res/scripts/ux.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,17 @@ window.addEventListener("DOMContentLoaded", () => {
3333
el.parent.addClass("expanded")
3434
}))
3535

36+
const observer = new IntersectionObserver(entries => {
37+
entries.forEach(entry => {
38+
const id = entry.target.getAttribute('id');
39+
if (entry.intersectionRatio > 0) {
40+
document.querySelector(`#toc li a[href="#${id}"]`).parentElement.classList.add('active');
41+
} else {
42+
document.querySelector(`#toc li a[href="#${id}"]`).parentElement.classList.remove('active');
43+
}
44+
});
45+
});
46+
3647
document.querySelectorAll('#content section[id]').forEach((section) => {
3748
observer.observe(section);
3849
});
@@ -110,6 +121,8 @@ window.addEventListener("DOMContentLoaded", () => {
110121
const sideMenuToggler = document.getElementById("mobile-sidebar-toggle");
111122
sideMenuToggler.addEventListener('click', _e => {
112123
document.getElementById("leftColumn").classList.toggle("show")
124+
document.getElementById("content-wrapper").classList.toggle("sidebar-shown")
125+
document.getElementById("toc").classList.toggle("sidebar-shown")
113126
sideMenuToggler.classList.toggle("menu-shown")
114127
})
115128

‎scaladoc/resources/dotty_res/styles/scalastyle.css

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -54,10 +54,10 @@ input {
5454
flex-direction: column;
5555
align-items: center;
5656
}
57-
#content {
57+
/* #content {
5858
max-width: 1100px;
5959
width: 100%;
60-
}
60+
} */
6161

6262
/* Text */
6363
h1,
@@ -801,11 +801,11 @@ footer .mode {
801801
position: relative;
802802
}
803803

804-
.cover-header {
804+
/* .cover-header {
805805
display: flex;
806806
flex-direction: row;
807807
padding-top: 1em;
808-
}
808+
} */
809809

810810
.micon {
811811
box-sizing: content-box;
@@ -929,7 +929,8 @@ footer .socials {
929929
height: 8px;
930930
}
931931

932-
#toc {
932+
/* #toc {
933+
display: inline;
933934
position: fixed;
934935
right: 0px;
935936
top: 0px;
@@ -967,7 +968,7 @@ footer .socials {
967968
968969
#toc li.active > a {
969970
color: var(--link-hover-fg);
970-
}
971+
} */
971972

972973
/* Signature coloring */
973974

@@ -1095,7 +1096,7 @@ footer .socials {
10951096

10961097
/* Breadcrumbs */
10971098

1098-
.breadcrumbs a {
1099+
/* .breadcrumbs a {
10991100
margin: 0 8px;
11001101
}
11011102
@@ -1105,7 +1106,7 @@ footer .socials {
11051106
11061107
.breadcrumbs {
11071108
align-self: flex-start;
1108-
}
1109+
} */
11091110

11101111
/* Header from docs.scala-lang */
11111112

‎scaladoc/resources/dotty_res/styles/theme/components/button/text-button.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22
display: flex;
33
}
44

5+
a:link { text-decoration: none; }
6+
a:visited { text-decoration: none; }
7+
a:hover { text-decoration: none; }
8+
a:active { text-decoration: none; }
9+
510
.text-button {
611
color: var(--action-primary-content-default);
712
text-decoration: none;

‎scaladoc/resources/dotty_res/styles/theme/components/table-of-content.css

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
#toc {
2+
position: absolute;
3+
right:0;
4+
display: flex;
5+
flex-direction: column;
6+
margin-top: calc(18.75 * var(--base-spacing));
7+
padding: 0 calc(1 * var(--base-spacing));
8+
}
9+
10+
#toc ul {
11+
list-style-type: none;
12+
padding: 0;
13+
}
14+
15+
#toc li {
16+
margin-bottom: calc(2.5 * var(--base-spacing));
17+
}
18+
19+
@media(min-width: 1920px) {
20+
#toc {
21+
margin-right: calc(36.75 * var(--base-spacing));
22+
}
23+
}
24+
25+
@media(max-width: 1920px) {
26+
#toc {
27+
margin-right: calc(6 * var(--base-spacing));
28+
}
29+
}
30+
31+
@media(max-width: 1024px) {
32+
#toc.sidebar-shown {
33+
display: none;
34+
}
35+
}
36+
37+
@media(max-width: 768px) {
38+
#toc {
39+
display: none;
40+
}
41+
}
42+
43+
.toc-title {
44+
color: var(--text-primary);
45+
margin-bottom: calc(2 * var(--base-spacing));
46+
}
47+
48+
.toc-nav a{
49+
color: var(--action-primary-content-default);
50+
text-decoration: none;
51+
}
52+
53+
#toc li:hover > a {
54+
color: var(--action-primary-content-hover);
55+
}
56+
57+
#toc li.active > a {
58+
color: var(--action-primary-content-hover);
59+
}
60+
61+
#toc li:focus-visible {
62+
box-shadow: 0px 0px 0px 2px var(--focus-default);
63+
}

‎scaladoc/resources/dotty_res/styles/theme/layout/content.css

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
#content {
2+
height: 100%;
3+
width: calc(100% - calc(39 * var(--base-spacing)));
4+
float: right;
5+
margin-top: var(--header-height);
6+
display: flex;
7+
flex-flow: column;
8+
overflow: scroll;
9+
}
10+
11+
#content-wrapper {
12+
overflow: scroll;
13+
display: flex;
14+
flex-flow: column;
15+
}
16+
17+
@media(min-width: 1920px) {
18+
#content-wrapper {
19+
padding-right: calc(74.25 * var(--base-spacing));
20+
padding-left: calc(36.75 * var(--base-spacing));
21+
}
22+
}
23+
24+
@media(max-width: 1920px) {
25+
#content-wrapper {
26+
padding-right: calc(41 * var(--base-spacing));
27+
padding-left: calc(6 * var(--base-spacing));
28+
}
29+
}
30+
31+
@media(max-width: 1024px) {
32+
#content {
33+
width: 100%;
34+
}
35+
#content-wrapper.sidebar-shown {
36+
padding-left: calc(45 * var(--base-spacing));
37+
padding-right: calc(6 * var(--base-spacing));
38+
}
39+
}
40+
41+
@media(max-width: 768px) {
42+
#content-wrapper {
43+
margin-right: calc(6 * var(--base-spacing));
44+
padding-right: 0;
45+
}
46+
}
47+
48+
49+
@media(max-width: 390px) {
50+
#content-wrapper {
51+
padding-left: 0;
52+
margin: 0;
53+
height: 100%;
54+
}
55+
56+
#content-wrapper .site-container {
57+
margin-left: calc(4 * var(--base-spacing));
58+
margin-right: calc(4 * var(--base-spacing));
59+
height: 100%;
60+
}
61+
}
62+
63+
#content h1 {
64+
color: var(--text-primary);
65+
}
66+
67+
.breadcrumbs {
68+
position: absolute;
69+
}

‎scaladoc/resources/dotty_res/styles/theme/layout/footer.css

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,3 +58,23 @@
5858
margin-top: calc(1 * var(--base-spacing));
5959
}
6060
}
61+
62+
#footer.mobile-footer {
63+
display: none;
64+
justify-content: center;
65+
}
66+
67+
@media(max-width: 390px) {
68+
#footer {
69+
display: none;
70+
}
71+
72+
#footer.mobile-footer {
73+
display: flex;
74+
position: unset;
75+
}
76+
77+
#footer .text-mobile {
78+
display: none;
79+
}
80+
}

‎scaladoc/resources/dotty_res/styles/theme/layout/leftMenu.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
padding: calc(3 * var(--base-spacing)) 0px;
66
position: absolute;
77
width: calc(39 * var(--base-spacing));
8-
height: calc(100% - var(--header-height) - (6 * var(--base-spacing)));
8+
height: calc(100% - (8 * var(--base-spacing)) - (6 * var(--base-spacing)));
99
left: 0px;
1010
top: calc(8 * var(--base-spacing));
1111
background: var(--background-default);
@@ -17,7 +17,7 @@
1717

1818
@media (max-width: 480px) {
1919
#leftColumn {
20-
height: calc(100% - var(--header-height) - (9 * var(--base-spacing)));
20+
height: calc(100% - (8 * var(--base-spacing)) - (9 * var(--base-spacing)));
2121
}
2222
}
2323

@@ -33,7 +33,7 @@
3333

3434
@media (max-width: 390px) {
3535
#leftColumn {
36-
height: calc(100% - var(--header-height));
36+
height: calc(100% - (8 * var(--base-spacing)));
3737
width: 100%;
3838
left: -100%;
3939
z-index: 1;

‎scaladoc/resources/dotty_res/styles/theme/layout/mobileMenu.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@
5151
padding: calc(2.5 * var(--base-spacing)) calc(2 * var(--base-spacing));
5252
display: flex;
5353
align-items: center;
54+
cursor: pointer;
5455
}
5556

5657
.mobile-menu-item:hover {

‎scaladoc/resources/dotty_res/styles/theme/layout/sideMenu.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.side-menu {
2-
overflow-y: auto;
2+
overflow-y: scroll;
33
overflow-x: hidden;
44
width: 100%;
55
height: calc(100% - calc(11 * var(--base-spacing)));

‎scaladoc/src/dotty/tools/scaladoc/renderers/HtmlRenderer.scala

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -208,7 +208,7 @@ class HtmlRenderer(rootPackage: Member, members: Map[DRI, Member])(using ctx: Do
208208
)
209209
}
210210

211-
div(id := "container")(
211+
div(id := "")(
212212
div(id := "header", cls := "body-small")(
213213
div(cls := "header-container-left")(
214214
projectLogoElem.toSeq,
@@ -322,16 +322,17 @@ class HtmlRenderer(rootPackage: Member, members: Map[DRI, Member])(using ctx: Do
322322
"© 2002-2021 · LAMP/EPFL"
323323
)
324324
),
325+
div(id := "scaladoc-searchBar"),
325326
div(id := "main")(
326-
div (id := "leftToggler")(
327-
span(cls := "icon-toggler")
327+
parentsHtml,
328+
div(id := "content")(
329+
content.content,
330+
renderTableOfContents(content.toc).fold(Nil) { toc =>
331+
div(id := "toc", cls:="body-small")(
332+
span(cls := "toc-title h200")("In this article"),
333+
toc
334+
)
335+
},
328336
),
329-
div(id := "scaladoc-searchBar"),
330337
),
331-
renderTableOfContents(content.toc).fold(Nil) { toc =>
332-
div(id := "toc")(
333-
span(cls := "toc-title")("In this article"),
334-
toc
335-
)
336-
}
337338
)

‎scaladoc/src/dotty/tools/scaladoc/renderers/MemberRenderer.scala

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ class MemberRenderer(signatureRenderer: SignatureRenderer)(using DocContext) ext
3030

3131
def inheritedFrom(m: Member) = m.inheritedFrom match
3232
case Some(InheritedFrom(name, dri, isSourceSuperclassHidden)) =>
33-
val hiddenNameSuffix = if isSourceSuperclassHidden then " (hidden)" else ""
33+
val hiddenNameSuffix = if isSourceSuperclassHidden then " (hidden)" else ""
3434
tableRow("Inherited from:", signatureRenderer.renderLink(name + hiddenNameSuffix, dri))
3535
case _ => Nil
3636

@@ -396,7 +396,7 @@ class MemberRenderer(signatureRenderer: SignatureRenderer)(using DocContext) ext
396396
Seq(
397397
div(cls := "cover-header")(
398398
memberIcon(m),
399-
h1(m.name)
399+
h1(cls := "h600")(m.name)
400400
),
401401
div(cls := "signature monospace")(
402402
annotations(m),

0 commit comments

Comments
 (0)