Skip to content

Commit d75de27

Browse files
goerzgoerz
committed
Add top bar
1 parent 71b9eef commit d75de27

9 files changed

Lines changed: 428 additions & 4 deletions

File tree

‎devrepl.jl‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414
using Pkg
1515
using Downloads: download
1616

17+
ENV["GKSwstype"] = 100
18+
1719
cd(@__DIR__)
1820
Pkg.activate("test")
1921

@@ -37,11 +39,13 @@ end
3739

3840
if !isfile(joinpath("test", "Manifest.toml"))
3941
_instantiate()
40-
cp(joinpath("test", "Project.toml"), joinpath("docs", "Project.toml"); force=true)
41-
cp(joinpath("test", "Manifest.toml"), joinpath("docs", "Manifest.toml"); force=true)
4242
end
4343
include("test/init.jl")
4444

45+
# Disable link-checking in interactive REPL, since it is the slowest part
46+
# of building the docs.
47+
ENV["DOCUMENTER_CHECK_LINKS"] = "0"
48+
4549
if abspath(PROGRAM_FILE) == @__FILE__
4650
help()
4751
end

‎docs/make.jl‎

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ using QuantumControl.Generators
99
using Pkg
1010
using Documenter
1111
using DocumenterCitations
12+
using DocumenterInterLinks
1213

1314
DocMeta.setdocmeta!(QuantumControl, :DocTestSetup, :(using QuantumControl); recursive=true)
1415

@@ -24,14 +25,32 @@ include("generate_api.jl")
2425

2526
bib = CitationBibliography(joinpath(@__DIR__, "src", "refs.bib"); style=:numeric)
2627

