Skip to content

Commit 4b08cc1

Browse files
tigarmotigarmo
committed
feat: update templates and assets from upstream
This commit copies over the templates and static assets from canonical/sphinx-docs-starter-pack@b43814f, plus a manual cherry-pick of the conf.py change from 4b28ec6.
1 parent 5388bd5 commit 4b08cc1

File tree

13 files changed

+249
-23
lines changed

13 files changed

+249
-23
lines changed

‎canonical_sphinx/config.py‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,8 @@ def config_inited(_app: Sphinx, config: Any) -> None: # noqa: ANN401
121121
if config.html_title == "":
122122
config.html_theme_options = {"sidebar_hide_name": True}
123123

124-
theme_assets = Path(__file__).parent / "theme/static"
124+
theme_dir = Path(__file__).parent / "theme"
125+
theme_assets = theme_dir / "static"
125126

126127
config.html_static_path.append(str(theme_assets))
127128

@@ -139,6 +140,12 @@ def config_inited(_app: Sphinx, config: Any) -> None: # noqa: ANN401
139140

140141
html_js_files = ["header-nav.js"]
141142

143+
# Issue: We don't have access to the builder here yet
144+
# Setting templates_path for epub makes the build fail
145+
# if builder == "dirhtml" or builder == "html":
146+
config.templates_path.append(str(theme_dir / "templates"))
147+
config.notfound_template = "404.html"
148+
142149
html_context = config.html_context
143150

144151
disable_feedback_button = config.disable_feedback_button

‎canonical_sphinx/theme/static/404.svg‎

Lines changed: 13 additions & 0 deletions
Loading

‎canonical_sphinx/theme/static/custom.css‎

