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 0 0 -4px;
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;
250 /* Adjust error indicator for password layout */
251 .form-table .form-required.user-pass1-wrap.form-invalid td:after {
255 .form-table .form-required.user-pass1-wrap.form-invalid .password-input-wrapper:after {
257 font: normal 20px/1 dashicons;
259 margin: 0 6px 0 -29px;
260 vertical-align: middle;
273 background: rgba( 255, 255, 255, 0.5 );
274 border-color: rgba( 222, 222, 222, 0.75 );
275 -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
276 box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
277 color: rgba( 51, 51, 51, 0.5 );
280 input[type="file"]:disabled,
281 input[type="file"].disabled,
282 input[type="range"]:disabled,
283 input[type="range"].disabled {
285 -webkit-box-shadow: none;
289 input[type="checkbox"]:disabled,
290 input[type="checkbox"].disabled,
291 input[type="radio"]:disabled,
292 input[type="radio"].disabled,
293 input[type="checkbox"]:disabled:checked:before,
294 input[type="checkbox"].disabled:checked:before,
295 input[type="radio"]:disabled:checked:before,
296 input[type="radio"].disabled:checked:before {
300 /*------------------------------------------------------------------------------
302 ------------------------------------------------------------------------------*/
309 vertical-align: middle;
312 .wp-admin .button-cancel {
317 .meta-box-sortables select {
321 .wp-admin select[multiple] {
328 -webkit-border-bottom-left-radius: 3px;
329 border-bottom-left-radius: 3px;
330 -webkit-border-bottom-right-radius: 3px;
331 border-bottom-right-radius: 3px;
335 form p.submit a.cancel:hover {
336 text-decoration: none;
346 .textright p.submit {
351 table.form-table + p.submit,
352 table.form-table + input + p.submit,
353 table.form-table + input + input + p.submit {
358 #minor-publishing-actions input,
359 #major-publishing-actions input,
360 #minor-publishing-actions .preview {
364 textarea.all-options,
370 textarea.large-text {
383 input[type="number"].small-text {
394 .tablenav #delete_all,
395 .tablenav #clear-recent-list,
396 .wp-filter #delete_all {
400 .tablenav .actions select {
406 .ie8 .tablenav .actions select {
410 .ie8 .tablenav .actions select#cat {
414 #timezone_string option {
422 button.wp-hide-pw > .dashicons {
428 #your-profile label + a {
429 vertical-align: middle;
433 #your-profile label + a {
434 vertical-align: middle;
437 .options-media-php label[for*="_size_"],
438 #misc-publishing-actions label {
439 vertical-align: baseline;
442 #misc-publishing-actions label[for="post_status"]:before {
444 display: inline-block;
445 font: normal 20px/1 'dashicons';
451 text-decoration: none !important;
453 -webkit-font-smoothing: antialiased;
454 -moz-osx-font-smoothing: grayscale;
457 #pass-strength-result {
458 background-color: #eee;
459 border: 1px solid #ddd;
461 margin: -2px 5px 5px 1px;
465 -webkit-box-sizing: border-box;
466 -moz-box-sizing: border-box;
467 box-sizing: border-box;
471 #pass-strength-result.short {
472 background-color: #f1adad;
473 border-color: #e35b5b;
477 #pass-strength-result.bad {
478 background-color: #fbc5a9;
479 border-color: #f78b53;
483 #pass-strength-result.good {
484 background-color: #ffe399;
485 border-color: #ffc733;
489 #pass-strength-result.strong {
490 background-color: #c1e1b9;
491 border-color: #83c373;
495 #pass1.short, #pass1-text.short {
496 border-color: #e35b5b;
499 #pass1.bad, #pass1-text.bad {
500 border-color: #f78b53;
503 #pass1.good, #pass1-text.good {
504 border-color: #ffc733;
507 #pass1.strong, #pass1-text.strong {
508 border-color: #83c373;
520 .show-password #pass1 {
524 .show-password #pass1-text
526 display: inline-block;
529 .form-table span.description.important {
538 .network-admin.themes-php p.search-box {
542 .search-box input[name="s"],
543 .tablenav .search-plugins input[name="s"],
550 input[type="text"].ui-autocomplete-loading,
551 input[type="email"].ui-autocomplete-loading {
552 background-image: url(../images/loading.gif);
553 background-repeat: no-repeat;
554 background-position: right center;
558 input.ui-autocomplete-input.open {
559 border-bottom-color: transparent;
562 ul#add-to-blog-users {
572 border: 1px solid #5b9dd9;
573 -webkit-box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
574 box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
575 background-color: #fff;
578 .ui-autocomplete li {
585 .ui-autocomplete li.ui-state-focus {
586 background-color: #ddd;
590 /*------------------------------------------------------------------------------
591 15.0 - Comments Screen
592 ------------------------------------------------------------------------------*/
595 border-collapse: collapse;
613 vertical-align: middle;
621 vertical-align: baseline;
627 padding: 20px 10px 20px 0;
633 .form-table th.th-full {
643 .form-table td fieldset label {
644 margin: 0.25em 0 0.5em !important;
645 display: inline-block;
648 .form-table td fieldset label,
649 .form-table td fieldset p,
650 .form-table td fieldset li {
654 .form-table input.tog,
655 .form-table input[type="radio"] {
666 table.form-table td .updated {
670 table.form-table td .updated p {
675 /*------------------------------------------------------------------------------
677 ------------------------------------------------------------------------------*/
679 #profile-page .form-table textarea {
684 #profile-page .form-table #rich_editing {
688 #your-profile legend {
696 #adduser .form-field input,
697 #createuser .form-field input {
702 display: inline-block;
704 padding: 5px 15px 15px;
705 -webkit-box-sizing: border-box;
706 -moz-box-sizing: border-box;
707 box-sizing: border-box;
712 .color-option.selected {
719 border-collapse: collapse;
731 /*------------------------------------------------------------------------------
733 ------------------------------------------------------------------------------*/
747 padding: 0.7em 2em 1em;
750 border: 1px solid #e5e5e5;
751 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
752 box-shadow: 0 1px 1px rgba(0,0,0,0.04);
756 /* Press this styles */
762 .pressthis textarea {
767 #pressthis-code-wrap {
771 .pressthis-bookmarklet-wrapper {
778 .pressthis-bookmarklet,
779 .pressthis-bookmarklet:hover,
780 .pressthis-bookmarklet:focus,
781 .pressthis-bookmarklet:active {
782 display: inline-block;
787 -webkit-border-radius: 5px;
789 border: 1px solid #b4b4b4;
793 text-decoration: none;
796 .pressthis-bookmarklet:active {
800 .pressthis-bookmarklet:after {
808 background: transparent;
809 -webkit-transform: skew(20deg) rotate(6deg);
810 -ms-transform: skew(20deg) rotate(6deg);
811 transform: skew(20deg) rotate(6deg);
812 -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
813 box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
816 .pressthis-bookmarklet:hover:after {
817 -webkit-transform: skew(20deg) rotate(9deg);
818 -ms-transform: skew(20deg) rotate(9deg);
819 transform: skew(20deg) rotate(9deg);
820 -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
821 box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
824 .pressthis-bookmarklet span {
825 display: inline-block;
827 padding: 0px 12px 8px 9px;
830 .pressthis-bookmarklet span:before {
832 font: normal 20px/1 'dashicons';
835 display: inline-block;
840 .pressthis-js-toggle {
847 .pressthis-js-toggle .dashicons {
848 margin: 5px 8px 6px 7px;
852 /* to override the button class being applied */
853 .pressthis-js-toggle.button.button {
860 .pressthis-js-toggle .dashicons {
861 margin: 5px 8px 6px 7px;
865 /*------------------------------------------------------------------------------
867 ------------------------------------------------------------------------------*/
869 #utc-time, #local-time {
874 .defaultavatarpicker .avatar {
876 vertical-align: middle;
879 .options-general-php input.small-text {
883 .options-general-php .spinner {
888 .settings-php .language-install-spinner,
889 .options-general-php .language-install-spinner {
890 display: inline-block;
893 vertical-align: middle;
896 /*------------------------------------------------------------------------------
898 ------------------------------------------------------------------------------*/
900 .setup-php textarea {
904 .form-field #site-address {
908 .form-field #domain {
912 .form-field #site-title,
913 .form-field #admin-email,
915 .form-field #blog_registered,
916 .form-field #blog_last_updated {
929 /*------------------------------------------------------------------------------
930 Credentials check dialog for Install and Updates
931 ------------------------------------------------------------------------------*/
933 .request-filesystem-credentials-dialog {
937 .request-filesystem-credentials-dialog .notification-dialog {
942 .request-filesystem-credentials-dialog-content {
946 .request-filesystem-credentials-form input[type="text"],
947 .request-filesystem-credentials-form input[type="password"] {
951 .request-filesystem-credentials-dialog input[type="text"],
952 .request-filesystem-credentials-dialog input[type="password"] {
956 .request-filesystem-credentials-form .field-title {
960 .request-filesystem-credentials-dialog label[for="hostname"],
961 .request-filesystem-credentials-dialog label[for="public_key"],
962 .request-filesystem-credentials-dialog label[for="private_key"] {
967 .request-filesystem-credentials-dialog .ftp-username,
968 .request-filesystem-credentials-dialog .ftp-password {
973 .request-filesystem-credentials-dialog .ftp-password {
977 .request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
981 .request-filesystem-credentials-dialog label[for="ftp"] {
985 #request-filesystem-credentials-dialog .button:not(:last-child) {
989 #request-filesystem-credentials-form .cancel-button {
993 #request-filesystem-credentials-dialog .cancel-button {
999 -------------------------------------------------------------- */
1001 @media screen and ( max-width: 782px ) {
1002 /* Input Elements */
1004 -webkit-appearance: none;
1008 input[type="email"],
1009 input[type="search"],
1010 input[type="password"],
1011 input[type="number"] {
1012 -webkit-appearance: none;
1017 padding-bottom: 5px;
1021 input[type="checkbox"],
1022 .widefat th input[type="checkbox"],
1023 .widefat thead td input[type="checkbox"],
1024 .widefat tfoot td input[type="checkbox"] {
1025 -webkit-appearance: none;
1029 .widefat th input[type="checkbox"],
1030 .widefat thead td input[type="checkbox"],
1031 .widefat tfoot td input[type="checkbox"] {
1035 input[type="checkbox"]:checked:before,
1036 .widefat th input[type="checkbox"]:before,
1037 .widefat thead td input[type="checkbox"]:before,
1038 .widefat tfoot td input[type="checkbox"]:before {
1039 font: normal 30px/1 'Dashicons';
1043 input[type="radio"],
1044 input[type="checkbox"] {
1049 .wp-admin p input[type="checkbox"],
1050 .wp-admin p input[type="radio"] {
1054 input[type="radio"]:checked:before {
1055 vertical-align: middle;
1062 .wp-upload-form input[type="submit"] {
1071 .wp-admin .button-cancel {
1076 #adduser .form-field input,
1077 #createuser .form-field input {
1082 -webkit-box-sizing: border-box;
1083 -moz-box-sizing: border-box;
1084 box-sizing: border-box;
1091 vertical-align: middle;
1094 .form-table .color-palette td {
1095 display: table-cell;
1099 .form-table table.color-palette {
1108 .form-table td input[type="text"],
1109 .form-table td input[type="email"],
1110 .form-table td input[type="password"],
1111 .form-table td select,
1112 .form-table td textarea,
1113 .form-table span.description,
1114 #profile-page .form-table textarea {
1121 -webkit-box-sizing: border-box;
1122 -moz-box-sizing: border-box;
1123 box-sizing: border-box;
1126 .form-table .form-required.form-invalid td:after {
1128 margin: -30px 3px 0 0;
1131 #wpbody .form-table td select {
1135 input[type="text"].small-text,
1136 input[type="search"].small-text,
1137 input[type="password"].small-text,
1138 input[type="number"].small-text,
1139 input[type="number"].small-text,
1140 .form-table input[type="text"].small-text {
1148 #pass-strength-result {
1150 -webkit-box-sizing: border-box;
1151 -moz-box-sizing: border-box;
1152 box-sizing: border-box;
1162 margin-bottom: 20px;
1165 p.search-box input[name="s"] {
1169 margin-bottom: 10px;
1170 vertical-align: middle;
1171 -webkit-appearance: none;
1174 p.search-box input[type="submit"] {
1175 margin-bottom: 10px;
1178 .form-table span.description {
1193 padding-bottom: 6px;
1198 .form-table.permalink-structure td code {
1202 .form-table.permalink-structure td input[type="text"] {
1208 .form-table input.regular-text {
1216 .form-table fieldset label {
1232 .form-field #domain {
1241 .wp-pwd [type="text"],
1242 .wp-pwd [type="password"] {
1243 padding-right: 40px;
1246 .wp-pwd button.button {
1247 background: transparent;
1249 -webkit-box-shadow: none;
1259 .wp-pwd button.button:hover,
1260 .wp-pwd button.button:focus,
1261 .wp-pwd button.button:active {
1262 background: transparent;
1265 .wp-pwd .button .text {
1270 @media only screen and (max-width: 768px) {
1271 .form-field input[type="text"],
1272 .form-field input[type="email"],
1273 .form-field input[type="password"],
1275 .form-field textarea {
1279 .form-wrap .form-field {
1284 #profile-page .form-table textarea {
1290 @media only screen and (max-height: 480px) {
1291 /* Request Credentials */
1292 .request-filesystem-credentials-dialog .notification-dialog{
1304 @media screen and (max-width: 600px) {
1305 /* Color Picker Options */