28+
warnonly = [:linkcheck,]
29+
if get(ENV, "DOCUMENTER_WARN_ONLY", "0") == "1" # cf. test/init.jl
30+
warnonly = true
31+
end
32+
warnonly = true # XXX temporarily switch to warnings
33+
2734
makedocs(;
2835
plugins=[bib],
2936
authors=AUTHORS,
3037
sitename="QuantumControl.jl",
38+
# Link checking is disabled in REPL, see `devrepl.jl`.
39+
linkcheck=(get(ENV, "DOCUMENTER_CHECK_LINKS", "1") != "0"),
40+
warnonly,
3141
format=Documenter.HTML(;
3242
prettyurls=true,
3343
canonical="https://juliaquantumcontrol.github.io/QuantumControl.jl",
34-
assets=["assets/custom.css", "assets/citations.css"],
44+
assets=[
45+
"assets/custom.css",
46+
"assets/citations.css",
47+
asset(
48+
"https://juliaquantumcontrol.github.io/QuantumControl.jl/dev/assets/topbar/topbar.css"
49+
),
50+
asset(
51+
"https://juliaquantumcontrol.github.io/QuantumControl.jl/dev/assets/topbar/topbar.js"
52+
),
53+
],
3554
footer="[$NAME.jl]($GITHUB) v$VERSION docs powered by [Documenter.jl](https://github.com/JuliaDocs/Documenter.jl)."
3655
),
3756
pages=[

‎docs/src/assets/topbar/org_logo.afdesign‎

164 KB
Binary file not shown.

‎docs/src/assets/topbar/org_logo.svg‎

Lines changed: 70 additions & 0 deletions
Loading

‎docs/src/assets/topbar/topbar.css‎

Lines changed: 226 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,226 @@
1+
html {
2+
--navbar-height: 55px;
3+
scroll-padding-top: calc(var(--navbar-height) + 1rem);
4+
}
5+
6+
#topbar-nav {
7+
width: 100%;
8+
height: var(--navbar-height);
9+
z-index: 10;
10+
padding: 0 1rem;
11+
position: sticky;
12+
display: flex;
13+
top: 0;
14+
background-color: #282f2f;
15+
border-bottom: 1px solid #5e6d6f;
16+
}
17+
18+
#topbar-nav #nav-items {
19+
display: flex;
20+
flex-grow: 1;
21+
flex-wrap: wrap;
22+
}
23+
24+
#topbar-nav #multidoc-toggler {
25+
display: none;
26+
margin-left: auto;
27+
font-size: 24px;
28+
height: var(--navbar-height);
29+
padding: 0;
30+
fill: white;
31+
cursor: pointer;
32+
border: none;
33+
background: none;
34+
padding-inline: none;
35+
}
36+
37+
#topbar-nav #multidoc-toggler > svg {
38+
line-height: unset;
39+
width: 24px;
40+
height: 24px;
41+
}
42+
43+
#topbar-nav>* {
44+
display: inline-block;
45+
}
46+
47+
#topbar-nav .brand {
48+
margin-right: 1.5rem;
49+
height: var(--navbar-height);
50+
}
51+
52+
#topbar-nav .brand img {
53+
position: relative;
54+
top: 50%;
55+
transform: translateY(-50%);
56+
max-height: calc(var(--navbar-height) - 10px);
57+
}
58+
59+
#topbar-nav .nav-item {
60+
padding: 0 0.75rem;
61+
line-height: var(--navbar-height);
62+
font-size: 16px;
63+
display: inline-block;
64+
margin: 0;
65+
}
66+
67+
#topbar-nav .dropdown-label {
68+
cursor: pointer;
69+
color: #ccc;
70+
border: none;
71+
text-align: left;
72+
background: none;
73+
padding: 0 12px;
74+
}
75+
76+
#topbar-nav .nav-expanded .dropdown-label {
77+
text-decoration: underline;
78+
}
79+
80+
#topbar-nav .dropdown-label::after {
81+
content: "";
82+
margin-left: 5px;
83+
84+
/* caret down */
85+
display: inline-block;
86+
vertical-align: 0.2em;
87+
border-top: .3em solid;
88+
border-right: .3em solid transparent;
89+
border-bottom: 0;
90+
border-left: .3em solid transparent;
91+
}
92+
93+
#topbar-nav .nav-expanded .dropdown-label::after {
94+
/* caret up */
95+
border-top: 0;
96+
border-bottom: .3em solid;
97+
}
98+
99+
#topbar-nav .dropdown-label:hover {
100+
color: #fff;
101+
}
102+
103+
#topbar-nav .nav-dropdown-container {
104+
background-color: #282f2f;
105+
line-height: 30px;
106+
padding: 5px 0;
107+
position: absolute;
108+
display: none;
109+
width: 16rem;
110+
}
111+
112+
#topbar-nav .nav-dropdown-container .nav-item:hover {
113+
background-color: #282f2f;
114+
}
115+
116+
#topbar-nav .nav-expanded .nav-dropdown-container {
117+
display: block;
118+
}
119+
120+
#topbar-nav .nav-dropdown-container a.nav-link {
121+
color: #ccc;
122+
line-height: 30px;
123+
padding: 0 1em;
124+
text-transform: none;
125+
width: 100%;
126+
}
127+
128+
#topbar-nav .nav-dropdown-container a.nav-link:hover {
129+
color: #fff;
130+
}
131+
132+
#topbar-nav a.nav-link {
133+
color: #ccc;
134+
}
135+
136+
#topbar-nav a.current {
137+
color: #fff;
138+
background-color: #555555; /* XXX */
139+
}
140+
141+
#topbar-nav button.current {
142+
color: #fff;
143+
background-color: #555555; /* XXX */
144+
}
145+
146+
#topbar-nav a.nav-link:hover {
147+
color: #fff;
148+
}
149+
150+
#topbar-nav a.active.nav-link {
151+
color: #fff;
152+
font-weight: bold;
153+
}
154+
155+
#topbar-nav .column-content {
156+
padding: 0;
157+
}
158+
159+
/* Documenter css tweaks */
160+
.docs-sidebar {
161+
padding-top: calc(var(--navbar-height) + 1rem) !important;
162+
}
163+
164+
.docs-sidebar {
165+
top: 0;
166+
}
167+
168+
@media screen and (max-width: 1055px) {
169+
#topbar-nav {
170+
position: sticky;
171+
top: 0;
172+
padding: 0 1rem;
173+
height: unset;
174+
min-height: var(--navbar-height);
175+
transition-property: top, box-shadow;
176+
-webkit-transition-property: top, box-shadow;
177+
transition-duration: 0.3s;
178+
-webkit-transition-duration: 0.3s;
179+
}
180+
181+
#topbar-nav #nav-items {
182+
flex-direction: column;
183+
margin-top: 1.5em;
184+
flex-wrap: nowrap;
185+
}
186+
187+
#topbar-nav .hidden-on-mobile {
188+
display: none!important;
189+
}
190+
191+
#topbar-nav .nav-item {
192+
line-height: unset;
193+
padding: 0 0 1em 0;
194+
width: 100%;
195+
}
196+
197+
#topbar-nav #multidoc-toggler {
198+
display: inline-block;
199+
}
200+
201+
#topbar-nav.headroom--not-top {
202+
box-shadow: 0.2rem 0rem 0.4rem #bbb;
203+
transition-duration: 0.7s;
204+
-webkit-transition-duration: 0.7s;
205+
}
206+
207+
#topbar-nav.headroom--unpinned.headroom--not-top.headroom--not-bottom {
208+
top: -100vh;
209+
transition-duration: 0.7s;
210+
-webkit-transition-duration: 0.7s;
211+
}
212+
213+
#topbar-nav .nav-dropdown-container {
214+
position: relative;
215+
margin-bottom: 1em;
216+
}
217+
218+
#documenter .docs-main header.docs-navbar.headroom--unpinned.headroom--not-top.headroom--not-bottom {
219+
top: -100vh;
220+
}
221+
222+
#documenter .docs-main header.docs-navbar {
223+
top: var(--navbar-height);
224+
}
225+
226+
}

