You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
214 lines
6.9 KiB
214 lines
6.9 KiB
# Empty stylesheets |
|
|
|
/* Just a comment */ |
|
|
|
==> |
|
|
|
StyleSheet(Comment) |
|
|
|
# Import statements |
|
|
|
@import url("fineprint.css") print; |
|
@import url("bluish.css") speech; |
|
@import 'custom.css'; |
|
@import url("chrome://communicator/skin/"); |
|
@import "common.css" screen; |
|
@import "reset.css" layer(framework.component); |
|
@import "components.css" layer screen; |
|
|
|
==> |
|
|
|
StyleSheet( |
|
ImportStatement(import,CallLiteral(CallTag,StringLiteral),KeywordQuery), |
|
ImportStatement(import,CallLiteral(CallTag,StringLiteral),KeywordQuery), |
|
ImportStatement(import,StringLiteral), |
|
ImportStatement(import,CallLiteral(CallTag,StringLiteral)), |
|
ImportStatement(import,StringLiteral,KeywordQuery), |
|
ImportStatement(import,StringLiteral,Layer(layer,LayerName,LayerName)), |
|
ImportStatement(import,StringLiteral,Layer(layer),KeywordQuery)) |
|
|
|
# Namespace statements |
|
|
|
/* Default namespace */ |
|
@namespace url(XML-namespace-URL); |
|
@namespace "XML-namespace-URL"; |
|
@namespace url(http://www.w3.org/1999/xhtml); |
|
@namespace svg url(http://www.w3.org/2000/svg); |
|
|
|
/* Prefixed namespace */ |
|
@namespace prefix url(XML-namespace-URL); |
|
@namespace prefix "XML-namespace-URL"; |
|
|
|
==> |
|
|
|
StyleSheet( |
|
Comment, |
|
NamespaceStatement(namespace,CallLiteral(CallTag,ParenthesizedContent)), |
|
NamespaceStatement(namespace,StringLiteral), |
|
NamespaceStatement(namespace,CallLiteral(CallTag,ParenthesizedContent)), |
|
NamespaceStatement(namespace,NamespaceName,CallLiteral(CallTag,ParenthesizedContent)), |
|
Comment, |
|
NamespaceStatement(namespace,NamespaceName,CallLiteral(CallTag,ParenthesizedContent)), |
|
NamespaceStatement(namespace,NamespaceName,StringLiteral)) |
|
|
|
# Keyframes statements |
|
|
|
@keyframes important1 { |
|
from { margin-top: 50px; } |
|
50%, 60% { margin-top: 150px !important; } /* ignored */ |
|
to { margin-top: 100px; } |
|
} |
|
|
|
==> |
|
|
|
StyleSheet(KeyframesStatement(keyframes,KeyframeName,KeyframeList( |
|
KeyframeSelector(KeyframeRangeName),Block(Declaration(PropertyName,NumberLiteral(Unit))), |
|
KeyframeSelector(NumberLiteral(Unit)),KeyframeSelector(NumberLiteral(Unit)),Block( |
|
Declaration(PropertyName,NumberLiteral(Unit),Important)), |
|
Comment, |
|
KeyframeSelector(KeyframeRangeName),Block(Declaration(PropertyName,NumberLiteral(Unit)))))) |
|
|
|
# Keyframes statements with range |
|
|
|
@keyframes anim-1 { |
|
entry 0% { margin-top: 50px; } |
|
entry 100% { margin-top: 50px; } |
|
exit 0% { margin-top: 50px; } |
|
exit 100% { margin-top: 50px; } |
|
} |
|
|
|
==> |
|
|
|
StyleSheet(KeyframesStatement(keyframes,KeyframeName,KeyframeList( |
|
KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),Block(Declaration(PropertyName,NumberLiteral(Unit))), |
|
KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),Block(Declaration(PropertyName,NumberLiteral(Unit))), |
|
KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),Block(Declaration(PropertyName,NumberLiteral(Unit))), |
|
KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),Block(Declaration(PropertyName,NumberLiteral(Unit)))))) |
|
|
|
# Keyframes statements with range and multiple keyframe selectors |
|
|
|
@keyframes fade-in-out-animation { |
|
entry 0%, exit 100% { opacity: 0 } |
|
entry 100%, exit 0% { opacity: 1 } |
|
} |
|
|
|
==> |
|
|
|
StyleSheet(KeyframesStatement(keyframes,KeyframeName,KeyframeList( |
|
KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),Block( |
|
Declaration(PropertyName,NumberLiteral)), |
|
KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),KeyframeSelector(KeyframeRangeName,NumberLiteral(Unit)),Block( |
|
Declaration(PropertyName,NumberLiteral))))) |
|
|
|
# Media statements |
|
|
|
@media screen and (min-width: 30em) and (orientation: landscape) {} |
|
@media (min-height: 680px), screen and (orientation: portrait) {} |
|
@media not all and (monochrome) {} |
|
@media only screen {} |
|
@media (10em <= width < 30em) {} |
|
|
|
==> |
|
|
|
StyleSheet( |
|
MediaStatement(media,BinaryQuery(BinaryQuery(KeywordQuery,LogicOp,FeatureQuery(FeatureName,NumberLiteral(Unit))),LogicOp, |
|
FeatureQuery(FeatureName,ValueName)),Block), |
|
MediaStatement(media,FeatureQuery(FeatureName,NumberLiteral(Unit)),BinaryQuery(KeywordQuery,LogicOp,FeatureQuery(FeatureName,ValueName)),Block), |
|
MediaStatement(media,UnaryQuery(UnaryQueryOp,BinaryQuery(KeywordQuery,LogicOp,ParenthesizedQuery(KeywordQuery))),Block), |
|
MediaStatement(media,UnaryQuery(UnaryQueryOp,KeywordQuery),Block), |
|
MediaStatement(media,ComparisonQuery(NumberLiteral(Unit),CompareOp,FeatureName,CompareOp,NumberLiteral(Unit)),Block)) |
|
|
|
# Supports statements |
|
|
|
@supports (animation-name: test) { |
|
div { animation-name: test; } |
|
} |
|
@supports (transform-style: preserve) or (-moz-transform-style: preserve) {} |
|
@supports not ((text-align-last: justify) or (-moz-text-align-last: justify)) {} |
|
@supports not selector(:matches(a, b)) {} |
|
|
|
==> |
|
|
|
StyleSheet( |
|
SupportsStatement(supports,FeatureQuery(FeatureName,ValueName),Block(RuleSet(TagSelector(TagName),Block(Declaration(PropertyName,ValueName))))), |
|
SupportsStatement(supports,BinaryQuery(FeatureQuery(FeatureName,ValueName),LogicOp,FeatureQuery(FeatureName,ValueName)),Block), |
|
SupportsStatement(supports,UnaryQuery(UnaryQueryOp,ParenthesizedQuery( |
|
BinaryQuery(FeatureQuery(FeatureName,ValueName),LogicOp,FeatureQuery(FeatureName,ValueName)))),Block), |
|
SupportsStatement(supports,UnaryQuery(UnaryQueryOp,SelectorQuery(selector,ParenthesizedSelector(PseudoClassSelector(PseudoClassName,ArgList(TagSelector(TagName),TagSelector(TagName)))))),Block)) |
|
|
|
# Charset statements |
|
|
|
@charset "utf-8"; |
|
|
|
==> |
|
|
|
StyleSheet(CharsetStatement(charset,StringLiteral)) |
|
|
|
# Other at-statements |
|
|
|
@font-face { |
|
font-family: "Open Sans"; |
|
src: url("/a") format("woff2"), url("/b/c") format("woff"); |
|
} |
|
|
|
==> |
|
|
|
StyleSheet(AtRule(AtKeyword,Block( |
|
Declaration(PropertyName,StringLiteral), |
|
Declaration(PropertyName,CallLiteral(CallTag,StringLiteral),CallExpression(Callee,ArgList(StringLiteral)), |
|
CallLiteral(CallTag,StringLiteral),CallExpression(Callee,ArgList(StringLiteral)))))) |
|
|
|
# Unterminated Comment |
|
|
|
p {} |
|
/* |
|
div {} |
|
|
|
==> |
|
|
|
StyleSheet(RuleSet(TagSelector(TagName),Block),Comment) |
|
|
|
# Escaped identifiers |
|
|
|
#foo\ bar { |
|
--weird\\var: 5px; |
|
width: var(--weird\\var); |
|
c\6f lor: b\6c ue; |
|
} |
|
==> |
|
|
|
StyleSheet(RuleSet(IdSelector(IdName),Block( |
|
Declaration(VariableName,NumberLiteral(Unit)), |
|
Declaration(PropertyName,CallExpression(Callee,ArgList(VariableName))), |
|
Declaration(PropertyName, ValueName)))) |
|
|
|
# Scope |
|
|
|
@scope { .x {} } |
|
@scope (div) {} |
|
@scope (.a) to (.b) {} |
|
|
|
==> |
|
|
|
StyleSheet( |
|
ScopeStatement(scope,Block(RuleSet(ClassSelector(ClassName),Block))), |
|
ScopeStatement(scope,ParenthesizedSelector(TagSelector(TagName)),Block), |
|
ScopeStatement(scope,ParenthesizedSelector(ClassSelector(ClassName)),to,ParenthesizedSelector(ClassSelector(ClassName)),Block)) |
|
|
|
# If Expressions |
|
|
|
p { |
|
background-color: if( |
|
style(--color: white): black; |
|
supports(foo: bar): red; |
|
else: pink |
|
); |
|
} |
|
|
|
==> |
|
|
|
StyleSheet(RuleSet(TagSelector(TagName),Block( |
|
Declaration(PropertyName,IfExpression(if,ArgList( |
|
IfBranch(CallQuery(QueryCallee,ArgList(FeatureName,ValueName)),ValueName), |
|
IfBranch(CallQuery(QueryCallee,ArgList(FeatureName,ValueName)),ValueName), |
|
IfBranch(KeywordQuery,ValueName)))))))
|
|
|