Lines changed: 186 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,129 @@
1-
/** Fix the font weight (300 for normal, 400 for slightly bold) **/
2-
3-
div.page, h1, h2, h3, h4, h5, h6, .sidebar-tree .current-page>.reference, button, input, optgroup, select, textarea, th.head {
4-
font-weight: 300
1+
/**
2+
Ubuntu variable font definitions.
3+
Based on https://github.com/canonical/vanilla-framework/blob/main/scss/_base_fontfaces.scss
4+
5+
When font files are updated in Vanilla, the links to font files will need to be updated here as well.
6+
*/
7+
8+
/* default font set */
9+
@font-face {
10+
font-family: 'Ubuntu variable';
11+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
12+
font-style: normal;
13+
font-weight: 100 800; /* min and max value for the weight axis */
14+
src: url('https://assets.ubuntu.com/v1/f1ea362b-Ubuntu%5Bwdth,wght%5D-latin-v0.896a.woff2') format('woff2-variations');
15+
}
16+
17+
@font-face {
18+
font-family: 'Ubuntu variable';
19+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
20+
font-style: italic;
21+
font-weight: 100 800; /* min and max value for the weight axis */
22+
src: url('https://assets.ubuntu.com/v1/90b59210-Ubuntu-Italic%5Bwdth,wght%5D-latin-v0.896a.woff2') format('woff2-variations');
23+
}
24+
25+
@font-face {
26+
font-family: 'Ubuntu Mono variable';
27+
font-style: normal;
28+
font-weight: 100 800; /* min and max value for the weight axis */
29+
src: url('https://assets.ubuntu.com/v1/d5fc1819-UbuntuMono%5Bwght%5D-latin-v0.869.woff2') format('woff2-variations');
30+
}
31+
32+
/* cyrillic-ext */
33+
@font-face {
34+
font-family: 'Ubuntu variable';
35+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
36+
font-style: normal;
37+
font-weight: 100 800; /* min and max value for the weight axis */
38+
src: url('https://assets.ubuntu.com/v1/77cd6650-Ubuntu%5Bwdth,wght%5D-cyrillic-extended-v0.896a.woff2') format('woff2-variations');
39+
unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
40+
}
41+
42+
/* cyrillic */
43+
@font-face {
44+
font-family: 'Ubuntu variable';
45+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
46+
font-style: normal;
47+
font-weight: 100 800; /* min and max value for the weight axis */
48+
src: url('https://assets.ubuntu.com/v1/2702fce5-Ubuntu%5Bwdth,wght%5D-cyrillic-v0.896a.woff2') format('woff2-variations');
49+
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
50+
}
51+
52+
/* greek-ext */
53+
@font-face {
54+
font-family: 'Ubuntu variable';
55+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
56+
font-style: normal;
57+
font-weight: 100 800; /* min and max value for the weight axis */
58+
src: url('https://assets.ubuntu.com/v1/5c108b7d-Ubuntu%5Bwdth,wght%5D-greek-extended-v0.896a.woff2') format('woff2-variations');
59+
unicode-range: U+1F00-1FFF;
60+
}
61+
62+
/* greek */
63+
@font-face {
64+
font-family: 'Ubuntu variable';
65+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
66+
font-style: normal;
67+
font-weight: 100 800; /* min and max value for the weight axis */
68+
src: url('https://assets.ubuntu.com/v1/0a14c405-Ubuntu%5Bwdth,wght%5D-greek-v0.896a.woff2') format('woff2-variations');
69+
unicode-range: U+0370-03FF;
70+
}
71+
72+
/* latin-ext */
73+
@font-face {
74+
font-family: 'Ubuntu variable';
75+
font-stretch: 100%; /* min and max value for the width axis, expressed as percentage */
76+
font-style: normal;
77+
font-weight: 100 800; /* min and max value for the weight axis */
78+
src: url('https://assets.ubuntu.com/v1/19f68eeb-Ubuntu%5Bwdth,wght%5D-latin-extended-v0.896a.woff2') format('woff2-variations');
79+
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
80+
}
81+
82+
83+
/** Define font-weights as per Vanilla
84+
Based on: https://github.com/canonical/vanilla-framework/blob/main/scss/_base_typography-definitions.scss
85+
86+
regular text: 400,
87+
bold: 550,
88+
thin: 300,
89+
90+
h1: bold,
91+
h2: 180;
92+
h3: bold,
93+
h4: 275,
94+
h5: bold,
95+
h6: regular
96+
*/
97+
98+
/* default regular text */
99+
html {
100+
font-weight: 400;
5101
}
6102

7-
.toc-tree li.scroll-current>.reference, dl.glossary dt, dl.simple dt, dl:not([class]) dt {
8-
font-weight: 400;
103+
/* heading specific definitions */
104+
h1, h3, h5 { font-weight: 550; }
105+
h2 { font-weight: 180; }
106+
h4 { font-weight: 275; }
107+
108+
/* bold */
109+
.toc-tree li.scroll-current>.reference,
110+
dl.glossary dt,
111+
dl.simple dt,
112+
dl:not([class]) dt {
113+
font-weight: 550;
9114
}
10115

116+
11117
/** Table styling **/
12118

13119
th.head {
14120
text-transform: uppercase;
15121
font-size: var(--font-size--small);
122+
text-align: initial;
123+
}
124+
125+
table.align-center th.head {
126+
text-align: center
16127
}
17128

18129
table.docutils {
@@ -57,34 +168,63 @@ a.headerlink {
57168
border-left: 2px solid var(--color-brand-primary);
58169
}
59170

60-
/** Some tweaks for issue #16 **/
171+
/** Some tweaks for Sphinx tabs **/
61172

62173
[role="tablist"] {
63174
border-bottom: 1px solid var(--color-sidebar-item-background--hover);
64175
}
65176

66-
.sphinx-tabs-tab[aria-selected="true"] {
177+
.sphinx-tabs-tab[aria-selected="true"], .sd-tab-set>input:checked+label{
67178
border: 0;
68179
border-bottom: 2px solid var(--color-brand-primary);
69-
background-color: var(--color-sidebar-item-background--current);
70-
font-weight:300;
180+
font-weight: 400;
181+
font-size: 1rem;
182+
color: var(--color-brand-primary);
183+
}
184+
185+
body[data-theme="dark"] .sphinx-tabs-tab[aria-selected="true"] {
186+
background: var(--color-background-primary);
187+
border-bottom: 2px solid var(--color-brand-primary);
188+
}
189+
190+
button.sphinx-tabs-tab[aria-selected="false"]:hover, .sd-tab-set>input:not(:checked)+label:hover {
191+
border-bottom: 2px solid var(--color-foreground-border);
192+
}
193+
194+
button.sphinx-tabs-tab[aria-selected="false"]{
195+
border-bottom: 2px solid var(--color-background-primary);
196+
}
197+
198+
body[data-theme="dark"] .sphinx-tabs-tab {
199+
background: var(--color-background-primary);
71200
}
72201

73-
.sphinx-tabs-tab{
202+
.sphinx-tabs-tab, .sd-tab-set>label{
74203
color: var(--color-brand-primary);
75-
font-weight:300;
204+
font-family: var(--font-stack);
205+
font-weight: 400;
206+
font-size: 1rem;
207+
padding: 1em 1.25em .5em
76208
}
77209

78210
.sphinx-tabs-panel {
79211
border: 0;
80212
border-bottom: 1px solid var(--color-sidebar-item-background--hover);
81213
background: var(--color-background-primary);
214+
padding: 0.75rem 0 0.75rem 0;
82215
}
83216

84-
button.sphinx-tabs-tab:hover {
85-
background-color: var(--color-sidebar-item-background--hover);
217+
body[data-theme="dark"] .sphinx-tabs-panel {
218+
background: var(--color-background-primary);
219+
}
220+
221+
/** A tweak for issue #190 **/
222+
223+
.highlight .hll {
224+
background-color: var(--color-highlighted-background);
86225
}
87226

227+
88228
/** Custom classes to fix scrolling in tables by decreasing the
89229
font size or breaking certain columns.
90230
Specify the classes in the Markdown file with, for example:
@@ -187,3 +327,35 @@ details summary {
187327
color: var(--color-version-popup);
188328
font-weight: bolder;
189329
}
330+
331+
/* Code-block copybutton invisible by default
332+
(overriding Furo config to achieve default copybutton setting). */
333+
.highlight button.copybtn {
334+
opacity: 0;
335+
}
336+
337+
/* Mimicking the 'Give feedback' button for UX consistency */
338+
.sidebar-search-container input[type=submit] {
339+
color: #FFFFFF;
340+
border: 2px solid #D6410D;
341+
padding: var(--sidebar-search-input-spacing-vertical) var(--sidebar-search-input-spacing-horizontal);
342+
background: #D6410D;
343+
font-weight: bold;
344+
font-size: var(--font-size--small);
345+
cursor: pointer;
346+
}
347+
348+
.sidebar-search-container input[type=submit]:hover {
349+
text-decoration: underline;
350+
}
351+
352+
/* Make inline code the same size as code blocks */
353+
p code.literal {
354+
border: 0;
355+
font-size: var(--code-font-size);
356+
}
357+
358+
/* Use the general admonition font size for inline code */
359+
.admonition p code.literal {
360+
font-size: var(--admonition-font-size);
361+
}

‎canonical_sphinx/theme/static/favicon.png‎

-54.2 KB
Loading

‎canonical_sphinx/theme/static/furo_colors.css‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
body {
22
--color-code-background: #f8f8f8;
33
--color-code-foreground: black;
4-
--font-stack: Ubuntu, -apple-system, Segoe UI, Roboto, Oxygen, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
5-
--font-stack--monospace: Ubuntu Mono, Consolas, Monaco, Courier, monospace;
4+
--code-font-size: 1rem;
5+
--font-stack: Ubuntu variable, Ubuntu, -apple-system, Segoe UI, Roboto, Oxygen, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
6+
--font-stack--monospace: Ubuntu Mono variable, Ubuntu Mono, Consolas, Monaco, Courier, monospace;
67
--color-foreground-primary: #111;
78
--color-foreground-secondary: var(--color-foreground-primary);
89
--color-foreground-muted: #333;
@@ -24,7 +25,7 @@ body {
2425
--color-admonition-title--tip: #24598F;
2526
--color-admonition-title--important: #C7162B;
2627
--color-admonition-title--caution: #F99B11;
27-
--color-highlighted-background: #EbEbEb;
28+
--color-highlighted-background: #EBEBEB;
2829
--color-link-underline: var(--color-background-primary);
2930
--color-link-underline--hover: var(--color-background-primary);
3031
--color-version-popup: #772953;

‎canonical_sphinx/theme/static/github_issue_links.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
.github-issue-link {
55
font-size: var(--font-size--small);
66
font-weight: bold;
7-
background-color: #DD4814;
7+
background-color: #D6410D;
88
padding: 13px 23px;
99
text-decoration: none;
1010
}

‎canonical_sphinx/theme/templates/404.html‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{% extends "page.html" %}
2+
3+
{% block content -%}
4+
<section>
5+
<h1>Page not found</h1>
6+
<div class="sd-container-fluid sd-sphinx-override sd-mb-4 docutils">
7+
<div class="sd-row sd-row-cols-1 sd-row-cols-xs-1 sd-row-cols-sm-1 sd-row-cols-md-2 sd-row-cols-lg-2 sd-g-5 sd-g-xs-5 sd-g-sm-5 sd-g-md-5 sd-g-lg-5 docutils">
8+
<div class="sd-col sd-d-flex-column docutils">
9+
{{ body }}
10+
</div>
11+
<div class="sd-col sd-d-flex-column docutils">
12+
<img alt="Penguin with a question mark" class="align-center" height="283" src="{{ pathto('_static/404.svg',1) }}" width="287" />
13+
</div>
14+
</div>
15+
</div>
16+
</section>
17+
{%- endblock content %}

canonical_sphinx/theme/base.html renamed to canonical_sphinx/theme/templates/base.html

File renamed without changes.

canonical_sphinx/theme/footer.html renamed to canonical_sphinx/theme/templates/footer.html

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
<div class="context">
2828
<span>{{ _("Previous") }}</span>
2929
</div>
30-
{% if prev.link == pathto(master_doc) %}
30+
{% if prev.link == pathto(root_doc) %}
3131
<div class="title">{{ _("Home") }}</div>
3232
{% else %}
3333
<div class="title">{{ prev.title }}</div>
@@ -80,6 +80,18 @@
8080
</div>
8181
{% endif %}
8282

83+
{% if mattermost %}
84+
<div class="ask-mattermost">
85+
<a class="muted-link" href="{{ mattermost }}">Ask a question on Mattermost</a>
86+
</div>
87+
{% endif %}
88+
89+
{% if matrix %}
90+
<div class="ask-matrix">
91+
<a class="muted-link" href="{{ matrix }}">Ask a question on Matrix</a>
92+
</div>
93+
{% endif %}
94+
8395
{% if github_url and github_version and github_folder %}
8496

8597
{% if github_issues %}

canonical_sphinx/theme/header.html renamed to canonical_sphinx/theme/templates/header.html

File renamed without changes.

0 commit comments

Comments
 (0)