35 line-height: 1.2; |
35 line-height: 1.2; |
36 } |
36 } |
37 |
37 |
38 .media-frame a { |
38 .media-frame a { |
39 border-bottom: none; |
39 border-bottom: none; |
40 color: #0073aa; |
40 color: #2271b1; |
41 } |
41 } |
42 |
42 |
43 .media-frame a:hover, |
43 .media-frame a:hover, |
44 .media-frame a:active { |
44 .media-frame a:active { |
45 color: #006799; |
45 color: #135e96; |
46 } |
46 } |
47 |
47 |
48 .media-frame a:focus { |
48 .media-frame a:focus { |
49 box-shadow: |
49 box-shadow: |
50 0 0 0 1px #5b9dd9, |
50 0 0 0 1px #4f94d4, |
51 0 0 2px 1px rgba(30, 140, 190, 0.8); |
51 0 0 2px 1px rgba(79, 148, 212, 0.8); |
52 color: #124964; |
52 color: #043959; |
53 /* Only visible in Windows High Contrast mode */ |
53 /* Only visible in Windows High Contrast mode */ |
54 outline: 1px solid transparent; |
54 outline: 1px solid transparent; |
55 } |
55 } |
56 |
56 |
57 .media-frame a.button { |
57 .media-frame a.button { |
58 color: #32373c; |
58 color: #2c3338; |
59 } |
59 } |
60 |
60 |
61 .media-frame a.button:hover { |
61 .media-frame a.button:hover { |
62 color: #23282d; |
62 color: #1d2327; |
63 } |
63 } |
64 |
64 |
65 .media-frame a.button-primary, |
65 .media-frame a.button-primary, |
66 .media-frame a.button-primary:hover { |
66 .media-frame a.button-primary:hover { |
67 color: #fff; |
67 color: #fff; |
94 .media-frame input[type="week"], |
94 .media-frame input[type="week"], |
95 .media-frame textarea, |
95 .media-frame textarea, |
96 .media-frame select { |
96 .media-frame select { |
97 box-shadow: 0 0 0 transparent; |
97 box-shadow: 0 0 0 transparent; |
98 border-radius: 4px; |
98 border-radius: 4px; |
99 border: 1px solid #7e8993; |
99 border: 1px solid #8c8f94; |
100 background-color: #fff; |
100 background-color: #fff; |
101 color: #32373c; |
101 color: #2c3338; |
102 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
102 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
103 font-size: 13px; |
103 font-size: 13px; |
104 } |
104 } |
105 |
105 |
106 .media-frame input[type="text"], |
106 .media-frame input[type="text"], |
133 .media-frame input[type="search"]:focus, |
133 .media-frame input[type="search"]:focus, |
134 .media-frame input[type="email"]:focus, |
134 .media-frame input[type="email"]:focus, |
135 .media-frame input[type="url"]:focus, |
135 .media-frame input[type="url"]:focus, |
136 .media-frame textarea:focus, |
136 .media-frame textarea:focus, |
137 .media-frame select:focus { |
137 .media-frame select:focus { |
138 border-color: #007cba; |
138 border-color: #3582c4; |
139 box-shadow: 0 0 0 1px #007cba; |
139 box-shadow: 0 0 0 1px #3582c4; |
140 outline: 2px solid transparent; |
140 outline: 2px solid transparent; |
141 } |
141 } |
142 |
142 |
143 .media-frame input:disabled, |
143 .media-frame input:disabled, |
144 .media-frame textarea:disabled, |
144 .media-frame textarea:disabled, |
145 .media-frame input[readonly], |
145 .media-frame input[readonly], |
146 .media-frame textarea[readonly] { |
146 .media-frame textarea[readonly] { |
147 background-color: #eee; |
147 background-color: #f0f0f1; |
148 } |
148 } |
149 |
149 |
150 .media-frame input[type="search"] { |
150 .media-frame input[type="search"] { |
151 -webkit-appearance: textfield; |
151 -webkit-appearance: textfield; |
152 } |
152 } |
153 |
153 |
154 .media-frame ::-webkit-input-placeholder { |
154 .media-frame ::-webkit-input-placeholder { |
155 color: #72777c; |
155 color: #646970; |
156 } |
156 } |
157 |
157 |
158 .media-frame ::-moz-placeholder { |
158 .media-frame ::-moz-placeholder { |
159 color: #72777c; |
159 color: #646970; |
160 opacity: 1; |
160 opacity: 1; |
161 } |
161 } |
162 |
162 |
163 .media-frame :-ms-input-placeholder { |
163 .media-frame :-ms-input-placeholder { |
164 color: #72777c; |
164 color: #646970; |
165 } |
165 } |
166 |
166 |
167 /* |
167 /* |
168 * In some cases there's the need of higher specificity, |
168 * In some cases there's the need of higher specificity, |
169 * for example higher than `.media-embed .setting`. |
169 * for example higher than `.media-embed .setting`. |
226 height: 50px; |
226 height: 50px; |
227 margin: 0; |
227 margin: 0; |
228 padding: 0; |
228 padding: 0; |
229 border: 1px solid transparent; |
229 border: 1px solid transparent; |
230 background: none; |
230 background: none; |
231 color: #666; |
231 color: #646970; |
232 z-index: 1000; |
232 z-index: 1000; |
233 cursor: pointer; |
233 cursor: pointer; |
234 outline: none; |
234 outline: none; |
235 transition: color .1s ease-in-out, background .1s ease-in-out; |
235 transition: color .1s ease-in-out, background .1s ease-in-out; |
236 } |
236 } |
237 |
237 |
238 .media-modal-close:hover, |
238 .media-modal-close:hover, |
239 .media-modal-close:active { |
239 .media-modal-close:active { |
240 color: #006799; |
240 color: #135e96; |
241 } |
241 } |
242 |
242 |
243 .media-modal-close:focus { |
243 .media-modal-close:focus { |
244 color: #006799; |
244 color: #135e96; |
245 border-color: #5b9dd9; |
245 border-color: #4f94d4; |
246 box-shadow: 0 0 3px rgba(0, 115, 170, 0.8); |
246 box-shadow: 0 0 3px rgba(34, 113, 177, 0.8); |
247 /* Only visible in Windows High Contrast mode */ |
247 /* Only visible in Windows High Contrast mode */ |
248 outline: 2px solid transparent; |
248 outline: 2px solid transparent; |
249 } |
249 } |
250 |
250 |
251 .media-modal-close span.media-modal-icon { |
251 .media-modal-close span.media-modal-icon { |
601 right: 0; |
603 right: 0; |
602 left: 0; |
604 left: 0; |
603 bottom: 0; |
605 bottom: 0; |
604 margin: 0; |
606 margin: 0; |
605 padding: 50px 0 10px; |
607 padding: 50px 0 10px; |
606 background: #f3f3f3; |
608 background: #f6f7f7; |
607 border-left-width: 1px; |
609 border-left-width: 1px; |
608 border-left-style: solid; |
610 border-left-style: solid; |
609 border-left-color: #ccc; |
611 border-left-color: #c3c4c7; |
610 -webkit-user-select: none; |
612 -webkit-user-select: none; |
611 -moz-user-select: none; |
|
612 -ms-user-select: none; |
|
613 user-select: none; |
613 user-select: none; |
614 } |
614 } |
615 |
615 |
616 .media-menu .media-menu-item { |
616 .media-menu .media-menu-item { |
617 display: block; |
617 display: block; |
622 margin: 0; |
622 margin: 0; |
623 padding: 8px 20px; |
623 padding: 8px 20px; |
624 font-size: 14px; |
624 font-size: 14px; |
625 line-height: 1.28571428; |
625 line-height: 1.28571428; |
626 background: transparent; |
626 background: transparent; |
627 color: #0073aa; |
627 color: #2271b1; |
628 text-align: right; |
628 text-align: right; |
629 text-decoration: none; |
629 text-decoration: none; |
630 cursor: pointer; |
630 cursor: pointer; |
631 } |
631 } |
632 |
632 |
633 .media-menu .media-menu-item:hover { |
633 .media-menu .media-menu-item:hover { |
634 background: rgba(0, 0, 0, 0.04); |
634 background: rgba(0, 0, 0, 0.04); |
635 } |
635 } |
636 |
636 |
637 .media-menu .media-menu-item:active { |
637 .media-menu .media-menu-item:active { |
638 color: #0073aa; |
638 color: #2271b1; |
639 outline: none; |
639 outline: none; |
640 } |
640 } |
641 |
641 |
642 .media-menu .active, |
642 .media-menu .active, |
643 .media-menu .active:hover { |
643 .media-menu .active:hover { |
644 color: #23282d; |
644 color: #1d2327; |
645 font-weight: 600; |
645 font-weight: 600; |
646 } |
646 } |
647 |
647 |
648 .media-menu .media-menu-item:focus { |
648 .media-menu .media-menu-item:focus { |
649 box-shadow: |
649 box-shadow: |
650 0 0 0 1px #5b9dd9, |
650 0 0 0 1px #4f94d4, |
651 0 0 2px 1px rgba(30, 140, 190, 0.8); |
651 0 0 2px 1px rgba(79, 148, 212, 0.8); |
652 color: #124964; |
652 color: #043959; |
653 /* Only visible in Windows High Contrast mode */ |
653 /* Only visible in Windows High Contrast mode */ |
654 outline: 1px solid transparent; |
654 outline: 1px solid transparent; |
655 } |
655 } |
656 |
656 |
657 .media-menu .separator { |
657 .media-menu .separator { |
658 height: 0; |
658 height: 0; |
659 margin: 12px 20px; |
659 margin: 12px 20px; |
660 padding: 0; |
660 padding: 0; |
661 border-top: 1px solid #ddd; |
661 border-top: 1px solid #dcdcde; |
662 } |
662 } |
663 |
663 |
664 /** |
664 /** |
665 * Menu |
665 * Menu |
666 */ |
666 */ |
690 border-left: 0; |
690 border-left: 0; |
691 } |
691 } |
692 |
692 |
693 .media-router .media-menu-item:hover, |
693 .media-router .media-menu-item:hover, |
694 .media-router .media-menu-item:active { |
694 .media-router .media-menu-item:active { |
695 color: #0073aa; |
695 color: #2271b1; |
696 } |
696 } |
697 |
697 |
698 .media-router .active, |
698 .media-router .active, |
699 .media-router .active:hover { |
699 .media-router .active:hover { |
700 color: #23282d; |
700 color: #1d2327; |
701 } |
701 } |
702 |
702 |
703 .media-router .media-menu-item:focus { |
703 .media-router .media-menu-item:focus { |
704 box-shadow: |
704 box-shadow: |
705 0 0 0 1px #5b9dd9, |
705 0 0 0 1px #4f94d4, |
706 0 0 2px 1px rgba(30, 140, 190, 0.8); |
706 0 0 2px 1px rgba(79, 148, 212, 0.8); |
707 color: #124964; |
707 color: #043959; |
708 /* Only visible in Windows High Contrast mode */ |
708 /* Only visible in Windows High Contrast mode */ |
709 outline: 1px solid transparent; |
709 outline: 1px solid transparent; |
710 } |
710 } |
711 |
711 |
712 .media-router .active, |
712 .media-router .active, |
713 .media-router .media-menu-item.active:last-child { |
713 .media-router .media-menu-item.active:last-child { |
714 margin: -1px -1px 0; |
714 margin: -1px -1px 0; |
715 background: #fff; |
715 background: #fff; |
716 border: 1px solid #ddd; |
716 border: 1px solid #dcdcde; |
717 border-bottom: none; |
717 border-bottom: none; |
718 } |
718 } |
719 |
719 |
720 .media-router .active:after { |
720 .media-router .active:after { |
721 display: none; |
721 display: none; |
908 */ |
908 */ |
909 .media-frame .search { |
909 .media-frame .search { |
910 margin: 32px 0 0; |
910 margin: 32px 0 0; |
911 padding: 4px; |
911 padding: 4px; |
912 font-size: 13px; |
912 font-size: 13px; |
913 color: #444; |
913 color: #3c434a; |
914 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
914 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
915 -webkit-appearance: none; |
915 -webkit-appearance: none; |
916 } |
916 } |
917 |
917 |
918 .media-toolbar-primary .search { |
918 .media-toolbar-primary .search { |
941 .wp-core-ui .attachment { |
941 .wp-core-ui .attachment { |
942 position: relative; |
942 position: relative; |
943 float: right; |
943 float: right; |
944 padding: 8px; |
944 padding: 8px; |
945 margin: 0; |
945 margin: 0; |
946 color: #444; |
946 color: #3c434a; |
947 cursor: pointer; |
947 cursor: pointer; |
948 list-style: none; |
948 list-style: none; |
949 text-align: center; |
949 text-align: center; |
950 -webkit-user-select: none; |
950 -webkit-user-select: none; |
951 -moz-user-select: none; |
|
952 -ms-user-select: none; |
|
953 user-select: none; |
951 user-select: none; |
954 width: 25%; |
952 width: 25%; |
955 box-sizing: border-box; |
953 box-sizing: border-box; |
956 } |
954 } |
957 |
955 |
958 .wp-core-ui .attachment:focus, |
956 .wp-core-ui .attachment:focus, |
959 .wp-core-ui .selected.attachment:focus, |
957 .wp-core-ui .selected.attachment:focus, |
960 .wp-core-ui .attachment.details:focus { |
958 .wp-core-ui .attachment.details:focus { |
961 box-shadow: |
959 box-shadow: |
962 inset 0 0 2px 3px #fff, |
960 inset 0 0 2px 3px #fff, |
963 inset 0 0 0 7px #5b9dd9; |
961 inset 0 0 0 7px #4f94d4; |
964 /* Only visible in Windows High Contrast mode */ |
962 /* Only visible in Windows High Contrast mode */ |
965 outline: 2px solid transparent; |
963 outline: 2px solid transparent; |
966 outline-offset: -6px; |
964 outline-offset: -6px; |
967 } |
965 } |
968 |
966 |
969 .wp-core-ui .selected.attachment { |
967 .wp-core-ui .selected.attachment { |
970 box-shadow: |
968 box-shadow: |
971 inset 0 0 0 5px #fff, |
969 inset 0 0 0 5px #fff, |
972 inset 0 0 0 7px #ccc; |
970 inset 0 0 0 7px #c3c4c7; |
973 } |
971 } |
974 |
972 |
975 .wp-core-ui .attachment.details { |
973 .wp-core-ui .attachment.details { |
976 box-shadow: |
974 box-shadow: |
977 inset 0 0 0 3px #fff, |
975 inset 0 0 0 3px #fff, |
978 inset 0 0 0 7px #0073aa; |
976 inset 0 0 0 7px #2271b1; |
979 } |
977 } |
980 |
978 |
981 .wp-core-ui .attachment-preview { |
979 .wp-core-ui .attachment-preview { |
982 position: relative; |
980 position: relative; |
983 box-shadow: |
981 box-shadow: |
984 inset 0 0 15px rgba(0, 0, 0, 0.1), |
982 inset 0 0 15px rgba(0, 0, 0, 0.1), |
985 inset 0 0 0 1px rgba(0, 0, 0, 0.05); |
983 inset 0 0 0 1px rgba(0, 0, 0, 0.05); |
986 background: #eee; |
984 background: #f0f0f1; |
987 cursor: pointer; |
985 cursor: pointer; |
988 } |
986 } |
989 |
987 |
990 .wp-core-ui .attachment-preview:before { |
988 .wp-core-ui .attachment-preview:before { |
991 content: ""; |
989 content: ""; |
1126 } |
1124 } |
1127 |
1125 |
1128 .wp-core-ui .attachment.details .check, |
1126 .wp-core-ui .attachment.details .check, |
1129 .wp-core-ui .attachment.selected .check:focus, |
1127 .wp-core-ui .attachment.selected .check:focus, |
1130 .wp-core-ui .media-frame.mode-grid .attachment.selected .check { |
1128 .wp-core-ui .media-frame.mode-grid .attachment.selected .check { |
1131 background-color: #0073aa; |
1129 background-color: #2271b1; |
1132 box-shadow: |
1130 box-shadow: |
1133 0 0 0 1px #fff, |
1131 0 0 0 1px #fff, |
1134 0 0 0 2px #0073aa; |
1132 0 0 0 2px #2271b1; |
1135 } |
1133 } |
1136 |
1134 |
1137 .wp-core-ui .attachment.selected .check:focus { |
1135 .wp-core-ui .attachment.selected .check:focus { |
1138 /* Only visible in Windows High Contrast mode */ |
1136 /* Only visible in Windows High Contrast mode */ |
1139 outline: 2px solid transparent; |
1137 outline: 2px solid transparent; |
1238 z-index: 1; |
1237 z-index: 1; |
1239 } |
1238 } |
1240 |
1239 |
1241 .uploader-inline .close:before { |
1240 .uploader-inline .close:before { |
1242 font: normal 30px/1 dashicons !important; |
1241 font: normal 30px/1 dashicons !important; |
1243 color: #555d66; |
1242 color: #50575e; |
1244 display: inline-block; |
1243 display: inline-block; |
1245 content: "\f335"; |
1244 content: "\f335"; |
1246 font-weight: 300; |
1245 font-weight: 300; |
1247 margin-top: 1px; |
1246 margin-top: 1px; |
1248 } |
1247 } |
1249 |
1248 |
1250 .uploader-inline .close:focus { |
1249 .uploader-inline .close:focus { |
1251 outline: 1px solid #5b9dd9; |
1250 outline: 1px solid #4f94d4; |
1252 box-shadow: 0 0 3px rgba(0, 115, 170, 0.8); |
1251 box-shadow: 0 0 3px rgba(34, 113, 177, 0.8); |
1253 } |
1252 } |
1254 |
1253 |
1255 .attachments-browser.hide-sidebar .attachments, |
1254 .attachments-browser.hide-sidebar .attachments, |
1256 .attachments-browser.hide-sidebar .uploader-inline { |
1255 .attachments-browser.hide-sidebar .uploader-inline { |
1257 left: 0; |
1256 left: 0; |
1261 .attachments-browser .instructions { |
1260 .attachments-browser .instructions { |
1262 display: inline-block; |
1261 display: inline-block; |
1263 margin-top: 16px; |
1262 margin-top: 16px; |
1264 line-height: 1.38461538; |
1263 line-height: 1.38461538; |
1265 font-size: 13px; |
1264 font-size: 13px; |
1266 color: #666; |
1265 color: #646970; |
1267 } |
1266 } |
1268 |
1267 |
1269 .attachments-browser .no-media { |
1268 .attachments-browser .no-media { |
1270 padding: 2em 2em 0 0; |
1269 padding: 2em 2em 0 0; |
|
1270 } |
|
1271 |
|
1272 .more-loaded .attachment:not(.found-media) { |
|
1273 background: #dcdcde; |
|
1274 } |
|
1275 |
|
1276 .load-more-wrapper { |
|
1277 clear: both; |
|
1278 display: flex; |
|
1279 flex-wrap: wrap; |
|
1280 align-items: center; |
|
1281 justify-content: center; |
|
1282 padding: 1em 0; |
|
1283 } |
|
1284 |
|
1285 .load-more-wrapper .load-more-count { |
|
1286 min-width: 100%; |
|
1287 margin: 0 0 1em; |
|
1288 text-align: center; |
|
1289 } |
|
1290 |
|
1291 .load-more-wrapper .load-more { |
|
1292 margin: 0; |
|
1293 } |
|
1294 |
|
1295 /* Needs high specificity. */ |
|
1296 .media-frame .load-more-wrapper .load-more + .spinner { |
|
1297 float: none; |
|
1298 margin: 0 10px 0 -30px; |
|
1299 } |
|
1300 |
|
1301 /* Reset spinner margin when the button is hidden to avoid horizontal scrollbar. */ |
|
1302 .media-frame .load-more-wrapper .load-more.hidden + .spinner { |
|
1303 margin: 0; |
|
1304 } |
|
1305 |
|
1306 /* Force a new row within the flex container. */ |
|
1307 .load-more-wrapper::after { |
|
1308 content: ""; |
|
1309 min-width: 100%; |
|
1310 order: 1; |
|
1311 } |
|
1312 |
|
1313 .load-more-wrapper .load-more-jump { |
|
1314 margin: 0 12px 0 0; |
|
1315 } |
|
1316 |
|
1317 .attachment.new-media { |
|
1318 outline: 2px dotted #c3c4c7; |
|
1319 } |
|
1320 |
|
1321 .load-more-wrapper { |
|
1322 clear: both; |
|
1323 display: flex; |
|
1324 flex-wrap: wrap; |
|
1325 align-items: center; |
|
1326 justify-content: center; |
|
1327 padding: 1em 0; |
|
1328 } |
|
1329 |
|
1330 .load-more-wrapper .load-more-count { |
|
1331 min-width: 100%; |
|
1332 margin: 0 0 1em; |
|
1333 text-align: center; |
|
1334 } |
|
1335 |
|
1336 .load-more-wrapper .load-more { |
|
1337 margin: 0; |
|
1338 } |
|
1339 |
|
1340 /* Needs high specificity. */ |
|
1341 .media-frame .load-more-wrapper .load-more + .spinner { |
|
1342 float: none; |
|
1343 margin: 0 10px 0 -30px; |
|
1344 } |
|
1345 |
|
1346 /* Reset spinner margin when the button is hidden to avoid horizontal scrollbar. */ |
|
1347 .media-frame .load-more-wrapper .load-more.hidden + .spinner { |
|
1348 margin: 0; |
|
1349 } |
|
1350 |
|
1351 /* Force a new row within the flex container. */ |
|
1352 .load-more-wrapper::after { |
|
1353 content: ""; |
|
1354 min-width: 100%; |
|
1355 order: 1; |
|
1356 } |
|
1357 |
|
1358 .load-more-wrapper .load-more-jump { |
|
1359 margin: 0 12px 0 0; |
1271 } |
1360 } |
1272 |
1361 |
1273 /** |
1362 /** |
1274 * Progress Bar |
1363 * Progress Bar |
1275 */ |
1364 */ |
1277 position: relative; |
1366 position: relative; |
1278 height: 10px; |
1367 height: 10px; |
1279 width: 70%; |
1368 width: 70%; |
1280 margin: 10px auto; |
1369 margin: 10px auto; |
1281 border-radius: 10px; |
1370 border-radius: 10px; |
1282 background: #ddd; |
1371 background: #dcdcde; |
1283 background: rgba(0, 0, 0, 0.1); |
1372 background: rgba(0, 0, 0, 0.1); |
1284 } |
1373 } |
1285 |
1374 |
1286 .media-progress-bar div { |
1375 .media-progress-bar div { |
1287 height: 10px; |
1376 height: 10px; |
1288 min-width: 20px; |
1377 min-width: 20px; |
1289 width: 0; |
1378 width: 0; |
1290 background: #0073aa; |
1379 background: #2271b1; |
1291 border-radius: 10px; |
1380 border-radius: 10px; |
1292 transition: width 300ms; |
1381 transition: width 300ms; |
1293 } |
1382 } |
1294 |
1383 |
1295 .media-uploader-status .media-progress-bar { |
1384 .media-uploader-status .media-progress-bar { |
1365 |
1454 |
1366 .media-uploader-status .upload-dismiss-errors::before { |
1455 .media-uploader-status .upload-dismiss-errors::before { |
1367 content: "\f153"; |
1456 content: "\f153"; |
1368 display: block; |
1457 display: block; |
1369 font: normal 16px/1 dashicons; |
1458 font: normal 16px/1 dashicons; |
1370 color: #72777c; |
1459 color: #787c82; |
1371 } |
1460 } |
1372 |
1461 |
1373 .uploader-inline .errors.media-uploader-status .upload-dismiss-errors::before { |
1462 .uploader-inline .errors.media-uploader-status .upload-dismiss-errors::before { |
1374 color: #606a73; |
1463 color: #646970; |
1375 } |
1464 } |
1376 |
1465 |
1377 .errors.media-uploader-status .upload-dismiss-errors:hover::before, |
1466 .errors.media-uploader-status .upload-dismiss-errors:hover::before, |
1378 .errors.media-uploader-status .upload-dismiss-errors:focus::before { |
1467 .errors.media-uploader-status .upload-dismiss-errors:focus::before { |
1379 color: #c00; |
1468 color: #d63638; |
1380 } |
1469 } |
1381 |
1470 |
1382 .upload-errors .upload-error { |
1471 .upload-errors .upload-error { |
1383 padding: 12px; |
1472 padding: 12px; |
1384 margin-bottom: 12px; |
1473 margin-bottom: 12px; |
1385 background: #fff; |
1474 background: #fff; |
1386 border-right: 4px solid #dc3232; |
1475 border-right: 4px solid #d63638; |
1387 box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); |
1476 box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); |
1388 } |
1477 } |
1389 |
1478 |
1390 .uploader-inline .upload-errors .upload-error { |
1479 .uploader-inline .upload-errors .upload-error { |
1391 padding: 12px 30px; |
1480 padding: 12px 30px; |
1392 background-color: #fbeaea; |
1481 background-color: #fcf0f1; |
1393 box-shadow: none; |
1482 box-shadow: none; |
1394 } |
1483 } |
1395 |
1484 |
1396 .upload-errors .upload-error-filename { |
1485 .upload-errors .upload-error-filename { |
1397 font-weight: 600; |
1486 font-weight: 600; |
1424 } |
1513 } |
1425 |
1514 |
1426 .wp-editor-wrap .uploader-editor { |
1515 .wp-editor-wrap .uploader-editor { |
1427 position: absolute; |
1516 position: absolute; |
1428 z-index: 99998; /* under the toolbar */ |
1517 z-index: 99998; /* under the toolbar */ |
1429 background: rgba(150, 150, 150, 0.9); |
1518 background: rgba(140, 143, 148, 0.9); |
1430 } |
1519 } |
1431 |
1520 |
1432 .uploader-window, |
1521 .uploader-window, |
1433 .wp-editor-wrap .uploader-editor.droppable { |
1522 .wp-editor-wrap .uploader-editor.droppable { |
1434 background: rgba(0, 86, 132, 0.9); |
1523 background: rgba(10, 75, 120, 0.9); |
1435 } |
1524 } |
1436 |
1525 |
1437 .uploader-window-content, |
1526 .uploader-window-content, |
1438 .wp-editor-wrap .uploader-editor-content { |
1527 .wp-editor-wrap .uploader-editor-content { |
1439 position: absolute; |
1528 position: absolute; |
1589 .media-selection .button-link { |
1678 .media-selection .button-link { |
1590 float: right; |
1679 float: right; |
1591 padding: 1px 8px; |
1680 padding: 1px 8px; |
1592 margin: 1px -8px 1px 8px; |
1681 margin: 1px -8px 1px 8px; |
1593 line-height: 1.4; |
1682 line-height: 1.4; |
1594 border-left: 1px solid #ddd; |
1683 border-left: 1px solid #dcdcde; |
1595 color: #0073aa; |
1684 color: #2271b1; |
1596 text-decoration: none; |
1685 text-decoration: none; |
1597 } |
1686 } |
1598 |
1687 |
1599 .media-selection .button-link:hover, |
1688 .media-selection .button-link:hover, |
1600 .media-selection .button-link:focus { |
1689 .media-selection .button-link:focus { |
1601 color: #006799; |
1690 color: #135e96; |
1602 } |
1691 } |
1603 |
1692 |
1604 .media-selection .button-link:last-child { |
1693 .media-selection .button-link:last-child { |
1605 border-left: 0; |
1694 border-left: 0; |
1606 margin-left: 0; |
1695 margin-left: 0; |
1607 } |
1696 } |
1608 |
1697 |
1609 .selection-info .clear-selection { |
1698 .selection-info .clear-selection { |
1610 color: #bc0b0b; |
1699 color: #d63638; |
1611 } |
1700 } |
1612 |
1701 |
1613 .selection-info .clear-selection:hover, |
1702 .selection-info .clear-selection:hover, |
1614 .selection-info .clear-selection:focus { |
1703 .selection-info .clear-selection:focus { |
1615 color: #dc3232; |
1704 color: #d63638; |
1616 } |
1705 } |
1617 |
1706 |
1618 .media-selection .selection-view { |
1707 .media-selection .selection-view { |
1619 display: inline-block; |
1708 display: inline-block; |
1620 vertical-align: top; |
1709 vertical-align: top; |
1654 .wp-core-ui .media-selection .attachment:focus, |
1743 .wp-core-ui .media-selection .attachment:focus, |
1655 .wp-core-ui .media-selection .selected.attachment:focus, |
1744 .wp-core-ui .media-selection .selected.attachment:focus, |
1656 .wp-core-ui .media-selection .attachment.details:focus { |
1745 .wp-core-ui .media-selection .attachment.details:focus { |
1657 box-shadow: |
1746 box-shadow: |
1658 0 0 0 1px #fff, |
1747 0 0 0 1px #fff, |
1659 0 0 2px 3px #5b9dd9; |
1748 0 0 2px 3px #4f94d4; |
1660 /* Only visible in Windows High Contrast mode */ |
1749 /* Only visible in Windows High Contrast mode */ |
1661 outline: 2px solid transparent; |
1750 outline: 2px solid transparent; |
1662 } |
1751 } |
1663 |
1752 |
1664 .wp-core-ui .media-selection .selected.attachment { |
1753 .wp-core-ui .media-selection .selected.attachment { |
1666 } |
1755 } |
1667 |
1756 |
1668 .wp-core-ui .media-selection .attachment.details { |
1757 .wp-core-ui .media-selection .attachment.details { |
1669 box-shadow: |
1758 box-shadow: |
1670 0 0 0 1px #fff, |
1759 0 0 0 1px #fff, |
1671 0 0 0 3px #0073aa; |
1760 0 0 0 3px #2271b1; |
1672 } |
1761 } |
1673 |
1762 |
1674 .media-selection:after { |
1763 .media-selection:after { |
1675 content: ""; |
1764 content: ""; |
1676 display: block; |
1765 display: block; |
1677 position: absolute; |
1766 position: absolute; |
1678 top: 0; |
1767 top: 0; |
1679 left: 0; |
1768 left: 0; |
1680 bottom: 0; |
1769 bottom: 0; |
1681 width: 25px; |
1770 width: 25px; |
1682 background-image: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); |
1771 background-image: linear-gradient(to right,#fff,rgba(255, 255, 255, 0)); |
1683 } |
1772 } |
1684 |
1773 |
1685 .media-selection .attachment .filename { |
1774 .media-selection .attachment .filename { |
1686 display: none; |
1775 display: none; |
1687 } |
1776 } |
1757 .attachment-info { |
1846 .attachment-info { |
1758 overflow: hidden; |
1847 overflow: hidden; |
1759 min-height: 60px; |
1848 min-height: 60px; |
1760 margin-bottom: 16px; |
1849 margin-bottom: 16px; |
1761 line-height: 1.5; |
1850 line-height: 1.5; |
1762 color: #666; |
1851 color: #646970; |
1763 border-bottom: 1px solid #ddd; |
1852 border-bottom: 1px solid #dcdcde; |
1764 padding-bottom: 11px; |
1853 padding-bottom: 11px; |
|
1854 } |
|
1855 |
|
1856 .attachment-info .wp-media-wrapper { |
|
1857 margin-bottom: 8px; |
|
1858 } |
|
1859 |
|
1860 .attachment-info .wp-media-wrapper.wp-audio { |
|
1861 margin-top: 13px; |
1765 } |
1862 } |
1766 |
1863 |
1767 .attachment-info .filename { |
1864 .attachment-info .filename { |
1768 font-weight: 600; |
1865 font-weight: 600; |
1769 color: #444; |
1866 color: #3c434a; |
1770 word-wrap: break-word; |
1867 word-wrap: break-word; |
1771 } |
1868 } |
1772 |
1869 |
1773 .attachment-info .thumbnail { |
1870 .attachment-info .thumbnail { |
1774 position: relative; |
1871 position: relative; |
1835 .media-modal .delete-attachment, |
1932 .media-modal .delete-attachment, |
1836 .media-modal .trash-attachment, |
1933 .media-modal .trash-attachment, |
1837 .media-modal .untrash-attachment { |
1934 .media-modal .untrash-attachment { |
1838 display: inline; |
1935 display: inline; |
1839 padding: 0; |
1936 padding: 0; |
1840 color: #bc0b0b; |
1937 color: #d63638; |
1841 } |
1938 } |
1842 |
1939 |
1843 .media-modal .delete-attachment:hover, |
1940 .media-modal .delete-attachment:hover, |
1844 .media-modal .delete-attachment:focus, |
1941 .media-modal .delete-attachment:focus, |
1845 .media-modal .trash-attachment:hover, |
1942 .media-modal .trash-attachment:hover, |
1846 .media-modal .trash-attachment:focus, |
1943 .media-modal .trash-attachment:focus, |
1847 .media-modal .untrash-attachment:hover, |
1944 .media-modal .untrash-attachment:hover, |
1848 .media-modal .untrash-attachment:focus { |
1945 .media-modal .untrash-attachment:focus { |
1849 color: #dc3232; |
1946 color: #d63638; |
1850 } |
1947 } |
1851 |
1948 |
1852 /** |
1949 /** |
1853 * Attachment Display Settings |
1950 * Attachment Display Settings |
1854 */ |
1951 */ |
1896 .media-modal .imgedit-wrap .imgedit-submit { |
1993 .media-modal .imgedit-wrap .imgedit-submit { |
1897 margin-bottom: 16px; |
1994 margin-bottom: 16px; |
1898 } |
1995 } |
1899 |
1996 |
1900 .media-modal .imgedit-wrap .imgedit-settings { |
1997 .media-modal .imgedit-wrap .imgedit-settings { |
1901 background: #f3f3f3; |
1998 background: #f6f7f7; |
1902 border-right: 1px solid #ddd; |
1999 border-right: 1px solid #dcdcde; |
1903 padding: 20px 16px 0; |
2000 padding: 20px 16px 0; |
1904 position: absolute; |
2001 position: absolute; |
1905 top: 0; |
2002 top: 0; |
1906 left: 0; |
2003 left: 0; |
1907 bottom: 0; |
2004 bottom: 0; |
1942 .media-modal .imgedit-group-top h2, |
2039 .media-modal .imgedit-group-top h2, |
1943 .media-modal .imgedit-group-top h2 .button-link { |
2040 .media-modal .imgedit-group-top h2 .button-link { |
1944 display: inline-block; |
2041 display: inline-block; |
1945 text-transform: uppercase; |
2042 text-transform: uppercase; |
1946 font-size: 12px; |
2043 font-size: 12px; |
1947 color: #666; |
2044 color: #646970; |
1948 margin: 0; |
2045 margin: 0; |
1949 margin-top: 3px; |
2046 margin-top: 3px; |
1950 } |
2047 } |
1951 |
2048 |
1952 .media-modal .imgedit-group-top h2 a, |
2049 .media-modal .imgedit-group-top h2 a, |
1953 .media-modal .imgedit-group-top h2 .button-link { |
2050 .media-modal .imgedit-group-top h2 .button-link { |
1954 text-decoration: none; |
2051 text-decoration: none; |
1955 color: #666; |
2052 color: #646970; |
1956 } |
2053 } |
1957 |
2054 |
1958 /* higher specificity than media.css */ |
2055 /* higher specificity than media.css */ |
1959 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle, |
2056 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle, |
1960 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:hover, |
2057 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:hover, |
1961 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:active { |
2058 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:active { |
1962 border: 1px solid transparent; |
2059 border: 1px solid transparent; |
1963 margin: 0; |
2060 margin: 0; |
1964 padding: 0; |
2061 padding: 0; |
1965 background: transparent; |
2062 background: transparent; |
1966 color: #0074a2; |
2063 color: #2271b1; |
1967 font-size: 20px; |
2064 font-size: 20px; |
1968 line-height: 1; |
2065 line-height: 1; |
1969 cursor: pointer; |
2066 cursor: pointer; |
1970 box-sizing: content-box; |
2067 box-sizing: content-box; |
1971 box-shadow: none; |
2068 box-shadow: none; |
1972 } |
2069 } |
1973 |
2070 |
1974 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:focus { |
2071 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:focus { |
1975 color: #0074a2; |
2072 color: #2271b1; |
1976 border-color: #5b9dd9; |
2073 border-color: #4f94d4; |
1977 box-shadow: 0 0 3px rgba(0, 115, 170, 0.8); |
2074 box-shadow: 0 0 3px rgba(34, 113, 177, 0.8); |
1978 /* Only visible in Windows High Contrast mode */ |
2075 /* Only visible in Windows High Contrast mode */ |
1979 outline: 2px solid transparent; |
2076 outline: 2px solid transparent; |
1980 } |
2077 } |
1981 |
2078 |
1982 .wp-core-ui.media-modal .imgedit-group-top .dashicons-arrow-down.imgedit-help-toggle { |
2079 .wp-core-ui.media-modal .imgedit-group-top .dashicons-arrow-down.imgedit-help-toggle { |
2116 .image-details .embed-media-settings div { |
2213 .image-details .embed-media-settings div { |
2117 box-sizing: border-box; |
2214 box-sizing: border-box; |
2118 } |
2215 } |
2119 |
2216 |
2120 .image-details .column-settings { |
2217 .image-details .column-settings { |
2121 background: #f3f3f3; |
2218 background: #f6f7f7; |
2122 border-left: 1px solid #ddd; |
2219 border-left: 1px solid #dcdcde; |
2123 min-height: 100%; |
2220 min-height: 100%; |
2124 width: 55%; |
2221 width: 55%; |
2125 position: absolute; |
2222 position: absolute; |
2126 top: 0; |
2223 top: 0; |
2127 right: 0; |
2224 right: 0; |
2128 } |
2225 } |
2129 |
2226 |
2130 .image-details .column-settings h2 { |
2227 .image-details .column-settings h2 { |
2131 margin: 20px; |
2228 margin: 20px; |
2132 padding-top: 20px; |
2229 padding-top: 20px; |
2133 border-top: 1px solid #ddd; |
2230 border-top: 1px solid #dcdcde; |
2134 color: #23282d; |
2231 color: #1d2327; |
2135 } |
2232 } |
2136 |
2233 |
2137 .image-details .column-image { |
2234 .image-details .column-image { |
2138 width: 45%; |
2235 width: 45%; |
2139 position: absolute; |
2236 position: absolute; |
2150 max-height: 500px; |
2247 max-height: 500px; |
2151 } |
2248 } |
2152 |
2249 |
2153 .image-details .advanced-toggle { |
2250 .image-details .advanced-toggle { |
2154 padding: 0; |
2251 padding: 0; |
2155 color: #666; |
2252 color: #646970; |
2156 text-transform: uppercase; |
2253 text-transform: uppercase; |
2157 text-decoration: none; |
2254 text-decoration: none; |
2158 } |
2255 } |
2159 |
2256 |
2160 .image-details .advanced-toggle:hover, |
2257 .image-details .advanced-toggle:hover, |
2161 .image-details .advanced-toggle:active { |
2258 .image-details .advanced-toggle:active { |
2162 color: #666; |
2259 color: #646970; |
2163 } |
2260 } |
2164 |
2261 |
2165 .image-details .advanced-toggle:after { |
2262 .image-details .advanced-toggle:after { |
2166 font: normal 20px/1 dashicons; |
2263 font: normal 20px/1 dashicons; |
2167 speak: none; |
2264 speak: never; |
2168 vertical-align: top; |
2265 vertical-align: top; |
2169 -webkit-font-smoothing: antialiased; |
2266 -webkit-font-smoothing: antialiased; |
2170 -moz-osx-font-smoothing: grayscale; |
2267 -moz-osx-font-smoothing: grayscale; |
2171 content: "\f140"; |
2268 content: "\f140"; |
2172 display: inline-block; |
2269 display: inline-block; |
2317 .media-embed .setting .name, |
2414 .media-embed .setting .name, |
2318 .media-embed .setting-group .name { |
2415 .media-embed .setting-group .name { |
2319 display: inline-block; |
2416 display: inline-block; |
2320 font-size: 13px; |
2417 font-size: 13px; |
2321 line-height: 1.84615384; |
2418 line-height: 1.84615384; |
2322 color: #666; |
2419 color: #646970; |
2323 } |
2420 } |
2324 |
2421 |
2325 .media-embed .setting span { |
2422 .media-embed .setting span { |
2326 display: block; /* Back-compat for pre-5.3 */ |
2423 display: block; /* Back-compat for pre-5.3 */ |
2327 width: 200px; /* Back-compat for pre-5.3 */ |
2424 width: 200px; /* Back-compat for pre-5.3 */ |
2519 width: 230px; |
2616 width: 230px; |
2520 } |
2617 } |
2521 |
2618 |
2522 .attachments-browser .attachments, |
2619 .attachments-browser .attachments, |
2523 .attachments-browser .uploader-inline, |
2620 .attachments-browser .uploader-inline, |
2524 .attachments-browser .media-toolbar { |
2621 .attachments-browser .media-toolbar, |
|
2622 .attachments-browser .attachments-wrapper, |
|
2623 .attachments-browser.has-load-more .attachments-wrapper { |
2525 left: 262px; |
2624 left: 262px; |
2526 } |
2625 } |
2527 |
2626 |
2528 .media-sidebar .setting, |
2627 .media-sidebar .setting, |
2529 .attachment-details .setting { |
2628 .attachment-details .setting { |
2786 bottom: 0; |
2885 bottom: 0; |
2787 } |
2886 } |
2788 |
2887 |
2789 .attachments-browser .attachments, |
2888 .attachments-browser .attachments, |
2790 .attachments-browser .uploader-inline, |
2889 .attachments-browser .uploader-inline, |
2791 .attachments-browser .media-toolbar { |
2890 .attachments-browser .media-toolbar, |
|
2891 .media-frame-content .attachments-browser .attachments-wrapper { |
2792 left: 0; |
2892 left: 0; |
|
2893 } |
|
2894 |
|
2895 .attachments-browser .attachments-wrapper { |
|
2896 padding-top: 12px; |
2793 } |
2897 } |
2794 |
2898 |
2795 .image-details .media-frame-title { |
2899 .image-details .media-frame-title { |
2796 display: block; |
2900 display: block; |
2797 top: 0; |
2901 top: 0; |
2811 |
2915 |
2812 /* Media tabs on the top */ |
2916 /* Media tabs on the top */ |
2813 .media-frame-content .media-toolbar .instructions { |
2917 .media-frame-content .media-toolbar .instructions { |
2814 display: none; |
2918 display: none; |
2815 } |
2919 } |
|
2920 |
|
2921 /* Change margin direction on load more button in responsive views. */ |
|
2922 .load-more-wrapper .load-more-jump { |
|
2923 margin: 12px 0 0 0; |
|
2924 } |
|
2925 |
2816 } |
2926 } |
2817 |
2927 |
2818 @media only screen and (min-width: 901px) and (max-height: 400px) { |
2928 @media only screen and (min-width: 901px) and (max-height: 400px) { |
2819 .media-menu, |
2929 .media-menu, |
2820 .media-frame:not(.hide-menu) .media-menu { |
2930 .media-frame:not(.hide-menu) .media-menu { |
2821 top: 0; |
2931 top: 0; |
2822 padding-top: 44px; |
2932 padding-top: 44px; |
2823 } |
2933 } |
|
2934 |
|
2935 /* Change margin direction on load more button in responsive views. */ |
|
2936 .load-more-wrapper .load-more-jump { |
|
2937 margin: 12px 0 0 0; |
|
2938 } |
|
2939 |
2824 } |
2940 } |
2825 |
2941 |
2826 @media only screen and (max-width: 480px) { |
2942 @media only screen and (max-width: 480px) { |
2827 .wp-core-ui.wp-customizer .media-button { |
2943 .wp-core-ui.wp-customizer .media-button { |
2828 margin-top: 13px; |
2944 margin-top: 13px; |