‎docs/src/assets/topbar/topbar.js‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
document.addEventListener("DOMContentLoaded", function() {
2+
var metaTag = document.querySelector('meta[name="description"]');
3+
var name = "";
4+
if (metaTag) {
5+
var content = metaTag.getAttribute('content');
6+
var match = content.match(/Documentation for (.+?)\./);
7+
if (match && match[1]) {
8+
name = match[1];
9+
name = name.concat(".jl");
10+
}
11+
}
12+
var packages = [
13+
"QuantumPropagators.jl",
14+
"QuantumControlBase.jl",
15+
"QuantumGradientGenerators.jl",
16+
"Krotov.jl",
17+
"GRAPE.jl",
18+
"TwoQubitWeylChamber.jl",
19+
"QuantumControl.jl",
20+
];
21+
var dropdownItems = packages.map(function(packageName) {
22+
return `<a class="nav-link nav-item ${name === packageName ? 'current' : ''}" href="https://juliaquantumcontrol.github.io/${packageName}/">${packageName}</a>`;
23+
}).join('');
24+
var isSecondaryPackage = !(name === "QuantumControl.jl" || name === "QuantumPropagators.jl");
25+
var navElement = document.createElement('nav');
26+
navElement.id = "topbar-nav";
27+
navElement.innerHTML = `
28+
<a href="https://github.com/JuliaQuantumControl" class="nav-link">
29+
<img src="https://juliaquantumcontrol.github.io/QuantumControl.jl/dev/assets/topbar/org_logo.svg" onload="this.style.height = getComputedStyle(document.getElementById('topbar-nav')).height" class="nav-link nav-item" alt="Logo">
30+
</a>
31+
<div class="hidden-on-mobile" id="nav-items">
32+
<div class="nav-dropdown">
33+
<button class="nav-item dropdown-label ${isSecondaryPackage ? 'current' : ''}">JuliaQuantumControl</button>
34+
<ul class="nav-dropdown-container">
35+
${dropdownItems}
36+
</ul>
37+
</div>
38+
<a class="nav-link nav-item ${name === 'QuantumPropagators.jl' ? 'current' : ''}" href="https://juliaquantumcontrol.github.io/QuantumPropagators.jl/">QuantumPropagators.jl</a>
39+
<a class="nav-link nav-item" ${name === 'QuantumControl.jl' ? 'current' : ''} href="https://juliaquantumcontrol.github.io/QuantumControl.jl/">QuantumControl.jl</a>
40+
</div>
41+
<button id="multidoc-toggler">
42+
<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
43+
<path d="M3 6h18v2H3V6m0 5h18v2H3v-2m0 5h18v2H3v-2Z"></path>
44+
</svg>
45+
</button>`;
46+
47+
var body = document.body;
48+
body.insertBefore(navElement, body.firstChild);
49+
});
50+
51+
function topbarInjector() {
52+
document
53+
.getElementById("multidoc-toggler")
54+
.addEventListener("click", function () {
55+
document.getElementById("nav-items").classList.toggle("hidden-on-mobile");
56+
});
57+
document.body.addEventListener("click", function (ev) {
58+
const thisIsExpanded = ev.target.matches(".nav-expanded > .dropdown-label");
59+
if (!ev.target.matches(".nav-dropdown-container")) {
60+
Array.prototype.forEach.call(
61+
document.getElementsByClassName("dropdown-label"),
62+
function (el) {
63+
el.parentElement.classList.remove("nav-expanded");
64+
}
65+
);
66+
}
67+
if (!thisIsExpanded && ev.target.matches(".dropdown-label")) {
68+
ev.target.parentElement.classList.add("nav-expanded");
69+
}
70+
});
71+
}
72+
73+
if (
74+
document.readyState === "complete" ||
75+
document.readyState === "interactive"
76+
) {
77+
// call on next available tick
78+
setTimeout(topbarInjector, 1);
79+
} else {
80+
document.addEventListener("DOMContentLoaded", topbarInjector);
81+
}

0 commit comments

Comments
 (0)