← All changes
|
media-optimization/assets/css/media-optimization.css
+83
-5
2.6.10
→
2.7.1
View file →
| @@ -669,9 +669,11 @@ | ||
| 669 | 669 | margin: 0; |
| 670 | 670 | } |
| 671 | 671 | |
| 672 | 672 | .metasync-media-optimization-page .metasync-tab-nav a { |
| 673 | - display: block; | |
| 673 | + display: flex; | |
| 674 | + align-items: center; | |
| 675 | + gap: 4px; | |
| 674 | 676 | padding: 12px 20px; |
| 675 | 677 | text-decoration: none; |
| 676 | 678 | color: var(--dashboard-text-secondary); |
| 677 | 679 | border-bottom: none; |
| @@ -683,8 +685,16 @@ | ||
| 683 | 685 | position: relative; |
| 684 | 686 | overflow: hidden; |
| 685 | 687 | } |
| 686 | 688 | |
| 689 | +.metasync-media-optimization-page .metasync-tab-nav a .dashicons { | |
| 690 | + font-size: 16px; | |
| 691 | + width: 16px; | |
| 692 | + height: 16px; | |
| 693 | + line-height: 1; | |
| 694 | + flex-shrink: 0; | |
| 695 | +} | |
| 696 | + | |
| 687 | 697 | .metasync-media-optimization-page .metasync-tab-nav a:hover { |
| 688 | 698 | color: var(--dashboard-text-primary); |
| 689 | 699 | background: rgba(255, 255, 255, 0.05); |
| 690 | 700 | } |
| @@ -736,8 +746,12 @@ | ||
| 736 | 746 | flex-direction: column; |
| 737 | 747 | gap: 4px; |
| 738 | 748 | } |
| 739 | 749 | |
| 750 | +.metasync-stat-rate { | |
| 751 | + margin-left: auto; | |
| 752 | +} | |
| 753 | + | |
| 740 | 754 | .metasync-stat-number { |
| 741 | 755 | font-size: 28px; |
| 742 | 756 | font-weight: 700; |
| 743 | 757 | color: var(--dashboard-text-primary); |
| @@ -764,10 +778,15 @@ | ||
| 764 | 778 | align-items: center; |
| 765 | 779 | gap: 10px; |
| 766 | 780 | } |
| 767 | 781 | |
| 782 | +.metasync-stat-rate .metasync-stat-progress-wrap { | |
| 783 | + min-height: 28px; | |
| 784 | + align-items: center; | |
| 785 | +} | |
| 786 | + | |
| 768 | 787 | .metasync-stat-progress-bar { |
| 769 | - width: 120px; | |
| 788 | + width: 200px; | |
| 770 | 789 | height: 8px; |
| 771 | 790 | background: var(--dashboard-border); |
| 772 | 791 | border-radius: 4px; |
| 773 | 792 | overflow: hidden; |
| @@ -917,8 +936,23 @@ | ||
| 917 | 936 | display: inline-flex; |
| 918 | 937 | align-items: center; |
| 919 | 938 | } |
| 920 | 939 | |
| 940 | +.metasync-toolbar-right .search-box .metasync-search-input-wrap::before { | |
| 941 | + content: ''; | |
| 942 | + position: absolute; | |
| 943 | + left: 10px; | |
| 944 | + top: 50%; | |
| 945 | + transform: translateY(-50%); | |
| 946 | + width: 15px; | |
| 947 | + height: 15px; | |
| 948 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E"); | |
| 949 | + background-repeat: no-repeat; | |
| 950 | + background-size: contain; | |
| 951 | + pointer-events: none; | |
| 952 | + z-index: 1; | |
| 953 | +} | |
| 954 | + | |
| 921 | 955 | .metasync-toolbar-right .search-box input[type="search"], |
| 922 | 956 | .metasync-toolbar-right .search-box input[type="text"] { |
| 923 | 957 | background: var(--dashboard-card-bg); |
| 924 | 958 | color: var(--dashboard-text-primary); |
| @@ -923,9 +957,9 @@ | ||
| 923 | 957 | background: var(--dashboard-card-bg); |
| 924 | 958 | color: var(--dashboard-text-primary); |
| 925 | 959 | border: 1px solid var(--dashboard-border); |
| 926 | 960 | border-radius: 6px; |
| 927 | - padding: 6px 30px 6px 12px; | |
| 961 | + padding: 6px 30px 6px 34px; | |
| 928 | 962 | height: 32px; |
| 929 | 963 | line-height: 32px; |
| 930 | 964 | font-size: 13px; |
| 931 | 965 | min-width: 260px; |
| @@ -1083,19 +1117,31 @@ | ||
| 1083 | 1117 | } |
| 1084 | 1118 | |
| 1085 | 1119 | /* ── Tablenav Inputs (select, button) ── */ |
| 1086 | 1120 | #metasync-image-library-form .tablenav select { |
| 1087 | - background: var(--dashboard-card-bg); | |
| 1121 | + background-color: var(--dashboard-card-bg); | |
| 1088 | 1122 | color: var(--dashboard-text-primary); |
| 1089 | 1123 | border: 1px solid var(--dashboard-border); |
| 1090 | 1124 | border-radius: 6px; |
| 1091 | 1125 | height: 34px; |
| 1092 | 1126 | line-height: 32px; |
| 1093 | - padding: 0 10px; | |
| 1127 | + padding: 0 30px 0 10px; | |
| 1094 | 1128 | font-size: 13px; |
| 1095 | 1129 | box-sizing: border-box; |
| 1130 | + cursor: pointer; | |
| 1131 | + appearance: none; | |
| 1132 | + -webkit-appearance: none; | |
| 1133 | + -moz-appearance: none; | |
| 1134 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); | |
| 1135 | + background-repeat: no-repeat; | |
| 1136 | + background-position: right 10px center; | |
| 1137 | + background-size: 10px 10px; | |
| 1096 | 1138 | } |
| 1097 | 1139 | |
| 1140 | +#metasync-image-library-form .tablenav select:focus { | |
| 1141 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='18 15 12 9 6 15'/%3E%3C/svg%3E"); | |
| 1142 | +} | |
| 1143 | + | |
| 1098 | 1144 | #metasync-image-library-form .tablenav .actions .button { |
| 1099 | 1145 | background: var(--dashboard-card-hover); |
| 1100 | 1146 | color: var(--dashboard-text-primary); |
| 1101 | 1147 | border: 1px solid var(--dashboard-border); |
| @@ -1252,8 +1298,27 @@ | ||
| 1252 | 1298 | border-radius: 4px; |
| 1253 | 1299 | display: block; |
| 1254 | 1300 | } |
| 1255 | 1301 | |
| 1302 | +/* Placeholder shown when an attachment's file is missing on disk */ | |
| 1303 | +.metasync-image-thumb-missing { | |
| 1304 | + width: 50px; | |
| 1305 | + height: 50px; | |
| 1306 | + border-radius: 4px; | |
| 1307 | + display: inline-flex; | |
| 1308 | + align-items: center; | |
| 1309 | + justify-content: center; | |
| 1310 | + background: rgba(239, 68, 68, 0.08); | |
| 1311 | + border: 1px dashed rgba(239, 68, 68, 0.4); | |
| 1312 | + color: #ef4444; | |
| 1313 | +} | |
| 1314 | + | |
| 1315 | +.metasync-image-thumb-missing .dashicons { | |
| 1316 | + font-size: 22px; | |
| 1317 | + width: 22px; | |
| 1318 | + height: 22px; | |
| 1319 | +} | |
| 1320 | + | |
| 1256 | 1321 | .metasync-image-info { |
| 1257 | 1322 | display: flex; |
| 1258 | 1323 | flex-direction: column; |
| 1259 | 1324 | gap: 2px; |
| @@ -1332,8 +1397,13 @@ | ||
| 1332 | 1397 | background: rgba(156, 163, 175, 0.15); |
| 1333 | 1398 | color: var(--dashboard-text-secondary); |
| 1334 | 1399 | } |
| 1335 | 1400 | |
| 1401 | +.metasync-status-missing { | |
| 1402 | + background: rgba(239, 68, 68, 0.15); | |
| 1403 | + color: #ef4444; | |
| 1404 | +} | |
| 1405 | + | |
| 1336 | 1406 | /* ── Size Savings ── */ |
| 1337 | 1407 | .metasync-size-savings { |
| 1338 | 1408 | display: flex; |
| 1339 | 1409 | flex-direction: column; |
| @@ -1383,9 +1453,13 @@ | ||
| 1383 | 1453 | .metasync-optimize-btn, |
| 1384 | 1454 | .metasync-revert-btn { |
| 1385 | 1455 | display: inline-flex !important; |
| 1386 | 1456 | align-items: center; |
| 1457 | + justify-content: center; | |
| 1387 | 1458 | gap: 4px; |
| 1459 | + min-width: 96px; | |
| 1460 | + white-space: nowrap; | |
| 1461 | + box-sizing: border-box; | |
| 1388 | 1462 | } |
| 1389 | 1463 | |
| 1390 | 1464 | .metasync-optimize-btn .dashicons, |
| 1391 | 1465 | .metasync-revert-btn .dashicons { |
| @@ -1437,8 +1511,12 @@ | ||
| 1437 | 1511 | } |
| 1438 | 1512 | |
| 1439 | 1513 | .metasync-stat-item { |
| 1440 | 1514 | min-width: 80px; |
| 1515 | + } | |
| 1516 | + | |
| 1517 | + .metasync-stat-rate { | |
| 1518 | + margin-left: 0; | |
| 1441 | 1519 | } |
| 1442 | 1520 | |
| 1443 | 1521 | .metasync-table-toolbar { |
| 1444 | 1522 | flex-direction: column; |