Skip to content

Commit a351d24

Browse files
ntwbGaryJonesdingo-d
authored
Apply suggestions from code review
Co-authored-by: Gary Jones <github@garyjones.io> Co-authored-by: Denis Žoljom <dingo-d@users.noreply.github.com>
1 parent 717cccd commit a351d24

File tree

1 file changed

+6
-6
lines changed
  • wordpress-coding-standards

1 file changed

+6
-6
lines changed

wordpress-coding-standards/css.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,8 @@ With specificity, comes great responsibility. Broad selectors allow us to be eff
4040

4141
- Similar to the [WordPress PHP Coding Standards](https://developer.wordpress.org/coding-standards/wordpress-coding-standards/php/#naming-conventions) for file names, use lowercase and separate words with hyphens when naming selectors. Avoid camelcase and underscores.
4242
- Use human readable selectors that describe what element(s) they style.
43-
- Attribute selectors should use double quotes around values
44-
- Refrain from using over-qualified selectors, `div.container` can simply be stated as `.container`
43+
- Attribute selectors should use double quotes around values.
44+
- Refrain from using over-qualified selectors, `div.container` can simply be stated as `.container`.
4545

4646
Correct:
4747

@@ -86,7 +86,7 @@ Similar to selectors, properties that are too specific will hinder the flexibili
8686
- Properties should be followed by a colon and a space.
8787
- All properties and values should be lowercase, except for font names and vendor-specific properties.
8888
- Use hex code for colors, or `rgba()` if opacity is needed. Avoid RGB format and uppercase, and shorten values when possible: `#fff` instead of `#FFFFFF`.
89-
- Use shorthand (except when overriding styles) for `background`, `border`, `font`, `list-style`, `margin`, and `padding` values as much as possible. (For a shorthand reference, see [CSS Shorthand](https://codex.wordpress.org/CSS_Shorthand).)
89+
- Use shorthand, except when overriding styles, for `background`, `border`, `font`, `list-style`, `margin`, and `padding` values as much as possible. For a shorthand reference, see [CSS Shorthand](https://codex.wordpress.org/CSS_Shorthand).
9090

9191
Correct:
9292

@@ -125,7 +125,7 @@ Above all else, choose something that is meaningful to you and semantic in some
125125

126126
Things that are not yet used in core itself, such as CSS3 animations, may not have a prescribed place above but likely would fit into one of the above in a logical manner. Just as CSS is evolving, so our standards will evolve with it.
127127

128-
Top/Right/Bottom/Left (TRBL/trouble) should be the order for any relevant properties (e.g. margin), much as the order goes in values. Corner specifiers (e.g. border-radius-*-*) should be top-left, top-right, bottom-right, bottom-left. This is derived from how shorthand values would be ordered.
128+
Top/Right/Bottom/Left (TRBL/trouble) should be the order for any relevant properties (e.g. `margin`), much as the order goes in values. Corner specifiers (e.g. `border-radius-*-*`) should be ordered as top-left, top-right, bottom-right, bottom-left. This is derived from how shorthand values would be ordered.
129129

130130
Example:
131131

@@ -155,7 +155,7 @@ Example:
155155

156156
### Vendor Prefixes
157157

158-
Updated on 2/13/2014, after [[27174](https://core.trac.wordpress.org/changeset/27174)]:
158+
Updated on 2014-02-13, after [[27174](https://core.trac.wordpress.org/changeset/27174)]:
159159

160160
We use [Autoprefixer](https://github.com/postcss/autoprefixer) as a pre-commit tool to easily manage necessary browser prefixes, thus making the majority of this section moot. For those interested in following that output without using Grunt, vendor prefixes should go longest (-webkit-) to shortest (unprefixed). All other spacing remains as per the rest of standards.
161161

@@ -288,7 +288,7 @@ Stylesheets tend to grow in length and complexity, and as they grow the chance o
288288
- Magic Numbers are unlucky. These are numbers that are used as quick fixes on a one-off basis. Example: `.box { margin-top: 37px }`.
289289
- DOM will change over time, target the element you want to use as opposed to "finding it" through its parents. Example: Use `.highlight` on the element as opposed to `.highlight a` (where the selector is on the parent)
290290
- Know when to use the `height` property. It should be used when you are including outside elements (such as images). Otherwise use `line-height` for more flexibility.
291-
- Do not restate default property &amp; value combinations (for instance `display: block;` on block-level elements).
291+
- Do not restate default property and value combinations (for instance `display: block;` on block-level elements).
292292

293293
### WP Admin CSS
294294

0 commit comments

Comments
 (0)