elements */
+body :not(div):not(span) {
+ font-weight: bold;
+}
+
+/* Elements that are not `.crazy` or `.fancy` */
+/* Note that this syntax is not well supported yet. */
+body :not(.crazy, .fancy) {
+ font-family: sans-serif;
+}
+
+:nth-child(odd) { color: lime; }
+:nth-child(even) { color: lime; }
+:nth-child(4) { color: lime; }
+:nth-child(4n) { color: lime; }
+:nth-child(3n+4) { color: lime; }
+:nth-child(-n+3) { color: lime; }
+:nth-child(n+8):nth-child(-n+15) { color: lime; }
+
+.first span:nth-child(2n+1),
+.second span:nth-child(2n+1),
+.third span:nth-of-type(2n+1) {
+ background-color: lime;
+ unknown-property: lime;
+}
+
+:root{
+ --foo: if(x > 5) this.width = 10; /* valid custom property, invalid in any normal property */
+}
+
+:root,
+:root:lang(en) {--external-link: "external link";}
+:root:lang(de) {--external-link: "externer Link";}
+
+a[href^="http"]::after {content: " (" var(--external-link) ")"}
+
+one { --foo: 10px; }
+two { --bar: calc(var(--foo) + 10px); }
+three { --foo: calc(var(--bar) + 10px); }
+.foo {
+ --gap: 20;
+ margin-top: var(--gap)px; /*20 px*/
+ margin-top: calc(var(--gap) * 1px); /*20px*/
+}
+
+foo {
+ width: calc(50% -8px); /* invalid */
+ width: calc(50%- 8px); /* invalid */
+ width: calc(50% +8px); /* invalid */
+ width: calc(50%+ 8px); /* invalid */
+ width: calc(2px -var(--a)); /* invalid */
+ width: calc(50%*-8px);
+ width: calc(50% - 8px);
+ width: calc(50% + -8px);
+ width: calc(50% +(8px));
+ width: calc(2px -(var(--a)));
+}
+
+sweet-alert input:focus::-moz-placeholder {
+ -webkit-transition: opacity 0.3s 0.03s ease;
+ transition: opacity 0.3s 0.03s ease;
+ opacity: 0.5;
+}
+
+
+@font-feature-values Font One {
+ @styleset {
+ nice-style: 12;
+ }
+}
+
+@font-feature-values Font Two {
+ @styleset {
+ nice-style: 4;
+ }
+}
+
+@counter-style thumbs {
+ system: cyclic;
+ symbols: "\1F44D";
+ suffix: " ";
+}
+
+@font-face {
+ font-family: "Open Sans";
+ src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
+ url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
+}
+
+@page {
+ margin: 1cm;
+}
+
+@page :first {
+ margin: 2cm;
+ /* comments */
+ marks: crop cross;
+}
+
+@page :unknown {
+ margin: 2cm;
+}
+
+@font-face {
+ unknown: 2px;
+ /* comments */
+ font-family: "Bitstream Vera Serif Bold";
+ src: url("/static/styles/libs/font-awesome/fonts/fontawesome-webfont.fdf491ce5ff5.woff");
+}
+
+@viewport {
+ zoom: 0.75;
+ /* comments */
+ min-zoom: 0.5;
+ max-zoom: 0.9;
+}
+
+@viewport {
+ orientation: landscape;
+ /* comments */
+ orientation: landscape;
+}
+
+@document url("https://www.example.com/") {
+ h1 {
+ color: green;
+ }
+}
+
+@supports (display: grid) {
+ div {
+ display: grid;
+ }
+}
+
+@media (max-width: 600px) {
+ .sidebar {
+ display: none;
+ }
+}
+
+@import url("fineprint.css") print;
+@import url(fineprint.css) print;
+@import url('bluish.css') speech;
+@import 'custom.css';
+@import url("chrome://communicator/skin/");
+@import "common.css" screen;
+@import url('landscape.css') screen and (orientation:landscape);
+
+@namespace url(http://www.w3.org/1999/xhtml);
+@namespace svg url(http://www.w3.org/2000/svg);
+
+@keyframes important1 {
+ from { margin-top: 50px; }
+ 50% { margin-top: 150px !important; } /* ignored */
+ to { margin-top: 100px; }
+}
+
+@keyframes important2 {
+ from { margin-top: 50px;
+ margin-bottom: 100px; }
+ to { margin-top: 150px !important; /* ignored */
+ margin-bottom: 50px; }
+}
+
+@keyframes slidein {
+ from {
+ margin-left: 100%;
+ width: 300%;
+ }
+
+ to {
+ margin-left: 0%;
+ width: 100%;
+ }
+}
+
+@media print {
+ a:hover { color: red }
+ /* comments */
+ a:hover { color: red }
+}
diff --git a/autotests/html/highlight.css.html b/autotests/html/highlight.css.html
index ab4a084..8e96fbf 100644
--- a/autotests/html/highlight.css.html
+++ b/autotests/html/highlight.css.html
@@ -1,56 +1,293 @@
highlight.css
/**
* This is a pseudo CSS file to test Kate's CSS syntax highlighting.
*/
-@import url("othersheet.css") screen, tv;
+@import url("othersheet.css") screen, tv;
body {
- font-size: 15pt;
+ font-size: 15pt;
font-family: Verdana, Helvetica, "Bitstream Vera Sans", sans-serif;
- margin-top: 0px; /* yet another comment */
- margin-bottom: 0px;
+ margin-top: 0px; /* yet another comment */
+ margin-bottom: 0px;
// this is no comment, it's just broken!
- margin-left: 0px;
- margin-right: 0px;
+ margin-left: 0px;
+ margin-right: 0px;
}
.something
{
- margin-right: 0px;
- color: #cdd;
- color: #AAFE04;
- color: rgb(10%,30%,43%);
- background: maroon;
+ margin-right: 0px;
+ color: #cdd;
+ color: #AAFE04;
+ color: rgb(10%,30%,43%);
+ background: maroon;
}
a:hover {
}
#header,
p.intro:first-letter,
p:lang(nl),
-img[align="right"]
+img[align="right"]
{
- border: 1px solid Qt::red !important;
- -moz-border-radius: 15px; /* unknown properties render italic */
+ border: 1px solid Qt::red !important;
+ -moz-border-radius: 15px; /* unknown properties render italic */
}
@media print {
#header
{
display: none;
}
}
/*
TODO: add more tests, e.g. media
*/
+
+
+.nice-look {
+ font-variant-alternates: styleset(nice-style);
+}
+
+ul {
+ list-style: thumbs;
+}
+
+/* SVG <a> */
+svg|a {}
+
+/* XHTML and SVG <a> */
+*|a {}
+
+*{}
+.class{}
+#id{}
+:hover{}
+:lang(fr){}
+E{}
+E F{}
+E>F{}
+E > F{}
+E~F{}
+E ~ F{}
+E:first-child{}
+E:visited{}
+E::after{}
+E:lang(c){}
+E:lang(fr-ca){}
+E + F{}
+E+F{}
+E[foo]{}
+E[foo=warning]{}
+E[foo="warning"]{}
+E[foo~="warning"]{}
+E[foo^="warning"]{}
+E[foo$="warning"]{}
+E[foo*="warning"]{}
+E[lang|="en"]{}
+DIV.warning{}
+DIV .warning{}
+E#myid{}
+E #myid{}
+E,E{}
+E, E{}
+E ,E{}
+E , E{}
+
+p:nth-child(2) {
+ background: red;
+}
+
+/* Elements that are not <div> or <span> elements */
+body :not(div):not(span) {
+ font-weight: bold;
+}
+
+/* Elements that are not `.crazy` or `.fancy` */
+/* Note that this syntax is not well supported yet. */
+body :not(.crazy, .fancy) {
+ font-family: sans-serif;
+}
+
+:nth-child(odd) { color: lime; }
+:nth-child(even) { color: lime; }
+:nth-child(4) { color: lime; }
+:nth-child(4n) { color: lime; }
+:nth-child(3n+4) { color: lime; }
+:nth-child(-n+3) { color: lime; }
+:nth-child(n+8):nth-child(-n+15) { color: lime; }
+
+.first span:nth-child(2n+1),
+.second span:nth-child(2n+1),
+.third span:nth-of-type(2n+1) {
+ background-color: lime;
+ unknown-property: lime;
+}
+
+:root{
+ --foo: if(x > 5) this.width = 10; /* valid custom property, invalid in any normal property */
+}
+
+:root,
+:root:lang(en) {--external-link: "external link";}
+:root:lang(de) {--external-link: "externer Link";}
+
+a[href^="http"]::after {content: " (" var(--external-link) ")"}
+
+one { --foo: 10px; }
+two { --bar: calc(var(--foo) + 10px); }
+three { --foo: calc(var(--bar) + 10px); }
+.foo {
+ --gap: 20;
+ margin-top: var(--gap)px; /*20 px*/
+ margin-top: calc(var(--gap) * 1px); /*20px*/
+}
+
+foo {
+ width: calc(50% -8px); /* invalid */
+ width: calc(50%- 8px); /* invalid */
+ width: calc(50% +8px); /* invalid */
+ width: calc(50%+ 8px); /* invalid */
+ width: calc(2px -var(--a)); /* invalid */
+ width: calc(50%*-8px);
+ width: calc(50% - 8px);
+ width: calc(50% + -8px);
+ width: calc(50% +(8px));
+ width: calc(2px -(var(--a)));
+}
+
+sweet-alert input:focus::-moz-placeholder {
+ -webkit-transition: opacity 0.3s 0.03s ease;
+ transition: opacity 0.3s 0.03s ease;
+ opacity: 0.5;
+}
+
+
+@font-feature-values Font One {
+ @styleset {
+ nice-style: 12;
+ }
+}
+
+@font-feature-values Font Two {
+ @styleset {
+ nice-style: 4;
+ }
+}
+
+@counter-style thumbs {
+ system: cyclic;
+ symbols: "\1F44D";
+ suffix: " ";
+}
+
+@font-face {
+ font-family: "Open Sans";
+ src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
+ url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
+}
+
+@page {
+ margin: 1cm;
+}
+
+@page :first {
+ margin: 2cm;
+ /* comments */
+ marks: crop cross;
+}
+
+@page :unknown {
+ margin: 2cm;
+}
+
+@font-face {
+ unknown: 2px;
+ /* comments */
+ font-family: "Bitstream Vera Serif Bold";
+ src: url("/static/styles/libs/font-awesome/fonts/fontawesome-webfont.fdf491ce5ff5.woff");
+}
+
+@viewport {
+ zoom: 0.75;
+ /* comments */
+ min-zoom: 0.5;
+ max-zoom: 0.9;
+}
+
+@viewport {
+ orientation: landscape;
+ /* comments */
+ orientation: landscape;
+}
+
+@document url("https://www.example.com/") {
+ h1 {
+ color: green;
+ }
+}
+
+@supports (display: grid) {
+ div {
+ display: grid;
+ }
+}
+
+@media (max-width: 600px) {
+ .sidebar {
+ display: none;
+ }
+}
+
+@import url("fineprint.css") print;
+@import url(fineprint.css) print;
+@import url('bluish.css') speech;
+@import 'custom.css';
+@import url("chrome://communicator/skin/");
+@import "common.css" screen;
+@import url('landscape.css') screen and (orientation:landscape);
+
+@namespace url(http://www.w3.org/1999/xhtml);
+@namespace svg url(http://www.w3.org/2000/svg);
+
+@keyframes important1 {
+ from { margin-top: 50px; }
+ 50% { margin-top: 150px !important; } /* ignored */
+ to { margin-top: 100px; }
+}
+
+@keyframes important2 {
+ from { margin-top: 50px;
+ margin-bottom: 100px; }
+ to { margin-top: 150px !important; /* ignored */
+ margin-bottom: 50px; }
+}
+
+@keyframes slidein {
+ from {
+ margin-left: 100%;
+ width: 300%;
+ }
+
+ to {
+ margin-left: 0%;
+ width: 100%;
+ }
+}
+
+@media print {
+ a:hover { color: red }
+ /* comments */
+ a:hover { color: red }
+}
diff --git a/autotests/html/review128925-1.css.html b/autotests/html/review128925-1.css.html
index 462efe7..192353d 100644
--- a/autotests/html/review128925-1.css.html
+++ b/autotests/html/review128925-1.css.html
@@ -1,119 +1,119 @@
review128925-1.css
/*
* CSS Syntax Highlight Sample File (Standard)
*
* This file contains most CSS syntax, CSS3 properties, @media, @font-face and
* @keyframes annotations.
*
* @author Guo Yunhe guoyunhebrave@gmail.com
* @date 2016-09-16
*/
/*
* Block comment
*
* Alert keywords:
* TODO BUG FIXME
*/
@charset "UTF-8";
-@import url("components/button.css");
+@import url("components/button.css");
/* Properties */
html, body {
font-family: "Droid Sans", Arial, sans-serif;
- font-size: 11pt;
- line-height: 1.5em;
- max-width: calc(100% - 300px);
- background: #fff000;
- text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
+ font-size: 11pt;
+ line-height: 1.5em;
+ max-width: calc(100% - 300px);
+ background: #fff000;
+ text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
box-sizing: border-box;
}
/* Selectors */
blockquote {
margin: 0;
}
header #logo {
- width: 100px;
+ width: 100px;
}
div#footer .link {
- color: blue;
+ color: blue;
}
-sidebar #subscribe .subscribe_form input[type="text"] {
- font-size: 20px;
+sidebar #subscribe .subscribe_form input[type="text"] {
+ font-size: 20px;
}
-sidebar #subscribe .subscribe_form:nth-child(2n + 1):hover input[class*="small-"] {
+sidebar #subscribe .subscribe_form:nth-child(2n + 1):hover input[class*="small-"] {
font-weight: bold;
}
/* Media Queries */
@media print {
.container {
- width: 100%;
+ width: 100%;
}
}
-@media screen and (min-width: 768px) {
+@media screen and (min-width: 768px) {
.container {
- width: 600px;
+ width: 600px;
}
}
-@media screen and (min-width: 768px) and (max-width: 960px) {
+@media screen and (min-width: 768px) and (max-width: 960px) {
.container {
- width: 720px;
+ width: 720px;
}
}
/* Fontface */
@font-face {
font-family: MyHelvetica;
- src: local("Helvetica Neue Bold"),
- local("HelveticaNeue-Bold"),
- url(MgOpenModernaBold.ttf);
+ src: local("Helvetica Neue Bold"),
+ local("HelveticaNeue-Bold"),
+ url(MgOpenModernaBold.ttf);
font-weight: bold;
}
/* Animation (Keyframes) */
@keyframes slidein {
- from {
- margin-left: 100%;
- width: 300%;
+ from {
+ margin-left: 100%;
+ width: 300%;
}
- to {
- margin-left: 0%;
- width: 100%;
+ to {
+ margin-left: 0%;
+ width: 100%;
}
}
/* Region markers */
/*BEGIN Comment */
/*END Comment */
diff --git a/autotests/html/review128925-2.css.html b/autotests/html/review128925-2.css.html
index a1eec08..f519726 100644
--- a/autotests/html/review128925-2.css.html
+++ b/autotests/html/review128925-2.css.html
@@ -1,69 +1,69 @@
review128925-2.css
/*
* CSS Syntax Highlight Sample File (Complex)
*
* This file contains complex CSS syntax that can test unexpected situations.
*
* @author Guo Yunhe guoyunhebrave@gmail.com
* @date 2016-09-16
*/
/* Comments with special content */
/*
* .class-selector #id "string" 'comment' // comment {} [] () /* comment
* TODO BUG DEBUG
* body {
* margin: 0 !important;
* }
*/
/* Comments in special positions */
header/* comment here */.active /* comment here */ {
- /* comment here */ color : /* comment here */ blue/* comment here */;
+ /* comment here */ color : /* comment here */ blue/* comment here */;
font-family: Arial /* comment here */,
"Droid Sans", /* comment here */
sans-serif/* comment here */;
}
-@media screen /* comment here */ and (max-width: 300px /* comment here */) /* comment here */ {/* comment here */}
+@media screen /* comment here */ and (max-width: 300px /* comment here */) /* comment here */ {/* comment here */}
/* Strings with special content */
-@import url("{} $variable /* comment */");
+@import url("{} $variable /* comment */");
/* Without extra breaklines and spaces */
-pre.primary:hover.large:nth-child(2n-1){font-size:17px;font-family:"Noto Sans";-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.3)}
+pre.primary:hover.large:nth-child(2n-1){font-size:17px;font-family:"Noto Sans";-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.3)}
/* With unnecessary breaklines and spaces */
blockquote .ref
{
- flex : 0 1 30%;
+ flex : 0 1 30%;
flex-wrap : wrap;
}
-@media screen and (orientation: landscape) {
+@media screen and (orientation: landscape) {
.sidebar {
- width: 500px; } }
+ width: 500px; } }
/* Special selectors: HTML5 allows user defined tags */
header {
flex {
- width: 300px;
+ width: 300px;
}
}
diff --git a/autotests/html/test.htm.html b/autotests/html/test.htm.html
index 3296226..4c5eca5 100644
--- a/autotests/html/test.htm.html
+++ b/autotests/html/test.htm.html
@@ -1,24 +1,24 @@
test.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>This is a title</title>
<style>
/* comment */
- #xyz { color: red; }
+ #xyz { color: red; }
h1 { font: "Comic Sans"; }
</style>
</head>
<body class="ui main">
<p *ngFor="let name of names">Hello, {{ name }}!</p>
</body>
<script>
document.body.appendChild(document.createTextNode('Hello World!')); // comment
</script>
</html>
diff --git a/autotests/input/highlight.css b/autotests/input/highlight.css
index 986c6c0..7a5ea67 100644
--- a/autotests/input/highlight.css
+++ b/autotests/input/highlight.css
@@ -1,49 +1,286 @@
/**
* This is a pseudo CSS file to test Kate's CSS syntax highlighting.
*/
@import url("othersheet.css") screen, tv;
body {
font-size: 15pt;
font-family: Verdana, Helvetica, "Bitstream Vera Sans", sans-serif;
margin-top: 0px; /* yet another comment */
margin-bottom: 0px;
// this is no comment, it's just broken!
margin-left: 0px;
margin-right: 0px;
}
.something
{
margin-right: 0px;
color: #cdd;
color: #AAFE04;
color: rgb(10%,30%,43%);
background: maroon;
}
a:hover {
}
#header,
p.intro:first-letter,
p:lang(nl),
img[align="right"]
{
border: 1px solid Qt::red !important;
-moz-border-radius: 15px; /* unknown properties render italic */
}
@media print {
#header
{
display: none;
}
}
/*
TODO: add more tests, e.g. media
*/
+
+
+.nice-look {
+ font-variant-alternates: styleset(nice-style);
+}
+
+ul {
+ list-style: thumbs;
+}
+
+/* SVG */
+svg|a {}
+
+/* XHTML and SVG */
+*|a {}
+
+*{}
+.class{}
+#id{}
+:hover{}
+:lang(fr){}
+E{}
+E F{}
+E>F{}
+E > F{}
+E~F{}
+E ~ F{}
+E:first-child{}
+E:visited{}
+E::after{}
+E:lang(c){}
+E:lang(fr-ca){}
+E + F{}
+E+F{}
+E[foo]{}
+E[foo=warning]{}
+E[foo="warning"]{}
+E[foo~="warning"]{}
+E[foo^="warning"]{}
+E[foo$="warning"]{}
+E[foo*="warning"]{}
+E[lang|="en"]{}
+DIV.warning{}
+DIV .warning{}
+E#myid{}
+E #myid{}
+E,E{}
+E, E{}
+E ,E{}
+E , E{}
+
+p:nth-child(2) {
+ background: red;
+}
+
+/* Elements that are not or
elements */
+body :not(div):not(span) {
+ font-weight: bold;
+}
+
+/* Elements that are not `.crazy` or `.fancy` */
+/* Note that this syntax is not well supported yet. */
+body :not(.crazy, .fancy) {
+ font-family: sans-serif;
+}
+
+:nth-child(odd) { color: lime; }
+:nth-child(even) { color: lime; }
+:nth-child(4) { color: lime; }
+:nth-child(4n) { color: lime; }
+:nth-child(3n+4) { color: lime; }
+:nth-child(-n+3) { color: lime; }
+:nth-child(n+8):nth-child(-n+15) { color: lime; }
+
+.first span:nth-child(2n+1),
+.second span:nth-child(2n+1),
+.third span:nth-of-type(2n+1) {
+ background-color: lime;
+ unknown-property: lime;
+}
+
+:root{
+ --foo: if(x > 5) this.width = 10; /* valid custom property, invalid in any normal property */
+}
+
+:root,
+:root:lang(en) {--external-link: "external link";}
+:root:lang(de) {--external-link: "externer Link";}
+
+a[href^="http"]::after {content: " (" var(--external-link) ")"}
+
+one { --foo: 10px; }
+two { --bar: calc(var(--foo) + 10px); }
+three { --foo: calc(var(--bar) + 10px); }
+.foo {
+ --gap: 20;
+ margin-top: var(--gap)px; /*20 px*/
+ margin-top: calc(var(--gap) * 1px); /*20px*/
+}
+
+foo {
+ width: calc(50% -8px); /* invalid */
+ width: calc(50%- 8px); /* invalid */
+ width: calc(50% +8px); /* invalid */
+ width: calc(50%+ 8px); /* invalid */
+ width: calc(2px -var(--a)); /* invalid */
+ width: calc(50%*-8px);
+ width: calc(50% - 8px);
+ width: calc(50% + -8px);
+ width: calc(50% +(8px));
+ width: calc(2px -(var(--a)));
+}
+
+sweet-alert input:focus::-moz-placeholder {
+ -webkit-transition: opacity 0.3s 0.03s ease;
+ transition: opacity 0.3s 0.03s ease;
+ opacity: 0.5;
+}
+
+
+@font-feature-values Font One {
+ @styleset {
+ nice-style: 12;
+ }
+}
+
+@font-feature-values Font Two {
+ @styleset {
+ nice-style: 4;
+ }
+}
+
+@counter-style thumbs {
+ system: cyclic;
+ symbols: "\1F44D";
+ suffix: " ";
+}
+
+@font-face {
+ font-family: "Open Sans";
+ src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
+ url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
+}
+
+@page {
+ margin: 1cm;
+}
+
+@page :first {
+ margin: 2cm;
+ /* comments */
+ marks: crop cross;
+}
+
+@page :unknown {
+ margin: 2cm;
+}
+
+@font-face {
+ unknown: 2px;
+ /* comments */
+ font-family: "Bitstream Vera Serif Bold";
+ src: url("/static/styles/libs/font-awesome/fonts/fontawesome-webfont.fdf491ce5ff5.woff");
+}
+
+@viewport {
+ zoom: 0.75;
+ /* comments */
+ min-zoom: 0.5;
+ max-zoom: 0.9;
+}
+
+@viewport {
+ orientation: landscape;
+ /* comments */
+ orientation: landscape;
+}
+
+@document url("https://www.example.com/") {
+ h1 {
+ color: green;
+ }
+}
+
+@supports (display: grid) {
+ div {
+ display: grid;
+ }
+}
+
+@media (max-width: 600px) {
+ .sidebar {
+ display: none;
+ }
+}
+
+@import url("fineprint.css") print;
+@import url(fineprint.css) print;
+@import url('bluish.css') speech;
+@import 'custom.css';
+@import url("chrome://communicator/skin/");
+@import "common.css" screen;
+@import url('landscape.css') screen and (orientation:landscape);
+
+@namespace url(http://www.w3.org/1999/xhtml);
+@namespace svg url(http://www.w3.org/2000/svg);
+
+@keyframes important1 {
+ from { margin-top: 50px; }
+ 50% { margin-top: 150px !important; } /* ignored */
+ to { margin-top: 100px; }
+}
+
+@keyframes important2 {
+ from { margin-top: 50px;
+ margin-bottom: 100px; }
+ to { margin-top: 150px !important; /* ignored */
+ margin-bottom: 50px; }
+}
+
+@keyframes slidein {
+ from {
+ margin-left: 100%;
+ width: 300%;
+ }
+
+ to {
+ margin-left: 0%;
+ width: 100%;
+ }
+}
+
+@media print {
+ a:hover { color: red }
+ /* comments */
+ a:hover { color: red }
+}
diff --git a/autotests/reference/highlight.css.ref b/autotests/reference/highlight.css.ref
index fa1fbed..a0c9bfd 100644
--- a/autotests/reference/highlight.css.ref
+++ b/autotests/reference/highlight.css.ref
@@ -1,49 +1,286 @@
/**
* This is a pseudo CSS file to test Kate's CSS syntax highlighting.
*/
-@import url("othersheet.css") screen, tv;
+@import url("othersheet.css") screen, tv;
-body {
- font-size: 15pt;
- font-family: Verdana, Helvetica, "Bitstream Vera Sans", sans-serif;
- margin-top: 0px; /* yet another comment */
- margin-bottom: 0px;
- // this is no comment, it's just broken!
- margin-left: 0px;
- margin-right: 0px;
+body {
+ font-size: 15pt;
+ font-family: Verdana, Helvetica, "Bitstream Vera Sans", sans-serif;
+ margin-top: 0px; /* yet another comment */
+ margin-bottom: 0px;
+ // this is no comment, it's just broken!
+ margin-left: 0px;
+ margin-right: 0px;
}
.something
{
- margin-right: 0px;
- color: #cdd;
- color: #AAFE04;
- color: rgb(10%,30%,43%);
- background: maroon;
+ margin-right: 0px;
+ color: #cdd;
+ color: #AAFE04;
+ color: rgb(10%,30%,43%);
+ background: maroon;
}
-a:hover {
+a:hover {
}
-#header,
-p.intro:first-letter,
-p:lang(nl),
-img[align="right"]
+#header,
+p.intro:first-letter,
+p:lang(nl),
+img[align="right"]
{
- border: 1px solid Qt::red !important;
- -moz-border-radius: 15px; /* unknown properties render italic */
+ border: 1px solid Qt::red !important;
+ -moz-border-radius: 15px; /* unknown properties render italic */
}
@media print {
#header
{
- display: none;
+ display: none;
}
}
/*
TODO: add more tests, e.g. media
*/
+
+
+.nice-look {
+ font-variant-alternates: styleset(nice-style);
+}
+
+ul {
+ list-style: thumbs;
+}
+
+/* SVG */
+svg|a {}
+
+/* XHTML and SVG */
+*|a {}
+
+*{}
+.class{}
+#id{}
+:hover{}
+:lang(fr){}
+E{}
+E F{}
+E>F{}
+E > F{}
+E~F{}
+E ~ F{}
+E:first-child{}
+E:visited{}
+E::after{}
+E:lang(c){}
+E:lang(fr-ca){}
+E + F{}
+E+F{}
+E[foo]{}
+E[foo=warning]{}
+E[foo="warning"]{}
+E[foo~="warning"]{}
+E[foo^="warning"]{}
+E[foo$="warning"]{}
+E[foo*="warning"]{}
+E[lang|="en"]{}
+DIV.warning{}
+DIV .warning{}
+E#myid{}
+E #myid{}
+E,E{}
+E, E{}
+E ,E{}
+E , E{}
+
+p:nth-child(2) {
+ background: red;
+}
+
+/* Elements that are not or
elements */
+body :not(div):not(span) {
+ font-weight: bold;
+}
+
+/* Elements that are not `.crazy` or `.fancy` */
+/* Note that this syntax is not well supported yet. */
+body :not(.crazy, .fancy) {
+ font-family: sans-serif;
+}
+
+:nth-child(odd) { color: lime; }
+:nth-child(even) { color: lime; }
+:nth-child(4) { color: lime; }
+:nth-child(4n) { color: lime; }
+:nth-child(3n+4) { color: lime; }
+:nth-child(-n+3) { color: lime; }
+:nth-child(n+8):nth-child(-n+15) { color: lime; }
+
+.first span:nth-child(2n+1),
+.second span:nth-child(2n+1),
+.third span:nth-of-type(2n+1) {
+ background-color: lime;
+ unknown-property: lime;
+}
+
+:root{
+ --foo: if(x > 5) this.width = 10; /* valid custom property, invalid in any normal property */
+}
+
+:root,
+:root:lang(en) {--external-link: "external link";}
+:root:lang(de) {--external-link: "externer Link";}
+
+a[href^="http"]::after {content: " (" var(--external-link) ")"}
+
+one { --foo: 10px; }
+two { --bar: calc(var(--foo) + 10px); }
+three { --foo: calc(var(--bar) + 10px); }
+.foo {
+ --gap: 20;
+ margin-top: var(--gap)px; /*20 px*/
+ margin-top: calc(var(--gap) * 1px); /*20px*/
+}
+
+foo {
+ width: calc(50% -8px); /* invalid */
+ width: calc(50%- 8px); /* invalid */
+ width: calc(50% +8px); /* invalid */
+ width: calc(50%+ 8px); /* invalid */
+ width: calc(2px -var(--a)); /* invalid */
+ width: calc(50%*-8px);
+ width: calc(50% - 8px);
+ width: calc(50% + -8px);
+ width: calc(50% +(8px));
+ width: calc(2px -(var(--a)));
+}
+
+sweet-alert input:focus::-moz-placeholder {
+ -webkit-transition: opacity 0.3s 0.03s ease;
+ transition: opacity 0.3s 0.03s ease;
+ opacity: 0.5;
+}
+
+
+@font-feature-values Font One {
+ @styleset {
+ nice-style: 12;
+ }
+}
+
+@font-feature-values Font Two {
+ @styleset {
+ nice-style: 4;
+ }
+}
+
+@counter-style thumbs {
+ system: cyclic;
+ symbols: "\1F44D";
+ suffix: " ";
+}
+
+@font-face {
+ font-family: "Open Sans";
+ src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
+ url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
+}
+
+@page {
+ margin: 1cm;
+}
+
+@page :first {
+ margin: 2cm;
+ /* comments */
+ marks: crop cross;
+}
+
+@page :unknown {
+ margin: 2cm;
+}
+
+@font-face {
+ unknown: 2px;
+ /* comments */
+ font-family: "Bitstream Vera Serif Bold";
+ src: url("/static/styles/libs/font-awesome/fonts/fontawesome-webfont.fdf491ce5ff5.woff");
+}
+
+@viewport {
+ zoom: 0.75;
+ /* comments */
+ min-zoom: 0.5;
+ max-zoom: 0.9;
+}
+
+@viewport {
+ orientation: landscape;
+ /* comments */
+ orientation: landscape;
+}
+
+@document url("https://www.example.com/") {
+ h1 {
+ color: green;
+ }
+}
+
+@supports (display: grid) {
+ div {
+ display: grid;
+ }
+}
+
+@media (max-width: 600px) {
+ .sidebar {
+ display: none;
+ }
+}
+
+@import url("fineprint.css") print;
+@import url(fineprint.css) print;
+@import url('bluish.css') speech;
+@import 'custom.css';
+@import url("chrome://communicator/skin/");
+@import "common.css" screen;
+@import url('landscape.css') screen and (orientation:landscape);
+
+@namespace url(http://www.w3.org/1999/xhtml);
+@namespace svg url(http://www.w3.org/2000/svg);
+
+@keyframes important1 {
+ from { margin-top: 50px; }
+ 50% { margin-top: 150px !important; } /* ignored */
+ to { margin-top: 100px; }
+}
+
+@keyframes important2 {
+ from { margin-top: 50px;
+ margin-bottom: 100px; }
+ to { margin-top: 150px !important; /* ignored */
+ margin-bottom: 50px; }
+}
+
+@keyframes slidein {
+ from {
+ margin-left: 100%;
+ width: 300%;
+ }
+
+ to {
+ margin-left: 0%;
+ width: 100%;
+ }
+}
+
+@media print {
+ a:hover { color: red }
+ /* comments */
+ a:hover { color: red }
+}
diff --git a/autotests/reference/review128925-1.css.ref b/autotests/reference/review128925-1.css.ref
index 59bc8e1..6fc69f0 100644
--- a/autotests/reference/review128925-1.css.ref
+++ b/autotests/reference/review128925-1.css.ref
@@ -1,112 +1,112 @@
/*
* CSS Syntax Highlight Sample File (Standard)
*
* This file contains most CSS syntax, CSS3 properties, @media, @font-face and
* @keyframes annotations.
*
* @author Guo Yunhe guoyunhebrave@gmail.com
* @date 2016-09-16
*/
/*
* Block comment
*
* Alert keywords:
* TODO BUG FIXME
*/
-@charset "UTF-8";
+@charset "UTF-8";
-@import url("components/button.css");
+@import url("components/button.css");
/* Properties */
-html, body {
- font-family: "Droid Sans", Arial, sans-serif;
- font-size: 11pt;
- line-height: 1.5em;
- max-width: calc(100% - 300px);
- background: #fff000;
- text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
- box-sizing: border-box;
+html, body {
+ font-family: "Droid Sans", Arial, sans-serif;
+ font-size: 11pt;
+ line-height: 1.5em;
+ max-width: calc(100% - 300px);
+ background: #fff000;
+ text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
+ box-sizing: border-box;
}
/* Selectors */
-blockquote {
- margin: 0;
+blockquote {
+ margin: 0;
}
-header #logo {
- width: 100px;
+header #logo {
+ width: 100px;
}
-div#footer .link {
- color: blue;
+div#footer .link {
+ color: blue;
}
-sidebar #subscribe .subscribe_form input[type="text"] {
- font-size: 20px;
+sidebar #subscribe .subscribe_form input[type="text"] {
+ font-size: 20px;
}
-sidebar #subscribe .subscribe_form:nth-child(2n + 1):hover input[class*="small-"] {
- font-weight: bold;
+sidebar #subscribe .subscribe_form:nth-child(2n + 1):hover input[class*="small-"] {
+ font-weight: bold;
}
/* Media Queries */
@media print {
.container {
- width: 100%;
+ width: 100%;
}
}
-@media screen and (min-width: 768px) {
+@media screen and (min-width: 768px) {
.container {
- width: 600px;
+ width: 600px;
}
}
-@media screen and (min-width: 768px) and (max-width: 960px) {
+@media screen and (min-width: 768px) and (max-width: 960px) {
.container {
- width: 720px;
+ width: 720px;
}
}
/* Fontface */
@font-face {
- font-family: MyHelvetica;
- src: local("Helvetica Neue Bold"),
- local("HelveticaNeue-Bold"),
- url(MgOpenModernaBold.ttf);
- font-weight: bold;
+ font-family: MyHelvetica;
+ src: local("Helvetica Neue Bold"),
+ local("HelveticaNeue-Bold"),
+ url(MgOpenModernaBold.ttf);
+ font-weight: bold;
}
/* Animation (Keyframes) */
@keyframes slidein {
- from {
- margin-left: 100%;
- width: 300%;
+ from {
+ margin-left: 100%;
+ width: 300%;
}
- to {
- margin-left: 0%;
- width: 100%;
+ to {
+ margin-left: 0%;
+ width: 100%;
}
}
/* Region markers */
/*BEGIN Comment */
/*END Comment */
diff --git a/autotests/reference/review128925-2.css.ref b/autotests/reference/review128925-2.css.ref
index b8c2139..2a39d12 100644
--- a/autotests/reference/review128925-2.css.ref
+++ b/autotests/reference/review128925-2.css.ref
@@ -1,62 +1,62 @@
/*
* CSS Syntax Highlight Sample File (Complex)
*
* This file contains complex CSS syntax that can test unexpected situations.
*
* @author Guo Yunhe guoyunhebrave@gmail.com
* @date 2016-09-16
*/
/* Comments with special content */
/*
* .class-selector #id "string" 'comment' // comment {} [] () /* comment
* TODO BUG DEBUG
* body {
* margin: 0 !important;
* }
*/
/* Comments in special positions */
-header/* comment here */.active /* comment here */ {
- /* comment here */ color : /* comment here */ blue/* comment here */;
+header/* comment here */.active /* comment here */ {
+ /* comment here */ color : /* comment here */ blue/* comment here */;
font-family: Arial /* comment here */,
"Droid Sans", /* comment here */
- sans-serif/* comment here */;
+ sans-serif/* comment here */;
}
-@media screen /* comment here */ and (max-width: 300px /* comment here */) /* comment here */ {/* comment here */}
+@media screen /* comment here */ and (max-width: 300px /* comment here */) /* comment here */ {/* comment here */}
/* Strings with special content */
-@import url("{} $variable /* comment */");
+@import url("{} $variable /* comment */");
/* Without extra breaklines and spaces */
-pre.primary:hover.large:nth-child(2n-1){font-size:17px;font-family:"Noto Sans";-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.3)}
+pre.primary:hover.large:nth-child(2n-1){font-size:17px;font-family:"Noto Sans";-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.3)}
/* With unnecessary breaklines and spaces */
-blockquote .ref
+blockquote .ref
{
- flex : 0 1 30%;
- flex-wrap : wrap;
+ flex : 0 1 30%;
+ flex-wrap : wrap;
}
-@media screen and (orientation: landscape) {
+@media screen and (orientation: landscape) {
.sidebar {
- width: 500px; } }
+ width: 500px; } }
/* Special selectors: HTML5 allows user defined tags */
-header {
+header {
flex {
- width: 300px;
+ width: 300px;
}
}
diff --git a/autotests/reference/test.css.ref b/autotests/reference/test.css.ref
index 980359f..83abc66 100644
--- a/autotests/reference/test.css.ref
+++ b/autotests/reference/test.css.ref
@@ -1,18 +1,18 @@
-h1 {
- text-color: "red";
+h1 {
+ text-color: "red";
}
/* PHP code, invalid in CSS context */
-for()
+for()
echo("hello");
// valid code in PHP context
for()
?>
-h2 {
- text-weight: bold;
+h2 {
+ text-weight: bold;
}
diff --git a/autotests/reference/test.htm.ref b/autotests/reference/test.htm.ref
index 1039359..c3d98ff 100644
--- a/autotests/reference/test.htm.ref
+++ b/autotests/reference/test.htm.ref
@@ -1,17 +1,17 @@
HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
This is a title
/* comment */
- #xyz { color: red; }
- h1 { font: "Comic Sans"; }
+ #xyz { color: red; }
+ h1 { font: "Comic Sans"; }
class="ui main">
*ngFor="let name of names">Hello, {{ name }}!
document.body.(document.('Hello World!')); // comment
diff --git a/data/syntax/css.xml b/data/syntax/css.xml
index 3300222..c71ea86 100644
--- a/data/syntax/css.xml
+++ b/data/syntax/css.xml
@@ -1,1056 +1,1701 @@
+
]>
-
+
- - azimuth
- align-content
- align-items
- - align-self
- alignment-baseline
+ - align-self
- all
- - animation-name
+ - animation
+ - animation-delay
+ - animation-direction
- animation-duration
+ - animation-fill-mode
- animation-iteration-count
- - animation-direction
- - animation-delay
+ - animation-name
- animation-play-state
- - animation-fill-mode
- animation-timing-function
+ - appearance
+ - azimuth
- backface-visibility
- background
- background-attachment
- background-blend-mode
- - background-break
- background-clip
- background-color
- background-image
+ - background-image-transform
- background-origin
- background-position
- background-repeat
- background-size
- baseline-shift
+ - block-size
+ - block-step
+ - block-step-align
+ - block-step-insert
+ - block-step-round
+ - block-step-size
- bookmark-label
- bookmark-level
- - bookmark-level
+ - bookmark-state
- border
+ - border-block
+ - border-block-color
+ - border-block-end
+ - border-block-end-color
+ - border-block-end-style
+ - border-block-end-width
+ - border-block-start
+ - border-block-start-color
+ - border-block-start-style
+ - border-block-start-width
+ - border-block-style
+ - border-block-width
- border-bottom
- border-bottom-color
- - border-bottom-image
- - border-bottom-style
- - border-bottom-width
- - border-bottom-left-image
- border-bottom-left-radius
- - border-bottom-right-image
- border-bottom-right-radius
+ - border-bottom-style
+ - border-bottom-width
- border-boundary
- border-collapse
- border-color
- - border-corner-image
- border-image
- border-image-outset
- border-image-repeat
- border-image-slice
- border-image-source
+ - border-image-transform
- border-image-width
+ - border-inline
+ - border-inline-color
+ - border-inline-end
+ - border-inline-end-color
+ - border-inline-end-style
+ - border-inline-end-width
+ - border-inline-start
+ - border-inline-start-color
+ - border-inline-start-style
+ - border-inline-start-width
+ - border-inline-style
+ - border-inline-width
- border-left
- border-left-color
- - border-left-image
- border-left-style
- border-left-width
- border-radius
- border-right
- border-right-color
- - border-right-image
- border-right-style
- border-right-width
- border-spacing
- border-style
- border-top
- border-top-color
- - border-top-image
- - border-top-style
- - border-top-width
- - border-top-left-image
- border-top-left-radius
- - border-top-right-image
- border-top-right-radius
+ - border-top-style
+ - border-top-width
- border-width
- bottom
- - box-align
- box-decoration-break
- - box-direction
- - box-flex
- box-shadow
- box-sizing
- box-snap
- - box-suppress
- break-after
- break-before
- break-inside
- - caret-color
- caption-side
- - chains
+ - caret
+ - caret-color
+ - caret-shape
- clear
- clip
- clip-path
- clip-rule
- color
+ - color-adjust
- color-interpolation-filters
+ - columns
- column-count
- column-fill
- column-gap
- column-rule
- column-rule-color
- column-rule-style
- column-rule-width
- column-span
- column-width
- - columns
+ - contain
- content
+ - continue
- counter-increment
- counter-reset
- counter-set
- cue
- cue-after
- cue-before
- cursor
- direction
- display
- dominant-baseline
- elevation
- empty-cells
+ - fill
+ - fill-break
+ - fill-color
+ - fill-image
+ - fill-opacity
+ - fill-origin
+ - fill-position
+ - fill-repeat
+ - fill-rule
+ - fill-size
- filter
- flex
- flex-basis
- flex-direction
- flex-flow
- flex-grow
- flex-shrink
- flex-wrap
- float
+ - float-defer
+ - float-offset
+ - float-reference
- flood-color
- flood-opacity
- - flow
- flow-from
- flow-into
- font
- font-family
+ - font-feature-settings
+ - font-kerning
+ - font-language-override
+ - font-max-size
+ - font-min-size
+ - font-optical-sizing
+ - font-palette
- font-size
- font-size-adjust
- font-stretch
- font-style
- - font-variant
- - font-weight
- - font-stretch
- - font-feature-settings
- - font-kerning
- - font-language-override
- font-synthesis
+ - font-variant
- font-variant-alternates
- font-variant-caps
- font-variant-east-asian
+ - font-variant-emoji
- font-variant-ligatures
- font-variant-numeric
- font-variant-position
+ - font-variation-settings
+ - font-weight
- footnote-display
- footnote-policy
+ - gap
- glyph-orientation-vertical
- grid
- grid-area
- grid-auto-columns
- grid-auto-flow
- grid-auto-rows
- grid-column
- grid-column-end
- grid-column-gap
- grid-column-start
- grid-gap
- grid-row
- grid-row-end
- grid-row-gap
- grid-row-start
- grid-template
- grid-template-areas
- grid-template-columns
- grid-template-rows
- hanging-punctuation
- height
+ - hyphenate-character
+ - hyphenate-limit-chars
+ - hyphenate-limit-last
+ - hyphenate-limit-lines
+ - hyphenate-limit-zone
- hyphens
- image-orientation
- image-rendering
- image-resolution
- initial-letter
- initial-letter-align
- initial-letter-wrap
+ - inline-size
+ - inset
+ - inset-block
+ - inset-block-end
+ - inset-block-start
+ - inset-inline
+ - inset-inline-end
+ - inset-inline-start
- isolation
- justify-content
- justify-items
- justify-self
- left
- letter-spacing
- lighting-color
- - linear-gradient
+ - line-break
- line-grid
- line-height
+ - line-height-step
- line-snap
- list-style
- list-style-image
- - list-style-keyword
- list-style-position
- list-style-type
- margin
+ - margin-block
+ - margin-block-end
+ - margin-block-start
- margin-bottom
+ - margin-inline
+ - margin-inline-end
+ - margin-inline-start
- margin-left
- margin-right
- margin-top
- - marker-offset
+ - marker
+ - marker-end
+ - marker-knockout-left
+ - marker-knockout-right
+ - marker-mid
+ - marker-pattern
+ - marker-segment
- marker-side
+ - marker-start
- marquee-direction
- marquee-loop
- marquee-speed
- marquee-style
- mask
- mask-border
- mask-border-mode
- mask-border-outset
- mask-border-repeat
- mask-border-slice
- mask-border-source
- mask-border-width
- mask-clip
- mask-composite
- mask-image
- mask-mode
- mask-origin
- mask-position
- mask-repeat
- mask-size
- mask-type
+ - max-block-size
- max-height
+ - max-inline-size
- max-lines
- max-width
+ - min-block-size
- min-height
+ - min-inline-size
- min-width
- mix-blend-mode
+ - nav-up
- nav-down
- nav-left
- nav-right
- - nav-up
- object-fit
- object-position
+ - offset
- offset-after
+ - offset-anchor
- offset-before
+ - offset-distance
- offset-end
+ - offset-path
+ - offset-position
+ - offset-rotate
- offset-start
- opacity
- order
- orphans
- outline
- outline-color
- outline-offset
- outline-style
- outline-width
- overflow
- overflow-style
- overflow-wrap
- overflow-x
- overflow-y
- padding
+ - padding-block
+ - padding-block-end
+ - padding-block-start
- padding-bottom
+ - padding-inline
+ - padding-inline-end
+ - padding-inline-start
- padding-left
- padding-right
- padding-top
- page
- page-break-after
- page-break-before
- page-break-inside
- pause
- pause-after
- pause-before
- perspective
- perspective-origin
- pitch
- pitch-range
+ - place-content
+ - place-items
+ - place-self
- play-during
- pointer-events
- - polar-anchor
- - polar-angle
- - polar-distance
- - polar-origin
- position
- - presentation-level
- quotes
+ - region-fragment
- resize
- - rest
- - rest-after
- - rest-before
- richness
- right
- rotation
- rotation-point
+ - row-gap
- ruby-align
- ruby-merge
- ruby-position
- running
- - scroll-behavior
- - scroll-snap-align
- - scroll-snap-margin
- - scroll-snap-margin-block
- - scroll-snap-margin-block-end
- - scroll-snap-margin-block-start
- - scroll-snap-margin-bottom
- - scroll-snap-margin-inline
- - scroll-snap-margin-inline-end
- - scroll-snap-margin-inline-start
- - scroll-snap-margin-left
- - scroll-snap-margin-right
- - scroll-snap-margin-top
- - scroll-snap-padding
- - scroll-snap-padding-block
- - scroll-snap-padding-block-end
- - scroll-snap-padding-block-start
- - scroll-snap-padding-bottom
- - scroll-snap-padding-inline
- - scroll-snap-padding-inline-end
- - scroll-snap-padding-inline-start
- - scroll-snap-padding-left
- - scroll-snap-padding-right
- - scroll-snap-padding-top
- - scroll-snap-stop
- - scroll-snap-type
+ - scrollbar-gutter
- shape-image-threshold
- shape-inside
- shape-margin
- shape-outside
- size
- speak
- - speak-as
- speak-header
- speak-numeral
- speak-punctuation
- speech-rate
- stress
- string-set
- - tab-size
- table-layout
+ - tab-size
+ - text-align-all
- text-align
- text-align-last
- text-combine-upright
- - text-decoration
- text-decoration-color
+ - text-decoration
- text-decoration-line
- text-decoration-skip
+ - text-decoration-skip-ink
- text-decoration-style
+ - text-decoration-width
- text-emphasis
- text-emphasis-color
- text-emphasis-position
+ - text-emphasis-skip
- text-emphasis-style
- text-indent
- text-justify
- text-orientation
- text-overflow
- text-shadow
+ - text-space-collapse
+ - text-space-trim
+ - text-spacing
- text-transform
+ - text-underline-offset
- text-underline-position
- text-wrap
- top
- transform
+ - transform-box
- transform-origin
- transform-style
- transition
- transition-delay
- - transition-property
- transition-duration
+ - transition-property
- transition-timing-function
- unicode-bidi
+ - user-select
- vertical-align
- visibility
- - voice-balance
- - voice-duration
- voice-family
- - voice-pitch
- - voice-range
- - voice-rate
- - voice-stress
- - voice-volume
- volume
- white-space
- widows
- width
- will-change
- word-break
- word-spacing
- word-wrap
+ - wrap-after
+ - wrap-before
- wrap-flow
+ - wrap-inside
- wrap-through
- writing-mode
- z-index
- - -moz-animation-name
- - -moz-animation-duration
- - -moz-animation-iteration
- - -moz-animation-direction
+ - -moz-animation
- -moz-animation-delay
- - -moz-animation-play-state
+ - -moz-animation-direction
+ - -moz-animation-duration
- -moz-animation-fill-mode
+ - -moz-animation-iteration-count
+ - -moz-animation-name
+ - -moz-animation-play-state
+ - -moz-animation-timing-function
+ - -moz-appearance
+ - -moz-background-clip
+ - -moz-background-origin
- -moz-background-size
- -moz-border-image
- - -moz-border-bottom-colors
- - -moz-border-left-colors
- -moz-border-radius
- - -moz-border-radius-topleft
- - -moz-border-radius-topright
- -moz-border-radius-bottomleft
- -moz-border-radius-bottomright
- - -moz-border-right-colors
- - -moz-border-top-colors
- - -moz-box
+ - -moz-border-radius-topleft
+ - -moz-border-radius-topright
+ - -moz-box-align
+ - -moz-box-direction
- -moz-box-flex
+ - -moz-box-flex-group
+ - -moz-box-ordinal-group
+ - -moz-box-orient
+ - -moz-box-pack
- -moz-box-shadow
- -moz-box-sizing
+ - -moz-box
- -moz-column-count
+ - -moz-column-fill
- -moz-column-gap
+ - -moz-column-rule
+ - -moz-column-rule-color
+ - -moz-column-rule-style
+ - -moz-column-rule-width
+ - -moz-columns
+ - -moz-column-width
- -moz-hyphens
- - -moz-linear-gradient
- -moz-opacity
- -moz-outline-style
- -moz-perspective
- - -moz-radial-gradient
- -moz-resize
+ - -moz-text-align-last
+ - -moz-text-decoration-color
+ - -moz-text-decoration-line
+ - -moz-text-decoration-style
- -moz-transform
- -moz-transform-origin
- -moz-transform-style
- -moz-transition
- - -moz-transition-property
+ - -moz-transition-delay
- -moz-transition-duration
+ - -moz-transition-property
+ - -moz-transition-timing-function
+ - -moz-user-select
- -o-background-size
- -o-linear-gradient
- -o-text-overflow
- -o-transition
- -o-transform-origin
- konq_bgpos_x
- konq_bgpos_y
- -khtml-background-size
- -khtml-border-top-left-radius
- -khtml-border-top-right-radius
- -khtml-border-bottom-left-radius
- -khtml-border-bottom-right-radius
- -khtml-border-radius
- -khtml-box-shadow
- -khtml-opacity
- -webkit-appearance
+ - -webkit-animation
- -webkit-animation-name
- -webkit-animation-duration
- -webkit-animation-iteration
- -webkit-animation-direction
- -webkit-animation-delay
- -webkit-animation-play-state
- -webkit-animation-fill-mode
- -webkit-background-size
+ - -webkit-backface-visibility
- -webkit-border-image
- -webkit-border-bottom-colors
- -webkit-border-left-colors
- -webkit-border-radius
- -webkit-border-right-colors
- -webkit-border-top-colors
- -webkit-border-top-left-radius
- -webkit-border-top-right-radius
- -webkit-border-bottom-left-radius
- -webkit-border-bottom-right-radius
- -webkit-border-radius-bottomleft
- -webkit-border-radius-bottomright
+ - -webkit-box-align
+ - -webkit-box-direction
- -webkit-box-flex
+ - -webkit-box-ordinal-group
+ - -webkit-box-orient
+ - -webkit-box-pack
- -webkit-box-reflect
- -webkit-box-shadow
- -webkit-box-sizing
- -webkit-column-count
- -webkit-column-gap
- -webkit-hyphens
- -webkit-linear-gradient
- -webkit-gradient
+ - -webkit-overflow-scrolling
- -webkit-perspective
+ - -webkit-text-decoration
+ - -webkit-text-decoration-skip
- -webkit-text-fill-color
- -webkit-text-stroke-color
- -webkit-text-stroke-width
- -webkit-text-size-adjust
+ - -webkit-tap-highlight-color
- -webkit-transform
- -webkit-transform-origin
- -webkit-transform-style
- -webkit-transition
- -webkit-transition-property
+ - -webkit-transition-delay
- -webkit-transition-duration
+ - -webkit-user-select
- zoom
- -ms-animation-name
- -ms-animation-duration
- -ms-animation-iteration
- -ms-animation-direction
- -ms-animation-delay
- -ms-animation-play-state
- -ms-animation-fill-mode
- -ms-box-sizing
- -ms-filter
+ - -ms-flex
+ - -ms-flex-align
+ - -ms-flex-direction
+ - -ms-flex-flow
+ - -ms-flex-item-align
+ - -ms-flex-line-pack
+ - -ms-flex-negative
+ - -ms-flex-order
+ - -ms-flex-pack
+ - -ms-flex-positive
+ - -ms-flex-position
+ - -ms-flex-preferred-size
+ - -ms-flex-wrap
- -ms-interpolation-mode
- -ms-linear-gradient
+ - -ms-overflow-style
- -ms-text-size-adjust
- -ms-transform
- -ms-transition
+ - -ms-user-select
+
-
- - font-family
- - font-size
- - font-stretch
- - font-style
- - font-variant
- - font-weight
- - unicode-range
- - units-per-em
- - src
- - panose-1
- - stemv
- - stemh
- - slope
- - cap-height
- - x-height
- - ascent
- - descent
- - widths
- - bbox
- - definition-src
- - baseline
- - centerline
- - mathline
- - topline
+
+ - inherit
+ - unset
+ - auto
+
- - inherit
- none
- hidden
- dotted
- dashed
- solid
- double
- groove
- ridge
- inset
- outset
- xx-small
- x-small
- small
- medium
- large
- x-large
- xx-large
- smaller
- larger
- italic
- oblique
- small-caps
- normal
- bold
- bolder
- lighter
- light
- - 100
- - 200
- - 300
- - 400
- - 500
- - 600
- - 700
- - 800
- - 900
- transparent
- repeat
- repeat-x
- repeat-y
- no-repeat
- baseline
- sub
- super
- top
- text-top
- middle
- bottom
- text-bottom
- left
- right
- center
- justify
- konq-center
- disc
- circle
- square
- box
- decimal
- decimal-leading-zero
- lower-roman
- upper-roman
- lower-greek
- lower-alpha
- lower-latin
- upper-alpha
- upper-latin
- hebrew
- armenian
- georgian
- cjk-ideographic
- hiragana
- katakana
- hiragana-iroha
- katakana-iroha
- inline
- inline-block
- block
- list-item
- run-in
- compact
- marker
- table
- inline-table
- table-row-group
- table-header-group
- table-footer-group
- table-row
- table-column-group
- table-column
- table-cell
- table-caption
- - auto
- crosshair
- default
- pointer
- move
- e-resize
- ne-resize
- nw-resize
- n-resize
- se-resize
- sw-resize
- s-resize
- w-resize
- text
- wait
- help
- above
- absolute
- always
- avoid
- below
- bidi-override
- blink
- both
- capitalize
- caption
- clip
- close-quote
- collapse
- condensed
- crop
- cross
- ellipsis
- ellipsis-word
- embed
- expanded
- extra-condensed
- extra-expanded
- fixed
- hand
- hide
- higher
- icon
- inside
- invert
- landscape
- level
- line-through
- loud
- lower
- lowercase
- ltr
- menu
- message-box
- mix
- narrower
- no-close-quote
- no-open-quote
- nowrap
- open-quote
- outside
- overline
- portrait
- pre
- pre-line
- pre-wrap
- relative
- rtl
- scroll
- semi-condensed
- semi-expanded
- separate
- show
- small-caption
- static
- static-position
- status-bar
- thick
- thin
- ultra-condensed
- ultra-expanded
- underline
- uppercase
- visible
- wider
- break
- serif
- sans-serif
- cursive
- fantasy
- monospace
- border-box
- content-box
- -epub-hyphens
+ - contain
+ - cover
+
+
+ - all
+ - ease
+ - ease-in
+ - ease-out
+ - ease-in-out
+ - step-start
+ - step-end
+ - linear
+
+
+ - infinite
+ - reverse
+ - alternate
+ - alternate-reverse
+ - forwards
+ - backwards
+ - running
+ - paused
- - aqua
- black
- - blue
- - cyan
- - fuchsia
+ - silver
- gray
+ - white
+ - maroon
+ - red
+ - purple
+ - fuchsia
- green
- lime
- - maroon
- - navy
- olive
- - purple
- - red
- - silver
- - teal
- - white
- yellow
+ - navy
+ - blue
+ - teal
+ - aqua
+ - orange
+ - aliceblue
+ - antiquewhite
+ - aquamarine
+ - azure
+ - beige
+ - bisque
+ - blanchedalmond
+ - blueviolet
+ - brown
+ - burlywood
+ - cadetblue
+ - chartreuse
+ - chocolate
+ - coral
+ - cornflowerblue
+ - cornsilk
+ - crimson
+ - cyan
+ - aqua
+ - darkblue
+ - darkcyan
+ - darkgoldenrod
+ - darkgray
+ - darkgreen
+ - darkgrey
+ - darkkhaki
+ - darkmagenta
+ - darkolivegreen
+ - darkorange
+ - darkorchid
+ - darkred
+ - darksalmon
+ - darkseagreen
+ - darkslateblue
+ - darkslategray
+ - darkslategrey
+ - darkturquoise
+ - darkviolet
+ - deeppink
+ - deepskyblue
+ - dimgray
+ - dimgrey
+ - dodgerblue
+ - firebrick
+ - floralwhite
+ - forestgreen
+ - gainsboro
+ - ghostwhite
+ - gold
+ - goldenrod
+ - greenyellow
+ - grey
+ - honeydew
+ - hotpink
+ - indianred
+ - indigo
+ - ivory
+ - khaki
+ - lavender
+ - lavenderblush
+ - lawngreen
+ - lemonchiffon
+ - lightblue
+ - lightcoral
+ - lightcyan
+ - lightgoldenrodyellow
+ - lightgray
+ - lightgreen
+ - lightgrey
+ - lightpink
+ - lightsalmon
+ - lightseagreen
+ - lightskyblue
+ - lightslategray
+ - lightslategrey
+ - lightsteelblue
+ - lightyellow
+ - limegreen
+ - linen
+ - magenta
+ - fuchsia
+ - mediumaquamarine
+ - mediumblue
+ - mediumorchid
+ - mediumpurple
+ - mediumseagreen
+ - mediumslateblue
+ - mediumspringgreen
+ - mediumturquoise
+ - mediumvioletred
+ - midnightblue
+ - mintcream
+ - mistyrose
+ - moccasin
+ - navajowhite
+ - oldlace
+ - olivedrab
+ - orangered
+ - orchid
+ - palegoldenrod
+ - palegreen
+ - paleturquoise
+ - palevioletred
+ - papayawhip
+ - peachpuff
+ - peru
+ - pink
+ - plum
+ - powderblue
+ - rosybrown
+ - royalblue
+ - saddlebrown
+ - salmon
+ - sandybrown
+ - seagreen
+ - seashell
+ - sienna
+ - skyblue
+ - slateblue
+ - slategray
+ - slategrey
+ - snow
+ - springgreen
+ - steelblue
+ - tan
+ - thistle
+ - tomato
+ - turquoise
+ - violet
+ - wheat
+ - whitesmoke
+ - yellowgreen
+ - rebeccapurple
+
- ActiveBorder
- ActiveCaption
- AppWorkspace
- Background
- ButtonFace
- ButtonHighlight
- ButtonShadow
- ButtonText
- CaptionText
- GrayText
- Highlight
- HighlightText
- InactiveBorder
- InactiveCaption
- InactiveCaptionText
- InfoBackground
- InfoText
- Menu
- MenuText
- Scrollbar
- ThreeDDarkShadow
- ThreeDFace
- ThreeDHighlight
- ThreeDLightShadow
- ThreeDShadow
- Window
- WindowFrame
- WindowText
- - url
- attr
- - rect
- - rgb
- - rgba
+ - calc
- hsl
- hsla
- - counter
- - counters
+ - linear-gradient
+ - radial-gradient
+ - repeating-linear-gradient
+ - repeating-radial-gradient
+ - rgb
+ - rgba
+ - var
+ - url
-
- - local
- - format
+
+ - rect
+
+
+ - inset
+ - circle
+ - ellipse
+ - polygon
+
+
+ - blur
+ - brightness
+ - contrast
+ - drop-shadow
+ - grayscale
+ - hue-rotate
+ - invert
+ - opacity
+ - saturate
+ - sepia
+
+
+ - max-content
+ - min-content
+ - minmax
+ - fix-content
+ - repeat
+
+
+ - cubic-bezier
+ - frames
+ - steps
-
- - expression
+
+ - matrix
+ - matrix3d
+ - perspective
+ - rotate
+ - rotate3d
+ - rotateX
+ - rotateY
+ - rotateZ
+ - scale
+ - scale3d
+ - scaleX
+ - scaleY
+ - scaleZ
+ - skew
+ - skewX
+ - skewY
+ - translate
+ - translate3d
+ - translateX
+ - translateY
+ - translateZ
+
+ - local
+ - format
-
+
+
- all
- - aural
- - braille
- - embossed
- - handheld
- print
- - projection
- screen
- speech
- - tty
- - tv
-
-
- - width
- - min-width
- - max-width
- - height
- - min-height
- - max-height
- - device-width
- - min-device-width
- - max-device-width
- - device-height
- - min-device-height
- - max-device-height
- - orientation
+
+ - any-pointer
+ - any-hover
- aspect-ratio
- - min-aspect-ratio
+ - color
+ - color-gamut
+ - color-index
+ - display-mode
+ - grid
+ - height
+ - hover
- max-aspect-ratio
- - device-aspect-ratio
- - min-device-aspect-ratio
+ - max-color
+ - max-color-index
- max-device-aspect-ratio
- - color
+ - max-device-height
+ - max-device-width
+ - max-height
+ - max-monochrome
+ - max-resolution
+ - max-width
+ - min-aspect-ratio
- min-color
- - max-color
- - color-index
- min-color-index
- - max-color-index
- - monochrome
+ - min-device-aspect-ratio
+ - min-device-height
+ - min-device-width
+ - min-height
- min-monochrome
- - max-monochrome
- - resolution
- min-resolution
- - max-resolution
+ - min-width
+ - monochrome
+ - orientation
+ - pointer
+ - resolution
- scan
- - grid
+ - update
+ - width
-
- - hover
- - link
- - visited
- - active
- - focus
- - first-child
- - last-child
- - only-child
- - first-of-type
- - last-of-type
- - only-of-type
+
+
+ - after
+ - before
+ - cue
- first-letter
- first-line
- - before
- - after
- selection
- - root
+
+
+ - backdrop
+ - placeholder
+
+ - slotted
+
+
+
+
+ - value
+ - choices
+ - repeat-item
+ - repeat-index
+
+ - -moz-progress-bar
+ - -moz-range-progress
+ - -moz-range-thumb
+ - -moz-range-track
+ - -moz-selection
+ - -ms-fill
+ - -ms-fill-lower
+ - -ms-fill-upper
+ - -ms-thumb
+ - -ms-track
+ - -webkit-progress-bar
+ - -webkit-progress-value
+ - -webkit-slider-runnable-track
+ - -webkit-slider-thumb
+
+
+
+
+ - active
+ - any-link
+ - checked
+ - default
+ - defined
+
+ - disabled
- empty
- - target
- enabled
- - disabled
- - checked
+ - first-child
+ - first-of-type
+ - fullscreen
+ - focus
+ - focus-within
+ - host
+ - hover
+ - in-range
- indeterminate
+ - invalid
+ - lang
+ - last-child
+ - last-of-type
+ - link
+ - not
- nth-child
- nth-last-child
- - nth-of-type
- nth-last-of-type
+ - nth-of-type
+ - only-child
+ - only-of-type
+ - optional
+ - out-of-range
+ - placeholder-shown
+ - read-only
+ - read-write
+ - required
+ - root
+ - scope
+ - target
+ - valid
+ - visited
+
+
+ - after
+ - before
+ - cue
+ - first-letter
+ - first-line
+ - selection
+
+
+
- not
+
+ - blank
+ - first
+ - left
+ - recto
+ - right
+ - verso
+
+
+
+ - @character
+ - @charset
+ - @import
+ - @namespace
+
+
+
+ - @document
+ - @media
+ - @supports
+
+
+
+ - @viewport
+
+
+
+ - min-width
+ - max-width
+ - width
+ - min-height
+ - max-height
+ - height
+ - zoom
+ - min-zoom
+ - max-zoom
+ - user-zoom
+ - orientation
+ - viewport-fit
+
+
+
+ - @page
+
+
+
+ - size
+ - marks
+ - bleed
+
+
+
+ - @font-face
+
+
+
+ - font-display
+ - font-family
+ - font-stretch
+ - font-style
+ - font-weight
+ - font-variant
+ - font-feature-settings
+ - font-variation-settings
+ - src
+ - unicode-range
+
+
+
+ - @keyframes
+
+
+
+ - from
+ - to
+
+
+
+ - and
+ - or
+
+
-
+
+
-
-
-
-
-
-
+
+
+
-
+
-
-
+
+
+
-
+
+
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
+
+
+
+
+
+
-
+
+
+
-
+
+
+
+
-
-
+
+
+
+
+
+
+
-
+
+
+
+
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
-
-
+
+
+
+
+
+
+
+
+
+
+
+
-
+