Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Discouraged CSS features #2486

Open
wants to merge 19 commits into
base: main
Choose a base branch
from

Conversation

jamesnw
Copy link
Collaborator

@jamesnw jamesnw commented Dec 20, 2024

Credit to @vwallen for the content.

@github-actions github-actions bot added the feature definition Creating or defining new features or groups of features. label Dec 20, 2024
Copy link
Contributor

@captainbrosset captainbrosset left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approved with a suggestion for the missing description.

features/text-decoration-line-blink.yml Outdated Show resolved Hide resolved
Copy link
Collaborator

@ddbeck ddbeck left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some ideas here, mostly to avoid having to stuff discouraged information into the IDs and descriptions.

@@ -0,0 +1,11 @@
name: color-adjust
description: The `color-adjust` shorthand CSS property allows multiple performance related color adjustments to be set at once. Setting the `print-color-adjust` CSS property directly is preferred, as it is the only such adjustment so far defined.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Non-blocking, just noting something here: we ought to come up with guidelines for whether to summarize the alternatives in the description or not.

@@ -0,0 +1,13 @@
name: Media queries (deprecated)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of junk-drawer-ing these (and having to do exceptional things with the name and identifier) maybe we can give them a real name?

Suggested change
name: Media queries (deprecated)
name: Device media queries

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

media-queries-deprecated.ymldevice-queries.yml

(c.f. several other media query features) and see below

@@ -0,0 +1,12 @@
name: "`overflow: overlay`"
description: "The `overflow: overlay` CSS declaration sets the behavior for when content doesn't fit in an element. It is superceded by `overflow: auto`."
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yikes, this one is messy. According to https://caniuse.com/css-overflow-overlay, this has a rather different between versions that BCD doesn't capture at all. I suspect what this needs is new support statements in BCD, showing partial_implementation when browsers had the non-standard behavior (i.e., before they aliased to auto).

Maybe we thread this needle like this:

Suggested change
description: "The `overflow: overlay` CSS declaration sets the behavior for when content doesn't fit in an element. It is superceded by `overflow: auto`."
description: "The `overflow: overlay` CSS declaration is an alias to `overflow: auto`. However, non-standard historic implementations change the appearance of scrollbars when content doesn't fit in an element."

And then keep this whole file in drafts until we (I?) can do the work upstream.

(cc: @atopal this is another good example of a "feature" that is interoperable—overflow: overlay aliasing to overflow: auto—but a bad thing to describe as Baseline)

@@ -0,0 +1,13 @@
name: "`text-decoration-line: blink`"
description: "The deprecated `text-decoration: blink` CSS declaration used to make text alternate between being visible and invisible."
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's write these in the usual way (present-tense, not incorporating the "deprecation"):

Suggested change
description: "The deprecated `text-decoration: blink` CSS declaration used to make text alternate between being visible and invisible."
description: "The `text-decoration: blink` CSS declaration flashes text between visible and invisible."

@@ -0,0 +1,11 @@
name: "`word-break: break-word`"
description: "The `word-break: break-word` CSS declaration sets word breaks to occur according to their customary rules. It is superceded by `overflow-wrap: anywhere`"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this is more inline with our "not to be confused with" and "also known as". I suspect we'll soon need a style guide entry for these.

Suggested change
description: "The `word-break: break-word` CSS declaration sets word breaks to occur according to their customary rules. It is superceded by `overflow-wrap: anywhere`"
description: "The `word-break: break-word` CSS declaration sets word breaks to occur according to their customary rules. Superseded by `overflow-wrap: anywhere`"

Comment on lines +1 to +2
name: Writing mode (deprecated)
description: The `lr`, `lr-tb`, `rl`, `rl-tb`, `tb`, and `tb-rl` keyword values represent writing modes for elements in SVG 1.1 documents.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's line this up closer to the other writing-mode features

Suggested change
name: Writing mode (deprecated)
description: The `lr`, `lr-tb`, `rl`, `rl-tb`, `tb`, and `tb-rl` keyword values represent writing modes for elements in SVG 1.1 documents.
name: writing-mode SVG 1.1 values
description: The `lr`, `lr-tb`, `rl`, `rl-tb`, `tb`, and `tb-rl` keyword values for the `writing-mode` CSS property set the text direction for elements in SVG 1.1 documents.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

features/writing-mode-deprecated.ymlfeatures/writing-mode-svg-values.yml

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature definition Creating or defining new features or groups of features.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants