PluginProbe
CookieAdmin – Cookie Consent Banner / 1.1.5
CookieAdmin – Cookie Consent Banner v1.1.5
1.2.3 1.2.2 1.2.1 1.2.0 1.1.9 trunk 1.0.2 1.0.3 1.0.4 1.0.5 1.0.6 1.0.7 1.0.8 1.0.9 1.1.0 1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.6 1.1.7 1.1.8
cookieadmin / assets / css / cookie.css

cookie.css in CookieAdmin – Cookie Consent Banner 1.1.5, at assets/css/cookie.css

792 lines 12.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 :root {
2 --cookieadmin-primary-color: #001d39;
3 --cookieadmin-primary-hover-color: #985e23;
4
5 --cookieadmin-secondary-color: #0046b2;
6 --cookieadmin-secondary-hover-color: #0065ff;
7
8 --cookieadmin-txcolor: #0f172a;
9
10 --cookieadmin-green-txtcolor: #3a8356;
11 --cookieadmin-warning-txtcolor: #9c7930;
12 --cookieadmin-red-txtcolor: #b55355;
13
14 --cookieadmin-green-color: #15a448;
15 --cookieadmin-warning-color: #e9b306;
16 --cookieadmin-red-color: #dd2727;
17 }
18
19 /* Header */
20 .cookieadmin-metabox-holder{
21 background-color: #ffffff;
22 padding: 10px;
23 margin-top:20px;
24 min-height: 90vh;
25 display: flex;
26 flex-direction: column;
27 }
28
29 /* Footer */
30 .cookieadmin-twitter{
31 border: 1px solid #E2E8F0;
32 padding: 10px;
33 border-radius: 1px;
34 width:40%;
35 background:#FFF;
36 padding:15px;
37 margin:auto;
38 }
39
40 .cookieadmin-footer{
41 padding: 10px;
42 }
43
44 .cookieadmin-twitter > span{
45 font-size:16px;
46 font-weight:600;
47 }
48
49 .cookieadmin-twitter > input{
50 margin-top:10px;
51 float:right;
52 }
53
54 /* Buttons */
55 .cookieadmin-btn{
56 display: inline-flex;
57 outline: 0;
58 text-align: center;
59 cursor: pointer;
60 padding: 6px 10px;
61 border-radius: 3px;
62 border: 1px solid transparent;
63 transition: background .3s ease, border-color .3s ease;
64 font-weight: 600;
65 font-size: 13px !important;
66 text-decoration: none;
67 }
68
69 .cookieadmin-btn-primary{
70 background: var(--cookieadmin-primary-color);
71 border-color: var(--cookieadmin-primary-color);
72 color: #fff;
73 }
74
75 .cookieadmin-btn-primary:hover{
76 background: var(--cookieadmin-primary-hover-color);
77 border-color: var(--cookieadmin-primary-hover-color);
78 }
79
80 .cookieadmin-btn-secondary{
81 background: var(--cookieadmin-secondary-color);
82 border-color: var(--cookieadmin-secondary-color);
83 color: #fff;
84 }
85
86 .cookieadmin-btn-secondary:hover{
87 background: var(--cookieadmin-secondary-hover-color);
88 border-color: var(--cookieadmin-secondary-hover-color);
89 }
90
91 .cookieadmin-btn-transparent{
92 background-color:transparent;
93 color: currentcolor;
94 }
95
96 .cookieadmin-btn-transparent:active{
97 outline:0;
98 }
99
100 /* Buttons End */
101
102 /* Dashboard Overview page css */
103
104 .cookieadmin-postbox-container{
105 flex:1;
106 }
107
108 .cookieadmin-postbox-container h2{
109 display: flex;
110 align-items: center;
111 gap:10px;
112 padding: 0 0 15px 0;
113 border-bottom: 1px solid #e0e0e0;
114 font-size:1.3rem;
115 line-height:2rem;
116 }
117
118 .cookieadmin-uppercase{
119 text-transform: uppercase;
120 }
121
122 .cookieadmin-admin-row{
123 display:flex;
124 gap: 10px;
125 margin-bottom: 20px;
126 }
127
128 .cookieadmin-admin-row .cookieadmin-is-block{
129 border: 1px solid #E2E8F0;
130 padding: 10px;
131 width: 100%;
132 border-radius:1px;
133 }
134
135 .cookieadmin-admin-row .cookieadmin-is-block-25{
136 border: 1px solid #E2E8F0;
137 padding: 10px;
138 width: 25%;
139 border-radius:1px;
140 }
141
142 .cookieadmin-stats-name{
143 margin-bottom:5px;
144 font-size:16px;
145 font-weight:600;
146 }
147
148 .cookieadmin-stat-status-indicator{
149 border-radius:50%;
150 width: 12px;
151 height:12px;
152 background-color: #e2e2e2;
153 margin-right: 10px;
154 }
155
156 .cookieadmin-stats-number{
157 font-size:1.5rem;
158 line-height:2.5rem;
159 }
160
161 .cookieadmin-block-link{
162 display:inline-flex;
163 font-size: 12px;
164 font-weight:400;
165 color: blue;
166 cursor:pointer;
167 }
168
169 .cookieadmin-block-link > a{
170 text-decoration:none;
171 }
172
173 .cookieadmin-green{
174 color: var(--cookieadmin-green-color);
175 }
176
177 .cookieadmin-red{
178 color: var(--cookieadmin-red-color);
179 }
180
181 .cookieadmin_view_column {
182 float: left;
183 width: 25%;
184 padding: 0 15px;
185 box-sizing: border-box;
186 }
187
188 /* Clear floats after the columns */
189 .cookieadmin_view_row:after {
190 content: "";
191 display: table;
192 clear: both;
193 }
194
195 .cookieadmin_view_row{
196 margin: 15px 0px;
197 }
198
199 /* Style the counter cards */
200 .cookieadmin_card {
201 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
202 text-align: center;
203 background-color: #9ec1c0;
204 color: white;
205 font-family: Arial, Helvetica, sans-serif;
206 margin: 5px;
207 min-width: 220px;
208 }
209
210 .cookieadmin_view_icon {font-size:50px;}
211
212 /* Dashboard Overview page css End */
213
214
215 /* Consent page css */
216
217 .cookieadmin-postbox-container {
218 max-width: 92vw;
219 float: unset;
220 margin: 10px;
221 }
222
223 .cookieadmin-metabox-holder label, .cookieadmin-metabox-holder input {
224 padding: 5px;
225 margin-right: 5px;
226 font-size: 15px;
227 }
228
229 .cookieadmin-metabox-holder label{
230 font-weight: 501;
231 }
232
233 .cookieadmin_hide{
234 display:none;
235 }
236
237 .cookieadmin_title{
238 text-align: center;
239 color: black;
240 font-weight: 600;
241 font-size: 20px;
242 margin: 2px;
243 }
244
245 .cookieadmin_consent-contents {
246 display: flex;
247 margin: 0px 5px;
248 }
249
250 .cookieadmin_consent_settings {
251 display: flex;
252 width: 100%;
253 flex-direction: column;
254 background: #ffffff;
255 /*margin-left: -3px;*/
256 }
257
258 .cookieadmin_law {
259 padding: 20px;
260 background: aliceblue;
261 margin: 10px;
262 height: fit-content;
263 font-size: 14px;
264 font-family: sans-serif;
265 }
266
267 .cookieadmin-contents {
268 width: 100%;
269 }
270
271 .cookieadmin-setting {
272 display: flex;
273 padding: 6px 0px;
274 justify-content: flex-start;
275 }
276
277 .cookieadmin-setting-head {
278 width: 100%;
279 padding: 5px;
280 align-content: center;
281 }
282
283 .cookieadmin-setting-contents {
284 align-items: baseline;
285 padding: 5px;
286 margin: 5px;
287 }
288
289 .cookieadmin-setting-results {
290 align-items: baseline;
291 padding: 5px;
292 margin: 5px;
293 width: 80%;
294 }
295
296 .cookieadmin-metabox-holder input[type="color"] {
297 border: 0px;
298 padding: 0px;
299 margin: 0px;
300 }
301
302 .cookieadmin-color-holder{
303 max-width: 110px;
304 }
305
306 .cookieadmin-title {
307 font-size:16px;
308 font-weight:600;
309 padding: 10px;
310 margin: 5px;
311 min-width: 15%;
312 cursor:pointer;
313 }
314
315 .cookieadmin-desc {
316 font-size:14px;
317 padding: 0 0 0 10px;
318 }
319
320 .cookieadmin-color-input{
321 border: 1px solid;
322 margin: 0px;
323 margin-left: -8px;
324 max-width: 75%;
325 padding: 0 8px !important;
326 }
327
328 .cookieadmin-vertical{
329 display: flex;
330 flex-direction: column;
331 margin: 2px 30px 2px 0px;
332 }
333
334 .cookieadmin-horizontal{
335 display: flex;
336 flex-direction: row;
337 align-items: center;
338 }
339
340 .cookieadmin-input{
341 padding-right: 20px;
342 }
343
344 .cookieadmin-collapsible-notice{
345 padding: 8px;
346 background-color: #ffffc6;
347 font-size: 14px;
348 border-radius: 4px;
349 max-width: fit-content;
350 margin: auto;
351 }
352
353 .cookieadmin-collapsible-notice:before{
354 content: "\1F6C8 ";
355 }
356
357 .cookieadmin-policy-gens{
358 justify-content: space-evenly;
359 }
360
361 .cookieadmin-cookie-scan, .cookieadmin-consent-logs{
362 justify-content: end;
363 }
364
365 .cookieadmin-cookie-scan{
366 display: flex;
367 flex-direction: row;
368 }
369
370 .cookieadmin-setting-colors{
371 justify-content: space-between;
372 }
373
374 .cookieadmin-buttons{
375 flex: auto;
376 justify-content: space-between;
377 margin: 5px;
378 }
379
380 .cookieadmin-button{
381 padding: 5px;
382 row-gap: 5px;
383 }
384
385 .cookieadmin-button-color{
386 justify-content: space-between;
387 min-width: 34%;
388 }
389
390
391 /* Dashboard Consent page css End*/
392
393
394 /* Website consent box */
395
396
397
398
399
400
401
402
403
404 .cookieadmin_btn-primary {
405 background-color: #007cba;
406 color: white;
407 border-color: #007cba;
408 }
409
410 .cookieadmin_btn-secondary {
411 background-color: #f6f7f7;
412 color: #007cba;
413 border-color: #007cba;
414 }
415
416 .cookieadmin_btn_accept{
417 color: #ffffff;
418 background-color: #1863dc;
419 border-color: rgb(24, 99, 220);
420 }
421
422 .cookieadmin_pl0{
423 padding-left:0px;
424 }
425
426
427 .cookieadmin-manager-cookie-scan, .cookieadmin-manager-consent-logs, .cookieadmin-manager-cookie-categorize{
428 flex-wrap: wrap;
429 justify-content: space-between;
430 }
431
432 .cookieadmin-manager-result{
433 padding: 10px;
434 width: 100%;
435 }
436
437 .cookieadmin-consent-logs-pagination{
438 padding: 15px;
439 margin: 5px;
440 width: 100%;
441 }
442
443 .cookieadmin-logs-paginate{
444 font-size: 2em;
445 text-decoration:none;
446 }
447
448 .cookieadmin-icon{
449 height: 60px;
450 display: inline-block;
451 }
452
453 .cookieadmin-logo{
454 width: 250px;
455 display: inline-block;
456 }
457
458
459 .cookieadmin-tag.active {
460 background: #000;
461 color: #fff;
462 }
463
464 .cookieadmin_edit_icon, .cookieadmin_delete_icon{
465 margin: 2px;
466 }
467
468 .cookieadmin_edit_icon:hover {
469 color : blue !important;
470 font-size: 22px !important;
471 }
472
473 .cookieadmin_delete_icon:hover {
474 color : red !important;
475 font-size: 22px;
476 }
477
478 /* Website consent box End*/
479
480
481
482
483 /* --- Modal Styles Start --- */
484
485 /* The Admin Edit/Add Cookie Modal Overlay/Backdrop */
486 .cookieadmin_modal-overlay {
487 position: fixed;
488 top: 0;
489 left: 0;
490 width: 100%;
491 height: 100%;
492 background-color: rgba(0, 0, 0, 0.6);
493 display: none; /* Initially hidden */
494 justify-content: center;
495 align-items: center;
496 z-index: 1000;
497 }
498
499 /* The Modal Container */
500 .cookieadmin_modal-container {
501 background-color: #ffffff;
502 border-radius: 4px;
503 width: 100%;
504 max-width: 600px;
505 box-shadow: 0 5px 15px rgba(0,0,0,0.3);
506 display: flex;
507 flex-direction: column;
508 overflow: hidden;
509 }
510
511 /* When the modal is active */
512 .cookieadmin_modal-overlay.active {
513 display: flex;
514 }
515
516 /* Modal Header */
517 .cookieadmin_modal-header {
518 display: flex;
519 justify-content: space-between;
520 align-items: center;
521 padding: 16px 24px;
522 border-bottom: 1px solid #e0e0e0;
523 }
524
525 .cookieadmin_modal-header h2 {
526 margin: 0;
527 font-size: 1.25rem;
528 font-weight: 600;
529 color: #1d2327;
530 }
531
532 .cookieadmin_modal-close-btn {
533 background: none;
534 border: none;
535 font-size: 1.5rem;
536 cursor: pointer;
537 color: #50575e;
538 }
539
540 /* Modal Body (the form) */
541 .cookieadmin_modal-body {
542 padding: 24px;
543 }
544
545 .cookieadmin_form-group {
546 margin-bottom: 20px;
547 display: grid;
548 grid-template-columns: 120px 1fr; /* Label and Input alignment */
549 align-items: center;
550 gap: 16px;
551 }
552
553 .cookieadmin_form-group label {
554 font-weight: 500;
555 color: #1d2327;
556 }
557
558 .cookieadmin_form-group input,
559 .cookieadmin_form-group select,
560 .cookieadmin_form-group textarea {
561 width: 95%;
562 padding: 8px 12px;
563 border: 1px solid #8c8f94;
564 border-radius: 4px;
565 font-size: 14px;
566 box-sizing: border-box; /* Important for padding and width */
567 }
568
569 .cookieadmin_form-group textarea {
570 min-height: 120px;
571 resize: vertical;
572 align-self: flex-start; /* Align textarea with top of label */
573 }
574
575 /* Modal Footer */
576 .cookieadmin_modal-footer {
577 display: flex;
578 justify-content: flex-end;
579 padding: 16px 24px;
580 border-top: 1px solid #e0e0e0;
581 background-color: #f6f7f7;
582 }
583
584 /* --- Modal Styles End --- */
585
586 /* Table */
587
588 .cookieadmin-table{
589 padding: 2px;
590 font-size: 14px;
591 text-align: left;
592 width: 100%;
593 table-layout: fixed;
594 word-wrap: anywhere;
595 border-collapse: collapse;
596 border-spacing: 0;
597 }
598
599 .cookieadmin-table tbody{
600 border-radius: 8px;
601 overflow: hidden;
602 display: table-row-group;
603 border: 1px solid #ddd;
604 }
605
606 table.cookieadmin-table thead{
607 background-color: #263544;
608 color: #ffffff;
609 font-weight: 500 !important;
610 padding: 0px;
611 border: 1px solid #ddd;
612 }
613
614 table.cookieadmin-table th{
615 padding: 10px 10px;
616 }
617
618 table.cookieadmin-table td{
619 background: white;
620 padding: 10px;
621 border-bottom: 1px solid #ddd;
622 line-height: 1.5;
623 }
624
625 /* Table End */
626
627 /* Badges End */
628
629 .cookieadmin-badge{
630 display: inline-block;
631 padding: 3px 10px 5px 10px;
632 font-size: 14px;
633 font-weight: 600;
634 line-height: 1.1;
635 border-radius: 1rem;
636 color: #000;
637 border: 1px solid #000;
638 background-color: #fff;
639 }
640
641 .cookieadmin-success{
642 color: #06923E;
643 border: 1px solid #16C47F;
644 background-color: #eefef4;
645 }
646
647 .cookieadmin-warning{
648 color: #b49046;
649 border: 1px solid #b49046;
650 background-color: #fffbe8;
651 }
652
653 .cookieadmin-danger{
654 color: #ED3500;
655 border: 1px solid #E55050;
656 background-color: #fef2f2;
657 }
658
659 .cookieadmin-info{
660 color: #4682A9;
661 border: 1px solid #5EABD6;
662 background-color: #f0fbff;
663 }
664
665 /* Badges End */
666
667 .cookieadmin-cookie-categorized tbody > tr:first-child td::before {
668 content: "";
669 position: relative;
670 float: right;
671 font-size: 17px;
672 }
673
674 .cookieadmin-cookie-categorized tbody:not(:last-of-type)::after {
675 content: "";
676 display: table-row;
677 height: 30px; /* This is your gap */
678 }
679
680 .cookieadmin-cookie-categorized tbody > tr:first-child td {
681 font-weight: bold !important;
682 padding: 15px !important;
683 cursor: pointer;
684 background: #EFEFEF !important;
685 }
686
687 .cookieadmin-cookie-categorized tbody:is(.collapsed) > tr:first-child td::before {
688 transform: rotate(90deg); /* expanded */
689 }
690
691 .cookieadmin-empty-row td {
692 text-align: center;
693 font-style: italic;
694 background-color: #f5f5f5;
695 opacity: 0.8;
696 pointer-events: none; /* feels disabled */
697 }
698
699 .cookieadmin_dialog_modal_close_btn{
700 background: none;
701 border: none;
702 padding: 0;
703 margin: 0;
704 font: inherit;
705 color: inherit;
706 cursor: pointer;
707 font-size: 24px;
708 font-weight: bold;
709 }
710
711 /* Dialog success/failure messages */
712
713 #cookieadmin-message{
714 margin-right: 10px;
715 font-weight: 500;
716 padding: 5px;
717 }
718
719 .cookieadmin-success-message {
720 color: #22c55e;
721 }
722
723 .cookieadmin-error-message {
724 color: #dc2626;
725 }
726
727 /* --- Auto Categorize Cookies End --- */
728
729
730
731 /* --- Override Dashicons Start --- */
732 .cookieadmin-metabox-holder .dashicons {
733 cursor: pointer;
734 }
735 /* --- Override Dashicons End --- */
736
737
738
739 /* CookieAdmin Tooltip Start */
740
741 .cookieadmin-tooltip {
742 position: fixed;
743 background: #5d5d5d;
744 color: #fff;
745 padding: 6px 10px;
746 border-radius: 4px;
747 font-size: 12px;
748 white-space: nowrap;
749 pointer-events: none;
750 z-index: 999999;
751 opacity: 0;
752 transition: opacity 0.12s ease;
753 }
754
755
756 /* CookieAdmin Tooltip End */
757
758
759 .cookieadmin-buttons-div {
760 display: flex;
761 flex-direction: row;
762 }
763
764 .cookieadmin-add-cookie-div {
765 border-right: 1px solid #e0e0e0;
766 padding-right: 10px;
767 }
768
769 /* Consent Expiry */
770 #cookieadmin_consent_logs_expiry_days {
771 width: 50px;
772 text-align: center;
773 margin: 0px 10px;
774 padding: 0px;
775 height: 30px;
776 }
777
778 .cookieadmin-purge-consent-btn{
779 background-color: #dc3545 !important;
780 color: white !important;
781 border-color: unset !important;
782 }
783
784 .cookieadmin-setting-logs{
785 display: flex;
786 align-items: center;
787 }
788
789 .cookieadmin-save-settings{
790 border-top: 1px solid #e0e0e0;
791 margin-bottom: 15vh;
792 }