WordPress 4.2

[autoinstalls/wordpress.git] / wp-admin / css / customize-widgets.css

diff --git a/wp-admin/css/customize-widgets.css b/wp-admin/css/customize-widgets.css
index 20a8a6987c3d7666af7b2d90f203aa4f2afddb00..ba95022d7d3c6742e380f7fd3a7c405af6e70c5e 100644 (file)
--- a/wp-admin/css/customize-widgets.css
+++ b/wp-admin/css/customize-widgets.css
@@ -23,13 +23,17 @@
        opacity: 0.5;
 }
 
-.customize-control-widget_form .widget-control-save,
-.customize-control-widget_form .spinner {
+.customize-control-widget_form .widget-control-save {
        display: none;
 }
 
+.customize-control-widget_form .spinner {
+       visibility: hidden;
+       margin-top: 0;
+}
+
 .customize-control-widget_form.previewer-loading .spinner {
-       display: inline;
+       visibility: visible;
 }
 
 .customize-control-widget_form.widget-form-disabled .widget-content {
@@ -156,7 +160,7 @@
        display: block;
        width: 33px; /* was 42px for mobile */
        height: 43px;
-       color: #888;
+       color: #82878c;
        text-indent: -9999px;
        cursor: pointer;
        outline: none;
@@ -255,7 +259,7 @@
 #customize-theme-controls .widget-area-select .selected {
        color: #fff;
        text-shadow: 0 -1px 0 rgba(0,0,0,.4);
-       background: #2ea2cc;
+       background: #00a0d2;
 }
 
 #customize-theme-controls .widget-area-select .selected:before {
@@ -315,7 +319,7 @@ body.adding-widget .add-new-widget,
 body.adding-widget .add-new-widget:hover {
        background: #eee;
        border-color: #999;
-       color: #333;
+       color: #32373c;
        -webkit-box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);
 }
@@ -344,14 +348,28 @@ body.adding-widget .add-new-widget:before {
        width: 300px;
        margin: 0;
        z-index: 1;
-       background: #fff;
+       background: #fff !important;
        -webkit-transition: all 0.2s;
        transition: all 0.2s;
        border-right: 1px solid #dddddd;
 }
 
+#available-widgets-list {
+       top: 46px;
+       position: absolute;
+       overflow: auto;
+       bottom: 0;
+       width: 100%;
+}
+
 #available-widgets-filter {
+       position: fixed;
+       top: 0;
+       z-index: 1;
+       width: 300px;
+       height: 46px;
        padding: 8px 17px 7px 13px;
+       background: #eee;
        border-bottom: 1px solid #e4e4e4;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
@@ -429,7 +447,7 @@ body.adding-widget #customize-preview {
        margin-right: 20px;
        width: 20px;
        height: 20px;
-       color: #333;
+       color: #32373c;
        font: normal 20px/1 'dashicons';
        text-align: center;
        -webkit-box-sizing: border-box;
@@ -601,3 +619,18 @@ body.adding-widget #customize-preview {
                top: 8px;
        }
 }
+
+@media screen and ( max-width: 640px ) {
+       body.adding-widget div#available-widgets {
+               top: 46px;
+               left: 0;
+               z-index: 10;
+               width: 100%;
+       }
+
+       #available-widgets-filter {
+               position: static;
+               width: 100%;
+               height: auto;
+       }
+}