Re: [csswg-drafts] [selectors4] Name the “functional pseudo-class like :matches() with 0 specificity”

TL;DR: I like `:any()`.

---

Forking @LeaVerou’s list from earlier to express sentiments on keywords I was drawn to:

| Name | Pros | Cons |
| --- | --- | --- |
| `:any()` | short, meaningful | prefixed version had differing specificity characteristics |
| `:as()` | short, frequently used  | suggests transformation of preceeding selector |
| `:if()` | short | suggests logical opposite of non-existent `:else()` |
| `:is()` | short, meaningful, backronym for "_Ignore Specificity_". | suggests logical opposite of existing `:not` without matching specificity characteristics |
| `:nil()` | short | infrequently used in language, explicitly not extended-able |
| `:nospecificity()` | meaningful | long, explicitly not extended-able |
| `:when()` | meaningful | suggests a change of context (when some time is.., when some element query is...) |
| `:zero()` | meaningful | explicitly not extended-able |

<small>* The table is sorted alphabetically by name</small>
<small>* _nil_ is an infrequent word according to https://www.wordfrequency.info/free.asp?s=y</small>

### Example Usages:

Forking @FremyCompany’s usages with minor changes to further share my impressions:

```pcss
/* :any() → actually looks okay especially because any is also used in any-link */

:any(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:any(:any-link:not(:hover):not(:active):not(:focus)) {
  /* weightless link styling */
}
```

```pcss
/* :as() → looks visually similar to :has and tripped me up when following it with :any-link */

:as(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:as(:any-link:not(:hover):not(:active):not(:focus)) {
  color: inherit;
}
```

```pcss
/* :if() → so is :else like :not but with zero-specificity? */

:if(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:if(:any-link:not(:hover):not(:active):not(:focus)) {
  /* weightless link styling */
}
```

```pcss
/* :nil() → i get it, but looks like programmer-speak not found elsewhere in css */

:nil(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:nil(:any-link:not(:hover):not(:active):not(:focus)) {
  /* weightless link styling */
}
```

```pcss
/* :nospecificity() → hello, spell check, my old friend */

:nospecificity(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:nospecificity(:any-link:not(:hover):not(:active):not(:focus)) {
  /* weightless link styling */
}
```

```pcss
/* :when() → it feels like this should not take css selectors */

:when(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:when(:any-link:not(:hover):not(:active):not(:focus)) {
  /* weightless link styling */
}
```

```pcss
/* :zero() → it feels like :zero is supposed to represent a state */

:zero(textarea, input:matches([type=text], [type=number], [type=email], :not([type])) {
  /* weightless text box styling */
}

:zero(:any-link:not(:hover):not(:active):not(:focus)) {
  /* weightless link styling */
}
```

My overall impression is that `:any` seems the most clear and consistent.

-- 
GitHub Notification of comment by jonathantneal
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2143#issuecomment-408128027 using your GitHub account

Received on Thursday, 26 July 2018 15:03:14 UTC