PluginProbe
Easy Appointments / trunk
Easy Appointments vtrunk
4.0.2.1 4.0.2 4.0.1 3.12.27 3.12.28 3.12.29 4.0 3.12.26 3.12.25 trunk 2.0.0 2.1.0 2.1.1 2.1.3 2.1.4 2.10.0 2.2.0 2.2.3 2.2.4 2.3.0 2.3.1 2.3.11 2.3.2 2.3.3 2.3.4 All 79 releases
easy-appointments / css / admin.css

admin.css in Easy Appointments trunk, at css/admin.css

513 lines 8.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @import "./scss/form-fields.css";
2 @import "./scss/tooltip.css";
3
4 * {
5 box-sizing: border-box;
6 }
7
8 hr.divider {
9 border-top: 2px dashed #DDD;
10 border-bottom: 0 none;
11 margin-top: 20px;
12 color: white;
13 }
14
15 select.field {
16 width: 100px;
17 }
18
19 #tab-header {
20 text-align: center;
21 margin-top: 35px;
22 padding: 10px;
23 background: #fff;
24 }
25
26 #tab-header li {
27 display: inline-block;
28 font-size: 15px;
29 margin-right: 20px;
30 margin-left: 20px;
31 text-align: center;
32 }
33
34 #tab-header li a {
35 text-decoration: none;
36 }
37
38 #tab-header li a:active, #tab-header li a:focus {
39 outline: none !important;
40 box-shadow: none !important;
41 }
42
43
44 #tab-header li a i {
45 margin-bottom: 4px;
46 display: block;
47 font-size: 3em;
48 }
49
50 #tab-header .tab-selected a {
51 color: red;
52 }
53
54 .column-5 {
55 width: 5%;
56 }
57
58 .column-10 {
59 width: 10%;
60 }
61
62 .column-15 {
63 width: 15%;
64 }
65
66 .column-20 {
67 width: 20%;
68 }
69
70 .filter-part {
71 padding: 10px;
72 background: #fff;
73 }
74
75 .ea-row:hover {
76 background-color: #B4E5FA;
77 }
78
79 .ea-editing td {
80 background-color: #CCC;
81 }
82
83 .ea-editing td input[type='text'] {
84 width: 100%;
85 }
86
87 .ea-row td {
88 height: 30px;
89 vertical-align: middle;
90 }
91
92 .ea-row .btn-edit, .ea-row .btn-del, .ea-row .btn-clone, .ea-row .btn-status-confirm, .ea-row .btn-status-cancel {
93 display: none;
94 }
95
96 .ea-row:hover .btn-edit, .ea-row:hover .btn-del, .ea-row:hover .btn-clone, .ea-row:hover .btn-status-confirm, .ea-row:hover .btn-status-cancel,
97 .ea-row:focus .btn-edit, .ea-row:focus .btn-del, .ea-row:focus .btn-clone, .ea-row:focus .btn-status-confirm, .ea-row:focus .btn-status-cancel,
98 .ea-row:focus-within .btn-edit, .ea-row:focus-within .btn-del, .ea-row:focus-within .btn-clone, .ea-row:focus-within .btn-status-confirm, .ea-row:focus-within .btn-status-cancel {
99 display: inline-block;
100 cursor: pointer;
101 }
102
103 .ea-row .action-column {
104 padding: 0;
105 }
106
107 .ea-sort-fields {
108 display: inline-block;
109 position: relative;
110 top: -6px;
111 margin-left: 15px;
112 }
113
114 .date-input {
115 width: 120px;
116 }
117
118 .filter-label {
119 text-align: right;
120 padding-left: 10px;
121 }
122
123 .filter-select select {
124 width: 180px;
125 }
126
127 select.time-start option:disabled {
128 background-color: grey;
129 }
130
131 .table-row-td p {
132 margin-top: 2px !important;
133 margin-bottom: 2px !important;
134 margin-left: 20px !important;
135 }
136
137 .table-row-td strong {
138 font-size: 1.1em;
139 }
140
141 .action-center {
142 text-align: center;
143 white-space: nowrap;
144 }
145
146 .action-center button,
147 .action-center button.button {
148 display: inline-flex !important;
149 align-items: center !important;
150 justify-content: center !important;
151 width: 28px !important;
152 height: 28px !important;
153 min-width: 28px !important;
154 max-width: 28px !important;
155 min-height: 28px !important;
156 max-height: 28px !important;
157 line-height: 1 !important;
158 padding: 0 !important;
159 margin: 1px 2px !important;
160 border-radius: 6px !important;
161 box-shadow: none !important;
162 vertical-align: middle !important;
163 background: #ffffff !important;
164 border: 1px solid #cbd5e1 !important;
165 color: #475569 !important;
166 box-sizing: border-box !important;
167 }
168
169 .action-center button svg {
170 display: block !important;
171 width: 14px !important;
172 height: 14px !important;
173 margin: auto !important;
174 flex-shrink: 0 !important;
175 }
176
177 .action-center button:hover:not(:disabled) {
178 background: #f1f5f9 !important;
179 border-color: #94a3b8 !important;
180 color: #0f172a !important;
181 }
182
183 .action-center button:disabled {
184 opacity: 0.35 !important;
185 cursor: not-allowed !important;
186 }
187
188 /* EDITING ROW */
189 .ea-editing td p {
190 margin-bottom: 0;
191 color: gray;
192 margin-top: 0;
193 }
194
195 .ea-editing td:last-child {
196 vertical-align: bottom;
197 }
198
199 .ea-editing select, .ea-editing input[type='text'] {
200 width: 100%;
201 margin-bottom: 6px;
202 margin-top: 0;
203 }
204
205 .ea-editing textarea {
206 font-size: 11px;
207 width: 100%;
208 }
209
210 body td .label-up {
211 color: gray;
212 margin: 0;
213 padding: 0;
214 }
215
216 .notifications {
217 margin: 0 auto;
218 width: 100%;
219 }
220
221 .notifications td {
222 padding-top: 5;
223 padding-bottom: 0;
224 }
225
226 .notifications h4 {
227 margin-bottom: 0;
228 margin-top: 0;
229 }
230
231 .notifications textarea {
232 width: 100%;
233 height: 130px;
234 margin-bottom: 15px;
235 }
236
237 .notifications-help {
238 margin-bottom: 0;
239 }
240
241 .form-table-translation th, .form-table-translation td {
242 padding: 0 !important;
243 }
244
245 .status {
246 float: right;
247 font-size: 14px;
248 color: gray;
249 margin-top: 5px;
250 }
251
252 #ui-datepicker-div {
253 display: none;
254 }
255
256 .custom-css {
257 width: 50%;
258 }
259
260 textarea[data-key="custom.css"] {
261 width: 100%;
262 height: 300px;
263 }
264
265 .sortable-placeholder {
266 border: 1px dashed #CCC;
267 width: 500px;
268 height: 40px;
269 }
270
271 .single-field-options {
272 display: block;
273 position: absolute;
274 right: -20px;
275 height: 40px;
276 width: 40px;
277 top: 0px;
278 text-align: center;
279 padding-top: 4px;
280 }
281
282 .field-settings {
283 background-color: #fff;
284 border-left: 1px solid #ccc;
285 border-right: 1px solid #ccc;
286 border-bottom: 1px solid #ccc;
287 width: 382px;
288 position: relative;
289 padding: 10px 15px;
290 }
291
292 .field-settings label {
293 display: inline-block;
294 width: 100px;
295 }
296
297 .remove-select-option {
298 float: right;
299 }
300
301 .field-settings .select-options li {
302 background-color: #ccc;
303 margin: 3px;
304 padding: 5px 10px 5px 10px;
305
306 }
307
308 .item-delete {
309 color: #A00;
310 }
311
312 .item-delete:hover {
313 color: red;
314 }
315
316 .inner-edit-table {
317 width: 100%;
318 }
319
320 /* tinyMCE */
321 .notifications .mce-tinymce {
322 border: 1px solid #e5e5e5;
323 }
324
325 .mail-tab {
326 padding: 10px;
327 color: #0073aa;
328 display: inline-block;
329 cursor: pointer;
330 border-top: 1px solid transparent;
331 border-left: 1px solid transparent;
332 border-right: 1px solid transparent;
333 }
334
335 .mail-tab.selected {
336 cursor: default;
337 color: #333;
338 background-color: #f5f5f5;
339 border-top: 1px solid #e5e5e5;
340 border-left: 1px solid #e5e5e5;
341 border-right: 1px solid #e5e5e5;
342 }
343
344 /* END tinyMCE */
345
346
347 /* Admin */
348 @media only screen and (max-width: 800px) {
349
350 .widefat td, .widefat th {
351 padding-left: 0;
352 padding-right: 0;
353 }
354
355 .filter-select select {
356 width: 100%;
357 }
358
359 td.action-center.action-center {
360 text-align: center;
361 border-bottom: 1px dashed #CCCCCC;
362 }
363
364 .ea-row .btn-edit, .ea-row .btn-del, .ea-row .btn-clone {
365 display: inline-block;
366 width: 28%;
367 }
368
369 /* Force table to not be like tables anymore */
370 .ea-responsive-table table,
371 .ea-responsive-table thead,
372 .ea-responsive-table tbody,
373 .ea-responsive-table th,
374 .ea-responsive-table td,
375 .ea-responsive-table tr {
376 display: block;
377 }
378
379 /* Hide table headers (but not display: none;, for accessibility) */
380 .ea-responsive-table thead tr {
381 position: absolute;
382 top: -9999px;
383 left: -9999px;
384 }
385
386 .ea-responsive-table tr { margin-bottom: 5px; }
387 .ea-responsive-table tr:last-child { margin-bottom: 0px; }
388
389 .ea-responsive-table td {
390 /* Behave like a "row" */
391 border: none;
392 /*border-bottom: 1px solid #eee;*/
393 position: relative;
394 /*padding-right: 50%;*/
395 white-space: normal;
396 text-align: left;
397 display: inline-table;
398 width: 100%;
399 }
400
401 .ea-responsive-table td:before {
402 /* Now like a table header */
403 position: absolute;
404 /* Top/left values mimic padding */
405 top: 6px;
406 left: 6px;
407 width: 45%;
408 /*padding-right: 10px;*/
409 white-space: nowrap;
410 text-align:left;
411 font-weight: bold;
412 }
413
414 /*
415 Label the data
416 */
417 .ea-responsive-table td:before { content: attr(data-title); }
418
419 #ea-appointments strong {
420 padding-left: 10%;
421 }
422 }
423
424 .bulk-text {
425 margin-bottom: 0;
426 margin-top: 5px;
427 font-size: 20px;
428 }
429
430 /* Bulk */
431 .bulk-row {
432 display: inline-flex;
433 padding: 5px;
434 width: 100%;
435 }
436
437 .bulk-row .bulk-field {
438 padding: 5px;
439 }
440
441 .bulk-row .bulk-field label {
442 font-weight: bolder;
443 }
444
445 .bulk-row .bulk-field input, .bulk-row .bulk-field select {
446 height: 29px;
447 font-size: 13px;
448 border: 1px solid #aaa;
449 background-color: #fff;
450 background-image: linear-gradient(#eee 1%,#fff 15%);
451 cursor: text;
452 }
453
454 #bulk-connections li{
455 padding-bottom: 6px;
456 border-bottom: 1px dashed #aaa;
457 }
458
459 #bulk-connections .bulk-value {
460 display: inline-block;
461 width: 30%;
462 font-weight: bold;
463 }
464
465 .bulk-footer {
466 text-align: right;
467 border-top: 1px solid #ddd;
468 padding-top: 8px;
469 }
470
471 .form-label-option, .select-label-option {
472 height: 75px;
473 margin-right: 10px;
474 border: 4px solid #ccc;
475 cursor: pointer;
476 }
477
478 .form-label-option.selected, .select-label-option.selected {
479 border: 4px solid #0073aa;
480 }
481
482 .ea-admin-subtabs {
483 margin: 10px 0 15px 0;
484 }
485
486 .ea-admin-subtabs a {
487 margin-right: 15px;
488 text-decoration: none;
489 font-weight: 500;
490 }
491
492 .ea-admin-subtabs a.selected {
493 font-weight: 600;
494 border-bottom: 2px solid #2271b1;
495 }
496
497 .label-with-tooltip label {
498 display: inline-flex;
499 align-items: center;
500 gap: 6px;
501 margin-top: 7px;
502 }
503
504 .ea-status-heading{
505 margin-top:20px;
506 font-size:15px;
507 font-weight:600;
508 padding-bottom:6px;
509 }
510 .ea-status-subjects{
511 margin-left:10px;
512 }
513