PluginProbe ʕ •ᴥ•ʔ
GPTranslate – Multilingual AI Translation for WordPress: Automatically Translate Websites / 2.25
GPTranslate – Multilingual AI Translation for WordPress: Automatically Translate Websites v2.25
2.33.7 2.33.6 2.33.5 2.33.2 2.32.10 2.33 2.33.1 2.32.6 2.32.7 2.32.8 trunk 2.10.3 2.10.4 2.10.5 2.10.6 2.11 2.12 2.13 2.14 2.14.1 2.15 2.15.1 2.16.1 2.16.2 2.17 2.18 2.18.1 2.18.2 2.19 2.20 2.21 2.22 2.23 2.24 2.25 2.25.1 2.25.2 2.26 2.27 2.27.10 2.27.5 2.28 2.28.1 2.29 2.30 2.31 2.32 2.32.5
gptranslate / assets / css / admin.css
gptranslate / assets / css Last commit date
admin.css 5 months ago bootstrap.min.css 5 months ago crawler.css 5 months ago select2.min.css 5 months ago
admin.css
803 lines
1 #wpbody-content > h1 {
2 color: #1d2327;
3 font-size: 2em;
4 margin: 0;
5 margin-left: -20px;
6 background: #FFF;
7 padding: 20px;
8 border: 1px solid #c3c4c7;
9 }
10
11 div.notice {
12 margin: 5px 20px 5px 0;
13 }
14
15 h2.nav-tab-wrapper {
16 margin-top: 20px;
17 }
18
19 img.gptranslate-plugin-icon {
20 width: 64px;
21 height: 64px;
22 }
23
24 /* Labels */
25 .gpt-label {
26 display: inline-block;
27 padding: 2px 8px;
28 font-size: 1em;
29 font-weight: 600;
30 color: #fff;
31 background-color: #0073aa; /* WordPress blue */
32 border-radius: 12px;
33 vertical-align: middle;
34 white-space: nowrap;
35 }
36
37 /* Success label */
38 .gpt-label-success {
39 background-color: #46b450;
40 }
41
42 /* Danger label */
43 .gpt-label-danger {
44 background-color: #dc3232;
45 }
46
47 /* Warning label */
48 .gpt-label-warning {
49 background-color: #ffb900;
50 color: #000;
51 }
52
53 /* Buttons */
54 .gpt-button {
55 display: inline-block;
56 padding: 6px 12px;
57 font-size: 14px;
58 font-weight: 600;
59 color: #fff;
60 background-color: #0073aa;
61 border: none;
62 border-radius: 2px;
63 cursor: pointer;
64 text-decoration: none;
65 transition: background-color 0.2s;
66 }
67
68 .gpt-button:hover {
69 background-color: #006799;
70 text-decoration: none;
71 }
72
73 /* Button variants */
74 .gpt-button-danger {
75 background-color: #dc3232;
76 }
77
78 .gpt-button-danger:hover {
79 background-color: #b81b1b;
80 }
81
82 .gpt-button-success {
83 background-color: #46b450;
84 }
85
86 .gpt-button-success:hover {
87 background-color: #3ea145;
88 }
89
90 /* Table styling */
91 .gpt-table {
92 width: 100%;
93 border-collapse: collapse;
94 margin-bottom: 20px;
95 }
96
97 .gpt-table th, .gpt-table td {
98 padding: 8px 10px;
99 border: 1px solid #ccc;
100 text-align: left;
101 }
102
103 .gpt-table th {
104 background-color: #f9f9f9;
105 font-weight: 600;
106 }
107
108 .form-table th {
109 vertical-align: top;
110 text-align: left;
111 padding: 20px 10px 10px 10px;
112 width: 200px;
113 line-height: 1.3;
114 font-weight: 600;
115 border-left: 1px solid #2271b1;
116 border-left-width: 4px;
117 box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
118 }
119
120 .form-table td {
121 box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
122 }
123
124 /* Edit record translation */
125 #wpfooter {
126 display: none !important;
127 }
128
129 input[name=pagelink], input[name=translated_alias], div.gptcard {
130 width: 60%;
131 }
132
133 @media ( max-width : 1024px) {
134 input[name=pagelink], div.gptcard {
135 width: 100%;
136 }
137 }
138
139 div.accordion-body {
140 max-height: 800px;
141 overflow: auto;
142 }
143
144 /* Search */
145 div.gptcard-header button, div.gptcard-header input {
146 font-weight: normal;
147 }
148
149 input[name=search] {
150 width: 50%;
151 }
152
153 /* Container */
154 form.form-filter-container {
155 display: flex;
156 justify-content: space-between;
157 margin-bottom: 10px;
158 position: relative;
159 }
160
161 div.right-filter-container input[type="submit"] {
162 margin: 0 1px;
163 }
164
165 .translations-container {
166 max-width: 100%;
167 padding: 1rem;
168 font-family: sans-serif;
169 }
170
171 *.doublesize-icon {
172 font-size: 18px;
173 font-weight: 700;
174 margin-left: 5px;
175 }
176
177 #search-input {
178 min-width: 300px;
179 margin-right: 2px;
180 }
181
182 #search-input+button,
183 #search-input+button+button {
184 margin-right: 2px;
185 }
186
187 /* Card */
188 .gptcard {
189 border: 1px solid #ddd;
190 border-radius: 6px;
191 margin-bottom: 1rem;
192 background-color: #fff;
193 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
194 }
195
196 /* Card header */
197 .gptcard-header {
198 background-color: #f5f5f5;
199 padding: 0.75rem 1rem;
200 border-bottom: 1px solid #ddd;
201 font-weight: bold;
202 }
203
204 /* Accordion toggle area */
205 .accordion-toggle {
206 display: flex;
207 align-items: center;
208 gap: 1rem;
209 }
210
211 /* Input group */
212 .input-group {
213 display: flex;
214 align-items: center;
215 gap: 0.5rem;
216 flex-wrap: nowrap;
217 width: 100%;
218 }
219
220 .input-group-text {
221 background-color: #e9ecef;
222 padding: 0.5rem 0.75rem;
223 border-radius: 4px;
224 font-size: 0.875rem;
225 }
226
227 #migraterow span.input-group label {
228 white-space: nowrap;
229 }
230
231 table.widefat input.form-check-input {
232 margin: 0;
233 }
234
235 /* Card body */
236 .gptcard-body {
237 padding: 1rem;
238 }
239
240 div.translation-row.translation-row-hidden {
241 display: none;
242 }
243
244 /* Buttons */
245 .btn {
246 display: inline-block;
247 padding: 0.375rem 0.75rem;
248 border-radius: 2px;
249 border: none;
250 font-size: 0.875rem;
251 cursor: pointer;
252 }
253
254 .btn-sm {
255 font-size: 0.75rem;
256 padding: 0.25rem 0.5rem;
257 }
258
259 .btn-primary {
260 background-color: #2271b1;
261 color: white;
262 }
263
264 .btn-success {
265 background-color: #198754;
266 color: white;
267 }
268
269 .btn-danger {
270 background-color: #dc3545;
271 color: white;
272 }
273
274 .btn-warning {
275 background-color: #ffc107;
276 color: black;
277 }
278
279 span.icon-refresh {
280 display: inline-block;
281 }
282
283 button.group-sync.btn-invisible {
284 display: none;
285 }
286
287 button.group-sync span.icon-refresh.icon-working {
288 animation: spin 2s infinite linear;
289 }
290
291 @keyframes spin {
292 0% {
293 transform: rotate(0deg);
294 }
295 100% {
296 transform: rotate(360deg);
297 }
298 }
299
300 /* Badges */
301 .badge {
302 display: inline-block;
303 padding: 0.35em 0.65em;
304 font-size: 1em;
305 font-weight: 600;
306 border-radius: 3px;
307 margin-bottom: 0.25rem;
308 }
309
310 /* Colori di stato */
311 .bg-primary {
312 background-color: #2271b1;
313 color: #FFFFFF;
314 }
315
316 .bg-success {
317 background-color: #28a745;
318 color: #FFFFFF;
319 }
320
321 .bg-danger {
322 background-color: #dc3545;
323 color: #FFFFFF;
324 }
325
326 .bg-warning {
327 background-color: #ffc107;
328 color: #212529;
329 }
330
331 .bg-info {
332 background-color: #17a2b8;
333 color: #FFFFFF;
334 }
335
336 /* Zero state */
337 .gptranslate-zero-state {
338 max-width: 720px;
339 margin: 80px auto;
340 padding: 40px;
341 background: #ffffff;
342 border-radius: 8px;
343 border: 1px solid #e5e5e5;
344 text-align: center;
345 }
346
347 .gptranslate-zero-title {
348 font-size: 24px;
349 font-weight: 600;
350 margin-bottom: 10px;
351 }
352
353 .gptranslate-zero-icon {
354 margin-bottom: 20px;
355 opacity: 0.9;
356 }
357
358 .gptranslate-zero-desc {
359 font-size: 15px;
360 color: #555;
361 margin-bottom: 30px;
362 }
363
364 .gptranslate-zero-hint {
365 margin-top: 20px;
366 font-size: 13px;
367 color: #777;
368 }
369
370 #gptranslate-start-crawler span.dashicons-before::before {
371 vertical-align: middle;
372 margin-right: 10px;
373 }
374
375 /* Textarea */
376 .translation-row textarea {
377 width: 198px;
378 height: 60px;
379 }
380
381 /* Translation row */
382 .translation-row {
383 padding-top: 1rem;
384 margin-top: 1rem;
385 display: flex;
386 align-items: center;
387 column-gap: 10px;
388 align-items: center;
389 position: relative;
390 }
391
392 .translation-row label.gpt-label.badge {
393 position: absolute;
394 right: 1px;
395 top: 0;
396 font-size: 12px;
397 }
398
399 /* Tooltips */
400 .custom-tooltip {
401 position: absolute;
402 top: 0;
403 left: 0;
404 z-index: 9999;
405 background: #333;
406 color: #fff;
407 padding: 6px 10px;
408 font-size: 0.85em;
409 border-radius: 4px;
410 max-width: 250px;
411 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
412 pointer-events: none;
413 opacity: 0;
414 transition: opacity 0.2s ease;
415 white-space: normal;
416 }
417
418 /* Settings with switchers */
419 a.nav-tab:focus {
420 box-shadow: none;
421 }
422
423 div.tab-content > p:first-child,
424 div.tab-content > p:last-child {
425 text-align: right;
426 margin-right: 20px;
427 }
428
429 #config-gptranslate table.form-table {
430 margin-top: -40px;
431 }
432
433 table.form-table th.settings-label-separator {
434 border: none;
435 background: #2271b1;
436 color: #FFF;
437 text-align: center;
438 padding: 0;
439 vertical-align: middle;
440 border-left: 4px solid #2271b1;
441 }
442
443 table.widefat.fixed.striped a:focus {
444 box-shadow: none;
445 }
446
447 table tr.alt_translations_0 {
448 display: none;
449 }
450
451 .toggle-import {
452 background: #FFF;
453 padding: 4px 5px;
454 }
455
456 .wp-admin input[type=file] {
457 border: 1px solid #CCC;
458 border-radius: 4px;
459 padding-left: 5px;
460 }
461
462 div.exportimportbtns {
463 display: flex;
464 justify-content: flex-end;
465 margin-top: -40px;
466 column-gap: 5px;
467 margin-right: 20px;
468 }
469
470 #add-repeatable-row {
471 float: right;
472 }
473
474 #bulk-delete-btn, #toggle-migration {
475 margin-right: 10px;
476 }
477
478 #migraterow {
479 width: 50%;
480 margin-bottom: 10px;
481 background: #FFF;
482 padding: 5px 10px;
483 border-radius: 4px;
484 }
485
486 #migraterow .input-group {
487 width: auto;
488 margin-right: 10px;
489 }
490
491 #migraterow .button {
492 margin-right: 5px;
493 }
494
495 /* Pagination */
496 .tablenav-pages {
497 margin-top: 20px;
498 }
499
500 .tablenav-pages .button {
501 margin-bottom: 4px !important;
502 margin-right: 5px;
503 padding: 5px 10px;
504 text-decoration: none;
505 }
506
507 .tablenav-pages .current-page {
508 font-weight: bold;
509 background-color: #0073aa;
510 color: #fff;
511 }
512
513 div.action-buttons-toolbar {
514 margin: 5px 0 10px;
515 }
516
517 input[name='import_file'] {
518 margin-left: 5px;
519 }
520
521 #translations_json {
522 display: none !important;
523 }
524
525 .wp-core-ui .button-warning,
526 .wp-core-ui .button-warning:focus,
527 .wp-core-ui .button-warning:active {
528 background: #f15116;
529 border-color: #d43900;
530 color: #fff;
531 }
532
533 .wp-core-ui .button-warning:hover {
534 background: #d43900;
535 border-color: #d43900;
536 color: #fff;
537 }
538
539 .wp-core-ui .button-warning.button-crawler {
540 position: absolute;
541 top: 40px;
542 right: 0;
543 box-shadow: none;
544 }
545
546 div.wrap:has(input.button-crawler) {
547 position: relative;
548 }
549
550 div.wrap:has(#notranslations-notice) .button-warning.button-crawler {
551 top: -60px;
552 }
553
554 @media (max-width: 782px) {
555 .wp-core-ui .button-warning.button-crawler {
556 top: 50px;
557 }
558 }
559
560 @media (max-width: 1280px) { body.toplevel_page_gptranslate, body.gptranslate_page_gptranslate-settings { min-width: 1280px; overflow-x: auto }}
561
562 /* GPTranslate iOS switch */
563 .wrapper {
564 position: relative;
565 display: inline-block;
566 width: 52px;
567 height: 28px;
568 vertical-align: middle;
569 cursor: pointer;
570 }
571
572 .wrapper input[type="radio"] {
573 position: absolute;
574 opacity: 0;
575 pointer-events: none;
576 }
577
578 .wrapper > label {
579 position: absolute;
580 top: 0;
581 left: 0;
582 height: 100%;
583 width: 50%;
584 cursor: pointer;
585 }
586 .wrapper > label:last-child {
587 left: 50%;
588 }
589
590 .wrapper > label > span {
591 position: absolute !important;
592 width: 1px;
593 height: 1px;
594 overflow: hidden;
595 clip: rect(1px,1px,1px,1px);
596 }
597
598 .wrapper::before {
599 content: "";
600 position: absolute;
601 inset: 0;
602 background: #bdbdbd;
603 border-radius: 999px;
604 transition: background-color 0.25s ease, box-shadow 0.25s ease;
605 box-shadow: inset 0 0 3px rgba(0,0,0,0.25);
606 pointer-events: none;
607 }
608
609 .wrapper::after {
610 position: absolute;
611 top: 3px;
612 left: 3px;
613 width: 22px;
614 height: 22px;
615 border-radius: 50%;
616 background: #fff;
617 box-shadow: 0 1px 4px rgba(0,0,0,0.3);
618 transition: transform 0.28s cubic-bezier(0.45,1.6,0.45,1), color 0.2s ease;
619 pointer-events: none;
620 display: flex;
621 align-items: center;
622 justify-content: center;
623 font-size: 14px;
624 font-weight: bold;
625 content: "";
626 }
627
628 .wrapper:has(> label:first-child > input:checked)::after {
629 content: "";
630 color: #2196f3;
631 }
632
633 .wrapper:has(> label:first-child > input:checked)::before {
634 background: #2196f3;
635 box-shadow: 0 0 0 3px rgba(33,150,243,0.18);
636 }
637 .wrapper:has(> label:first-child > input:checked)::after {
638 transform: translateX(24px);
639 }
640
641 .wrapper:has(> label:last-child > input:checked)::before {
642 background: #bdbdbd;
643 }
644 .wrapper:has(> label:last-child > input:checked)::after {
645 transform: translateX(0);
646 }
647
648 .wrapper:hover::before {
649 box-shadow: 0 0 0 3px rgba(33,150,243,0.12);
650 }
651 .wrapper input[type="radio"]:focus-visible + span {
652 outline: 2px solid rgba(33,150,243,0.45);
653 outline-offset: 2px;
654 }
655
656 /* Test API Key button */
657 #btn_test_apikey {
658 margin: 4px 0 0 1px;
659 vertical-align: middle;
660 background: #f6f7f7;
661 }
662 #btn_test_apikey:disabled {
663 opacity: 0.7;
664 cursor: wait;
665 }
666 .icon-spin {
667 animation: gpt-spin 1s linear infinite;
668 }
669 @keyframes gpt-spin {
670 0% { transform: rotate(0deg); }
671 100% { transform: rotate(360deg); }
672 }
673 #apikey_test_result {
674 display: inline-block;
675 padding: 3px 10px;
676 border-radius: 3px;
677 font-size: 13px;
678 vertical-align: middle;
679 font-weight: 500;
680 }
681 .gpt-test-success {
682 background-color: #d4edda;
683 color: #155724;
684 border: 1px solid #c3e6cb;
685 }
686 .gpt-test-error {
687 background-color: #f8d7da;
688 color: #721c24;
689 border: 1px solid #f5c6cb;
690 max-width: 500px;
691 word-break: break-word;
692 }
693
694 .gpt-drag-over-before {
695 border-top: 3px solid #2271b1;
696 box-shadow: 0 -2px 6px rgba(34, 113, 177, 0.35);
697 }
698 .gpt-drag-over-after {
699 border-bottom: 3px solid #2271b1;
700 box-shadow: 0 2px 6px rgba(34, 113, 177, 0.35);
701 }
702
703 /* Targetta ogni body che ha una classe 'branch-' seguita da un numero >= 7 */
704 body[class*="branch-7"] .wrapper:has(> label:first-child > input:checked)::after,
705 body[class*="branch-8"] .wrapper:has(> label:first-child > input:checked)::after,
706 body[class*="branch-9"] .wrapper:has(> label:first-child > input:checked)::after {
707 color: #3858e9;
708 }
709
710 body[class*="branch-7"] .wrapper:has(> label:first-child > input:checked)::before,
711 body[class*="branch-8"] .wrapper:has(> label:first-child > input:checked)::before,
712 body[class*="branch-9"] .wrapper:has(> label:first-child > input:checked)::before {
713 background: #3858e9;
714 }
715
716 body[class*="branch-7"] table.form-table th.settings-label-separator,
717 body[class*="branch-8"] table.form-table th.settings-label-separator,
718 body[class*="branch-9"] table.form-table th.settings-label-separator {
719 background: #3858e9;
720 border-left: 4px solid #3858e9;
721 }
722
723 body[class*="branch-7"] div.exportimportbtns,
724 body[class*="branch-8"] div.exportimportbtns,
725 body[class*="branch-9"] div.exportimportbtns {
726 margin-top: -50px;
727 }
728
729
730 body[class*="branch-7"] input[name="gptranslate_settings_file"],
731 body[class*="branch-8"] input[name="gptranslate_settings_file"],
732 body[class*="branch-9"] input[name="gptranslate_settings_file"],
733 body[class*="branch-7"] input[name="import_file"],
734 body[class*="branch-8"] input[name="import_file"],
735 body[class*="branch-9"] input[name="import_file"] {
736 border: 1px solid #CCC;
737 border-radius: 4px;
738 padding-left: 5px;
739 padding: 8px;
740 }
741
742 body[class*="branch-7"] .gpt-label,
743 body[class*="branch-8"] .gpt-label,
744 body[class*="branch-9"] .gpt-label {
745 background-color: #3858e9;
746 }
747
748 body[class*="branch-7"].wp-core-ui .button-warning.button-crawler,
749 body[class*="branch-8"].wp-core-ui .button-warning.button-crawler,
750 body[class*="branch-9"].wp-core-ui .button-warning.button-crawler {
751 top: 50px;
752 }
753
754 body[class*="branch-7"] .bg-primary,
755 body[class*="branch-8"] .bg-primary,
756 body[class*="branch-9"] .bg-primary,
757 body[class*="branch-7"] .btn-primary,
758 body[class*="branch-8"] .btn-primary,
759 body[class*="branch-9"] .btn-primary {
760 background-color: #3858e9;
761 }
762
763 body[class*="branch-7"] #btn_test_apikey span.dashicons,
764 body[class*="branch-8"] #btn_test_apikey span.dashicons,
765 body[class*="branch-9"] #btn_test_apikey span.dashicons {
766 line-height: normal;
767 margin-top: -1px;
768 }
769
770 body[class*="branch-7"] div.notice.notice-success,
771 body[class*="branch-8"] div.notice.notice-success,
772 body[class*="branch-9"] div.notice.notice-success {
773 border-top: 1px solid #4ab866;
774 border-right: 1px solid #4ab866;
775 border-bottom: 1px solid #4ab866;
776 }
777
778 body[class*="branch-7"] div.notice.notice-warning,
779 body[class*="branch-8"] div.notice.notice-warning,
780 body[class*="branch-9"] div.notice.notice-warning {
781 border-top: 1px solid #f0b849;
782 border-right: 1px solid #f0b849;
783 border-bottom: 1px solid #f0b849;
784 }
785
786 body[class*="branch-7"].wp-core-ui div.left-filter-container .button,
787 body[class*="branch-8"].wp-core-ui div.left-filter-container .button,
788 body[class*="branch-9"].wp-core-ui div.left-filter-container .button,
789 body[class*="branch-7"].wp-core-ui div.right-filter-container .button,
790 body[class*="branch-8"].wp-core-ui div.right-filter-container .button,
791 body[class*="branch-9"].wp-core-ui div.right-filter-container .button {
792 background: #f6f7f7;
793 }
794
795 body[class*="branch-7"] .form-table th,
796 body[class*="branch-8"] .form-table th,
797 body[class*="branch-9"] .form-table th {
798 border-left-color: #3858e9;
799 }
800
801 body[class*="branch-7"] input[name="exactmatch"]{
802 border: 1px solid #3858e9;
803 }