From acdc440547a86c3e06cad46d781f785e975db7cf Mon Sep 17 00:00:00 2001 From: Matt Thomas Date: Wed, 27 Nov 2013 19:51:11 +0000 Subject: [PATCH] Design fixes to the color picker: * Apply top: 0 to .wp-color-result (open and closed). * Reduce text size in hex-value field. * Move hex-value-field styles to color-picker.css. Fixes #26289, props mattheu. Built from https://develop.svn.wordpress.org/trunk@26435 git-svn-id: http://core.svn.wordpress.org/trunk@26333 1a063a9b-81f0-0310-95a4-ce76da25c4cd --- wp-admin/css/color-picker-rtl.css | 22 +++++++++++++++++++-- wp-admin/css/color-picker-rtl.min.css | 2 +- wp-admin/css/color-picker.css | 22 +++++++++++++++++++-- wp-admin/css/color-picker.min.css | 2 +- wp-admin/css/customize-controls-rtl.css | 20 ------------------- wp-admin/css/customize-controls-rtl.min.css | 2 +- wp-admin/css/customize-controls.css | 20 ------------------- wp-admin/css/customize-controls.min.css | 2 +- 8 files changed, 44 insertions(+), 48 deletions(-) diff --git a/wp-admin/css/color-picker-rtl.css b/wp-admin/css/color-picker-rtl.css index fe41d19abe..6d90e7d8f1 100644 --- a/wp-admin/css/color-picker-rtl.css +++ b/wp-admin/css/color-picker-rtl.css @@ -59,7 +59,7 @@ border-right: 1px solid #999; } -.wp-color-result.wp-picker-open { +.wp-color-result { top: 0; } @@ -96,11 +96,29 @@ } .wp-picker-container .iris-picker { + border-radius: 0; border-color: #dfdfdf; margin-top: 6px; } -input[type="text"].iris-error { +.wp-picker-container input[type="text"].wp-color-picker { + width: 65px; + font-size: 12px; + font-family: monospace; + text-align: center; + line-height: 16px; + margin: 0; +} + +.wp-picker-container input[type="text"].wp-color-picker:focus::-webkit-input-placeholder { + color: transparent; +} + +.wp-picker-container input[type="text"].wp-color-picker:-moz-placeholder { + color: #999; +} + +.wp-picker-container input[type="text"].iris-error { background-color: #ffebe8; border-color: #c00; color: #000; diff --git a/wp-admin/css/color-picker-rtl.min.css b/wp-admin/css/color-picker-rtl.min.css index 60009d51c5..7efa4b17b3 100644 --- a/wp-admin/css/color-picker-rtl.min.css +++ b/wp-admin/css/color-picker-rtl.min.css @@ -1 +1 @@ -.wp-color-picker{width:80px}.wp-picker-container .hidden{display:none}.wp-color-result{background-color:#f7f7f7;border:1px solid #ccc;border-radius:3px;cursor:pointer;display:inline-block;height:22px;margin:0 0 6px 6px;position:relative;top:1px;user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;vertical-align:bottom;display:inline-block;padding-right:30px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.08);box-shadow:0 1px 0 rgba(0,0,0,.08)}.wp-color-result:after{background:#f7f7f7;border-radius:2px 0 0 2px;border-right:1px solid #ccc;color:#555;content:attr(title);display:block;font-size:11px;line-height:22px;padding:0 6px;position:relative;left:0;text-align:center;top:0;-webkit-box-shadow:inset 0 1px 0 #fff;box-shadow:inset 0 1px 0 #fff}.wp-color-result:hover{background:#fafafa;border-color:#999;color:#222}.wp-color-result:hover:after{color:#222;border-color:#aaa;border-right:1px solid #999}.wp-color-result.wp-picker-open{top:0}.wp-color-result.wp-picker-open:after{content:attr(data-current)}.wp-picker-container,.wp-picker-container:active{display:inline-block;outline:0}.wp-color-result:focus{border-color:#888;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 1px 2px rgba(0,0,0,.2)}.wp-color-result:focus:after{border-color:#888}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-container .button{margin-right:6px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-color:#dfdfdf;margin-top:6px}input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000} \ No newline at end of file +.wp-color-picker{width:80px}.wp-picker-container .hidden{display:none}.wp-color-result{background-color:#f7f7f7;border:1px solid #ccc;border-radius:3px;cursor:pointer;display:inline-block;height:22px;margin:0 0 6px 6px;position:relative;top:1px;user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;vertical-align:bottom;display:inline-block;padding-right:30px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.08);box-shadow:0 1px 0 rgba(0,0,0,.08)}.wp-color-result:after{background:#f7f7f7;border-radius:2px 0 0 2px;border-right:1px solid #ccc;color:#555;content:attr(title);display:block;font-size:11px;line-height:22px;padding:0 6px;position:relative;left:0;text-align:center;top:0;-webkit-box-shadow:inset 0 1px 0 #fff;box-shadow:inset 0 1px 0 #fff}.wp-color-result:hover{background:#fafafa;border-color:#999;color:#222}.wp-color-result:hover:after{color:#222;border-color:#aaa;border-right:1px solid #999}.wp-color-result{top:0}.wp-color-result.wp-picker-open:after{content:attr(data-current)}.wp-picker-container,.wp-picker-container:active{display:inline-block;outline:0}.wp-color-result:focus{border-color:#888;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 1px 2px rgba(0,0,0,.2)}.wp-color-result:focus:after{border-color:#888}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-container .button{margin-right:6px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-radius:0;border-color:#dfdfdf;margin-top:6px}.wp-picker-container input[type=text].wp-color-picker{width:65px;font-size:12px;font-family:monospace;text-align:center;line-height:16px;margin:0}.wp-picker-container input[type=text].wp-color-picker:focus::-webkit-input-placeholder{color:transparent}.wp-picker-container input[type=text].wp-color-picker:-moz-placeholder{color:#999}.wp-picker-container input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000} \ No newline at end of file diff --git a/wp-admin/css/color-picker.css b/wp-admin/css/color-picker.css index 5c0b544c9e..5fc95f5f56 100644 --- a/wp-admin/css/color-picker.css +++ b/wp-admin/css/color-picker.css @@ -59,7 +59,7 @@ border-left: 1px solid #999; } -.wp-color-result.wp-picker-open { +.wp-color-result { top: 0; } @@ -96,11 +96,29 @@ } .wp-picker-container .iris-picker { + border-radius: 0; border-color: #dfdfdf; margin-top: 6px; } -input[type="text"].iris-error { +.wp-picker-container input[type="text"].wp-color-picker { + width: 65px; + font-size: 12px; + font-family: monospace; + text-align: center; + line-height: 16px; + margin: 0; +} + +.wp-picker-container input[type="text"].wp-color-picker:focus::-webkit-input-placeholder { + color: transparent; +} + +.wp-picker-container input[type="text"].wp-color-picker:-moz-placeholder { + color: #999; +} + +.wp-picker-container input[type="text"].iris-error { background-color: #ffebe8; border-color: #c00; color: #000; diff --git a/wp-admin/css/color-picker.min.css b/wp-admin/css/color-picker.min.css index 8849131a29..a2af22d21f 100644 --- a/wp-admin/css/color-picker.min.css +++ b/wp-admin/css/color-picker.min.css @@ -1 +1 @@ -.wp-color-picker{width:80px}.wp-picker-container .hidden{display:none}.wp-color-result{background-color:#f7f7f7;border:1px solid #ccc;border-radius:3px;cursor:pointer;display:inline-block;height:22px;margin:0 6px 6px 0;position:relative;top:1px;user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;vertical-align:bottom;display:inline-block;padding-left:30px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.08);box-shadow:0 1px 0 rgba(0,0,0,.08)}.wp-color-result:after{background:#f7f7f7;border-radius:0 2px 2px 0;border-left:1px solid #ccc;color:#555;content:attr(title);display:block;font-size:11px;line-height:22px;padding:0 6px;position:relative;right:0;text-align:center;top:0;-webkit-box-shadow:inset 0 1px 0 #fff;box-shadow:inset 0 1px 0 #fff}.wp-color-result:hover{background:#fafafa;border-color:#999;color:#222}.wp-color-result:hover:after{color:#222;border-color:#aaa;border-left:1px solid #999}.wp-color-result.wp-picker-open{top:0}.wp-color-result.wp-picker-open:after{content:attr(data-current)}.wp-picker-container,.wp-picker-container:active{display:inline-block;outline:0}.wp-color-result:focus{border-color:#888;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 1px 2px rgba(0,0,0,.2)}.wp-color-result:focus:after{border-color:#888}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-container .button{margin-left:6px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-color:#dfdfdf;margin-top:6px}input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000} \ No newline at end of file +.wp-color-picker{width:80px}.wp-picker-container .hidden{display:none}.wp-color-result{background-color:#f7f7f7;border:1px solid #ccc;border-radius:3px;cursor:pointer;display:inline-block;height:22px;margin:0 6px 6px 0;position:relative;top:1px;user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;vertical-align:bottom;display:inline-block;padding-left:30px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.08);box-shadow:0 1px 0 rgba(0,0,0,.08)}.wp-color-result:after{background:#f7f7f7;border-radius:0 2px 2px 0;border-left:1px solid #ccc;color:#555;content:attr(title);display:block;font-size:11px;line-height:22px;padding:0 6px;position:relative;right:0;text-align:center;top:0;-webkit-box-shadow:inset 0 1px 0 #fff;box-shadow:inset 0 1px 0 #fff}.wp-color-result:hover{background:#fafafa;border-color:#999;color:#222}.wp-color-result:hover:after{color:#222;border-color:#aaa;border-left:1px solid #999}.wp-color-result{top:0}.wp-color-result.wp-picker-open:after{content:attr(data-current)}.wp-picker-container,.wp-picker-container:active{display:inline-block;outline:0}.wp-color-result:focus{border-color:#888;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 1px 2px rgba(0,0,0,.2)}.wp-color-result:focus:after{border-color:#888}.wp-picker-open+.wp-picker-input-wrap{display:inline-block;vertical-align:top}.wp-picker-container .button{margin-left:6px}.wp-picker-container .iris-square-slider .ui-slider-handle:focus{background-color:#555}.wp-picker-container .iris-picker{border-radius:0;border-color:#dfdfdf;margin-top:6px}.wp-picker-container input[type=text].wp-color-picker{width:65px;font-size:12px;font-family:monospace;text-align:center;line-height:16px;margin:0}.wp-picker-container input[type=text].wp-color-picker:focus::-webkit-input-placeholder{color:transparent}.wp-picker-container input[type=text].wp-color-picker:-moz-placeholder{color:#999}.wp-picker-container input[type=text].iris-error{background-color:#ffebe8;border-color:#c00;color:#000} \ No newline at end of file diff --git a/wp-admin/css/customize-controls-rtl.css b/wp-admin/css/customize-controls-rtl.css index 11cec449f6..2518214465 100644 --- a/wp-admin/css/customize-controls-rtl.css +++ b/wp-admin/css/customize-controls-rtl.css @@ -313,26 +313,6 @@ body { border-color: rgba(0, 0, 0, 0.25); } -.customize-control-color .iris-picker { - border-radius: !important 0; -} - -.accordion-section input[type="text"].color-picker-hex { - width: 65px; - font-family: monospace; - text-align: center; - line-height: 16px; -} - -/* The centered cursor overlaps the placeholder in webkit. Hide it when selected. */ -.accordion-section input[type="text"].color-picker-hex:focus::-webkit-input-placeholder { - color: transparent; -} - -.accordion-section input[type="text"].color-picker-hex:-moz-placeholder { - color: #999; -} - /* * Image Picker */ diff --git a/wp-admin/css/customize-controls-rtl.min.css b/wp-admin/css/customize-controls-rtl.min.css index 88c331f73c..f43469cc62 100644 --- a/wp-admin/css/customize-controls-rtl.min.css +++ b/wp-admin/css/customize-controls-rtl.min.css @@ -1 +1 @@ -body{overflow:hidden}#customize-controls a{text-decoration:none}#customize-controls h3{font-size:14px}#customize-controls .submit{text-align:center}#customize-controls .description{color:#666}#customize-header-actions .button-primary{float:left;margin-top:9px}#customize-header-actions .spinner{margin-top:16px;margin-left:4px}.saving #customize-header-actions .spinner{display:block}#customize-info{border:0;border-top:1px solid #ddd}#customize-info .accordion-section-title{background-color:#fff;color:#666;border-right:0;border-left:0;border-bottom:1px solid #eee}#customize-info.open .accordion-section-title,#customize-info .accordion-section-title:hover,#customize-info .accordion-section-title:focus{color:#555}#customize-info.open .accordion-section-title:after,#customize-info .accordion-section-title:hover:after,#customize-info .accordion-section-title:focus:after{color:#555}#customize-info.open .accordion-section-title{border-color:transparent}#customize-info .preview-notice{font-size:13px;line-height:24px}#customize-info .theme-name{font-size:20px;font-weight:200;line-height:24px;display:block}#customize-info .theme-screenshot{width:258px}#customize-info .theme-description{margin-top:1em;color:#666;line-height:20px}#customize-theme-controls{-webkit-box-shadow:0 1px 1px -1px rgba(0,0,0,.1);box-shadow:0 1px 1px -1px rgba(0,0,0,.1)}#customize-theme-controls .control-section{border:0}#customize-theme-controls .accordion-section-title{color:#555;background-color:#fff;border-bottom:1px solid #eee}#customize-theme-controls .accordion-section-content{color:#555;background:#fff}#customize-theme-controls .control-section:hover .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:hover,#customize-theme-controls .control-section.open .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:focus{color:#555;background:#f5f5f5}.js .control-section:hover .accordion-section-title,.js .control-section .accordion-section-title:hover,.js .control-section.open .accordion-section-title,.js .control-section .accordion-section-title:focus{background:#f5f5f5}#customize-theme-controls .control-section:hover .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:hover::after,#customize-theme-controls .control-section.open .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:focus::after{color:#555}#customize-theme-controls .control-section.open{border-bottom:1px solid #eee}#customize-theme-controls .control-section.open .accordion-section-title{border-bottom-color:#eee!important}#customize-theme-controls .control-section:last-of-type.open,#customize-theme-controls .control-section:last-of-type .accordion-section-title{border-bottom-color:#ddd}#customize-theme-controls>ul,#customize-theme-controls .accordion-section-content{margin:0}.customize-control{width:100%;float:right;clear:both;margin-bottom:8px}.customize-control select,.customize-control input[type=text],.customize-control input[type=radio],.customize-control input[type=checkbox]{line-height:28px}.customize-control input[type=text]{width:98%;line-height:18px;margin:0}.customize-control select{min-width:50%;max-width:100%;height:28px;line-height:28px}.customize-control-title{display:block;font-size:14px;line-height:24px;font-weight:600;margin-bottom:5px}.customize-control-color .color-picker,.customize-control-checkbox label,.customize-control-upload div{line-height:28px}.customize-control-checkbox input{margin-left:5px}.customize-control-radio{padding:5px 0 10px}.customize-control-radio .customize-control-title{margin-bottom:0;line-height:22px}.customize-control-radio label{line-height:32px}.customize-control-radio input{margin-left:5px}#customize-preview iframe{width:100%;height:100%}.wp-full-overlay-sidebar{background:#eee;border-left:1px solid #ddd}.collapse-sidebar{background-color:transparent!important;border:0!important;box-shadow:none!important;border-radius:!important 0}.collapse-sidebar:active,.collapse-sidebar:active .collapse-sidebar-label,.collapse-sidebar:active .collapse-sidebar-arrow:before{text-shadow:none}.collapsed .collapse-sidebar-arrow:before{color:#888}.accordion-section .dropdown{float:right;display:block;position:relative;cursor:pointer}.accordion-section .dropdown-content{overflow:hidden;float:right;min-width:30px;height:16px;line-height:16px;margin-left:16px;padding:4px 5px;border:2px solid #eee;-webkit-user-select:none;-moz-user-select:none;user-select:none}.customize-control .dropdown-arrow{position:absolute;top:0;bottom:0;left:0;width:20px;background:#eee}.customize-control .dropdown-arrow:after{content:"\f140";font:400 20px/1 dashicons;speak:none;display:block;padding:0;text-indent:0;text-align:center;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none!important;color:#333}.customize-control .dropdown-status{color:#333;background:#eee;display:none;max-width:112px}.customize-control-color .color-picker-hex{display:none}.customize-control-color.open .color-picker-hex{display:block}.customize-control-color .dropdown{margin-left:5px;margin-bottom:5px}.customize-control-color .dropdown .dropdown-content{background-color:#555;border:1px solid rgba(0,0,0,.15)}.customize-control-color .dropdown:hover .dropdown-content{border-color:rgba(0,0,0,.25)}.customize-control-color .iris-picker{border-radius:!important 0}.accordion-section input[type=text].color-picker-hex{width:65px;font-family:monospace;text-align:center;line-height:16px}.accordion-section input[type=text].color-picker-hex:focus::-webkit-input-placeholder{color:transparent}.accordion-section input[type=text].color-picker-hex:-moz-placeholder{color:#999}.customize-control-image .library,.customize-control-image .actions{display:none;float:right;width:100%}.customize-control-image.open .library,.customize-control-image.open .actions{display:block}.accordion-section .customize-control-image .dropdown-content{height:auto;min-height:24px;min-width:40px;padding:0}.accordion-section .customize-control-image .dropdown-status{padding:4px 5px}.accordion-section .customize-control-image .preview-thumbnail img{display:block;width:100%;max-width:122px;max-height:98px;margin:0 auto}.accordion-section .customize-control-image .actions{text-align:left}.accordion-section .customize-control-image .library ul{border-bottom:1px solid #ddd;float:right;width:100%;margin:10px 0 0}.accordion-section .customize-control-image .library li{color:#ccc;float:right;padding:3px 15px;margin:0;border:1px solid transparent}.accordion-section .customize-control-image .library li.library-selected{margin-bottom:-1px;padding-bottom:4px;color:#666;border-color:#ddd;border-bottom-color:#fff}.accordion-section .customize-control-image .library .thumbnail{display:block;width:100%}.accordion-section .customize-control-image .library .thumbnail img{display:block;max-width:90%;max-height:80px;margin:5px auto;padding:2px;background:#666}.accordion-section .customize-control-image .library .thumbnail:hover img{background-color:#2ea2cc}.accordion-section .customize-control-image .library-content{display:none;width:100%;float:right;padding:10px 0}.accordion-section .customize-control-image .library-content.library-selected{display:block}.accordion-section .customize-control-upload .upload-fallback,.accordion-section .customize-control-image .upload-fallback{display:none}.accordion-section .customize-control-upload .upload-dropzone,.accordion-section .customize-control-image .upload-dropzone{display:none;padding:15px 10px;border:3px dashed #dfdfdf;margin:5px auto;text-align:center;position:relative;cursor:default}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop{display:block;-webkit-transition:border-color .1s;-moz-transition:border-color .1s;-ms-transition:border-color .1s;-o-transition:border-color .1s;transition:border-color .1s}.accordion-section .customize-control-upload .library ul li,.accordion-section .customize-control-image .library ul li{cursor:pointer}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over{border-color:#83b4d8}.ios .wp-full-overlay{position:relative}.ios #customize-preview{position:relative}.ios #customize-controls .wp-full-overlay-sidebar-content{-webkit-overflow-scrolling:touch}body.cheatin{min-width:0;background:#f9f9f9;padding:50px}body.cheatin p{max-width:700px;margin:0 auto;padding:2em;font-size:14px;background:#555;border:1px solid #dfdfdf;-webkit-border-radius:3px;border-radius:3px} \ No newline at end of file +body{overflow:hidden}#customize-controls a{text-decoration:none}#customize-controls h3{font-size:14px}#customize-controls .submit{text-align:center}#customize-controls .description{color:#666}#customize-header-actions .button-primary{float:left;margin-top:9px}#customize-header-actions .spinner{margin-top:16px;margin-left:4px}.saving #customize-header-actions .spinner{display:block}#customize-info{border:0;border-top:1px solid #ddd}#customize-info .accordion-section-title{background-color:#fff;color:#666;border-right:0;border-left:0;border-bottom:1px solid #eee}#customize-info.open .accordion-section-title,#customize-info .accordion-section-title:hover,#customize-info .accordion-section-title:focus{color:#555}#customize-info.open .accordion-section-title:after,#customize-info .accordion-section-title:hover:after,#customize-info .accordion-section-title:focus:after{color:#555}#customize-info.open .accordion-section-title{border-color:transparent}#customize-info .preview-notice{font-size:13px;line-height:24px}#customize-info .theme-name{font-size:20px;font-weight:200;line-height:24px;display:block}#customize-info .theme-screenshot{width:258px}#customize-info .theme-description{margin-top:1em;color:#666;line-height:20px}#customize-theme-controls{-webkit-box-shadow:0 1px 1px -1px rgba(0,0,0,.1);box-shadow:0 1px 1px -1px rgba(0,0,0,.1)}#customize-theme-controls .control-section{border:0}#customize-theme-controls .accordion-section-title{color:#555;background-color:#fff;border-bottom:1px solid #eee}#customize-theme-controls .accordion-section-content{color:#555;background:#fff}#customize-theme-controls .control-section:hover .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:hover,#customize-theme-controls .control-section.open .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:focus{color:#555;background:#f5f5f5}.js .control-section:hover .accordion-section-title,.js .control-section .accordion-section-title:hover,.js .control-section.open .accordion-section-title,.js .control-section .accordion-section-title:focus{background:#f5f5f5}#customize-theme-controls .control-section:hover .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:hover::after,#customize-theme-controls .control-section.open .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:focus::after{color:#555}#customize-theme-controls .control-section.open{border-bottom:1px solid #eee}#customize-theme-controls .control-section.open .accordion-section-title{border-bottom-color:#eee!important}#customize-theme-controls .control-section:last-of-type.open,#customize-theme-controls .control-section:last-of-type .accordion-section-title{border-bottom-color:#ddd}#customize-theme-controls>ul,#customize-theme-controls .accordion-section-content{margin:0}.customize-control{width:100%;float:right;clear:both;margin-bottom:8px}.customize-control select,.customize-control input[type=text],.customize-control input[type=radio],.customize-control input[type=checkbox]{line-height:28px}.customize-control input[type=text]{width:98%;line-height:18px;margin:0}.customize-control select{min-width:50%;max-width:100%;height:28px;line-height:28px}.customize-control-title{display:block;font-size:14px;line-height:24px;font-weight:600;margin-bottom:5px}.customize-control-color .color-picker,.customize-control-checkbox label,.customize-control-upload div{line-height:28px}.customize-control-checkbox input{margin-left:5px}.customize-control-radio{padding:5px 0 10px}.customize-control-radio .customize-control-title{margin-bottom:0;line-height:22px}.customize-control-radio label{line-height:32px}.customize-control-radio input{margin-left:5px}#customize-preview iframe{width:100%;height:100%}.wp-full-overlay-sidebar{background:#eee;border-left:1px solid #ddd}.collapse-sidebar{background-color:transparent!important;border:0!important;box-shadow:none!important;border-radius:!important 0}.collapse-sidebar:active,.collapse-sidebar:active .collapse-sidebar-label,.collapse-sidebar:active .collapse-sidebar-arrow:before{text-shadow:none}.collapsed .collapse-sidebar-arrow:before{color:#888}.accordion-section .dropdown{float:right;display:block;position:relative;cursor:pointer}.accordion-section .dropdown-content{overflow:hidden;float:right;min-width:30px;height:16px;line-height:16px;margin-left:16px;padding:4px 5px;border:2px solid #eee;-webkit-user-select:none;-moz-user-select:none;user-select:none}.customize-control .dropdown-arrow{position:absolute;top:0;bottom:0;left:0;width:20px;background:#eee}.customize-control .dropdown-arrow:after{content:"\f140";font:400 20px/1 dashicons;speak:none;display:block;padding:0;text-indent:0;text-align:center;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none!important;color:#333}.customize-control .dropdown-status{color:#333;background:#eee;display:none;max-width:112px}.customize-control-color .color-picker-hex{display:none}.customize-control-color.open .color-picker-hex{display:block}.customize-control-color .dropdown{margin-left:5px;margin-bottom:5px}.customize-control-color .dropdown .dropdown-content{background-color:#555;border:1px solid rgba(0,0,0,.15)}.customize-control-color .dropdown:hover .dropdown-content{border-color:rgba(0,0,0,.25)}.customize-control-image .library,.customize-control-image .actions{display:none;float:right;width:100%}.customize-control-image.open .library,.customize-control-image.open .actions{display:block}.accordion-section .customize-control-image .dropdown-content{height:auto;min-height:24px;min-width:40px;padding:0}.accordion-section .customize-control-image .dropdown-status{padding:4px 5px}.accordion-section .customize-control-image .preview-thumbnail img{display:block;width:100%;max-width:122px;max-height:98px;margin:0 auto}.accordion-section .customize-control-image .actions{text-align:left}.accordion-section .customize-control-image .library ul{border-bottom:1px solid #ddd;float:right;width:100%;margin:10px 0 0}.accordion-section .customize-control-image .library li{color:#ccc;float:right;padding:3px 15px;margin:0;border:1px solid transparent}.accordion-section .customize-control-image .library li.library-selected{margin-bottom:-1px;padding-bottom:4px;color:#666;border-color:#ddd;border-bottom-color:#fff}.accordion-section .customize-control-image .library .thumbnail{display:block;width:100%}.accordion-section .customize-control-image .library .thumbnail img{display:block;max-width:90%;max-height:80px;margin:5px auto;padding:2px;background:#666}.accordion-section .customize-control-image .library .thumbnail:hover img{background-color:#2ea2cc}.accordion-section .customize-control-image .library-content{display:none;width:100%;float:right;padding:10px 0}.accordion-section .customize-control-image .library-content.library-selected{display:block}.accordion-section .customize-control-upload .upload-fallback,.accordion-section .customize-control-image .upload-fallback{display:none}.accordion-section .customize-control-upload .upload-dropzone,.accordion-section .customize-control-image .upload-dropzone{display:none;padding:15px 10px;border:3px dashed #dfdfdf;margin:5px auto;text-align:center;position:relative;cursor:default}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop{display:block;-webkit-transition:border-color .1s;-moz-transition:border-color .1s;-ms-transition:border-color .1s;-o-transition:border-color .1s;transition:border-color .1s}.accordion-section .customize-control-upload .library ul li,.accordion-section .customize-control-image .library ul li{cursor:pointer}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over{border-color:#83b4d8}.ios .wp-full-overlay{position:relative}.ios #customize-preview{position:relative}.ios #customize-controls .wp-full-overlay-sidebar-content{-webkit-overflow-scrolling:touch}body.cheatin{min-width:0;background:#f9f9f9;padding:50px}body.cheatin p{max-width:700px;margin:0 auto;padding:2em;font-size:14px;background:#555;border:1px solid #dfdfdf;-webkit-border-radius:3px;border-radius:3px} \ No newline at end of file diff --git a/wp-admin/css/customize-controls.css b/wp-admin/css/customize-controls.css index 3ebb07239a..63a3a3a4c1 100644 --- a/wp-admin/css/customize-controls.css +++ b/wp-admin/css/customize-controls.css @@ -313,26 +313,6 @@ body { border-color: rgba(0, 0, 0, 0.25); } -.customize-control-color .iris-picker { - border-radius: 0 !important; -} - -.accordion-section input[type="text"].color-picker-hex { - width: 65px; - font-family: monospace; - text-align: center; - line-height: 16px; -} - -/* The centered cursor overlaps the placeholder in webkit. Hide it when selected. */ -.accordion-section input[type="text"].color-picker-hex:focus::-webkit-input-placeholder { - color: transparent; -} - -.accordion-section input[type="text"].color-picker-hex:-moz-placeholder { - color: #999; -} - /* * Image Picker */ diff --git a/wp-admin/css/customize-controls.min.css b/wp-admin/css/customize-controls.min.css index 43612dcc84..b706a2bdfe 100644 --- a/wp-admin/css/customize-controls.min.css +++ b/wp-admin/css/customize-controls.min.css @@ -1 +1 @@ -body{overflow:hidden}#customize-controls a{text-decoration:none}#customize-controls h3{font-size:14px}#customize-controls .submit{text-align:center}#customize-controls .description{color:#666}#customize-header-actions .button-primary{float:right;margin-top:9px}#customize-header-actions .spinner{margin-top:16px;margin-right:4px}.saving #customize-header-actions .spinner{display:block}#customize-info{border:0;border-top:1px solid #ddd}#customize-info .accordion-section-title{background-color:#fff;color:#666;border-left:0;border-right:0;border-bottom:1px solid #eee}#customize-info.open .accordion-section-title,#customize-info .accordion-section-title:hover,#customize-info .accordion-section-title:focus{color:#555}#customize-info.open .accordion-section-title:after,#customize-info .accordion-section-title:hover:after,#customize-info .accordion-section-title:focus:after{color:#555}#customize-info.open .accordion-section-title{border-color:transparent}#customize-info .preview-notice{font-size:13px;line-height:24px}#customize-info .theme-name{font-size:20px;font-weight:200;line-height:24px;display:block}#customize-info .theme-screenshot{width:258px}#customize-info .theme-description{margin-top:1em;color:#666;line-height:20px}#customize-theme-controls{-webkit-box-shadow:0 1px 1px -1px rgba(0,0,0,.1);box-shadow:0 1px 1px -1px rgba(0,0,0,.1)}#customize-theme-controls .control-section{border:0}#customize-theme-controls .accordion-section-title{color:#555;background-color:#fff;border-bottom:1px solid #eee}#customize-theme-controls .accordion-section-content{color:#555;background:#fff}#customize-theme-controls .control-section:hover .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:hover,#customize-theme-controls .control-section.open .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:focus{color:#555;background:#f5f5f5}.js .control-section:hover .accordion-section-title,.js .control-section .accordion-section-title:hover,.js .control-section.open .accordion-section-title,.js .control-section .accordion-section-title:focus{background:#f5f5f5}#customize-theme-controls .control-section:hover .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:hover::after,#customize-theme-controls .control-section.open .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:focus::after{color:#555}#customize-theme-controls .control-section.open{border-bottom:1px solid #eee}#customize-theme-controls .control-section.open .accordion-section-title{border-bottom-color:#eee!important}#customize-theme-controls .control-section:last-of-type.open,#customize-theme-controls .control-section:last-of-type .accordion-section-title{border-bottom-color:#ddd}#customize-theme-controls>ul,#customize-theme-controls .accordion-section-content{margin:0}.customize-control{width:100%;float:left;clear:both;margin-bottom:8px}.customize-control select,.customize-control input[type=text],.customize-control input[type=radio],.customize-control input[type=checkbox]{line-height:28px}.customize-control input[type=text]{width:98%;line-height:18px;margin:0}.customize-control select{min-width:50%;max-width:100%;height:28px;line-height:28px}.customize-control-title{display:block;font-size:14px;line-height:24px;font-weight:600;margin-bottom:5px}.customize-control-color .color-picker,.customize-control-checkbox label,.customize-control-upload div{line-height:28px}.customize-control-checkbox input{margin-right:5px}.customize-control-radio{padding:5px 0 10px}.customize-control-radio .customize-control-title{margin-bottom:0;line-height:22px}.customize-control-radio label{line-height:32px}.customize-control-radio input{margin-right:5px}#customize-preview iframe{width:100%;height:100%}.wp-full-overlay-sidebar{background:#eee;border-right:1px solid #ddd}.collapse-sidebar{background-color:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}.collapse-sidebar:active,.collapse-sidebar:active .collapse-sidebar-label,.collapse-sidebar:active .collapse-sidebar-arrow:before{text-shadow:none}.collapsed .collapse-sidebar-arrow:before{color:#888}.accordion-section .dropdown{float:left;display:block;position:relative;cursor:pointer}.accordion-section .dropdown-content{overflow:hidden;float:left;min-width:30px;height:16px;line-height:16px;margin-right:16px;padding:4px 5px;border:2px solid #eee;-webkit-user-select:none;-moz-user-select:none;user-select:none}.customize-control .dropdown-arrow{position:absolute;top:0;bottom:0;right:0;width:20px;background:#eee}.customize-control .dropdown-arrow:after{content:"\f140";font:400 20px/1 dashicons;speak:none;display:block;padding:0;text-indent:0;text-align:center;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none!important;color:#333}.customize-control .dropdown-status{color:#333;background:#eee;display:none;max-width:112px}.customize-control-color .color-picker-hex{display:none}.customize-control-color.open .color-picker-hex{display:block}.customize-control-color .dropdown{margin-right:5px;margin-bottom:5px}.customize-control-color .dropdown .dropdown-content{background-color:#555;border:1px solid rgba(0,0,0,.15)}.customize-control-color .dropdown:hover .dropdown-content{border-color:rgba(0,0,0,.25)}.customize-control-color .iris-picker{border-radius:0!important}.accordion-section input[type=text].color-picker-hex{width:65px;font-family:monospace;text-align:center;line-height:16px}.accordion-section input[type=text].color-picker-hex:focus::-webkit-input-placeholder{color:transparent}.accordion-section input[type=text].color-picker-hex:-moz-placeholder{color:#999}.customize-control-image .library,.customize-control-image .actions{display:none;float:left;width:100%}.customize-control-image.open .library,.customize-control-image.open .actions{display:block}.accordion-section .customize-control-image .dropdown-content{height:auto;min-height:24px;min-width:40px;padding:0}.accordion-section .customize-control-image .dropdown-status{padding:4px 5px}.accordion-section .customize-control-image .preview-thumbnail img{display:block;width:100%;max-width:122px;max-height:98px;margin:0 auto}.accordion-section .customize-control-image .actions{text-align:right}.accordion-section .customize-control-image .library ul{border-bottom:1px solid #ddd;float:left;width:100%;margin:10px 0 0}.accordion-section .customize-control-image .library li{color:#ccc;float:left;padding:3px 15px;margin:0;border:1px solid transparent}.accordion-section .customize-control-image .library li.library-selected{margin-bottom:-1px;padding-bottom:4px;color:#666;border-color:#ddd;border-bottom-color:#fff}.accordion-section .customize-control-image .library .thumbnail{display:block;width:100%}.accordion-section .customize-control-image .library .thumbnail img{display:block;max-width:90%;max-height:80px;margin:5px auto;padding:2px;background:#666}.accordion-section .customize-control-image .library .thumbnail:hover img{background-color:#2ea2cc}.accordion-section .customize-control-image .library-content{display:none;width:100%;float:left;padding:10px 0}.accordion-section .customize-control-image .library-content.library-selected{display:block}.accordion-section .customize-control-upload .upload-fallback,.accordion-section .customize-control-image .upload-fallback{display:none}.accordion-section .customize-control-upload .upload-dropzone,.accordion-section .customize-control-image .upload-dropzone{display:none;padding:15px 10px;border:3px dashed #dfdfdf;margin:5px auto;text-align:center;position:relative;cursor:default}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop{display:block;-webkit-transition:border-color .1s;-moz-transition:border-color .1s;-ms-transition:border-color .1s;-o-transition:border-color .1s;transition:border-color .1s}.accordion-section .customize-control-upload .library ul li,.accordion-section .customize-control-image .library ul li{cursor:pointer}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over{border-color:#83b4d8}.ios .wp-full-overlay{position:relative}.ios #customize-preview{position:relative}.ios #customize-controls .wp-full-overlay-sidebar-content{-webkit-overflow-scrolling:touch}body.cheatin{min-width:0;background:#f9f9f9;padding:50px}body.cheatin p{max-width:700px;margin:0 auto;padding:2em;font-size:14px;background:#555;border:1px solid #dfdfdf;-webkit-border-radius:3px;border-radius:3px} \ No newline at end of file +body{overflow:hidden}#customize-controls a{text-decoration:none}#customize-controls h3{font-size:14px}#customize-controls .submit{text-align:center}#customize-controls .description{color:#666}#customize-header-actions .button-primary{float:right;margin-top:9px}#customize-header-actions .spinner{margin-top:16px;margin-right:4px}.saving #customize-header-actions .spinner{display:block}#customize-info{border:0;border-top:1px solid #ddd}#customize-info .accordion-section-title{background-color:#fff;color:#666;border-left:0;border-right:0;border-bottom:1px solid #eee}#customize-info.open .accordion-section-title,#customize-info .accordion-section-title:hover,#customize-info .accordion-section-title:focus{color:#555}#customize-info.open .accordion-section-title:after,#customize-info .accordion-section-title:hover:after,#customize-info .accordion-section-title:focus:after{color:#555}#customize-info.open .accordion-section-title{border-color:transparent}#customize-info .preview-notice{font-size:13px;line-height:24px}#customize-info .theme-name{font-size:20px;font-weight:200;line-height:24px;display:block}#customize-info .theme-screenshot{width:258px}#customize-info .theme-description{margin-top:1em;color:#666;line-height:20px}#customize-theme-controls{-webkit-box-shadow:0 1px 1px -1px rgba(0,0,0,.1);box-shadow:0 1px 1px -1px rgba(0,0,0,.1)}#customize-theme-controls .control-section{border:0}#customize-theme-controls .accordion-section-title{color:#555;background-color:#fff;border-bottom:1px solid #eee}#customize-theme-controls .accordion-section-content{color:#555;background:#fff}#customize-theme-controls .control-section:hover .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:hover,#customize-theme-controls .control-section.open .accordion-section-title,#customize-theme-controls .control-section .accordion-section-title:focus{color:#555;background:#f5f5f5}.js .control-section:hover .accordion-section-title,.js .control-section .accordion-section-title:hover,.js .control-section.open .accordion-section-title,.js .control-section .accordion-section-title:focus{background:#f5f5f5}#customize-theme-controls .control-section:hover .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:hover::after,#customize-theme-controls .control-section.open .accordion-section-title::after,#customize-theme-controls .control-section .accordion-section-title:focus::after{color:#555}#customize-theme-controls .control-section.open{border-bottom:1px solid #eee}#customize-theme-controls .control-section.open .accordion-section-title{border-bottom-color:#eee!important}#customize-theme-controls .control-section:last-of-type.open,#customize-theme-controls .control-section:last-of-type .accordion-section-title{border-bottom-color:#ddd}#customize-theme-controls>ul,#customize-theme-controls .accordion-section-content{margin:0}.customize-control{width:100%;float:left;clear:both;margin-bottom:8px}.customize-control select,.customize-control input[type=text],.customize-control input[type=radio],.customize-control input[type=checkbox]{line-height:28px}.customize-control input[type=text]{width:98%;line-height:18px;margin:0}.customize-control select{min-width:50%;max-width:100%;height:28px;line-height:28px}.customize-control-title{display:block;font-size:14px;line-height:24px;font-weight:600;margin-bottom:5px}.customize-control-color .color-picker,.customize-control-checkbox label,.customize-control-upload div{line-height:28px}.customize-control-checkbox input{margin-right:5px}.customize-control-radio{padding:5px 0 10px}.customize-control-radio .customize-control-title{margin-bottom:0;line-height:22px}.customize-control-radio label{line-height:32px}.customize-control-radio input{margin-right:5px}#customize-preview iframe{width:100%;height:100%}.wp-full-overlay-sidebar{background:#eee;border-right:1px solid #ddd}.collapse-sidebar{background-color:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}.collapse-sidebar:active,.collapse-sidebar:active .collapse-sidebar-label,.collapse-sidebar:active .collapse-sidebar-arrow:before{text-shadow:none}.collapsed .collapse-sidebar-arrow:before{color:#888}.accordion-section .dropdown{float:left;display:block;position:relative;cursor:pointer}.accordion-section .dropdown-content{overflow:hidden;float:left;min-width:30px;height:16px;line-height:16px;margin-right:16px;padding:4px 5px;border:2px solid #eee;-webkit-user-select:none;-moz-user-select:none;user-select:none}.customize-control .dropdown-arrow{position:absolute;top:0;bottom:0;right:0;width:20px;background:#eee}.customize-control .dropdown-arrow:after{content:"\f140";font:400 20px/1 dashicons;speak:none;display:block;padding:0;text-indent:0;text-align:center;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none!important;color:#333}.customize-control .dropdown-status{color:#333;background:#eee;display:none;max-width:112px}.customize-control-color .color-picker-hex{display:none}.customize-control-color.open .color-picker-hex{display:block}.customize-control-color .dropdown{margin-right:5px;margin-bottom:5px}.customize-control-color .dropdown .dropdown-content{background-color:#555;border:1px solid rgba(0,0,0,.15)}.customize-control-color .dropdown:hover .dropdown-content{border-color:rgba(0,0,0,.25)}.customize-control-image .library,.customize-control-image .actions{display:none;float:left;width:100%}.customize-control-image.open .library,.customize-control-image.open .actions{display:block}.accordion-section .customize-control-image .dropdown-content{height:auto;min-height:24px;min-width:40px;padding:0}.accordion-section .customize-control-image .dropdown-status{padding:4px 5px}.accordion-section .customize-control-image .preview-thumbnail img{display:block;width:100%;max-width:122px;max-height:98px;margin:0 auto}.accordion-section .customize-control-image .actions{text-align:right}.accordion-section .customize-control-image .library ul{border-bottom:1px solid #ddd;float:left;width:100%;margin:10px 0 0}.accordion-section .customize-control-image .library li{color:#ccc;float:left;padding:3px 15px;margin:0;border:1px solid transparent}.accordion-section .customize-control-image .library li.library-selected{margin-bottom:-1px;padding-bottom:4px;color:#666;border-color:#ddd;border-bottom-color:#fff}.accordion-section .customize-control-image .library .thumbnail{display:block;width:100%}.accordion-section .customize-control-image .library .thumbnail img{display:block;max-width:90%;max-height:80px;margin:5px auto;padding:2px;background:#666}.accordion-section .customize-control-image .library .thumbnail:hover img{background-color:#2ea2cc}.accordion-section .customize-control-image .library-content{display:none;width:100%;float:left;padding:10px 0}.accordion-section .customize-control-image .library-content.library-selected{display:block}.accordion-section .customize-control-upload .upload-fallback,.accordion-section .customize-control-image .upload-fallback{display:none}.accordion-section .customize-control-upload .upload-dropzone,.accordion-section .customize-control-image .upload-dropzone{display:none;padding:15px 10px;border:3px dashed #dfdfdf;margin:5px auto;text-align:center;position:relative;cursor:default}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop{display:block;-webkit-transition:border-color .1s;-moz-transition:border-color .1s;-ms-transition:border-color .1s;-o-transition:border-color .1s;transition:border-color .1s}.accordion-section .customize-control-upload .library ul li,.accordion-section .customize-control-image .library ul li{cursor:pointer}.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over{border-color:#83b4d8}.ios .wp-full-overlay{position:relative}.ios #customize-preview{position:relative}.ios #customize-controls .wp-full-overlay-sidebar-content{-webkit-overflow-scrolling:touch}body.cheatin{min-width:0;background:#f9f9f9;padding:50px}body.cheatin p{max-width:700px;margin:0 auto;padding:2em;font-size:14px;background:#555;border:1px solid #dfdfdf;-webkit-border-radius:3px;border-radius:3px} \ No newline at end of file