xref: /template/ad-hominem/css/_admin.less (revision 6b8be8bdb588e730590d3a388319181f61b9f25d)
1
2/* indicate special modes by using a different background and border */
3body.mode_admin {
4	main {
5		& {
6			background-color: @ini_background_alt;
7			border: @ini_text_alt solid 2px;
8			color: @ini_text_alt;
9		}
10		#toc {
11			background-color: @ini_background_alt;
12		}
13		#navYouAreHere {
14			background-color: @ini_background;
15			padding: .25em .25em 0 .25em;
16			border-radius: .25em;
17			border: @ini_text_alt solid 2px;
18		}
19		table th {
20			background-color: @ini_background_neu;
21		}
22	}
23	div.ui-admin {
24
25		& {
26			display: grid;
27			grid-template-columns: 1fr 1fr;
28		}
29
30		h1.first-child,
31		div.level1	{
32			grid-column: 1 / span 2;
33			margin-bottom: 1em;
34		}
35
36		/* main task grouped in two columns */
37		ul.admin_tasks {
38			grid-column: 2;
39			list-style-type: none;
40			font-size: 1.125em;
41			margin: 0;
42		}
43		ul.admin_tasks:first-of-type {
44			grid-row: 3 / span 4;
45			grid-column: 1;
46		}
47		ul.admin_plugins {
48			grid-row: 6;
49			grid-column: 2;
50		}
51
52		/* general menu item styling */
53		ul {
54			padding: 0;
55			li {
56				margin: 0 0 1em 0;
57				font-weight: bold;
58				list-style-type: none;
59				white-space: nowrap;
60
61				a {
62					display: flex;
63					span {
64						display: inline-block;
65
66						&.icon {
67							width: 1.5em;
68							min-height: 1.5em;
69							margin: 0 0.5em;
70							vertical-align: top;
71
72							svg {
73								width: 1.5em;
74								height: 1.5em;
75								fill: @ini_link;
76								display: inline-block;
77								path {
78									fill: @ini_link;
79								}
80							}
81						}
82
83						&.prompt {
84							white-space: normal;
85						}
86					}
87				}
88			}
89		}
90
91		/* Security Warning */
92		#security__check {
93			clear: both;
94			grid-row: 7;
95			grid-column: 1 / span 2;
96		}
97
98		/* DokuWiki version */
99		#admin__version {
100			display: block;
101			box-sizing: border-box;
102			width: 100%;
103			max-height: 7em;
104			overflow: auto;
105			color: @ini_text_neu;
106			background: @ini_background_neu url('images/info.svg') .25em .5em no-repeat;
107			background-size: 1em;
108			padding: .25em 0 .25em 1.75em;
109			border: @ini_border 1px solid;
110			border-radius: .25em;
111			box-shadow: inset .5pt .5pt 1pt #00000088;
112			grid-row: 9;
113			grid-column: 1 / span 2;
114		}
115	}
116
117	/* user manager: */
118	#user__manager {
119		button {
120			& {
121				background-color: @ini_background;
122				border: @ini_text solid 1px;
123				border-radius: .25em;
124				padding: .25em .5em;
125				cursor: pointer;
126			}
127			&#usrmgr__del {
128				background-color: #fcd;
129				color: @ini_text;
130			}
131			&[name="fn[add]"] {
132				background-color: #cdf;
133				color: @ini_text;
134			}
135			&[name="fn[start]"] {
136				border-radius: .5em 0 0 .5em;
137			}
138			&[name="fn[prev]"],
139			&[name="fn[next]"] {
140				border-radius: 0;
141				border-left-width: 0;
142			}
143			&[name="fn[last]"] {
144				border-radius: 0 .5em .5em 0;
145				border-left-width: 0;
146			}
147		}
148	}
149}
150
151/* style the extension manager items: */
152body.dokuwiki #extension__manager {
153	form.install { box-sizing: border-box; width: 100%; padding: 1em 2em; background-color: #EEE; }
154	form.install .block { text-align: left; width: 100% }
155	form.install input[name=installurl] {
156		font-family: @ini_mono_fonts;
157		padding: .25em .25em .25em 24px;
158		border-radius: 10px;
159		background: @ini_background_site url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAQAAAC1+jfqAAABdklEQVR4AWMgAVRo1zY3rGk41rC+rqvCBCJWBpPM4WoomLHtdtuv/t9Lfk263TtrQ0t7Oj9cbzZDc/W6s/8T7khD+P+F/8bv29PZlswJVVBu0vPuVZyNYHFZbmAqE1SR0cbjXR6pjGBO58am962Ta3e3ftqy6B5LCcMasOj7gInrm9jBzI4vTX+bfjT/7/4/p/w/zFXybUmt71u4wJzGfxP/t/xvA+KaP2XnQSKVFpWPav/U/6+HKJjz++OVJUDp1n9N/+r+19QyMCz1mPC/8X/X/26Igrn3GiUeL5n/v+F/8//6/9NOMTC0hDUDefP/L4MoOL6ickVeSQ1QqAGooPdBJE/lnloge/fhixBHftFd9bLkR83/+n/1QAXVP8qX1Pyv/L/s/12f/4xQNz8s3Pa/6X/Vvzqgour/5f/r/q//f2fmLy54WP7lfJN74eMSoKIyoNFz/5/+9ar+Px9aZL3Xfjvz7aO3/96+eLvsnSVE7CPhOAYA9nvIX0UoNU8AAAAASUVORK5CYII=') 3px center no-repeat;
160		width: calc(100% - 6em);
161	}
162	form.install input[name=overwrite] { width: auto; margin-left: 2em;}
163	form.install button[type=submit] {
164		border: #CCC solid 1.5pt;
165		padding: .5em .75em;
166		background-color: #cdf;
167	}
168	form.install button[type=submit]::before {
169		content: ' ';
170		display: inline-block;
171		position: relative;
172		top: .1em;
173		width: 1em;
174		height: 1em;
175		background: transparent url('images/editor/edit-save.svg') center bottom no-repeat;
176		margin-right: .25em;
177	}
178}
179
180/* dark mode overrides */
181@media (prefers-color-scheme: dark) {
182	body.darkmode.mode_admin {
183		main {
184			& {
185				background-color: @ini_background_alt_dark;
186				border-color: @ini_text_alt_dark;
187				color: @ini_text_alt_dark;
188			}
189			#toc {
190				background-color: @ini_background_alt_dark;
191				border-left: @ini_text_alt_dark solid .5pt;;
192			}
193			#navYouAreHere {
194				background-color: @ini_background_dark;
195				border-color: @ini_text_alt_dark;
196			}
197		}
198	}
199
200	body.darkmode #extension__manager form.install { background-color: #39393D; }
201	body.darkmode #extension__manager form.install button[type=submit] {
202		color: #CDF;
203		background-color: #346;
204		border-color: #90909B;
205	}
206	body.darkmode #extension__manager form.install button[type=submit]::before { filter: invert(.9); }
207	body.darkmode div.ui-admin #admin__version {
208		color: @ini_text_neu_dark;
209		background-color: @ini_background_neu_dark;
210	}
211
212	body.darkmode div.ui-admin ul li a span.icon {
213		svg {
214			& { fill: @ini_link_dark; }
215			path { fill: @ini_link_dark; }
216		}
217	}
218}
219/* below tablet size */
220@media (max-width: @ini_tablet_width) {
221	body.dokuwiki div.ui-admin { display: block; }
222}