xref: /template/ad-hominem/css/design.less (revision 2fd890d1234ae9930f6e15baf655344abd846971)
1/**
2 * This file provides the main design styles for the
3 * bits that surround the content.
4 *
5 * @author Anika Henke <anika@selfthinker.org>
6 * @author Andreas Gohr <andi@splitbrain.org>
7 * @author Clarence Lee <clarencedglee@gmail.com>
8 */
9
10.dokuwiki.export {
11	background-color: @ini_background;
12}
13
14/* header
15********************************************************************/
16
17#dokuwiki__header {
18	padding: 2em 0 1.5em;
19
20	.headings,
21	.tools {
22		margin-bottom: 1.5em;
23		width: 49%;
24	}
25	.tools {
26		margin-top: .2em;
27	}
28
29	.logo {
30		margin: 0;
31		font-size: 1.5em;
32		font-weight: normal;
33		line-height: 1.2;
34
35		img {
36			float: left;
37			margin-right: .5em;
38		}
39
40		span {
41			display: block;
42			padding-top: 10px;
43		}
44
45		a {
46			text-decoration: none;
47			color: @ini_text;
48			background-color: inherit;
49		}
50	}
51
52	p.claim {
53		margin-bottom: 0;
54		font-size: 0.875em;
55	}
56
57	/* make all links in header (including breadcrumb and interwiki) same colour as the rest */
58	a {
59		color: @ini_link;
60		background-color: inherit;
61	}
62}
63
64[dir=rtl] #dokuwiki__header .logo img {
65	float: right;
66	margin-left: .5em;
67	margin-right: 0;
68}
69
70/* tools
71********************************************************************/
72
73/* highlight selected tool */
74.mode_admin .action.admin a,
75.mode_login .action.login a,
76.mode_register .action.register a,
77.mode_profile .action.profile a,
78.mode_recent .action.recent a,
79.mode_index .action.index a,
80.mode_media .action.media a,
81.mode_revisions .action.revs a,
82.mode_backlink .action.backlink a,
83.mode_subscribe .action.subscribe a {
84	font-weight: bold;
85}
86
87#dokuwiki__header .tools {
88	ul {
89		padding-left: 0;
90		margin-bottom: 0;
91	}
92
93	li {
94		font-size: 0.875em;
95		margin-left: 1em;
96		list-style: none;
97		display: inline;
98	}
99
100	form.search div.ajax_qsearch li {
101		font-size: 1em;
102		margin-left: 0;
103		display: block;
104		overflow: hidden;
105		text-overflow: ellipsis;
106	}
107}
108
109[dir=rtl] #dokuwiki__header .tools li {
110	margin-right: 1em;
111	margin-left: 0;
112}
113
114#dokuwiki__header .mobileTools {
115	display: none; /* hide mobile tools dropdown to only show in mobile view */
116}
117
118/*____________ site tools ____________*/
119
120#dokuwiki__sitetools {
121	& {
122		text-align: right;
123	}
124	form.search {
125		font-size: 0.875em;
126	}
127}
128
129[dir=rtl] #dokuwiki__sitetools {
130	text-align: left;
131}
132
133form.search {
134	display: block;
135	position: relative;
136	margin-bottom: 0.5em;
137
138	input {
139		/* width: 18em; */
140		padding: .35em 22px .35em .1em;
141	}
142
143	button {
144		background: transparent url(images/search.png) no-repeat 0 0;
145		background-size: 16px;
146		border-width: 0;
147		width: 16px;
148		height: 16px;
149		text-indent: -99999px;
150		margin-left: -28px;
151		box-shadow: none;
152		padding: 0;
153	}
154}
155
156[dir=rtl] form.search {
157	input {
158		padding: .35em .1em .35em 22px;
159	}
160
161	button {
162		background-position: 5px 0;
163		margin-left: 0;
164		margin-right: -20px;
165		position: relative;
166	}
167}
168
169/*____________ breadcrumbs ____________*/
170
171.dokuwiki div.breadcrumbs {
172	border-top: 1px solid @ini_border;
173	border-bottom: 1px solid @ini_background;
174	margin-bottom: .5em;
175	font-size: 0.875em;
176	clear: both;
177
178	div {
179		padding: .1em .35em;
180	}
181
182	div:only-child {
183		border-top: 1px solid @ini_background;
184		border-bottom: 1px solid @ini_border;
185	}
186
187	div:first-child {
188		border-top: 1px solid @ini_background;
189	}
190
191	div:last-child {
192		border-bottom: 1px solid @ini_border;
193	}
194
195	.bcsep {
196		font-size: 0.75em;
197	}
198}
199
200/* sidebar
201********************************************************************/
202
203.dokuwiki .aside {
204	font-size: 0.875em;
205	overflow: hidden;
206	word-wrap: break-word;
207
208	/* make sidebar more condensed */
209
210	h1 {
211		font-size: 1.714em;
212		margin-bottom: .292em;
213	}
214
215	h2 {
216		margin-bottom: .333em;
217	}
218
219	h3 {
220		margin-bottom: .444em;
221	}
222
223	h4 {
224		margin-bottom: .5em;
225	}
226
227	h5 {
228		margin-bottom: .5714em;
229	}
230
231	p,
232	ul,
233	ol,
234	dl,
235	pre,
236	table,
237	fieldset,
238	hr,
239	blockquote,
240	address {
241		margin-bottom: .7em;
242	}
243
244	ul,
245	ol {
246		padding-left: .5em;
247	}
248
249	li ul,
250	li ol {
251		margin-bottom: 0;
252		padding: 0;
253	}
254
255	a:link,
256	a:visited {
257		color: @ini_link;
258		background-color: inherit;
259	}
260}
261
262[dir=rtl] .dokuwiki .aside ul,
263[dir=rtl] .dokuwiki .aside ol {
264	padding-right: .5em;
265}
266
267/* content
268********************************************************************/
269
270.dokuwiki .pageId {
271	float: right;
272	margin-right: -1em;
273	margin-bottom: -1px;
274	margin-top: -1.5em;
275	overflow: hidden;
276	padding: 0.5em 1em 0;
277
278	span {
279		font-size: 0.875em;
280		border: solid @ini_background_alt;
281		border-width: 1px 1px 0;
282		background-color: @ini_background;
283		color: @ini_text_alt;
284		padding: .1em .35em;
285		border-top-left-radius: 2px;
286		border-top-right-radius: 2px;
287		box-shadow: 0 0 .5em @ini_text_alt;
288		display: block;
289	}
290}
291
292.dokuwiki div.page {
293	clear: both;
294	background: @ini_background;
295	color: inherit;
296	border: 1px solid @ini_background_alt;
297	box-shadow: 0 0 .5em @ini_text_alt;
298	border-radius: 2px;
299	padding: 1.556em 2em 2em;
300	margin-bottom: .5em;
301	overflow: hidden;
302	word-wrap: break-word;
303}
304
305.dokuwiki .docInfo {
306	font-size: 0.875em;
307	text-align: right;
308	overflow-wrap: break-word;
309}
310
311/* license note under edit window */
312.dokuwiki div.license {
313	font-size: small;
314	line-height: 1.5em;
315	padding: 3pt;
316	background-color: @ini_background_alt;
317	border: @ini_border solid 1px;
318}
319
320[dir=rtl] .dokuwiki .docInfo {
321	text-align: left;
322}
323
324[dir=rtl] .dokuwiki .pageId {
325	float: left;
326	margin-left: -1em;
327	margin-right: 0;
328}
329
330/* footer
331********************************************************************/
332
333.dokuwiki .wrapper {
334	margin-bottom: 1.4em;
335}
336
337#dokuwiki__footer {
338	margin-bottom: 1em;
339	text-align: center;
340
341	> .pad {
342		font-size: 0.875em;
343	}
344
345	div.license {
346		margin-bottom: 0.5em;
347		font-size: 100%;
348	}
349
350	div.buttons a {
351		img {
352			opacity: 0.5;
353		}
354
355		&:hover img,
356		&:active img,
357		&:focus img {
358			opacity: 1;
359		}
360	}
361
362}
363
364[dir=rtl] #dokuwiki__footer .license img {
365	margin: 0 0 0 .5em;
366}
367
368/* dark mode overrides */
369@media (prefers-color-scheme: dark) {
370	body.darkmode div.license {
371		background-color: @ini_background_alt_dark;
372		border-color: @ini_border_dark;
373	}
374}