[wp-trac] [WordPress Trac] #61963: Twenty Twenty-One: defining standard `appearance` property in the CSS files (was: Twenty twenty-one theme: I have defined standard property into the CSS file.)

[WordPress Trac]

#61963: Twenty Twenty-One: defining standard `appearance` property in the CSS files
-------------------------------------------------+-------------------------
 Reporter:  viralsampat                          |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  Awaiting
                                                 |  Review
Component:  Bundled Theme                        |     Version:
 Severity:  normal                               |  Resolution:
 Keywords:  has-patch reporter-feedback close    |     Focuses:  css
  2nd-opinion                                    |
-------------------------------------------------+-------------------------
Changes (by sabernhardt):

 * keywords:  has-patch reporter-feedback => has-patch reporter-feedback
     close 2nd-opinion


Comment:

 The patch involves more than `normalize.css`, but I would not recommend
 the proposed changes.

 - The `button` and `[type=search]` rulesets come from the `normalize.css`
 external library (which
 [https://github.com/WordPress/twentytwentyone/commits/trunk/assets/sass/03-generic/normalize.scss
 the theme has modified]). The library mentions that those two rulesets are
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentytwentyone/assets/sass/03-generic/normalize.scss?rev=49574&marks=200#L192
 for "iOS and Safari"] and
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentytwentyone/assets/sass/03-generic/normalize.scss?rev=49574&marks=292#L286
 for "Chrome and Safari"].
 - The [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentytwentyone/assets/sass/04-elements/forms.scss?rev=49870&marks=105-106#L96
 checkboxes and radio buttons] and the
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentytwentyone/assets/sass/04-elements/forms.scss?rev=49870&marks=204,217#L199
 range inputs] have special styles within a `@supports (-webkit-appearance:
 none) or (-moz-appearance: none)` condition
 ([https://github.com/WordPress/twentytwentyone/pull/142 PR 142]). If some
 browser needs `appearance: none`, and if no other browsers would have a
 problem with that rule, then it likely would belong in the condition also.
 - The [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentytwentyone/assets/sass/06-components/widgets.scss?rev=52237&marks=145#L141
 classic Search widget field] styles target small iOS devices
 ([https://github.com/WordPress/twentytwentyone/pull/400 PR 400]).

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/61963#comment:2>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform