Строка валидации CSS
 

Дана строка в котором написана CSS код. И надо выяснить в нем все правильно написано или нет?

Например

div > p {
	color: red;
	font-size 14px;
}

В вышеуказанном примере есть ошибка так как после font-size нет двоеточия. В задаче предпологается что значения парамтеров (red, 14px и т.д.) всегда переданы правильно.

Нужно написать функцию, которая строкой получает CSS код и возврощает true/false (только для этих 12 случиях) в зависимости от того CSS код написан правильно или нет.

function  validateCSS(){}
console.log(validateCSS(" div > p { color:red;  font-size  14px; } "))    // false
console.log(validateCSS("{ color: red }"))    // false
console.log(validateCSS("p { color: red;  }"))    // true
console.log(validateCSS("p { color: red  font-size: 14px; }"))    // false
console.log(validateCSS("p: first-child a { color: red; }"))    // true
console.log(validateCSS("a: not (.red):last-child {color: red; background: red; border: 1px solid red; }"))    // true
console.log(validateCSS(“div > p”));    // false
console.log(validateCSS(“div > p {}”));    // true
console.log(validateCSS(“div > p {color: red, background color: green;}”));    // false
console.log(validateCSS(“a {display: block;}”));    // true
console.log(validateCSS(“a {display-block;}”);   // false
console.log(validateCSS(“a {dis play-block;}”);   // false

Поможете решить задачу?

там и без этого гигантская кухня.
дохрена всяких комбинаций селекторов, особенно доставляют селекторы атрибутов.
@-правила (медиазапросы, чарсеты и т.д.)
большой набор тегов.
псевдоклассы, псевдоэлементы.
свойства вроде content, которые должны быть внутри псевдоэлементов, и внутри значения которых надо пропустить точку с запятой.
опять же, составить словарь тегов и названий свойств.

нет, определенно, лет 15 назад можно было такую задачу с полпинка решить, но не сейчас :)

ну а так, понятное дело, регексы плюс некий конечный автомат с состояниями...