Skip to content

Commit 2f5c837

Browse files
stefanvstefanv
authored
Consolidate navbar CSS (#428)
1 parent b02717a commit 2f5c837

3 files changed

Lines changed: 125 additions & 113 deletions

File tree

‎assets/theme-css/fresh.css‎

Lines changed: 0 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,3 @@
1-
.navbar.is-fresh {
2-
position: sticky;
3-
top: 0px;
4-
min-height: 3.8rem;
5-
transition: all 0.3s;
6-
z-index: 99;
7-
}
8-
.navbar.is-fresh .container {
9-
min-height: 4rem;
10-
}
11-
.navbar.is-fresh.no-shadow {
12-
box-shadow: none !important;
13-
}
14-
.navbar.is-fresh .navbar-burger {
15-
width: 4rem;
16-
height: 4rem;
17-
}
18-
.navbar.is-fresh .navbar-brand {
19-
min-height: 4rem;
20-
}
21-
.navbar.is-fresh .navbar-brand img {
22-
max-height: 36px !important;
23-
height: 36px;
24-
}
25-
.navbar.is-fresh .navbar-end {
26-
align-items: center;
27-
}
28-
.navbar.is-fresh .navbar-item.has-dropdown {
29-
padding: 10px 0;
30-
}
31-
.navbar.is-fresh .navbar-item.has-dropdown .navbar-link {
32-
color: #999;
33-
text-decoration: none;
34-
}
35-
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown .navbar-item:hover {
36-
color: var(--pst-color-link-hover);
37-
}
38-
.navbar.is-fresh .navbar-item.has-dropdown .navbar-link:after {
39-
top: 55%;
40-
height: 0.5em;
41-
width: 0.5em;
42-
border-width: 2px;
43-
border-color: #999;
44-
}
45-
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown {
46-
top: 3.4rem;
47-
min-width: 220px;
48-
margin-top: 4px;
49-
}
50-
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown .navbar-item {
51-
padding: 10px 20px;
52-
}
531
.animated {
542
animation-duration: 0.5s;
553
animation-fill-mode: both;

‎assets/theme-css/navbar.css‎

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
nav,
2+
.navbar {
3+
background: var(--pst-color-background);
4+
}
5+
6+
.navbar-burger {
7+
color: var(--pst-color-text-muted);
8+
}
9+
10+
.navbar-burger:hover {
11+
color: var(--colorPrimaryLight);
12+
}
13+
14+
.navbar-item {
15+
color: var(--pst-color-text-muted);
16+
}
17+
18+
.navbar-menu.is-active {
19+
background: var(--pst-color-text-muted);
20+
}
21+
22+
.navbar-menu.is-active .navbar-item {
23+
color: var(--pst-color-background);
24+
}
25+
26+
.navbar-menu.is-active .navbar-item:hover {
27+
color: var(--pst-color-link-hover);
28+
}
29+
30+
.navbar-logo {
31+
height: 28px;
32+
padding-right: 1rem;
33+
}
34+
35+
.navbar-logo-text {
36+
color: var(--pst-color-text-base);
37+
font-size: 1.25rem;
38+
font-weight: 700;
39+
}
40+
41+
.navbar.is-fresh {
42+
position: sticky;
43+
top: 0;
44+
min-height: 3.8rem;
45+
transition: all 0.3s;
46+
z-index: 99;
47+
}
48+
49+
.navbar.is-fresh .container {
50+
min-height: 4rem;
51+
}
52+
53+
.navbar.is-fresh.no-shadow {
54+
box-shadow: none !important;
55+
}
56+
57+
.navbar.is-fresh .navbar-burger {
58+
width: 4rem;
59+
height: 4rem;
60+
}
61+
62+
.navbar.is-fresh .navbar-brand {
63+
min-height: 4rem;
64+
}
65+
66+
.navbar.is-fresh .navbar-brand img {
67+
max-height: 36px !important;
68+
height: 36px;
69+
}
70+
71+
.navbar.is-fresh .navbar-end {
72+
align-items: center;
73+
}
74+
75+
a.navbar-item,
76+
a.navbar-item:visited {
77+
color: var(--pst-color-text-base);
78+
text-decoration: none;
79+
}
80+
81+
a.navbar-item:hover {
82+
color: var(--pst-color-link-hover);
83+
}
84+
85+
/* Dropdown menu item text */
86+
.navbar.is-fresh .navbar-item.has-dropdown .navbar-link {
87+
color: #999;
88+
text-decoration: none;
89+
}
90+
91+
/* Reduce space between dropdown item and its dropdown menu */
92+
.navbar.is-fresh .navbar-item.has-dropdown {
93+
padding: 10px 0;
94+
}
95+
96+
/* Down arrow next to dropdown menu */
97+
.navbar.is-fresh .navbar-item.has-dropdown .navbar-link:after {
98+
top: 55%;
99+
height: 0.5em;
100+
width: 0.5em;
101+
border-width: 2px;
102+
border-color: #999;
103+
}
104+
105+
/* Language dropdown box */
106+
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown {
107+
top: 3.4rem;
108+
min-width: 220px;
109+
margin-top: 4px;
110+
}
111+
112+
/* Dropdown menu items */
113+
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown .navbar-item {
114+
padding: 10px 20px;
115+
}
116+
117+
/* Dropdown menu hover */
118+
.navbar.is-fresh .navbar-item.has-dropdown:hover .navbar-link {
119+
color: var(--pst-color-link-hover);
120+
}
121+
122+
/* Dropdown menu item hover */
123+
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown .navbar-item:hover {
124+
color: var(--pst-color-link-hover);
125+
}

‎assets/theme-css/styles.css‎

Lines changed: 0 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -197,67 +197,6 @@ svg.icon {
197197
padding: 10px;
198198
}
199199

200-
/* navbar */
201-
202-
nav,
203-
.navbar {
204-
background: var(--pst-color-background);
205-
}
206-
.navbar-burger {
207-
color: var(--pst-color-text-muted);
208-
}
209-
.navbar-burger:hover {
210-
color: var(--colorPrimaryLight);
211-
}
212-
.navbar-item {
213-
color: var(--pst-color-text-muted);
214-
}
215-
216-
@media screen and (max-width: 1023px) {
217-
.navbar-menu.is-active {
218-
background: var(--pst-color-text-muted);
219-
}
220-
.navbar-menu.is-active .navbar-item {
221-
color: var(--pst-color-background);
222-
}
223-
.navbar-menu.is-active .navbar-item:hover {
224-
color: var(--pst-color-link-hover);
225-
}
226-
}
227-
228-
a.navbar-item,
229-
a.navbar-item:visited {
230-
color: var(--pst-color-text-base);
231-
text-decoration: none;
232-
}
233-
234-
a.navbar-item:hover {
235-
color: var(--pst-color-link-hover);
236-
}
237-
238-
.navbar-logo {
239-
height: 28px;
240-
padding-right: 1rem;
241-
}
242-
243-
.navbar-logo-text {
244-
color: var(--pst-color-text-base);
245-
font-size: 1.25rem;
246-
font-weight: bold;
247-
}
248-
249-
.navbar.is-fresh .navbar-item.has-dropdown .navbar-dropdown {
250-
border-top-color: var(--colorPrimaryDark);
251-
}
252-
253-
.navbar.is-fresh .navbar-item.has-dropdown:hover .navbar-link {
254-
color: var(--pst-color-link-hover);
255-
}
256-
257-
.navbar.is-fresh .navbar-item.has-dropdown:hover .navbar-link:after {
258-
border-color: var(--pst-color-link-hover);
259-
}
260-
261200
/* reboot stuff needed for pydata-sphinx-theme */
262201

263202
pre {

0 commit comments

Comments
 (0)