PluginProbe
Groups – Memberships and Access Control / 4.5.0
Groups – Memberships and Access Control v4.5.0
4.6.0 4.5.0 4.4.0 4.3.0 trunk 1.0.0-beta-1 1.0.0-beta-2 1.0.0-beta-3 1.0.0-beta-3b 1.0.0-beta-3c 1.0.0-beta-3d 1.1.4 1.1.5 1.10.0 1.10.1 1.10.2 1.10.3 1.11.0 1.11.1 1.11.2 1.11.3 1.12.0 1.13.0 1.13.1 1.2.0 All 129 releases
groups / css / groups_admin.css

groups_admin.css in Groups – Memberships and Access Control 4.5.0, at css/groups_admin.css

618 lines 12.6 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * groups_admin.css
3 *
4 * Copyright (c) "kento" Karim Rahimpur www.itthinx.com
5 *
6 * This code is released under the GNU General Public License.
7 * See COPYRIGHT.txt and LICENSE.txt.
8 *
9 * This code is distributed in the hope that it will be useful,
10 * but WITHOUT ANY WARRANTY; without even the implied warranty of
11 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
12 * GNU General Public License for more details.
13 *
14 * This header and all notices must be kept intact.
15 *
16 * @author Karim Rahimpur
17 * @package groups
18 * @since groups 1.0.0
19 */
20 .manage-groups,
21 .manage-capabilities {
22 margin-right: 1em;
23 }
24 .filters,
25 .manage {
26 background-color: #fff;
27 padding: 0.62em;
28 margin-bottom: 0.62em;
29 border: 1px solid #ddd;
30 }
31 .filters fieldset,
32 .manage fieldset {
33 display: inline-block;
34 clear: both;
35 }
36 .filters legend {
37 padding: 0 0 2px 0;
38 }
39 .filters form label {
40 white-space: nowrap;
41 margin-bottom: 0.62em;
42 }
43 .manage a.add {
44 text-decoration: none;
45 cursor: pointer;
46 }
47 .manage a.add .icon {
48 vertical-align: middle;
49 padding-right: 4px;
50 }
51 .manage-groups a.add.page-title-action img.icon,
52 .manage-groups a.refresh.page-title-action img.icon,
53 .manage-groups .row-actions span.edit img,
54 .manage-groups .row-actions span.remove img,
55 .manage-capabilities a.add.page-title-action img.icon,
56 .manage-capabilities a.refresh.page-title-action img.icon,
57 .manage-capabilities .row-actions span.edit img,
58 .manage-capabilities .row-actions span.remove img {
59 vertical-align: sub;
60 }
61 .manage a.add .label {
62 height: 20px;
63 vertical-align: middle;
64 }
65 .manage a.refresh {
66 text-decoration: none;
67 cursor: pointer;
68 float: right;
69 }
70 .manage a.refresh .icon {
71 vertical-align: middle;
72 }
73 .manage a.refresh .label {
74 height: 20px;
75 vertical-align: middle;
76 }
77 div.field {
78 padding-bottom: 0.62em;
79 }
80 div.field a.cancel {
81 vertical-align: middle;
82 }
83 div.field input[type="submit"],
84 div.group.remove input[type="submit"],
85 div.capability.remove input[type="submit"] {
86 margin-right: 1em;
87 }
88 label.group-id-filter,
89 label.group-name-filter,
90 label.capability-id-filter,
91 label.capability-filter,
92 label.field-label {
93 padding-right: 0.62em;
94 }
95 input.group-id-filter,
96 input.group-name-filter,
97 input.capability-id-filter,
98 input.capability-filter {
99 margin-right: 0.31em;
100 }
101
102 div.group.new label,
103 div.group.edit label,
104 div.capability.new label,
105 div.capability.edit label {
106 display: block;
107 }
108
109
110 .groups-overview .page-options,
111 .capabilities-overview .page-options {
112 float: left;
113 display: inline;
114 /*width: 250px;*/
115 padding-bottom: 1em;
116 }
117 .groups-overview .page-options.right,
118 .capabilities-overview .page-options.right {
119 float: right;
120 }
121 .groups-overview .page-options label,
122 .groups-overview .page-options input[type="text"],
123 .groups-overview .page-options .button,
124 .capabilities-overview .page-options label,
125 .capabilities-overview .page-options input[type="text"],
126 .capabilities-overview .page-options .button {
127 margin-right: 4px;
128 vertical-align: middle;
129 }
130 .groups-overview .page-options input[type="text"],
131 .capabilities-overview .page-options input[type="text"] {
132 text-align: center;
133 }
134 .groups-overview .tablenav.top,
135 .capabilities-overview .tablenav.top {
136 display: inline;
137 width: 250px;
138 }
139 .groups-overview th.check-column,
140 .capabilities-overview th.check-column {
141 padding: 10px 0 0 3px;
142 }
143 .groups-overview th.edit,
144 .groups-overview th.group_id,
145 .groups-overview th.remove,
146 .capabilities-overview th.capability_id,
147 .capabilities-overview th.edit,
148 .capabilities-overview th.remove {
149 width: 10%;
150 }
151
152 .groups-overview td.capabilities,
153 .capabilities-overview td.capability {
154 text-overflow: ellipsis;
155 }
156
157 .groups-overview td.capabilities ul {
158 margin: 0;
159 }
160
161 .groups-overview td.capabilities span.inherited {
162 font-style: italic;
163 }
164
165 .manage-groups .required,
166 .manage-capabilities .required {
167 background: url(../images/required.png) transparent no-repeat left center;
168 padding-left: 16px ! important;
169 }
170 .groups-footer {
171 padding-top: 16px;
172 color: #999;
173 }
174 .groups-footer a {
175 color: #777;
176 text-decoration: none;
177 font-weight: bold;
178 }
179 .groups-footer form {
180 display: inline;
181 }
182
183 .groups-options input[type="checkbox"] {
184 margin-right: 4px;
185 }
186 .groups-options .groups-permissions thead td {
187 padding: 0 4px;
188 font-weight: bold;
189 margin: 0;
190 }
191 .groups-options .groups-permissions td.checkbox {
192 text-align: center;
193 }
194 .info {
195 background-color: #eec;
196 border: 1px solid #cca;
197 border-radius: 4px;
198 margin: 1em;
199 padding: 1em;
200 }
201
202 #groups-extensions-box {
203 position: relative;
204 float: right;
205 padding: 1em;
206 margin: 1em;
207 background-color: #fff;
208 border-radius: 4px;
209 color: #111;
210 border: 1px solid #999;
211 width: 256px;
212 }
213 #groups-extensions-box h3 {
214 margin: 0.62em 0;
215 }
216 #groups-extensions-box h3::after {
217 content: "\f487";
218 background: transparent;
219 color: #f33;
220 display: inline-block;
221 font: normal 18px dashicons;
222 vertical-align: middle;
223 text-align: center;
224 transform: rotate(21deg);
225 position: relative;
226 top: -4px;
227 left: 4px;
228 }
229 #groups-extensions-box p {
230 margin: 0.31em 0;
231 }
232 #groups-extensions-box a.close {
233 color: #999;
234 line-height: 18px;
235 position: absolute;
236 right: 4px;
237 text-decoration: none;
238 top: 4px;
239 font-family: sans;
240 font-size: 12px;
241 }
242 #groups-extensions-box a.close::before {
243 background: transparent;
244 color: #ddd;
245 content: "\f153";
246 display: inline-block;
247 font: normal 16px/20px dashicons;
248 height: 20px;
249 text-align: center;
250 width: 20px;
251 position: relative;
252 top: 4px;
253 right: 4px;
254 transition: all .62s ease-in-out;
255 }
256 #groups-extensions-box a.close:hover::before {
257 color: #f00;
258 }
259
260 .groups-bitcoin-box {
261 padding: 1em;
262 margin: 1em;
263 background-color: #fff;
264 border-radius: 4px;
265 color: #111;
266 border: 1px solid #999;
267 width: 256px;
268 }
269 .groups-bitcoin-box.options {
270 position: relative;
271 float: right;
272 }
273 .groups-bitcoin-box-inside {
274 display: flex;
275 flex-direction: column;
276 text-align: center;
277 }
278
279 .groups-bitcoin-box span {
280 margin: 0.31em 0;
281 flex-grow: 1;
282 text-align: center;
283 }
284 .groups-bitcoin-box .groups-bitcoin-cta {
285 font-weight: bold;
286 padding-bottom: 16px;
287 }
288 .groups-bitcoin-box .groups-bitcoin-image img {
289 width: 100%;
290 }
291 .groups-bitcoin-box.small .groups-bitcoin-image img {
292 width: 128px;
293 }
294 .groups-bitcoin-box .groups-bitcoin-description {
295 padding-top: 12px;
296 }
297 .groups-bitcoin-box .groups-bitcoin-description .groups-bitcoin-address {
298 word-wrap: anywhere;
299 vertical-align: middle;
300 font-weight: bold;
301 }
302 .groups-bitcoin-box .groups-bitcoin-description .dashicons.dashicons-admin-page {
303 opacity: 0.42;
304 vertical-align: middle;
305 }
306
307 .groups-bitcoin-box.horizontal {
308 flex: auto;
309 max-width: 384px;
310 min-width: 256px;
311 width: auto;
312 padding: 8px;
313 margin: 8px;
314 }
315 .groups-bitcoin-box.horizontal .groups-bitcoin-box-inside {
316 display: grid;
317 grid-template-rows: 25% 75%;
318 grid-template-columns: 35% 65%;
319 }
320 .groups-bitcoin-box.horizontal .groups-bitcoin-cta {
321 grid-column-start: 2;
322 grid-row-start: 1;
323 padding: 4px;
324 }
325 .groups-bitcoin-box.horizontal .groups-bitcoin-image {
326 grid-row-start: 1;
327 grid-column-start: 1;
328 grid-row-end: span 2;
329 }
330 .groups-bitcoin-box.horizontal .groups-bitcoin-image img {
331 width: 128px;
332 }
333 .groups-bitcoin-box.horizontal .groups-bitcoin-description {
334 grid-row-start: 2;
335 grid-column-start: 2;
336 padding: 4px;
337 }
338
339 .groups-bitcoin-box a.close {
340 color: #999;
341 line-height: 18px;
342 position: absolute;
343 right: 4px;
344 text-decoration: none;
345 top: 4px;
346 font-family: sans;
347 font-size: 12px;
348 }
349 .groups-bitcoin-box a.close::before {
350 background: transparent;
351 color: #ddd;
352 content: "\f153";
353 display: inline-block;
354 font: normal 16px/20px dashicons;
355 height: 20px;
356 text-align: center;
357 width: 20px;
358 position: relative;
359 top: 4px;
360 right: 4px;
361 transition: all .62s ease-in-out;
362 }
363 .groups-bitcoin-box a.close:hover::before {
364 color: #f00;
365 }
366
367 #groups-extensions-support {
368 padding: 1em;
369 margin: 0 0 24px 0;
370 background-color: #fff;
371 border-radius: 4px;
372 color: #111;
373 border: 2px solid #7494d1;
374 display: flex;
375 flex-direction: row;
376 flex-wrap: wrap;
377 justify-content: space-around;
378 }
379 #groups-extensions-support p {
380 font-size: 14px;
381 color: #333;
382 }
383 #groups-extensions-support h2::after {
384 content: "\f487";
385 background: transparent;
386 color: #f33;
387 display: inline-block;
388 font: normal 18px dashicons;
389 vertical-align: middle;
390 text-align: center;
391 transform: rotate(21deg);
392 position: relative;
393 top: -4px;
394 left: 4px;
395 }
396 #groups-extensions-support-inside {
397 flex: 1;
398 min-width: 256px;
399 }
400 .groups-bulk-container {
401 padding-bottom: 1em;
402 }
403 .groups-bulk-container,
404 .capabilities-bulk-container,
405 .tablenav .tablenav-pages {
406 line-height: 24px;
407 }
408 .groups-bulk-container .capabilities-select-container {
409 width: 25%;
410 float: left;
411 vertical-align: middle;
412 }
413 .groups-bulk-container .selectize-control,
414 .groups-bulk-container select.bulk-action,
415 .capabilities-bulk-container select.bulk-action {
416 margin-right: 4px;
417 vertical-align: middle;
418 }
419 .groups-bulk-container .selectize-input {
420 font-size: inherit;
421 line-height: 18px;
422 padding: 0 4px;
423 vertical-align: middle;
424 }
425 .groups-bulk-container .selectize-input input[type="text"],
426 .groups-bulk-container .selectize-input input[type="select-multiple"],
427 .groups-groups-container .selectize-input input[type="select-multiple"] {
428 font-size: inherit;
429 vertical-align: middle;
430 height: 28px;
431 line-height: 28px;
432 }
433 .groups-bulk-container .button,
434 .capabilities-bulk-container .button {
435 vertical-align: middle;
436 }
437
438 .group.new .selectize-control,
439 .group.edit .selectize-control,
440 .groups-options .selectize-control {
441 padding: 2px;
442 }
443 .group.new .selectize-input,
444 .group.edit .selectize-input,
445 .groups-options .selectize-input {
446 font-size: inherit;
447 line-height: 18px;
448 padding: 2px;
449 }
450
451 .groups.messages {
452 padding: 1em 0;
453 }
454
455 @media screen and ( max-width: 782px ) {
456 .groups-bulk-container .selectize-input {
457 padding: 2px;
458 }
459 .groups-bulk-container .selectize-input .item,
460 .groups-bulk-container .selectize-dropdown-content .option {
461 font-size: 16px;
462 }
463 .groups-bulk-container .selectize-input input[type="text"] {
464 height: 32px;
465 font-size: 16px;
466 }
467 }
468
469 .groups-admin-add-ons {
470 margin: 24px 24px 0 2px;
471 }
472 .groups-admin-add-ons ul.add-ons {
473 list-style: none;
474 display: flex;
475 flex-wrap: wrap;
476 padding: 0;
477 overflow: hidden;
478 }
479 .groups-admin-add-ons ul.add-ons li.add-on {
480 margin: 0 1em 1em 0;
481 padding: 16px;
482 vertical-align: top;
483 width: 256px;
484 min-height: 158px;
485 background-color: #fff;
486 border: 1px solid #ccc;
487 border-radius: 3px;
488 flex: 1 1 22%;
489 max-width: 384px;
490 }
491 .groups-admin-add-ons ul.woocommerce.add-ons li.add-on p {
492 font-size: 15px;
493 }
494 .groups-admin-add-ons ul.woocommerce.add-ons li.add-on h3 {
495 font-size: 18px;
496 font-weight: 600;
497 }
498 .groups-admin-add-ons ul.groups.add-ons li.add-on,
499 .groups-admin-add-ons ul.other.add-ons li.add-on {
500 max-width: 256px;
501 min-height: 128px;
502 }
503 .groups-admin-add-ons .add-ons h3 {
504 margin: 0;
505 display: flex;
506 align-items: center;
507 justify-content: left;
508 }
509 .groups-admin-add-ons h3.woocommerce {
510 font-size: 18px;
511 }
512 .groups-admin-add-ons .add-ons h3 img {
513 vertical-align: middle;
514 height: 36px;
515 margin: 0 8px 0 0;
516 border-radius: 3px;
517 }
518 .groups-admin-add-ons .woocommerce.add-ons h3 img {
519 width: 48px;
520 height: auto;
521 }
522 .groups-admin-add-ons .add-ons a {
523 text-decoration: none;
524 display: block;
525 overflow: hidden;
526 }
527 .groups-admin-add-ons .add-ons p {
528 margin: 0;
529 padding-top: 8px;
530 clear: both;
531 display: block;
532 color: #333;
533 font-size: 14px;
534 }
535
536 .groups-admin-add-ons .woocommerce-marketplace {
537 margin: 0 0 2em 0;
538 padding: 8px;
539 background-color: #fff;
540 border: 1px solid #ccc;
541 display: inline-block;
542 }
543
544 .groups-welcome-panel {
545 position: relative;
546 overflow: auto;
547 margin: 1em;
548 padding: 1em;
549 border: 1px solid #e5e5e5;
550 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
551 box-shadow: 0 1px 1px rgba(0,0,0,0.04);
552 background: #fff;
553 font-size: 14px;
554 line-height: 2.1em;
555 }
556 .groups-welcome-panel h2 {
557 margin: 1.62em 0 0 0;
558 font-size: 21px;
559 font-weight: 600;
560 line-height: 1.2;
561 }
562 .groups-welcome-panel h3 {
563 margin: 1.33em 0 0;
564 font-weight: 500;
565 font-size: 17px;
566 }
567 .groups-welcome-panel li {
568 font-size: 14px;
569 }
570 .groups-welcome-panel p {
571 color: #72777c;
572 font-size: 15px;
573 line-height: 1.6em;
574 margin: 1em 0;
575 }
576 .groups-welcome-panel-description p {
577 font-size: 16px;
578 }
579 .groups-welcome-panel a {
580 text-decoration: none;
581 }
582 .groups-welcome-panel .headline {
583 font-size: 17px;
584 margin: 1em 0 1.62em 0;
585 }
586
587 .groups-welcome-panel-content {
588 margin-left: 13px;
589 max-width: 1500px;
590 }
591 .groups-welcome-icon {
592 float: right;
593 margin: 0 0.62em 0.62em 0.62em;
594 }
595 .groups-welcome-panel .important {
596 border: 1px solid #e5e5e5;
597 border-left: 2px solid #ffcc00;
598 padding: 1em;
599 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
600 box-shadow: 0 1px 1px rgba(0,0,0,0.04);
601 }
602 .groups-welcome-panel .indent {
603 border: 1px solid #e5e5e5;
604 padding: 0 0.62em;
605 }
606
607 ul.groups-group-bulk-remove,
608 ul.groups-capability-bulk-remove {
609 list-style: disc inside;
610 }
611
612 ul.groups-tree {
613 list-style: inside;
614 }
615 li.groups-tree-node {
616 padding-left: 1em;
617 }
618