Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
freebsd
GitHub Repository: freebsd/freebsd-doc
Path: blob/main/website/themes/beastie/static/css/navigation.css
18096 views
1
/*
2
* FreeBSD.org - Navigation (and List) Styles
3
*
4
* $FreeBSD$
5
*/
6
7
/* Site Navigation */
8
9
@media screen {
10
#topnav {
11
text-align: left;
12
color: #666;
13
font-size: 0.9em;
14
margin: 0;
15
padding: 0;
16
height: 29px;
17
overflow: visible;
18
margin-top: 7px;
19
}
20
21
#topnavleft {
22
width: 7px;
23
height: 29px;
24
border: 0px;
25
padding-right: 10px;
26
margin: 0px;
27
float: left;
28
}
29
30
#topnavleft img {
31
border: 0px;
32
margin: 0;
33
padding: 0;
34
}
35
36
#topnavright {
37
width: 7px;
38
height: 29px;
39
border: 0px;
40
padding: 0px;
41
margin: 0px;
42
float: right;
43
}
44
45
#topnavright img {
46
border: 0px;
47
margin: 0;
48
padding: 0;
49
}
50
51
#topnavlist {
52
list-style: none;
53
margin: 0;
54
padding: 0;
55
height: 29px;
56
}
57
58
#topnavlist li {
59
padding: 0 1em 0 1.2em;
60
display: inline;
61
border-left: 1px solid #B4B4B4;
62
}
63
64
#topnavlist li a {
65
color: #666;
66
font-weight: bold;
67
text-decoration: none;
68
}
69
70
#topnavlist li:first-child {
71
border-left: 0;
72
padding-left: 0;
73
}
74
75
/* Drop-down menu */
76
77
nav {
78
float: left;
79
height: 2.0em;
80
font-size: 90%;
81
clear: both;
82
margin-top: .3%;
83
font-weight: bold;
84
}
85
86
nav ul {
87
list-style: none;
88
margin: 0;
89
padding: 0px 10px 2px 10px;
90
float: left;
91
border-left: 1px solid #B4B4B4;
92
}
93
94
nav ul:first-child {
95
padding-left: 0;
96
border: 0;
97
}
98
99
nav a {
100
display: block;
101
padding: 0px 3px;
102
color: #666 !important;
103
text-decoration: none !important;
104
}
105
106
nav a:visited {
107
color: #666;
108
}
109
110
nav a:hover {
111
color: #990000;
112
}
113
114
nav li {
115
position: relative;
116
}
117
118
nav ul ul {
119
position: absolute;
120
background-color: #e5e5e5;
121
padding: 2px;
122
border: 0;
123
width: 10em;
124
z-index: 500;
125
}
126
127
nav ul ul li {
128
border-top: 1px solid #B4B4B4;
129
padding: 4px 0 4px 0;
130
}
131
132
nav ul ul ul {
133
top: 0;
134
left: 100%;
135
background: #e5e5e5;
136
}
137
138
nav ul ul,
139
nav ul li:hover ul ul,
140
nav ul ul li:hover ul ul {
141
display: none;
142
}
143
144
nav ul li:hover ul,
145
nav ul ul li:hover ul,
146
nav ul ul ul li:hover ul {
147
display: block;
148
}
149
150
/* Language selection */
151
152
#languagenav {
153
text-align: right;
154
color: #666;
155
font-size: 0.9em;
156
margin: 0px 0px 0px 0px;
157
right: 0px;
158
padding: 0;
159
}
160
161
#languagenavlist {
162
list-style: none;
163
margin: 0;
164
padding: 0;
165
}
166
167
#languagenavlist li {
168
padding: 0 0.5em 0 0.2em;
169
display: inline;
170
border-right: 1px solid #B6B6B6;
171
}
172
173
#languagenavlist li.last-child {
174
padding: 0 0em 0 0.2em;
175
border-right: 0;
176
}
177
178
#languagenavlist li a {
179
text-decoration: underline;
180
}
181
182
#languagenavlist li a:hover {
183
}
184
185
/* The search navigation is the list of links above the search box. */
186
187
#searchnav {
188
position: relative;
189
text-align: right;
190
color: #fff;
191
font-size: 0.9em;
192
margin: 0px 0px 0px 0px;
193
margin-top: 8px;
194
right: 0px;
195
padding: 0;
196
}
197
198
#searchnavlist {
199
list-style: none;
200
margin: 0;
201
padding: 0;
202
}
203
204
#searchnavlist li {
205
padding: 0 0.6em 0 0.3em;
206
display: inline;
207
border-right: 1px solid #fff;
208
}
209
210
#searchnavlist li.last-child {
211
padding: 0 0 0 0.3em;
212
border-right: 0;
213
}
214
215
#searchnavlist li a {
216
color: #FFCC66;
217
text-decoration: underline;
218
}
219
220
#searchnavlist li a:hover {
221
color: #fff;
222
}
223
224
/* Category Navigation */
225
226
#sidenav, #sidenav ul, #sidenav ul ul {
227
margin: 0;
228
padding: 0;
229
list-style: none;
230
font-size: 1.0em;
231
}
232
233
#sidenav {
234
width: 150px;
235
background-color: #eee;
236
border: 1px solid #D4D4D4;
237
}
238
239
#sidenav ul {
240
padding: 8px 4px 12px 4px;
241
}
242
243
#sidenav ul ul {
244
background: none;
245
background-color: #eee;
246
margin: 0;
247
padding: 0;
248
list-style: none;
249
}
250
251
#sidenav ul ul li {
252
background: none;
253
border: none;
254
}
255
256
#sidenav ul li {
257
border-bottom: 1px solid #eee;
258
margin: 0;
259
padding-left: 12px;
260
background-image: url(../images/blt_red_arrow.png);
261
background-repeat: no-repeat;
262
background-position: 12px 0.65em;
263
}
264
265
#sidenav ul li.active {
266
font-weight: bold;
267
}
268
269
#sidenav ul li.active span {
270
display: none;
271
}
272
273
#sidenav ul li a {
274
display: block;
275
color: #990000;
276
text-decoration: underline;
277
padding: 3px 5px 3px 12px;
278
margin: 0;
279
}
280
281
#sidenav ul ul li a.active {
282
font-weight: bold;
283
}
284
285
#sidenav ul ul li a {
286
display: block;
287
padding-left: 12px;
288
margin: 0;
289
}
290
291
#sidenav ul li a:hover {
292
color: #000;
293
}
294
295
#feedlinks {
296
padding-top: 5px;
297
padding-left: 5px;
298
margin-top: 5px;
299
margin-left: 5px;
300
list-style: none;
301
display: block;
302
}
303
304
#feedlinks ul {
305
list-style-image: url(../images/rss_icon_small.png);
306
}
307
308
/* Right Navigation */
309
310
.rightnav, .rightnav ul, .rightnav ul ul {
311
margin: 0;
312
padding: 0;
313
list-style: none;
314
font-size: 1.0em;
315
}
316
317
.rightnav {
318
width: 150px;
319
background-color: #eee;
320
border: 1px solid #D4D4D4;
321
}
322
323
.rightnav ul {
324
padding: 8px 4px 12px 4px;
325
}
326
327
.rightnav ul ul {
328
background: none;
329
background-color: #eee;
330
margin: 0;
331
padding: 0;
332
list-style: none;
333
}
334
335
.rightnav ul ul li {
336
background: none;
337
border: none;
338
}
339
340
.rightnav ul li {
341
border-bottom: 1px solid #eee;
342
margin: 0;
343
padding-left: 12px;
344
background-image: url(../images/blt_red_arrow.png);
345
background-repeat: no-repeat;
346
background-position: 12px 0.65em;
347
}
348
349
.rightnav ul li.active {
350
font-weight: bold;
351
}
352
353
.rightnav ul li.active span {
354
display: none;
355
}
356
357
.rightnav ul li a {
358
display: block;
359
color: #990000;
360
text-decoration: underline;
361
padding: 3px 5px 3px 12px;
362
margin: 0;
363
}
364
365
.rightnav ul ul li a.active {
366
font-weight: bold;
367
}
368
369
.rightnav ul ul li a {
370
display: block;
371
padding-left: 12px;
372
margin: 0;
373
}
374
375
.rightnav ul li a:hover {
376
color: #000;
377
}
378
379
.rightnav h1, .rightnav h2, .rightnav h3, .rightnav h4, .rightnav h5, .rightnav h6, .rightnav p {
380
padding-left: 10px;
381
padding-right: 10px;
382
}
383
}
384
385
@media print {
386
#topnav, #topnavleft, #topnavright, #topnavlist { display: none; }
387
nav { display: none; }
388
#languagenav, #languagenavlist { display: none; }
389
#searchnav, #searchnavlist { display: none; }
390
#sidenav { display: none; }
391
#feedlinks { display: none; }
392
.rightnav { display: none; }
393
}
394
395