diff --git a/testsuite/css/change/test5.css b/testsuite/css/change/test5.css new file mode 100644 index 0000000000..3543511de4 --- /dev/null +++ b/testsuite/css/change/test5.css @@ -0,0 +1,14 @@ +/* test variable changes */ + +box { + --test: red; + color: var(--test, green); +} + +label:hover { + --test: blue; +} + +label:active { + --test: initial; +} diff --git a/testsuite/css/change/test5.nodes b/testsuite/css/change/test5.nodes new file mode 100644 index 0000000000..adf9995dfd --- /dev/null +++ b/testsuite/css/change/test5.nodes @@ -0,0 +1,3 @@ +window.background:dir(ltr) + box.horizontal:dir(ltr) name + label.a:dir(ltr) name|state|hover diff --git a/testsuite/css/change/test5.ui b/testsuite/css/change/test5.ui new file mode 100644 index 0000000000..3b238ce2e5 --- /dev/null +++ b/testsuite/css/change/test5.ui @@ -0,0 +1,17 @@ + + + + False + 0 + + + True + + + + + + + + + diff --git a/testsuite/css/parser/meson.build b/testsuite/css/parser/meson.build index b05efb7fd2..ee1714b503 100644 --- a/testsuite/css/parser/meson.build +++ b/testsuite/css/parser/meson.build @@ -606,6 +606,23 @@ test_data = [ 'value-none.css', 'value-none.errors', 'value-none.ref.css', + 'variables.css', + 'variables.ref.css', + 'variables-invalid-01.css', + 'variables-invalid-01.errors', + 'variables-invalid-01.ref.css', + 'variables-invalid-02.css', + 'variables-invalid-02.errors', + 'variables-invalid-02.ref.css', + 'variables-invalid-03.css', + 'variables-invalid-03.errors', + 'variables-invalid-03.ref.css', + 'variables-invalid-04.css', + 'variables-invalid-04.errors', + 'variables-invalid-04.ref.css', + 'variables-invalid-05.css', + 'variables-invalid-05.errors', + 'variables-invalid-05.ref.css', ] foreach testname : test_data diff --git a/testsuite/css/parser/variables-invalid-01.css b/testsuite/css/parser/variables-invalid-01.css new file mode 100644 index 0000000000..8b10e4c0d7 --- /dev/null +++ b/testsuite/css/parser/variables-invalid-01.css @@ -0,0 +1,3 @@ +label { + color: var( +} diff --git a/testsuite/css/parser/variables-invalid-01.errors b/testsuite/css/parser/variables-invalid-01.errors new file mode 100644 index 0000000000..f8d7dea713 --- /dev/null +++ b/testsuite/css/parser/variables-invalid-01.errors @@ -0,0 +1,5 @@ +variables-invalid-01.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-01.css:2:10-14: error: GTK_CSS_PARSER_ERROR_SYNTAX +variables-invalid-01.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-01.css:2:3-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-01.css:1:7-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX diff --git a/testsuite/css/parser/variables-invalid-01.ref.css b/testsuite/css/parser/variables-invalid-01.ref.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/testsuite/css/parser/variables-invalid-02.css b/testsuite/css/parser/variables-invalid-02.css new file mode 100644 index 0000000000..c50f41b784 --- /dev/null +++ b/testsuite/css/parser/variables-invalid-02.css @@ -0,0 +1,3 @@ +label { + color: var(color); +} diff --git a/testsuite/css/parser/variables-invalid-02.errors b/testsuite/css/parser/variables-invalid-02.errors new file mode 100644 index 0000000000..d1f8e7bc38 --- /dev/null +++ b/testsuite/css/parser/variables-invalid-02.errors @@ -0,0 +1 @@ +variables-invalid-02.css:2:10-14: error: GTK_CSS_PARSER_ERROR_SYNTAX diff --git a/testsuite/css/parser/variables-invalid-02.ref.css b/testsuite/css/parser/variables-invalid-02.ref.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/testsuite/css/parser/variables-invalid-03.css b/testsuite/css/parser/variables-invalid-03.css new file mode 100644 index 0000000000..cef82e8e7a --- /dev/null +++ b/testsuite/css/parser/variables-invalid-03.css @@ -0,0 +1,3 @@ +label { + color: var(color +} diff --git a/testsuite/css/parser/variables-invalid-03.errors b/testsuite/css/parser/variables-invalid-03.errors new file mode 100644 index 0000000000..6140ac6f25 --- /dev/null +++ b/testsuite/css/parser/variables-invalid-03.errors @@ -0,0 +1,5 @@ +variables-invalid-03.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-03.css:2:10-14: error: GTK_CSS_PARSER_ERROR_SYNTAX +variables-invalid-03.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-03.css:2:3-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-03.css:1:7-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX diff --git a/testsuite/css/parser/variables-invalid-03.ref.css b/testsuite/css/parser/variables-invalid-03.ref.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/testsuite/css/parser/variables-invalid-04.css b/testsuite/css/parser/variables-invalid-04.css new file mode 100644 index 0000000000..07b41afab9 --- /dev/null +++ b/testsuite/css/parser/variables-invalid-04.css @@ -0,0 +1,3 @@ +label { + color: var(color, +} diff --git a/testsuite/css/parser/variables-invalid-04.errors b/testsuite/css/parser/variables-invalid-04.errors new file mode 100644 index 0000000000..94b476f9ac --- /dev/null +++ b/testsuite/css/parser/variables-invalid-04.errors @@ -0,0 +1,5 @@ +variables-invalid-04.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-04.css:2:10-14: error: GTK_CSS_PARSER_ERROR_SYNTAX +variables-invalid-04.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-04.css:2:3-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-04.css:1:7-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX diff --git a/testsuite/css/parser/variables-invalid-04.ref.css b/testsuite/css/parser/variables-invalid-04.ref.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/testsuite/css/parser/variables-invalid-05.css b/testsuite/css/parser/variables-invalid-05.css new file mode 100644 index 0000000000..f27bec0b6b --- /dev/null +++ b/testsuite/css/parser/variables-invalid-05.css @@ -0,0 +1,3 @@ +label { + color: var(color, var() +} diff --git a/testsuite/css/parser/variables-invalid-05.errors b/testsuite/css/parser/variables-invalid-05.errors new file mode 100644 index 0000000000..e19373680e --- /dev/null +++ b/testsuite/css/parser/variables-invalid-05.errors @@ -0,0 +1,5 @@ +variables-invalid-05.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-05.css:2:10-14: error: GTK_CSS_PARSER_ERROR_SYNTAX +variables-invalid-05.css:2:10-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-05.css:2:3-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX +variables-invalid-05.css:1:7-4:1: error: GTK_CSS_PARSER_WARNING_SYNTAX diff --git a/testsuite/css/parser/variables-invalid-05.ref.css b/testsuite/css/parser/variables-invalid-05.ref.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/testsuite/css/parser/variables.css b/testsuite/css/parser/variables.css new file mode 100644 index 0000000000..b4a8cc06ae --- /dev/null +++ b/testsuite/css/parser/variables.css @@ -0,0 +1,14 @@ +:root { + --color1: red; + --color2: initial; +} + +label { + color: var(--color1); + background-color: var(--color2, green); +} + +@keyframes aaaa { + from { --test: red; --test2: green; } + to { --test: blue; --test3: cyan; } +} diff --git a/testsuite/css/parser/variables.ref.css b/testsuite/css/parser/variables.ref.css new file mode 100644 index 0000000000..e8176d52a4 --- /dev/null +++ b/testsuite/css/parser/variables.ref.css @@ -0,0 +1,20 @@ +@keyframes aaaa { + from { + --test: red; + --test2: green; + } + to { + --test: blue; + --test3: cyan; + } +} + +label { + background-color: var(--color2, green); + color: var(--color1); +} + +:root { + --color1: red; + --color2: initial; +} diff --git a/testsuite/css/style/variables.css b/testsuite/css/style/variables.css new file mode 100644 index 0000000000..5c98e66207 --- /dev/null +++ b/testsuite/css/style/variables.css @@ -0,0 +1,147 @@ +:root { + --color1: red; + --not-a-color: 20px; + + /* A dependency cycle */ + --test1: var(--test2); + --test2: var(--test1); +} + +.label-1 { + color: var(--color1); + + /* Fallback is unused when the variable resolves */ + background-color: var(--color1, green); + + /* Nested fallbacks */ + box-shadow: inset 0 0 3px var(--color2, var(--color3, green)); +} + +.label-2 { + /* Overriding variables */ + --color1: yellow; + color: var(--color1); + + /* Nonexistent variable, so the fallback is used */ + background-color: var(--color2, green); + + /* Variables are case-sensitive */ + box-shadow: inset 0 0 3px var(--Color1, green); +} + +.label-3 { + /* Unsetting variables */ + --color1: initial; + color: var(--color1, green); + + /* Shorthand properties */ + --border1: 3px; + --border2: solid red; + border: var(--border1, 4px) var(--border2); +} + +.label-4 { + /* --test1 is a part of a dependency cycle */ + /* See https://www.w3.org/TR/css-variables-1/#cycles */ + color: var(--test1, green); + + /* A dependency cycle with a fallback, the variable is invalid anyway */ + --test3: var(--test3, green); + background-color: var(--test3, purple); +} + +.label-5 { + /* Not a dependency cycle since we've overridden --test1. --test2 is still bad */ + --test1: red; + color: var(--test1, green); + background-color: var(--test2, green); + + --prop1: lol; + --prop2: var(--prop1) var(--prop1); + --prop3: var(--prop2) var(--prop2); + --prop4: var(--prop3) var(--prop3); + --prop5: var(--prop4) var(--prop4); + --prop6: var(--prop5) var(--prop5); + --prop7: var(--prop6) var(--prop6); + --prop8: var(--prop7) var(--prop7); + --prop9: var(--prop8) var(--prop8); + --prop10: var(--prop9) var(--prop9); + --prop11: var(--prop10) var(--prop10); + --prop12: var(--prop11) var(--prop11); + --prop13: var(--prop12) var(--prop12); + --prop14: var(--prop13) var(--prop13); + --prop15: var(--prop14) var(--prop14); + --prop16: var(--prop15) var(--prop15); + --prop17: var(--prop16) var(--prop16); + --prop18: var(--prop17) var(--prop17); + --prop19: var(--prop18) var(--prop18); + --prop20: var(--prop19) var(--prop19); + + /* Fallback is used since --prop20 is too long */ + /* See https://www.w3.org/TR/css-variables-1/#long-variables */ + box-shadow: inset 0 0 3px var(--prop20, green); +} + +.label-6 { + all: unset; + + /* Should still be red, since variables are not unset by that */ + color: var(--color1, green); +} + +.label-7 { + /* Empty fallback */ + color: var(--color2,) var(--color1); + + background-color: red; +} + +.label-7 { + /* Invalid variable, but this declaration still wins over the one above */ + background-color: var(--not-a-color); +} + +@keyframes test { + from { + --test1: red; + --test2: blue; + --duration: 2s; + --padding-right: 10px; + padding-left: var(--padding1, 10px); + padding-right: var(--padding-right); + } + to { + --test1: blue; + --test3: red; + --duration: 3s; + padding-left: var(--padding2, 20px); + } +} + +.label-8 { + /* FIXME: this is only there because properties that are only in keyframes */ + /* won't get printed otherwise */ + padding-left: 0; + padding-right: 0; + + --padding1: 1px; + --padding2: 2px; + + /* We're testing the initial state */ + animation: test 10s infinite linear; + + /* This gets overridden by the animation */ + --test1: pink; + + color: var(--test1, yellow); + + /* Only defined in the initial state, still fine */ + background-color: var(--test2, yellow); + + /* Variables only defined later in the animation -> invalid */ + box-shadow: inset 0 0 3px var(--test3, yellow); + + /* --duration is animation-tainted and so is --duration2, this should be 5s */ + --duration2: var(--duration, 4s); + transition-duration: var(--duration2, 5s); +} diff --git a/testsuite/css/style/variables.nodes b/testsuite/css/style/variables.nodes new file mode 100644 index 0000000000..212ecc5a38 --- /dev/null +++ b/testsuite/css/style/variables.nodes @@ -0,0 +1,189 @@ +window.background:dir(ltr) + --color1: red; /* variables.css:2:3-17 */ + --not-a-color: 20px; /* variables.css:3:3-23 */ + + box.horizontal:dir(ltr) + --color1: red; /* variables.css:2:3-17 */ + --not-a-color: 20px; /* variables.css:3:3-23 */ + + label.label-1:dir(ltr) + color: rgb(255,0,0); /* variables.css:11:3-24 */ + background-color: rgb(255,0,0); /* variables.css:14:3-42 */ + box-shadow: 0 0 3px rgb(0,128,0) inset; /* variables.css:17:3-65 */ + --color1: red; /* variables.css:2:3-17 */ + --not-a-color: 20px; /* variables.css:3:3-23 */ + label.label-2:dir(ltr) + color: rgb(255,255,0); /* variables.css:23:3-24 */ + background-color: rgb(0,128,0); /* variables.css:26:3-42 */ + box-shadow: 0 0 3px rgb(0,128,0) inset; /* variables.css:29:3-50 */ + --color1: yellow; /* variables.css:22:3-20 */ + label.label-3:dir(ltr) + color: rgb(0,128,0); /* variables.css:35:3-31 */ + border-top-style: solid; /* variables.css:40:3-46 */ + border-top-width: 3px; /* variables.css:40:3-46 */ + border-left-style: solid; /* variables.css:40:3-46 */ + border-left-width: 3px; /* variables.css:40:3-46 */ + border-bottom-style: solid; /* variables.css:40:3-46 */ + border-bottom-width: 3px; /* variables.css:40:3-46 */ + border-right-style: solid; /* variables.css:40:3-46 */ + border-right-width: 3px; /* variables.css:40:3-46 */ + border-top-color: rgb(255,0,0); /* variables.css:40:3-46 */ + border-right-color: rgb(255,0,0); /* variables.css:40:3-46 */ + border-bottom-color: rgb(255,0,0); /* variables.css:40:3-46 */ + border-left-color: rgb(255,0,0); /* variables.css:40:3-46 */ + border-image-source: none; /* variables.css:40:3-46 */ + border-image-repeat: stretch; /* variables.css:40:3-46 */ + border-image-slice: 100%; /* variables.css:40:3-46 */ + border-image-width: 1; /* variables.css:40:3-46 */ + --border1: 3px; /* variables.css:38:3-18 */ + --border2: solid red; /* variables.css:39:3-24 */ + --color1: initial; /* variables.css:34:3-21 */ + label.label-4:dir(ltr) + color: rgb(0,128,0); /* variables.css:46:3-30 */ + background-color: rgb(128,0,128); /* variables.css:50:3-42 */ + label.label-5:dir(ltr) + color: rgb(255,0,0); /* variables.css:56:3-30 */ + background-color: rgb(0,128,0); /* variables.css:57:3-41 */ + box-shadow: 0 0 3px rgb(0,128,0) inset; /* variables.css:82:3-50 */ + --prop1: lol; /* variables.css:59:3-16 */ + --prop10: var(--prop9) var(--prop9); /* variables.css:68:3-39 */ + --prop11: var(--prop10) var(--prop10); /* variables.css:69:3-41 */ + --prop12: var(--prop11) var(--prop11); /* variables.css:70:3-41 */ + --prop13: var(--prop12) var(--prop12); /* variables.css:71:3-41 */ + --prop14: var(--prop13) var(--prop13); /* variables.css:72:3-41 */ + --prop15: var(--prop14) var(--prop14); /* variables.css:73:3-41 */ + --prop16: var(--prop15) var(--prop15); /* variables.css:74:3-41 */ + --prop17: var(--prop16) var(--prop16); /* variables.css:75:3-41 */ + --prop18: var(--prop17) var(--prop17); /* variables.css:76:3-41 */ + --prop19: var(--prop18) var(--prop18); /* variables.css:77:3-41 */ + --prop2: var(--prop1) var(--prop1); /* variables.css:60:3-38 */ + --prop20: var(--prop19) var(--prop19); /* variables.css:78:3-41 */ + --prop3: var(--prop2) var(--prop2); /* variables.css:61:3-38 */ + --prop4: var(--prop3) var(--prop3); /* variables.css:62:3-38 */ + --prop5: var(--prop4) var(--prop4); /* variables.css:63:3-38 */ + --prop6: var(--prop5) var(--prop5); /* variables.css:64:3-38 */ + --prop7: var(--prop6) var(--prop6); /* variables.css:65:3-38 */ + --prop8: var(--prop7) var(--prop7); /* variables.css:66:3-38 */ + --prop9: var(--prop8) var(--prop8); /* variables.css:67:3-38 */ + --test1: red; /* variables.css:55:3-16 */ + label.label-6:dir(ltr) + color: rgb(255,0,0); /* variables.css:89:3-31 */ + -gtk-dpi: 96; /* variables.css:86:3-14 */ + font-size: 13.333333333333334px; /* variables.css:86:3-14 */ + -gtk-icon-palette: error rgb(255,255,255), success rgb(255,255,255), warning rgb(255,255,255); /* variables.css:86:3-14 */ + background-color: rgba(0,0,0,0); /* variables.css:86:3-14 */ + font-family: "Sans"; /* variables.css:86:3-14 */ + font-style: normal; /* variables.css:86:3-14 */ + font-weight: 400; /* variables.css:86:3-14 */ + font-stretch: normal; /* variables.css:86:3-14 */ + letter-spacing: 0; /* variables.css:86:3-14 */ + text-decoration-line: none; /* variables.css:86:3-14 */ + text-decoration-color: rgb(255,0,0); /* variables.css:86:3-14 */ + text-decoration-style: solid; /* variables.css:86:3-14 */ + text-transform: none; /* variables.css:86:3-14 */ + font-kerning: auto; /* variables.css:86:3-14 */ + font-variant-ligatures: normal; /* variables.css:86:3-14 */ + font-variant-position: normal; /* variables.css:86:3-14 */ + font-variant-caps: normal; /* variables.css:86:3-14 */ + font-variant-numeric: normal; /* variables.css:86:3-14 */ + font-variant-alternates: normal; /* variables.css:86:3-14 */ + font-variant-east-asian: normal; /* variables.css:86:3-14 */ + text-shadow: none; /* variables.css:86:3-14 */ + box-shadow: none; /* variables.css:86:3-14 */ + margin-top: 0; /* variables.css:86:3-14 */ + margin-left: 0; /* variables.css:86:3-14 */ + margin-bottom: 0; /* variables.css:86:3-14 */ + margin-right: 0; /* variables.css:86:3-14 */ + padding-top: 0; /* variables.css:86:3-14 */ + padding-left: 0; /* variables.css:86:3-14 */ + padding-bottom: 0; /* variables.css:86:3-14 */ + padding-right: 0; /* variables.css:86:3-14 */ + border-top-style: none; /* variables.css:86:3-14 */ + border-top-width: 0; /* variables.css:86:3-14 */ + border-left-style: none; /* variables.css:86:3-14 */ + border-left-width: 0; /* variables.css:86:3-14 */ + border-bottom-style: none; /* variables.css:86:3-14 */ + border-bottom-width: 0; /* variables.css:86:3-14 */ + border-right-style: none; /* variables.css:86:3-14 */ + border-right-width: 0; /* variables.css:86:3-14 */ + border-top-left-radius: 0; /* variables.css:86:3-14 */ + border-top-right-radius: 0; /* variables.css:86:3-14 */ + border-bottom-right-radius: 0; /* variables.css:86:3-14 */ + border-bottom-left-radius: 0; /* variables.css:86:3-14 */ + outline-style: none; /* variables.css:86:3-14 */ + outline-width: 0; /* variables.css:86:3-14 */ + outline-offset: 0; /* variables.css:86:3-14 */ + background-clip: border-box; /* variables.css:86:3-14 */ + background-origin: padding-box; /* variables.css:86:3-14 */ + background-size: auto; /* variables.css:86:3-14 */ + background-position: left top; /* variables.css:86:3-14 */ + border-top-color: rgb(255,0,0); /* variables.css:86:3-14 */ + border-right-color: rgb(255,0,0); /* variables.css:86:3-14 */ + border-bottom-color: rgb(255,0,0); /* variables.css:86:3-14 */ + border-left-color: rgb(255,0,0); /* variables.css:86:3-14 */ + outline-color: rgb(255,0,0); /* variables.css:86:3-14 */ + background-repeat: repeat; /* variables.css:86:3-14 */ + background-image: none; /* variables.css:86:3-14 */ + background-blend-mode: normal; /* variables.css:86:3-14 */ + border-image-source: none; /* variables.css:86:3-14 */ + border-image-repeat: stretch; /* variables.css:86:3-14 */ + border-image-slice: 100%; /* variables.css:86:3-14 */ + border-image-width: 1; /* variables.css:86:3-14 */ + -gtk-icon-source: none; /* variables.css:86:3-14 */ + -gtk-icon-size: 16px; /* variables.css:86:3-14 */ + -gtk-icon-shadow: none; /* variables.css:86:3-14 */ + -gtk-icon-style: requested; /* variables.css:86:3-14 */ + -gtk-icon-transform: none; /* variables.css:86:3-14 */ + -gtk-icon-filter: none; /* variables.css:86:3-14 */ + border-spacing: 0 0; /* variables.css:86:3-14 */ + transform: none; /* variables.css:86:3-14 */ + transform-origin: center; /* variables.css:86:3-14 */ + min-width: 0; /* variables.css:86:3-14 */ + min-height: 0; /* variables.css:86:3-14 */ + transition-property: all; /* variables.css:86:3-14 */ + transition-duration: 0; /* variables.css:86:3-14 */ + transition-timing-function: ease; /* variables.css:86:3-14 */ + transition-delay: 0; /* variables.css:86:3-14 */ + animation-name: none; /* variables.css:86:3-14 */ + animation-duration: 0; /* variables.css:86:3-14 */ + animation-timing-function: ease; /* variables.css:86:3-14 */ + animation-iteration-count: 1; /* variables.css:86:3-14 */ + animation-direction: normal; /* variables.css:86:3-14 */ + animation-play-state: running; /* variables.css:86:3-14 */ + animation-delay: 0; /* variables.css:86:3-14 */ + animation-fill-mode: none; /* variables.css:86:3-14 */ + opacity: 1; /* variables.css:86:3-14 */ + filter: none; /* variables.css:86:3-14 */ + caret-color: rgb(255,255,255); /* variables.css:86:3-14 */ + -gtk-secondary-caret-color: rgb(255,255,255); /* variables.css:86:3-14 */ + font-feature-settings: normal; /* variables.css:86:3-14 */ + font-variation-settings: normal; /* variables.css:86:3-14 */ + line-height: normal; /* variables.css:86:3-14 */ + --color1: red; /* variables.css:2:3-17 */ + --not-a-color: 20px; /* variables.css:3:3-23 */ + label.label-7:dir(ltr) + color: rgb(255,0,0); /* variables.css:94:3-39 */ + background-color: rgba(0,0,0,0); /* variables.css:101:3-40 */ + --color1: red; /* variables.css:2:3-17 */ + --not-a-color: 20px; /* variables.css:3:3-23 */ + label.label-8:dir(ltr) + color: rgb(255,0,0); /* variables.css:136:3-31 */ + background-color: rgb(0,0,255); /* variables.css:139:3-42 */ + box-shadow: 0 0 3px rgb(255,255,0) inset; /* variables.css:142:3-50 */ + padding-left: 1px; /* variables.css:124:3-19 */ + padding-right: 10px; /* variables.css:125:3-20 */ + transition-duration: 5s; /* variables.css:146:3-45 */ + animation-name: test; /* variables.css:131:3-39 */ + animation-duration: 10s; /* variables.css:131:3-39 */ + animation-timing-function: linear; /* variables.css:131:3-39 */ + animation-iteration-count: infinite; /* variables.css:131:3-39 */ + animation-direction: normal; /* variables.css:131:3-39 */ + animation-delay: 0; /* variables.css:131:3-39 */ + animation-fill-mode: none; /* variables.css:131:3-39 */ + --duration: 2s; + --duration2: var(--duration, 4s); /* variables.css:145:3-36 */ + --padding-right: 10px; + --padding1: 1px; /* variables.css:127:3-19 */ + --padding2: 2px; /* variables.css:128:3-19 */ + --test1: red; + --test2: blue; diff --git a/testsuite/css/style/variables.ui b/testsuite/css/style/variables.ui new file mode 100644 index 0000000000..21b52ff88e --- /dev/null +++ b/testsuite/css/style/variables.ui @@ -0,0 +1,75 @@ + + + + False + 0 + + + + + Hello World! + + + + + + Hello World! + + + + + + Hello World! + + + + + + Hello World! + + + + + + Hello World! + + + + + + Hello World! + + + + + + Hello World! + + + + + + Hello World! + + + + + + +