atom / language-css

CSS package for Atom

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

CSS code highlighting on some more properties not working

go-commit-code opened this issue · comments

Prerequisites

Description

Some missing property highlighting has already been reported (#189, #190, #192),
But I thought I'd go through MDN css reference to see if there are more.

I have only tested on vscode, but I'm assuming the grammer is up to date. (updated 2021 November 2.)

The following properties are missing syntax highlighting:

Non-experimental properties:

  • border-block
  • border-block-color
  • border-block-style
  • border-block-width
  • border-inline
  • border-inline-color
  • border-inline-style
  • border-inline-width
  • color-scheme
  • content-visibility
  • counter-set
  • forced-color-adjust
  • offset-rotate
  • print-color-adjust
  • text-decoration-thickness
  • text-underline-offset
  • vector-effect (svg)

Experimental properties:

  • inherits
  • math-style
  • overflow-clip-margin
  • syntax

Behind experimantal flag:

  • align-tracks
  • animation-timeline
  • justify-tracks
  • line-height-step

Not implemented in any browser:

  • margin-trim
  • masonry-auto-flow

Deprecated:

  • viewport-fit

No MDN docs:

  • block-overflow
  • input-security

Steps to Reproduce

Reproduces with this snippet:

div {
	/* Non-experimental properties */
	border-block: initial;
	border-block-color: initial;
	border-block-style: initial;
	border-block-width: initial;
	border-inline: initial;
	border-inline-color: initial;
	border-inline-style: initial;
	border-inline-width: initial;
	color-scheme: initial;
	content-visibility: initial;
	counter-set: initial;
	forced-color-adjust: initial;
	offset-rotate: initial;
	print-color-adjust: initial;
	text-decoration-thickness: initial;
	text-underline-offset: initial;

	/* Experimental properties */
	inherits: initial;
	math-style: initial;
	overflow-clip-margin: initial;
	syntax: initial;

	/* Behind experimantal flag */
	align-tracks: initial;
	animation-timeline: initial;
	justify-tracks: initial;
	line-height-step: initial;

	/* Not implemented in any browser */
	margin-trim: initial;
	masonry-auto-flow: initial;

	/* Deprecated */
	viewport-fit: initial;

	/* No MDN docs */ 
	block-overflow: initial; /* I think this has been renamed to `overflow-block` */
	input-security: initial;

	/* svg */
	vector-effect: initial; /* no compatibility table on MDN, but works on chrome */
}

Expected behavior:

The properties have syntax highlighting

Actual behavior:

The properties don't have syntax highlighting

Reproduces how often:

100% (in vscode)

+1 it's so annoying, please take a look at this