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 /* Vertically align the number selector with the input. */
71 input[type="number"] {
75 input[type="checkbox"],
77 border: 1px solid #b4b9be;
82 display: inline-block;
87 padding: 0 !important;
89 vertical-align: middle;
92 -webkit-appearance: none;
93 -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
94 box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
95 -webkit-transition: .05s border-color ease-in-out;
96 transition: .05s border-color ease-in-out;
99 input[type="radio"]:checked + label:before {
103 .wp-core-ui input[type="reset"]:hover,
104 .wp-core-ui input[type="reset"]:active {
108 td > input[type="checkbox"],
109 .wp-admin p input[type="checkbox"],
110 .wp-admin p input[type="radio"] {
114 .wp-admin p label input[type="checkbox"] {
118 .wp-admin p label input[type="radio"] {
122 input[type="radio"] {
123 -webkit-border-radius: 50%;
129 input[type="checkbox"]:checked:before,
130 input[type="radio"]:checked:before {
132 display: inline-block;
133 vertical-align: middle;
135 font: normal 21px/1 dashicons;
137 -webkit-font-smoothing: antialiased;
138 -moz-osx-font-smoothing: grayscale;
141 input[type="checkbox"]:checked:before {
143 margin: -3px -4px 0 0;
147 input[type="radio"]:checked:before {
149 text-indent: -9999px;
150 -webkit-border-radius: 50px;
157 background-color: #1e8cbe;
160 @-moz-document url-prefix() {
161 input[type="checkbox"],
163 .form-table input.tog {
169 input[type="search"] {
170 -webkit-appearance: textfield;
173 input[type="search"]::-webkit-search-decoration {
177 .ie8 input[type="password"] {
178 font-family: sans-serif;
185 font-family: inherit;
187 font-weight: inherit;
195 -webkit-border-radius: 0;
196 border-radius: 0; /* Reset mobile webkit's default element styling */
206 .wp-admin input[type="file"] {
226 padding: 4px 6px 1px 6px;
233 background-color: #eee;
237 .wp-core-ui :-moz-placeholder {
241 .form-invalid input, .form-invalid input:focus,
242 .form-invalid select, .form-invalid select:focus {
243 border-color: #dc3232 !important;
244 -webkit-box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
245 box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
248 .form-table .form-required.form-invalid td:after {
250 font: normal 20px/1 dashicons;
253 vertical-align: middle;
256 /* Adjust error indicator for password layout */
257 .form-table .form-required.user-pass1-wrap.form-invalid td:after {
261 .form-table .form-required.user-pass1-wrap.form-invalid .password-input-wrapper:after {
263 font: normal 20px/1 dashicons;
265 margin: 0 -29px 0 6px;
266 vertical-align: middle;
279 background: rgba( 255, 255, 255, 0.5 );
280 border-color: rgba( 222, 222, 222, 0.75 );
281 -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
282 box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
283 color: rgba( 51, 51, 51, 0.5 );
286 input[type="file"]:disabled,
287 input[type="file"].disabled,
288 input[type="range"]:disabled,
289 input[type="range"].disabled {
291 -webkit-box-shadow: none;
295 input[type="checkbox"]:disabled,
296 input[type="checkbox"].disabled,
297 input[type="radio"]:disabled,
298 input[type="radio"].disabled,
299 input[type="checkbox"]:disabled:checked:before,
300 input[type="checkbox"].disabled:checked:before,
301 input[type="radio"]:disabled:checked:before,
302 input[type="radio"].disabled:checked:before {
306 /*------------------------------------------------------------------------------
308 ------------------------------------------------------------------------------*/
315 vertical-align: middle;
318 .wp-admin .button-cancel {
323 .meta-box-sortables select {
327 .wp-admin select[multiple] {
334 -webkit-border-bottom-right-radius: 3px;
335 border-bottom-right-radius: 3px;
336 -webkit-border-bottom-left-radius: 3px;
337 border-bottom-left-radius: 3px;
341 form p.submit a.cancel:hover {
342 text-decoration: none;
352 .textright p.submit {
357 table.form-table + p.submit,
358 table.form-table + input + p.submit,
359 table.form-table + input + input + p.submit {
364 #minor-publishing-actions input,
365 #major-publishing-actions input,
366 #minor-publishing-actions .preview {
370 textarea.all-options,
376 textarea.large-text {
389 input[type="number"].small-text {
397 input[type="number"].tiny-text {
408 .tablenav #delete_all,
409 .tablenav #clear-recent-list,
410 .wp-filter #delete_all {
414 .tablenav .actions select {
420 .ie8 .tablenav .actions select {
424 .ie8 .tablenav .actions select#cat {
428 #timezone_string option {
436 button.wp-hide-pw > .dashicons {
442 #your-profile label + a {
443 vertical-align: middle;
447 #your-profile label + a {
448 vertical-align: middle;
451 .options-media-php label[for*="_size_"],
452 #misc-publishing-actions label {
453 vertical-align: baseline;
456 #misc-publishing-actions label[for="post_status"]:before {
458 display: inline-block;
459 font: normal 20px/1 dashicons;
465 text-decoration: none !important;
467 -webkit-font-smoothing: antialiased;
468 -moz-osx-font-smoothing: grayscale;
471 #pass-strength-result {
472 background-color: #eee;
473 border: 1px solid #ddd;
475 margin: -2px 1px 5px 5px;
479 -webkit-box-sizing: border-box;
480 -moz-box-sizing: border-box;
481 box-sizing: border-box;
485 #pass-strength-result.short {
486 background-color: #f1adad;
487 border-color: #e35b5b;
491 #pass-strength-result.bad {
492 background-color: #fbc5a9;
493 border-color: #f78b53;
497 #pass-strength-result.good {
498 background-color: #ffe399;
499 border-color: #ffc733;
503 #pass-strength-result.strong {
504 background-color: #c1e1b9;
505 border-color: #83c373;
509 #pass1.short, #pass1-text.short {
510 border-color: #e35b5b;
513 #pass1.bad, #pass1-text.bad {
514 border-color: #f78b53;
517 #pass1.good, #pass1-text.good {
518 border-color: #ffc733;
521 #pass1.strong, #pass1-text.strong {
522 border-color: #83c373;
534 .show-password #pass1 {
538 .show-password #pass1-text
540 display: inline-block;
543 .form-table span.description.important {
552 .network-admin.themes-php p.search-box {
556 .search-box input[name="s"],
557 .tablenav .search-plugins input[name="s"],
564 input[type="text"].ui-autocomplete-loading,
565 input[type="email"].ui-autocomplete-loading {
566 background-image: url(../images/loading.gif);
567 background-repeat: no-repeat;
568 background-position: left center;
572 input.ui-autocomplete-input.open {
573 border-bottom-color: transparent;
576 ul#add-to-blog-users {
586 border: 1px solid #5b9dd9;
587 -webkit-box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
588 box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
589 background-color: #fff;
592 .ui-autocomplete li {
599 .ui-autocomplete li.ui-state-focus {
600 background-color: #ddd;
604 /*------------------------------------------------------------------------------
605 15.0 - Comments Screen
606 ------------------------------------------------------------------------------*/
609 border-collapse: collapse;
627 vertical-align: middle;
635 vertical-align: baseline;
641 padding: 20px 0 20px 10px;
647 .form-table th.th-full {
657 .form-table td fieldset label {
658 margin: 0.25em 0 0.5em !important;
659 display: inline-block;
662 .form-table td fieldset label,
663 .form-table td fieldset p,
664 .form-table td fieldset li {
668 .form-table input.tog,
669 .form-table input[type="radio"] {
680 table.form-table td .updated {
684 table.form-table td .updated p {
689 /*------------------------------------------------------------------------------
691 ------------------------------------------------------------------------------*/
693 #profile-page .form-table textarea {
698 #profile-page .form-table #rich_editing {
702 #your-profile legend {
710 #adduser .form-field input,
711 #createuser .form-field input {
716 display: inline-block;
718 padding: 5px 15px 15px;
719 -webkit-box-sizing: border-box;
720 -moz-box-sizing: border-box;
721 box-sizing: border-box;
726 .color-option.selected {
733 border-collapse: collapse;
745 /*------------------------------------------------------------------------------
747 ------------------------------------------------------------------------------*/
757 vertical-align: middle;
764 #export-filters p.submit {
773 padding: 0.7em 2em 1em;
776 border: 1px solid #e5e5e5;
777 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
778 box-shadow: 0 1px 1px rgba(0,0,0,0.04);
782 /* Press this styles */
788 .pressthis textarea {
793 #pressthis-code-wrap {
797 .pressthis-bookmarklet-wrapper {
804 .pressthis-bookmarklet,
805 .pressthis-bookmarklet:hover,
806 .pressthis-bookmarklet:focus,
807 .pressthis-bookmarklet:active {
808 display: inline-block;
813 -webkit-border-radius: 5px;
815 border: 1px solid #b4b4b4;
819 text-decoration: none;
822 .pressthis-bookmarklet:active {
826 .pressthis-bookmarklet:after {
834 background: transparent;
835 -webkit-transform: skew(-20deg) rotate(-6deg);
836 -ms-transform: skew(-20deg) rotate(-6deg);
837 transform: skew(-20deg) rotate(-6deg);
838 -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
839 box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
842 .pressthis-bookmarklet:hover:after {
843 -webkit-transform: skew(-20deg) rotate(-9deg);
844 -ms-transform: skew(-20deg) rotate(-9deg);
845 transform: skew(-20deg) rotate(-9deg);
846 -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
847 box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
850 .pressthis-bookmarklet span {
851 display: inline-block;
853 padding: 0px 9px 8px 12px;
856 .pressthis-bookmarklet span:before {
858 font: normal 20px/1 dashicons;
861 display: inline-block;
866 .pressthis-js-toggle {
873 .pressthis-js-toggle .dashicons {
874 margin: 5px 7px 6px 8px;
878 /* to override the button class being applied */
879 .pressthis-js-toggle.button.button {
886 .pressthis-js-toggle .dashicons {
887 margin: 5px 7px 6px 8px;
891 /*------------------------------------------------------------------------------
893 ------------------------------------------------------------------------------*/
895 #utc-time, #local-time {
900 .defaultavatarpicker .avatar {
902 vertical-align: middle;
905 .options-general-php input.small-text {
909 .options-general-php .spinner {
914 .settings-php .language-install-spinner,
915 .options-general-php .language-install-spinner {
916 display: inline-block;
919 vertical-align: middle;
922 /*------------------------------------------------------------------------------
924 ------------------------------------------------------------------------------*/
926 .setup-php textarea {
930 .form-field #site-address {
934 .form-field #domain {
938 .form-field #site-title,
939 .form-field #admin-email,
941 .form-field #blog_registered,
942 .form-field #blog_last_updated {
955 /*------------------------------------------------------------------------------
956 Credentials check dialog for Install and Updates
957 ------------------------------------------------------------------------------*/
959 .request-filesystem-credentials-dialog {
963 .request-filesystem-credentials-dialog .notification-dialog {
968 .request-filesystem-credentials-dialog-content {
972 #request-filesystem-credentials-title {
977 .request-filesystem-credentials-form legend {
983 .request-filesystem-credentials-form input[type="text"],
984 .request-filesystem-credentials-form input[type="password"] {
988 .request-filesystem-credentials-dialog input[type="text"],
989 .request-filesystem-credentials-dialog input[type="password"] {
993 .request-filesystem-credentials-form .field-title {
997 .request-filesystem-credentials-dialog label[for="hostname"],
998 .request-filesystem-credentials-dialog label[for="public_key"],
999 .request-filesystem-credentials-dialog label[for="private_key"] {
1004 .request-filesystem-credentials-dialog .ftp-username,
1005 .request-filesystem-credentials-dialog .ftp-password {
1010 .request-filesystem-credentials-dialog .ftp-password {
1014 .request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
1018 .request-filesystem-credentials-dialog label[for="ftp"] {
1022 #request-filesystem-credentials-dialog .button:not(:last-child) {
1026 #request-filesystem-credentials-form .cancel-button {
1030 #request-filesystem-credentials-dialog .cancel-button {
1036 -------------------------------------------------------------- */
1038 @media screen and ( max-width: 782px ) {
1039 /* Input Elements */
1041 -webkit-appearance: none;
1045 input[type="email"],
1046 input[type="search"],
1047 input[type="password"],
1048 input[type="number"] {
1049 -webkit-appearance: none;
1054 padding-bottom: 5px;
1058 input[type="checkbox"],
1059 .widefat th input[type="checkbox"],
1060 .widefat thead td input[type="checkbox"],
1061 .widefat tfoot td input[type="checkbox"] {
1062 -webkit-appearance: none;
1066 .widefat th input[type="checkbox"],
1067 .widefat thead td input[type="checkbox"],
1068 .widefat tfoot td input[type="checkbox"] {
1072 input[type="checkbox"]:checked:before,
1073 .widefat th input[type="checkbox"]:before,
1074 .widefat thead td input[type="checkbox"]:before,
1075 .widefat tfoot td input[type="checkbox"]:before {
1076 font: normal 30px/1 dashicons;
1080 input[type="radio"],
1081 input[type="checkbox"] {
1086 .wp-admin p input[type="checkbox"],
1087 .wp-admin p input[type="radio"] {
1091 input[type="radio"]:checked:before {
1092 vertical-align: middle;
1099 .wp-upload-form input[type="submit"] {
1108 .wp-admin .button-cancel {
1113 #adduser .form-field input,
1114 #createuser .form-field input {
1119 -webkit-box-sizing: border-box;
1120 -moz-box-sizing: border-box;
1121 box-sizing: border-box;
1129 vertical-align: middle;
1136 .export-filters li {
1140 .form-table .color-palette td {
1141 display: table-cell;
1145 .form-table table.color-palette {
1154 .form-table td input[type="text"],
1155 .form-table td input[type="email"],
1156 .form-table td input[type="password"],
1157 .form-table td select,
1158 .form-table td textarea,
1159 .form-table span.description,
1160 #profile-page .form-table textarea {
1167 -webkit-box-sizing: border-box;
1168 -moz-box-sizing: border-box;
1169 box-sizing: border-box;
1172 .form-table .form-required.form-invalid td:after {
1174 margin: -30px 0 0 3px;
1177 #wpbody .form-table td select {
1181 input[type="text"].small-text,
1182 input[type="search"].small-text,
1183 input[type="password"].small-text,
1184 input[type="number"].small-text,
1185 input[type="number"].small-text,
1186 .form-table input[type="text"].small-text {
1194 #pass-strength-result {
1196 -webkit-box-sizing: border-box;
1197 -moz-box-sizing: border-box;
1198 box-sizing: border-box;
1208 margin-bottom: 20px;
1211 p.search-box input[name="s"] {
1215 margin-bottom: 10px;
1216 vertical-align: middle;
1217 -webkit-appearance: none;
1220 p.search-box input[type="submit"] {
1221 margin-bottom: 10px;
1224 .form-table span.description {
1239 padding-bottom: 6px;
1244 .form-table.permalink-structure td code {
1248 .form-table.permalink-structure td input[type="text"] {
1254 .form-table input.regular-text {
1262 .form-table fieldset label {
1278 .form-field #domain {
1287 .wp-pwd [type="text"],
1288 .wp-pwd [type="password"] {
1292 .wp-pwd button.button {
1293 background: transparent;
1295 -webkit-box-shadow: none;
1305 .wp-pwd button.button:hover,
1306 .wp-pwd button.button:focus,
1307 .wp-pwd button.button:active {
1308 background: transparent;
1311 .wp-pwd .button .text {
1316 @media only screen and (max-width: 768px) {
1317 .form-field input[type="text"],
1318 .form-field input[type="email"],
1319 .form-field input[type="password"],
1321 .form-field textarea {
1325 .form-wrap .form-field {
1330 #profile-page .form-table textarea {
1336 @media only screen and (max-height: 480px) {
1337 /* Request Credentials */
1338 .request-filesystem-credentials-dialog .notification-dialog{
1350 @media screen and (max-width: 600px) {
1351 /* Color Picker Options */