1 /* Include margin and padding in the width calculation of input and textarea. */
4 -webkit-box-sizing: border-box;
5 -moz-box-sizing: border-box;
6 box-sizing: border-box;
10 input[type="password"],
11 input[type="checkbox"],
14 input[type="datetime"],
15 input[type="datetime-local"],
19 input[type="password"],
29 border: 1px solid #ddd;
30 -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
31 box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
32 background-color: #fff;
35 -webkit-transition: 0.05s border-color ease-in-out;
36 transition: 0.05s border-color ease-in-out;
39 input[type="text"]:focus,
40 input[type="password"]:focus,
41 input[type="color"]:focus,
42 input[type="date"]:focus,
43 input[type="datetime"]:focus,
44 input[type="datetime-local"]:focus,
45 input[type="email"]:focus,
46 input[type="month"]:focus,
47 input[type="number"]:focus,
48 input[type="password"]:focus,
49 input[type="search"]:focus,
50 input[type="tel"]:focus,
51 input[type="text"]:focus,
52 input[type="time"]:focus,
53 input[type="url"]:focus,
54 input[type="week"]:focus,
55 input[type="checkbox"]:focus,
56 input[type="radio"]:focus,
59 border-color: #5b9dd9;
60 -webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
61 box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
70 input[type="checkbox"],
72 border: 1px solid #b4b9be;
77 display: inline-block;
82 padding: 0 !important;
84 vertical-align: middle;
87 -webkit-appearance: none;
88 -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
89 box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
90 -webkit-transition: .05s border-color ease-in-out;
91 transition: .05s border-color ease-in-out;
94 input[type="radio"]:checked + label:before {
98 .wp-core-ui input[type="reset"]:hover,
99 .wp-core-ui input[type="reset"]:active {
103 td > input[type="checkbox"],
104 .wp-admin p input[type="checkbox"],
105 .wp-admin p input[type="radio"] {
109 .wp-admin p label input[type="checkbox"] {
113 .wp-admin p label input[type="radio"] {
117 input[type="radio"] {
118 -webkit-border-radius: 50%;
124 input[type="checkbox"]:checked:before,
125 input[type="radio"]:checked:before {
127 display: inline-block;
128 vertical-align: middle;
130 font: normal 21px/1 'dashicons';
132 -webkit-font-smoothing: antialiased;
133 -moz-osx-font-smoothing: grayscale;
136 input[type="checkbox"]:checked:before {
138 margin: -3px -4px 0 0;
142 input[type="radio"]:checked:before {
144 text-indent: -9999px;
145 -webkit-border-radius: 50px;
152 background-color: #1e8cbe;
155 @-moz-document url-prefix() {
156 input[type="checkbox"],
158 .form-table input.tog {
164 input[type="search"] {
165 -webkit-appearance: textfield;
168 input[type="search"]::-webkit-search-decoration {
172 .ie8 input[type="password"] {
173 font-family: sans-serif;
180 font-family: inherit;
182 font-weight: inherit;
190 -webkit-border-radius: 0;
191 border-radius: 0; /* Reset mobile webkit's default element styling */
200 .wp-admin input[type="file"] {
220 padding: 4px 6px 1px 6px;
227 background-color: #eee;
231 .wp-core-ui :-moz-placeholder {
235 .form-invalid input, .form-invalid input:focus,
236 .form-invalid select, .form-invalid select:focus {
237 border-color: #dc3232 !important;
238 -webkit-box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
239 box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
242 .form-table .form-required.form-invalid td:after {
244 font: normal 20px/1 dashicons;
247 vertical-align: middle;
260 background: rgba( 255, 255, 255, 0.5 );
261 border-color: rgba( 222, 222, 222, 0.75 );
262 -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
263 box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
264 color: rgba( 51, 51, 51, 0.5 );
267 input[type="file"]:disabled,
268 input[type="file"].disabled,
269 input[type="range"]:disabled,
270 input[type="range"].disabled {
272 -webkit-box-shadow: none;
276 input[type="checkbox"]:disabled,
277 input[type="checkbox"].disabled,
278 input[type="radio"]:disabled,
279 input[type="radio"].disabled,
280 input[type="checkbox"]:disabled:checked:before,
281 input[type="checkbox"].disabled:checked:before,
282 input[type="radio"]:disabled:checked:before,
283 input[type="radio"].disabled:checked:before {
287 /*------------------------------------------------------------------------------
289 ------------------------------------------------------------------------------*/
296 vertical-align: middle;
299 .wp-admin .button-cancel {
304 .meta-box-sortables select {
308 .wp-admin select[multiple] {
315 -webkit-border-bottom-right-radius: 3px;
316 border-bottom-right-radius: 3px;
317 -webkit-border-bottom-left-radius: 3px;
318 border-bottom-left-radius: 3px;
322 form p.submit a.cancel:hover {
323 text-decoration: none;
333 .textright p.submit {
338 table.form-table + p.submit,
339 table.form-table + input + p.submit,
340 table.form-table + input + input + p.submit {
345 #minor-publishing-actions input,
346 #major-publishing-actions input,
347 #minor-publishing-actions .preview {
351 textarea.all-options,
357 textarea.large-text {
370 input[type="number"].small-text {
381 .tablenav #delete_all,
382 .tablenav #clear-recent-list,
383 .wp-filter #delete_all {
387 .tablenav .actions select {
393 .ie8 .tablenav .actions select {
397 .ie8 .tablenav .actions select#cat {
401 #timezone_string option {
409 button.wp-hide-pw > .dashicons {
415 #your-profile label + a {
416 vertical-align: middle;
420 #your-profile label + a {
421 vertical-align: middle;
424 .options-media-php label[for*="_size_"],
425 #misc-publishing-actions label {
426 vertical-align: baseline;
429 #misc-publishing-actions label[for="post_status"]:before {
431 display: inline-block;
432 font: normal 20px/1 'dashicons';
438 text-decoration: none !important;
440 -webkit-font-smoothing: antialiased;
441 -moz-osx-font-smoothing: grayscale;
444 #pass-strength-result {
445 background-color: #eee;
446 border: 1px solid #ddd;
448 margin: -2px 1px 5px 5px;
452 -webkit-box-sizing: border-box;
453 -moz-box-sizing: border-box;
454 box-sizing: border-box;
458 #pass-strength-result.short {
459 background-color: #f1adad;
460 border-color: #e35b5b;
464 #pass-strength-result.bad {
465 background-color: #fbc5a9;
466 border-color: #f78b53;
470 #pass-strength-result.good {
471 background-color: #ffe399;
472 border-color: #ffc733;
476 #pass-strength-result.strong {
477 background-color: #c1e1b9;
478 border-color: #83c373;
482 #pass1.short, #pass1-text.short {
483 border-color: #e35b5b;
486 #pass1.bad, #pass1-text.bad {
487 border-color: #f78b53;
490 #pass1.good, #pass1-text.good {
491 border-color: #ffc733;
494 #pass1.strong, #pass1-text.strong {
495 border-color: #83c373;
507 .show-password #pass1 {
511 .show-password #pass1-text
513 display: inline-block;
516 .form-table span.description.important {
525 .network-admin.themes-php p.search-box {
529 .search-box input[name="s"],
530 .tablenav .search-plugins input[name="s"],
537 input[type="text"].ui-autocomplete-loading,
538 input[type="email"].ui-autocomplete-loading {
539 background-image: url(../images/loading.gif);
540 background-repeat: no-repeat;
541 background-position: left center;
545 input.ui-autocomplete-input.open {
546 border-bottom-color: transparent;
549 ul#add-to-blog-users {
559 border: 1px solid #5b9dd9;
560 -webkit-box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
561 box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
562 background-color: #fff;
565 .ui-autocomplete li {
572 .ui-autocomplete li.ui-state-focus {
573 background-color: #ddd;
577 /*------------------------------------------------------------------------------
578 15.0 - Comments Screen
579 ------------------------------------------------------------------------------*/
582 border-collapse: collapse;
600 vertical-align: middle;
608 vertical-align: baseline;
614 padding: 20px 0 20px 10px;
620 .form-table th.th-full {
630 .form-table td fieldset label {
631 margin: 0.25em 0 0.5em !important;
632 display: inline-block;
635 .form-table td fieldset label,
636 .form-table td fieldset p,
637 .form-table td fieldset li {
641 .form-table input.tog,
642 .form-table input[type="radio"] {
653 table.form-table td .updated {
657 table.form-table td .updated p {
662 /*------------------------------------------------------------------------------
664 ------------------------------------------------------------------------------*/
666 #profile-page .form-table textarea {
671 #profile-page .form-table #rich_editing {
675 #your-profile legend {
683 #adduser .form-field input,
684 #createuser .form-field input {
689 display: inline-block;
691 padding: 5px 15px 15px;
692 -webkit-box-sizing: border-box;
693 -moz-box-sizing: border-box;
694 box-sizing: border-box;
699 .color-option.selected {
706 border-collapse: collapse;
718 /*------------------------------------------------------------------------------
720 ------------------------------------------------------------------------------*/
734 padding: 0.7em 2em 1em;
737 border: 1px solid #e5e5e5;
738 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
739 box-shadow: 0 1px 1px rgba(0,0,0,0.04);
743 /* Press this styles */
749 .pressthis textarea {
754 #pressthis-code-wrap {
758 .pressthis-bookmarklet-wrapper {
765 .pressthis-bookmarklet,
766 .pressthis-bookmarklet:hover,
767 .pressthis-bookmarklet:focus,
768 .pressthis-bookmarklet:active {
769 display: inline-block;
774 -webkit-border-radius: 5px;
776 border: 1px solid #b4b4b4;
780 text-decoration: none;
783 .pressthis-bookmarklet:active {
787 .pressthis-bookmarklet:after {
795 background: transparent;
796 -webkit-transform: skew(-20deg) rotate(-6deg);
797 -ms-transform: skew(-20deg) rotate(-6deg);
798 transform: skew(-20deg) rotate(-6deg);
799 -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
800 box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
803 .pressthis-bookmarklet:hover:after {
804 -webkit-transform: skew(-20deg) rotate(-9deg);
805 -ms-transform: skew(-20deg) rotate(-9deg);
806 transform: skew(-20deg) rotate(-9deg);
807 -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
808 box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
811 .pressthis-bookmarklet span {
812 display: inline-block;
814 padding: 0px 9px 8px 12px;
817 .pressthis-bookmarklet span:before {
819 font: normal 20px/1 'dashicons';
822 display: inline-block;
827 .pressthis-js-toggle {
834 .pressthis-js-toggle .dashicons {
835 margin: 5px 7px 6px 8px;
839 /* to override the button class being applied */
840 .pressthis-js-toggle.button.button {
847 .pressthis-js-toggle .dashicons {
848 margin: 5px 7px 6px 8px;
852 /*------------------------------------------------------------------------------
854 ------------------------------------------------------------------------------*/
856 #utc-time, #local-time {
861 .defaultavatarpicker .avatar {
863 vertical-align: middle;
866 .options-general-php input.small-text {
870 .options-general-php .spinner {
875 .settings-php .language-install-spinner,
876 .options-general-php .language-install-spinner {
877 display: inline-block;
880 vertical-align: middle;
883 /*------------------------------------------------------------------------------
885 ------------------------------------------------------------------------------*/
887 .setup-php textarea {
891 .form-field #site-address {
895 .form-field #domain {
899 .form-field #site-title,
900 .form-field #admin-email,
902 .form-field #blog_registered,
903 .form-field #blog_last_updated {
916 /*------------------------------------------------------------------------------
917 Credentials check dialog for Install and Updates
918 ------------------------------------------------------------------------------*/
920 .request-filesystem-credentials-dialog {
924 .request-filesystem-credentials-dialog .notification-dialog {
929 .request-filesystem-credentials-dialog-content {
933 .request-filesystem-credentials-form input[type="text"],
934 .request-filesystem-credentials-form input[type="password"] {
938 .request-filesystem-credentials-dialog input[type="text"],
939 .request-filesystem-credentials-dialog input[type="password"] {
943 .request-filesystem-credentials-form .field-title {
947 .request-filesystem-credentials-dialog label[for="hostname"],
948 .request-filesystem-credentials-dialog label[for="public_key"],
949 .request-filesystem-credentials-dialog label[for="private_key"] {
954 .request-filesystem-credentials-dialog .ftp-username,
955 .request-filesystem-credentials-dialog .ftp-password {
960 .request-filesystem-credentials-dialog .ftp-password {
964 .request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
968 .request-filesystem-credentials-dialog label[for="ftp"] {
972 #request-filesystem-credentials-dialog .button:not(:last-child) {
976 #request-filesystem-credentials-form .cancel-button {
980 #request-filesystem-credentials-dialog .cancel-button {
986 -------------------------------------------------------------- */
988 @media screen and ( max-width: 782px ) {
991 -webkit-appearance: none;
996 input[type="search"],
997 input[type="password"],
998 input[type="number"] {
999 -webkit-appearance: none;
1004 padding-bottom: 5px;
1008 input[type="checkbox"],
1009 .widefat th input[type="checkbox"],
1010 .widefat thead td input[type="checkbox"],
1011 .widefat tfoot td input[type="checkbox"] {
1012 -webkit-appearance: none;
1016 .widefat th input[type="checkbox"],
1017 .widefat thead td input[type="checkbox"],
1018 .widefat tfoot td input[type="checkbox"] {
1022 input[type="checkbox"]:checked:before,
1023 .widefat th input[type="checkbox"]:before,
1024 .widefat thead td input[type="checkbox"]:before,
1025 .widefat tfoot td input[type="checkbox"]:before {
1026 font: normal 30px/1 'Dashicons';
1030 input[type="radio"],
1031 input[type="checkbox"] {
1036 .wp-admin p input[type="checkbox"],
1037 .wp-admin p input[type="radio"] {
1041 input[type="radio"]:checked:before {
1042 vertical-align: middle;
1049 .wp-upload-form input[type="submit"] {
1058 .wp-admin .button-cancel {
1063 #adduser .form-field input,
1064 #createuser .form-field input {
1069 -webkit-box-sizing: border-box;
1070 -moz-box-sizing: border-box;
1071 box-sizing: border-box;
1078 vertical-align: middle;
1081 .form-table .color-palette td {
1082 display: table-cell;
1086 .form-table table.color-palette {
1095 .form-table td input[type="text"],
1096 .form-table td input[type="email"],
1097 .form-table td input[type="password"],
1098 .form-table td select,
1099 .form-table td textarea,
1100 .form-table span.description,
1101 #profile-page .form-table textarea {
1108 -webkit-box-sizing: border-box;
1109 -moz-box-sizing: border-box;
1110 box-sizing: border-box;
1113 .form-table .form-required.form-invalid td:after {
1115 margin: -30px 0 0 3px;
1118 #wpbody .form-table td select {
1122 input[type="text"].small-text,
1123 input[type="search"].small-text,
1124 input[type="password"].small-text,
1125 input[type="number"].small-text,
1126 input[type="number"].small-text,
1127 .form-table input[type="text"].small-text {
1135 #pass-strength-result {
1137 -webkit-box-sizing: border-box;
1138 -moz-box-sizing: border-box;
1139 box-sizing: border-box;
1149 margin-bottom: 20px;
1152 p.search-box input[name="s"] {
1156 margin-bottom: 10px;
1157 vertical-align: middle;
1158 -webkit-appearance: none;
1161 p.search-box input[type="submit"] {
1162 margin-bottom: 10px;
1165 .form-table span.description {
1180 padding-bottom: 6px;
1185 .form-table.permalink-structure td code {
1189 .form-table.permalink-structure td input[type="text"] {
1195 .form-table input.regular-text {
1203 .form-table fieldset label {
1219 .form-field #domain {
1228 .wp-pwd [type="text"],
1229 .wp-pwd [type="password"] {
1233 .wp-pwd button.button {
1234 background: transparent;
1236 -webkit-box-shadow: none;
1246 .wp-pwd button.button:hover,
1247 .wp-pwd button.button:focus,
1248 .wp-pwd button.button:active {
1249 background: transparent;
1252 .wp-pwd .button .text {
1257 @media only screen and (max-width: 768px) {
1258 .form-field input[type="text"],
1259 .form-field input[type="email"],
1260 .form-field input[type="password"],
1262 .form-field textarea {
1266 .form-wrap .form-field {
1271 #profile-page .form-table textarea {
1277 @media only screen and (max-height: 480px) {
1278 /* Request Credentials */
1279 .request-filesystem-credentials-dialog .notification-dialog{
1291 @media screen and (max-width: 600px) {
1292 /* Color Picker Options */