WordPress.org

Make WordPress Core

Ticket #28262: forms.patch

File forms.patch, 8.0 KB (added by iseulde, 6 years ago)
  • src/wp-admin/css/forms.css

     
    1 /* include margin and padding in the width calculation of input and textarea */
     1/* Include margin and padding in the width calculation of input and textarea. */
    22input,
    3 input[type="text"],
    4 input[type="password"],
    5 input[type="number"],
    6 input[type="search"],
    7 input[type="email"],
    8 input[type="url"],
    93textarea {
    104        -webkit-box-sizing: border-box;
    115        -moz-box-sizing: border-box;
     
    3630        width: 16px;
    3731        min-width: 16px;
    3832        -webkit-appearance: none;
    39         -webkit-box-sizing: border-box;
    40         -moz-box-sizing: border-box;
    41         box-sizing: border-box;
    42         -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
    43         box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
     33        -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
     34        box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
    4435        -webkit-transition: .05s border-color ease-in-out;
    4536        transition: .05s border-color ease-in-out;
    4637}
     
    5546}
    5647
    5748td > input[type="checkbox"],
    58 .wp-admin p input[type=checkbox],
    59 .wp-admin p input[type=radio] {
     49.wp-admin p input[type="checkbox"],
     50.wp-admin p input[type="radio"] {
    6051        margin-top: 0;
    6152}
    6253
    63 .wp-admin p label input[type=checkbox] {
     54.wp-admin p label input[type="checkbox"] {
    6455        margin-top: -4px;
    6556}
    6657
    67 .wp-admin p label input[type=radio] {
     58.wp-admin p label input[type="radio"] {
    6859        margin-top: -2px;
    6960}
    7061
    71 input[type=radio] {
     62input[type="radio"] {
    7263        -webkit-border-radius: 50%;
    7364        border-radius: 50%;
    7465        margin-right: 4px;
    7566        line-height: 10px;
    7667}
    7768
    78 input[type=checkbox]:checked:before,
    79 input[type=radio]:checked:before {
     69input[type="checkbox"]:checked:before,
     70input[type="radio"]:checked:before {
    8071        float: left;
    8172        display: inline-block;
    8273        vertical-align: middle;
     
    8778        -moz-osx-font-smoothing: grayscale;
    8879}
    8980
    90 input[type=checkbox]:checked:before {
     81input[type="checkbox"]:checked:before {
    9182        content: '\f147';
    9283        margin: -3px 0 0 -4px;
    9384        color: #1e8cbe;
    9485}
    9586
    96 input[type=radio]:checked:before {
     87input[type="radio"]:checked:before {
    9788        content: '\2022';
    9889        text-indent: -9999px;
    9990        -webkit-border-radius: 50px;
     
    10697        background-color: #1e8cbe;
    10798}
    10899
    109 input.readonly, textarea.readonly {
    110         background-color: #ddd;
    111 }
    112 
    113100@-moz-document url-prefix() {
    114         input[type=checkbox],
    115         input[type=radio],
     101        input[type="checkbox"],
     102        input[type="radio"],
    116103        .form-table input.tog {
    117104                margin-bottom: -1px;
    118105        }
     
    156143        line-height: 1.4;
    157144}
    158145
    159 input[type="text"],
    160 input[type="password"],
    161 input[type="number"],
    162 input[type="search"],
    163 input[type="email"],
    164 input[type="url"],
    165 textarea,
    166 select {
    167         outline: 0;
    168 }
    169 
    170146.wp-admin input[type="file"] {
    171147        padding: 3px 0;
    172148}
     
    190166        padding: 4px 6px 1px 6px;
    191167}
    192168
    193 textarea,
    194169input[type="text"],
    195170input[type="password"],
     171input[type="checkbox"],
     172input[type="color"],
     173input[type="date"],
     174input[type="datetime"],
     175input[type="datetime-local"],
    196176input[type="email"],
     177input[type="month"],
    197178input[type="number"],
     179input[type="password"],
    198180input[type="search"],
     181input[type="radio"],
    199182input[type="tel"],
     183input[type="text"],
     184input[type="time"],
    200185input[type="url"],
    201 select {
     186input[type="week"],
     187select,
     188textarea {
    202189        border: 1px solid #ddd;
    203         -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
    204         box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
     190        -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
     191        box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
    205192        background-color: #fff;
    206193        color: #333;
    207         -webkit-transition: .05s border-color ease-in-out;
    208         transition: .05s border-color ease-in-out;
    209 }
    210 
    211 select[disabled] {
    212         color: #7f7f7f;
     194        outline: none;
     195        -webkit-transition: 0.05s border-color ease-in-out;
     196        transition: 0.05s border-color ease-in-out;
    213197}
    214198
    215 textarea:focus,
    216199input[type="text"]:focus,
    217200input[type="password"]:focus,
     201input[type="color"]:focus,
     202input[type="date"]:focus,
     203input[type="datetime"]:focus,
     204input[type="datetime-local"]:focus,
    218205input[type="email"]:focus,
     206input[type="month"]:focus,
    219207input[type="number"]:focus,
     208input[type="password"]:focus,
    220209input[type="search"]:focus,
    221210input[type="tel"]:focus,
     211input[type="text"]:focus,
     212input[type="time"]:focus,
    222213input[type="url"]:focus,
    223 input[type="checkbox"]:focus,
    224 input[type="radio"]:focus,
    225 select:focus {
     214input[type="week"]:focus,
     215select:focus,
     216textarea:focus {
    226217        border-color: #5b9dd9;
    227         -webkit-box-shadow: 0 0 2px rgba(30,140,190,0.8);
    228         box-shadow: 0 0 2px rgba(30,140,190,0.8);
     218        -webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
     219        box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
    229220}
    230221
    231 input[readonly] {
     222input.readonly,
     223input[readonly],
     224textarea.readonly,
     225textarea[readonly] {
    232226        background-color: #eee;
    233227}
    234228
     
    252246
    253247input:disabled,
    254248input.disabled,
     249select:disabled,
     250select.disabled,
    255251textarea:disabled,
    256252textarea.disabled {
    257         -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.04);
    258         box-shadow: inset 0 1px 2px rgba(0,0,0,0.04);
    259         border-color: rgba(222, 222, 222, .75);
    260         background: rgba(255, 255, 255, .5);
    261         color: rgba(51, 51, 51, .5);
    262 }
    263 
    264 input[type=checkbox]:disabled,
    265 input[type=radio]:disabled,
    266 input[type=checkbox]:disabled:checked:before,
    267 input[type=radio]:disabled:checked:before {
     253        background: rgba( 255, 255, 255, 0.5 );
     254        border-color: rgba( 222, 222, 222, 0.75 );
     255        -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
     256        box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
     257        color: rgba( 51, 51, 51, 0.5 );
     258}
     259
     260input[type="file"]:disabled,
     261input[type="file"].disabled,
     262input[type="range"]:disabled,
     263input[type="range"].disabled {
     264        background: none;
     265        -webkit-box-shadow: none;
     266        box-shadow: none;
     267}
     268
     269input[type="checkbox"]:disabled,
     270input[type="checkbox"].disabled,
     271input[type="radio"]:disabled,
     272input[type="radio"].disabled,
     273input[type="checkbox"]:disabled:checked:before,
     274input[type="checkbox"].disabled:checked:before,
     275input[type="radio"]:disabled:checked:before,
     276input[type="radio"].disabled:checked:before {
    268277        opacity: 0.7;
    269278}
    270279
     
    585594}
    586595
    587596.form-table input.tog,
    588 .form-table input[type=radio] {
     597.form-table input[type="radio"] {
    589598        margin-top: -4px;
    590599        margin-right: 4px;
    591600        float: none;
     
    760769                -webkit-appearance: none;
    761770        }
    762771
    763         input[type=text], input[type=search],
    764         input[type=password], input[type=number] {
     772        input[type=text], input[type="search"],
     773        input[type=password], input[type="number"] {
    765774                -webkit-appearance: none;
    766775                padding: 6px 10px;
    767776        }
     
    771780                padding-top: 10px;
    772781        }
    773782
    774         input[type=checkbox], .widefat th input[type=checkbox] {
     783        input[type="checkbox"], .widefat th input[type="checkbox"] {
    775784                -webkit-appearance: none;
    776785                padding: 10px;
    777786        }
    778787
    779         .widefat th input[type=checkbox] {
     788        .widefat th input[type="checkbox"] {
    780789                margin-bottom: 8px;
    781790        }
    782791
    783         input[type=checkbox]:checked:before, .widefat th input[type=checkbox]:before {
     792        input[type="checkbox"]:checked:before, .widefat th input[type="checkbox"]:before {
    784793                font: normal 30px/1 'Dashicons';
    785794                margin: -3px -5px;
    786795        }
    787796
    788         input[type=radio],
    789         input[type=checkbox] {
     797        input[type="radio"],
     798        input[type="checkbox"] {
    790799                height: 25px;
    791800                width: 25px;
    792801        }
    793802
    794         .wp-admin p input[type=checkbox],
    795         .wp-admin p input[type=radio] {
     803        .wp-admin p input[type="checkbox"],
     804        .wp-admin p input[type="radio"] {
    796805                margin-top: -3px;
    797806        }
    798807
    799         input[type=radio]:checked:before {
     808        input[type="radio"]:checked:before {
    800809                vertical-align: middle;
    801810                width: 9px;
    802811                height: 9px;
     
    804813                line-height: 16px;
    805814        }
    806815
    807         .wp-upload-form input[type=submit] {
     816        .wp-upload-form input[type="submit"] {
    808817                margin-top: 10px;
    809818        }
    810819
     
    866875                box-sizing: border-box;
    867876        }
    868877
    869         input[type=text].small-text,
    870         input[type=search].small-text,
    871         input[type=password].small-text,
    872         input[type=number].small-text,
     878        input[type="text"].small-text,
     879        input[type="search"].small-text,
     880        input[type="password"].small-text,
     881        input[type="number"].small-text,
    873882        input[type="number"].small-text,
    874         .form-table input[type=text].small-text {
     883        .form-table input[type="text"].small-text {
    875884                width: auto;
    876885                max-width: 55px;
    877886                display: inline;