Skip to content

Commit ac5f7ff

Browse files
chore: update docs template to match 4insight (#97)
1 parent c5118de commit ac5f7ff

9 files changed

Lines changed: 382 additions & 2 deletions

File tree

docs/_static/4insight-logo.svg

Lines changed: 12 additions & 0 deletions
Loading

docs/_static/css/custom.css

Lines changed: 270 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,270 @@
1+
@import "../basic.css";
2+
3+
:root {
4+
/*****************************************************************************
5+
* Theme config
6+
**/
7+
--pst-header-height: 44px;
8+
9+
/*****************************************************************************
10+
* Font size
11+
**/
12+
--pst-font-size-base: 18px; /* base font size - applied at body / html level */
13+
--pst-font-size-nav: 15px; /* navbar font size */
14+
--pst-font-size-breadcrumb: 16px; /* breadcrumb font size */
15+
--pst-font-size-logo: 16px; /* breadcrumb font size */
16+
17+
/*****************************************************************************
18+
* Font family
19+
**/
20+
/* These are adapted from https://systemfontstack.com/ */
21+
--pst-font-family-sansserif-system: "Trebuchet MS", -apple-system,
22+
BlinkMacSystemFont, avenir next, avenir, "segoe ui", "helvetica neue",
23+
helvetica, Ubuntu, roboto, noto, arial, sans-serif;
24+
25+
--pst-font-family-serif-system: "Georgia", "Iowan Old Style", "Apple Garamond",
26+
Baskerville, "Times New Roman", "Droid Serif", Times, "Source Serif Pro",
27+
serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
28+
29+
--pst-font-family-monospace-system: SFMono-Regular, Menlo, Consolas, Monaco,
30+
Liberation Mono, "Lucida Console", monospace;
31+
32+
--pst-font-family-base: var(--pst-font-family-sansserif-system);
33+
--pst-font-family-heading: var(--pst-font-family-sansserif-system);
34+
--pst-font-family-monospace: var(--pst-font-family-monospace-system);
35+
36+
/*****************************************************************************
37+
* Color
38+
**/
39+
--pst-color-on-background: #333333 !important; /*navbar bg-colour*/
40+
--pst-color-background: #ece9e5 !important;
41+
42+
--pst-color-primary: #00a0af !important; /* headers */
43+
--pst-color-text-base: #49494a !important;
44+
--pst-color-info: #009ddc !important;
45+
--pst-color-success: 0, 168, 143;
46+
--pst-color-warning: 250, 166, 52;
47+
--pst-color-danger: 237, 23, 79;
48+
49+
--pst-color-h1: var(--pst-color-primary) !important;
50+
--pst-color-h2: var(--pst-color-primary) !important;
51+
--pst-color-h3: #49494a !important;
52+
--pst-color-h4: var(--pst-color-primary) !important;
53+
--pst-color-h5: var(--pst-color-text-base);
54+
--pst-color-h6: var(--pst-color-text-base);
55+
--pst-color-paragraph: var(--pst-color-text-base);
56+
--pst-color-link: #00a0af !important; /*links*/
57+
--pst-color-headerlink: #002d56 !important;
58+
--pst-color-headerlink-hover: #0032fa !important;
59+
--pst-color-inline-code: #ed174f !important;
60+
61+
--pst-color-text-muted: #77757a !important ; /* Inactive sidebar links*/
62+
63+
--pst-color-active-navigation: red !important; /*#00A0Af !important;*/
64+
--pst-color-navbar-link: #ece9e5 !important;
65+
66+
/*****************************************************************************
67+
* Admonitions
68+
**/
69+
--pst-color-admonition-default: var(--pst-color-info) !important;
70+
--pst-color-admonition-note: var(--pst-color-info) !important;
71+
72+
--pst-color-secondary: #00a0af !important;
73+
}
74+
75+
/*****************************************************************************
76+
* 4Subsea tweaks
77+
**/
78+
h1,
79+
h2 {
80+
color: var(--pst-color-h1);
81+
}
82+
83+
h1 {
84+
font-size: 32px;
85+
}
86+
h2 {
87+
font-size: 22px;
88+
}
89+
90+
h3 {
91+
font-size: 18px;
92+
font-weight: 700;
93+
}
94+
95+
/* Keep link color for visited links */
96+
a:visited {
97+
color: var(--pst-color-link);
98+
}
99+
100+
/*****************************************************************************
101+
* Admonitions
102+
**/
103+
104+
.admonition,
105+
div.admonition {
106+
background-color: transparent;
107+
}
108+
109+
.table tbody tr:nth-child(odd) {
110+
background-color: transparent;
111+
}
112+
113+
.table tbody tr:nth-child(even) {
114+
background-color: transparent;
115+
}
116+
117+
/*****************************************************************************
118+
* Header adjustments
119+
**/
120+
121+
/* Let the inner header take full width */
122+
.bd-header__inner {
123+
max-width: 100%;
124+
}
125+
126+
/* Distribute navigation items, see https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-justify-content */
127+
.bd-header {
128+
justify-content: space-between;
129+
}
130+
131+
/*****************************************************************************
132+
* Logo and title
133+
**/
134+
135+
/* Offset the logo to mimic the docs.4insight.io behaviour */
136+
.navbar-brand {
137+
margin-left: 73px;
138+
margin-top: 5px;
139+
margin-right: 40px; /* Add some margin before coming elements*/
140+
}
141+
142+
/* Fix logo image height*/
143+
.navbar-brand img {
144+
height: 22px;
145+
}
146+
147+
.navbar-brand img:hover {
148+
height: 32px;
149+
border-top: transparent;
150+
border-top-style: solid;
151+
border-top-width: 2px;
152+
padding-top: 3px;
153+
border-bottom: var(--pst-color-primary);
154+
border-bottom-style: solid;
155+
border-bottom-width: 2px;
156+
padding-bottom: 3px;
157+
}
158+
159+
/* Style the title next to logo */
160+
.navbar-brand p {
161+
color: var(--pst-color-navbar-link);
162+
}
163+
164+
/* Turn of underline on hover */
165+
.navbar-brand:hover {
166+
text-decoration: none;
167+
}
168+
169+
.logo__title {
170+
font-size: var(--pst-font-size-logo);
171+
padding-left: 4px;
172+
}
173+
174+
/* Make 4insight DOCUMENTATION take automatic width */
175+
.bd-header .navbar-header-items__start {
176+
width: auto;
177+
}
178+
179+
/*****************************************************************************
180+
* Navbar links
181+
**/
182+
183+
/* General text color */
184+
.navbar-nav .nav-link {
185+
color: var(--pst-color-navbar-link) !important;
186+
}
187+
188+
/* Style the underline on hover */
189+
.navbar-nav .nav-link:hover::after,
190+
.navbar-nav .nav-link:focus::after {
191+
text-decoration: underline;
192+
text-decoration-thickness: 2px;
193+
text-underline-offset: 3px;
194+
text-decoration-color: var(--pst-color-link);
195+
}
196+
197+
/* For active/current page */
198+
.navbar-nav .nav-link.active::after {
199+
color: var(--pst-color-navbar-link);
200+
text-decoration: none; /* Remove underline for active link */
201+
}
202+
203+
/* Set color for dropdown button */
204+
.bd-header ul.navbar-nav > li.nav-item.dropdown > .dropdown-toggle,
205+
.bd-header ul.navbar-nav > li.nav-item.dropdown > .dropdown-toggle:hover {
206+
color: var(--pst-color-navbar-link);
207+
font-size: var(--pst-font-size-nav);
208+
}
209+
210+
/* Font size for navbar items */
211+
.bd-header .navbar-nav li {
212+
font-size: var(--pst-font-size-nav);
213+
}
214+
215+
/* Set background color on hover for dropdown items */
216+
.bd-header ul.navbar-nav li a.nav-link.dropdown-item:hover {
217+
background-color: transparent;
218+
text-decoration: underline;
219+
text-decoration-thickness: 2px;
220+
text-underline-offset: 3px;
221+
text-decoration-color: var(--pst-color-link);
222+
}
223+
224+
/* Color of navbar icons */
225+
html .pst-navbar-icon {
226+
color: var(--pst-color-navbar-link);
227+
}
228+
229+
/*****************************************************************************
230+
* Breadcrumb
231+
**/
232+
233+
/* Styling for breadcrumb container */
234+
.breadcrumb {
235+
height: var(--pst-header-height);
236+
background-color: white;
237+
font-size: var(--pst-font-size-breadcrumb);
238+
padding-left: 16px;
239+
padding-top: 10px;
240+
}
241+
242+
/* Breadcrumb list styling */
243+
ul.breadcrumb {
244+
list-style: none;
245+
}
246+
247+
/* Remove default link styling */
248+
ul.breadcrumb li a {
249+
text-decoration: none;
250+
}
251+
252+
/* Add underline effect on hover */
253+
ul.breadcrumb li a:hover {
254+
color: var(--pst-color-link);
255+
text-decoration: underline;
256+
text-decoration-thickness: 1px;
257+
text-underline-offset: 2px;
258+
}
259+
260+
/* Add '/' between breadcrumb items */
261+
ul.breadcrumb li + li:before {
262+
padding: 5px;
263+
color: var(--pst-color-text-base);
264+
content: "/\00a0";
265+
}
266+
267+
/* Keep the link color even if visited */
268+
ul.breadcrumb li a:visited {
269+
color: var(--pst-color-link);
270+
}

docs/_static/empty

Whitespace-only changes.

docs/_static/favicon.png

822 Bytes
Loading

docs/_templates/breadcrumbs.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<ul class="breadcrumb">
2+
{# Home link #}
3+
<li><a href="http://docs.4insight.io">Home</a></li>
4+
5+
{# SDKs link #}
6+
<li><a href="http://docs.4insight.io/sdks">SDKs</a></li>
7+
8+
{# Project ("home") link #}
9+
<li><a href="{{ pathto(master_doc) }}">{{project}}</a></li>
10+
11+
{# Loop through parents #}
12+
{% for parent in parents %}
13+
<li><a href="{{ parent.link }}">{{ parent.title }}</a></li>
14+
{% endfor %}
15+
16+
{# Current page #}
17+
<li>{{ title }}</li>
18+
19+
</ul>

docs/_templates/layout.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{% extends "!layout.html" %}
2+
3+
{%- block docs_navbar %}
4+
{{ super() }}
5+
{# Insert breadcrumbs right after the navbar #}
6+
{% include "breadcrumbs.html" %}
7+
{%- endblock %}

0 commit comments

Comments
 (0)