82 |
82 |
83 .media-widget-buttons .button:first-child { |
83 .media-widget-buttons .button:first-child { |
84 margin-right: 8px; |
84 margin-right: 8px; |
85 } |
85 } |
86 |
86 |
|
87 .media-widget-control .attachment-media-view .button-add-media, |
87 .media-widget-control .placeholder { |
88 .media-widget-control .placeholder { |
88 border: 1px dashed #b4b9be; |
89 border: 1px dashed #b4b9be; |
89 box-sizing: border-box; |
90 box-sizing: border-box; |
90 cursor: pointer; |
91 cursor: pointer; |
91 line-height: 20px; |
92 line-height: 1.6; |
92 padding: 9px 0; |
93 padding: 9px 0; |
93 position: relative; |
94 position: relative; |
94 text-align: center; |
95 text-align: center; |
95 width: 100%; |
96 width: 100%; |
|
97 } |
|
98 |
|
99 .media-widget-control .attachment-media-view .button-add-media { |
|
100 cursor: pointer; |
|
101 background-color: #edeff0; |
|
102 color: #32373c; |
|
103 } |
|
104 |
|
105 .media-widget-control .attachment-media-view .button-add-media:hover { |
|
106 background-color: #fbfbfc; |
|
107 } |
|
108 |
|
109 .media-widget-control .attachment-media-view .button-add-media:focus { |
|
110 background-color: #fbfbfc; |
|
111 border-style: solid; |
|
112 border-color: #5b9dd9; |
|
113 box-shadow: 0 0 3px rgba( 0, 115, 170, .8 ); |
|
114 /* Only visible in Windows High Contrast mode */ |
|
115 outline: 2px solid transparent; |
|
116 outline-offset: -2px; |
96 } |
117 } |
97 |
118 |
98 .media-widget-control .media-widget-preview { |
119 .media-widget-control .media-widget-preview { |
99 background: transparent; |
120 background: transparent; |
100 text-align: center; |
121 text-align: center; |
219 position: absolute; |
238 position: absolute; |
220 top: 0; |
239 top: 0; |
221 bottom: 0; |
240 bottom: 0; |
222 width: 100%; |
241 width: 100%; |
223 box-sizing: border-box; |
242 box-sizing: border-box; |
224 display: -webkit-box; |
|
225 display: flex; |
243 display: flex; |
226 -webkit-box-align: center; |
|
227 align-items: center; |
244 align-items: center; |
228 -webkit-box-pack: center; |
|
229 justify-content: center; |
245 justify-content: center; |
230 background-color: rgba( 0, 0, 0, .5 ); |
246 background-color: rgba(0, 0, 0, 0.5); |
231 } |
247 } |
232 |
248 |
233 .media-widget-gallery-preview .gallery-icon-placeholder-text { |
249 .media-widget-gallery-preview .gallery-icon-placeholder-text { |
234 font-weight: 600; |
250 font-weight: 600; |
235 font-size: 2em; |
251 font-size: 2em; |
489 } |
501 } |
490 |
502 |
491 /* Dragging a widget over a closed sidebar */ |
503 /* Dragging a widget over a closed sidebar */ |
492 #widgets-right .widgets-holder-wrap.widget-hover { |
504 #widgets-right .widgets-holder-wrap.widget-hover { |
493 border-color: #72777c; |
505 border-color: #72777c; |
494 box-shadow: 0 1px 2px rgba(0,0,0,0.3); |
506 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); |
495 } |
507 } |
496 |
508 |
497 /* Accessibility Mode */ |
509 /* Accessibility Mode */ |
|
510 .widget-access-link { |
|
511 float: right; |
|
512 margin: -5px 0 10px 10px; |
|
513 } |
|
514 |
498 .widgets_access #widgets-left .widget .widget-top { |
515 .widgets_access #widgets-left .widget .widget-top { |
499 cursor: auto; |
516 cursor: auto; |
500 } |
517 } |
501 |
518 |
502 .widgets_access #wpwrap .widgets-holder-wrap.closed .sidebar-description, |
519 .widgets_access #wpwrap .widgets-holder-wrap.closed .sidebar-description, |
509 .widgets_access #widgets-right .widget .widget-top:hover { |
526 .widgets_access #widgets-right .widget .widget-top:hover { |
510 border-color: #ddd; |
527 border-color: #ddd; |
511 } |
528 } |
512 |
529 |
513 #available-widgets .widget-control-edit .edit, |
530 #available-widgets .widget-control-edit .edit, |
|
531 #available-widgets .widget-action .edit, |
514 #widgets-left .inactive-sidebar .widget-control-edit .add, |
532 #widgets-left .inactive-sidebar .widget-control-edit .add, |
515 #widgets-right .widget-control-edit .add { |
533 #widgets-left .inactive-sidebar .widget-action .add, |
|
534 #widgets-right .widget-control-edit .add, |
|
535 #widgets-right .widget-action .add { |
516 display: none; |
536 display: none; |
517 } |
537 } |
518 |
538 |
519 .widget-control-edit { |
539 .widget-control-edit { |
520 display: block; |
540 display: block; |
521 color: #666; |
541 color: #666; |
522 background: #EEE; |
542 background: #EEE; |
523 padding: 0 15px; |
543 padding: 0 15px; |
524 line-height: 43px; |
544 line-height: 3.35; |
525 border-left: 1px solid #DDD; |
545 border-left: 1px solid #DDD; |
526 } |
546 } |
527 |
547 |
528 #widgets-left .widget-control-edit:hover, |
548 #widgets-left .widget-control-edit:hover, |
529 #widgets-right .widget-control-edit:hover { |
549 #widgets-right .widget-control-edit:hover { |
638 #widgets-left .widget-in-question .widget-top, |
658 #widgets-left .widget-in-question .widget-top, |
639 #available-widgets .widget-top:hover, |
659 #available-widgets .widget-top:hover, |
640 div#widgets-right .widget-top:hover, |
660 div#widgets-right .widget-top:hover, |
641 #widgets-left .widget-top:hover { |
661 #widgets-left .widget-top:hover { |
642 border-color: #999; |
662 border-color: #999; |
643 box-shadow: 0 1px 2px rgba(0,0,0,0.1); |
663 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); |
644 } |
664 } |
645 |
665 |
646 .widgets-chooser ul.widgets-chooser-sidebars { |
666 .widgets-chooser ul.widgets-chooser-sidebars { |
647 margin: 0; |
667 margin: 0; |
648 list-style-type: none; |
668 list-style-type: none; |
657 .widgets-chooser ul { |
677 .widgets-chooser ul { |
658 border: 1px solid #ccc; |
678 border: 1px solid #ccc; |
659 } |
679 } |
660 |
680 |
661 .widgets-chooser li { |
681 .widgets-chooser li { |
662 padding: 10px 15px 10px 35px; |
|
663 border-bottom: 1px solid #ccc; |
682 border-bottom: 1px solid #ccc; |
664 background: #fff; |
683 background: #fff; |
665 margin: 0; |
684 margin: 0; |
|
685 position: relative; |
|
686 } |
|
687 |
|
688 .widgets-chooser .widgets-chooser-button { |
|
689 width: 100%; |
|
690 padding: 10px 15px 10px 35px; |
|
691 background: transparent; |
|
692 border: 0; |
|
693 box-sizing: border-box; |
|
694 text-align: left; |
666 cursor: pointer; |
695 cursor: pointer; |
|
696 transition: background 0.2s ease-in-out; |
|
697 } |
|
698 |
|
699 /* @todo looks like these hover/focus states are overridden by .widgets-chooser-selected */ |
|
700 .widgets-chooser .widgets-chooser-button:hover, |
|
701 .widgets-chooser .widgets-chooser-button:focus { |
667 outline: none; |
702 outline: none; |
668 position: relative; |
703 text-decoration: underline; |
669 transition: background 0.2s ease-in-out; |
|
670 } |
|
671 |
|
672 /* @todo looks like these hover/focus states are overridden by .widgets-chooser-selected */ |
|
673 .widgets-chooser li:hover, |
|
674 .widgets-chooser li:focus { |
|
675 background: rgba(255,255,255,0.7); |
|
676 } |
|
677 |
|
678 .widgets-chooser li:focus:before { |
|
679 content: "\f147"; |
|
680 display: block; |
|
681 -webkit-font-smoothing: antialiased; |
|
682 font: normal 26px/1 dashicons; |
|
683 color: #555d66; |
|
684 position: absolute; |
|
685 top: 7px; |
|
686 left: 5px; |
|
687 } |
704 } |
688 |
705 |
689 .widgets-chooser li:last-child { |
706 .widgets-chooser li:last-child { |
690 border: none; |
707 border: none; |
691 } |
708 } |
692 |
709 |
693 .widgets-chooser li.widgets-chooser-selected { |
710 .widgets-chooser .widgets-chooser-selected .widgets-chooser-button { |
694 background: #00a0d2; |
711 background: #0073aa; |
695 color: #fff; |
712 color: #fff; |
696 } |
713 } |
697 |
714 |
698 .widgets-chooser li.widgets-chooser-selected:before, |
715 .widgets-chooser .widgets-chooser-selected:before { |
699 .widgets-chooser li.widgets-chooser-selected:focus:before { |
|
700 content: "\f147"; |
716 content: "\f147"; |
701 display: block; |
717 display: block; |
702 -webkit-font-smoothing: antialiased; |
718 -webkit-font-smoothing: antialiased; |
703 font: normal 26px/1 dashicons; |
719 font: normal 26px/1 dashicons; |
704 color: #fff; |
720 color: #fff; |