feat(css/minifier): Merge rules (#6220)

This commit is contained in:
Alexander Akait 2022-10-21 15:49:25 +03:00 committed by GitHub
parent b79997ba02
commit 8b6b9c0961
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
57 changed files with 1131 additions and 233 deletions

View File

@ -1,182 +0,0 @@
use swc_atoms::{js_word, JsWord};
use swc_common::collections::AHashMap;
use swc_css_ast::*;
use super::Compressor;
enum ParentNode<'a> {
Stylesheet(&'a mut Stylesheet),
SimpleBlock(&'a mut SimpleBlock),
}
#[derive(Eq, Hash, PartialEq)]
enum Name {
CounterStyle(JsWord),
// We need to keep prefixed keyframes, i.e. `@-webkit-keyframes`
Keyframes(JsWord, JsWord),
}
impl Compressor {
fn get_at_rule_name(&self, at_rule: &AtRule) -> JsWord {
match &at_rule.name {
AtRuleName::Ident(Ident { value, .. }) => value.to_ascii_lowercase(),
AtRuleName::DashedIdent(DashedIdent { value, .. }) => value.to_ascii_lowercase(),
}
}
fn collect_names(&self, rule: &Rule, names: &mut AHashMap<Name, isize>) {
if let Rule::AtRule(box at_rule) = rule {
match &at_rule.prelude {
Some(box AtRulePrelude::CounterStylePrelude(CustomIdent {
value: name, ..
})) => {
names
.entry(Name::CounterStyle(name.clone()))
.and_modify(|mana| *mana += 1)
.or_insert(1);
}
Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::CustomIdent(
box CustomIdent { value: name, .. },
)))
| Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::Str(box Str {
value: name,
..
}))) => {
names
.entry(Name::Keyframes(
self.get_at_rule_name(at_rule),
name.clone(),
))
.and_modify(|mana| *mana += 1)
.or_insert(1);
}
_ => {}
}
}
}
fn discard_overridden(&self, parent_node: ParentNode, names: &mut AHashMap<Name, isize>) {
let mut discarder = |at_rule: &AtRule| match &at_rule.prelude {
Some(box AtRulePrelude::CounterStylePrelude(CustomIdent { value: name, .. })) => {
if let Some(counter) = names.get_mut(&Name::CounterStyle(name.clone())) {
if *counter > 1 {
*counter -= 1;
false
} else {
true
}
} else {
false
}
}
Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::CustomIdent(
box CustomIdent { value: name, .. },
)))
| Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::Str(box Str {
value: name,
..
}))) => {
let counter = names.get_mut(&Name::Keyframes(
self.get_at_rule_name(at_rule),
name.clone(),
));
if let Some(counter) = counter {
if *counter > 1 {
*counter -= 1;
false
} else {
true
}
} else {
false
}
}
_ => true,
};
match parent_node {
ParentNode::Stylesheet(stylesheet) => {
stylesheet.rules.retain(|rule| match rule {
Rule::AtRule(box at_rule) => discarder(at_rule),
_ => true,
});
}
ParentNode::SimpleBlock(simple_block) => simple_block.value.retain(|rule| match rule {
ComponentValue::Rule(Rule::AtRule(box at_rule)) => discarder(at_rule),
_ => true,
}),
}
}
pub(super) fn compress_empty_stylesheet(&self, stylesheet: &mut Stylesheet) {
let mut names: AHashMap<Name, isize> = Default::default();
stylesheet.rules.retain(|rule| match rule {
Rule::QualifiedRule(box QualifiedRule { block, .. }) if block.value.is_empty() => false,
Rule::AtRule(box AtRule {
name: AtRuleName::Ident(Ident { value, .. }),
block: Some(block),
..
}) if !need_keep_by_name(value) && block.value.is_empty() => false,
_ => {
self.collect_names(rule, &mut names);
true
}
});
if !names.is_empty() {
self.discard_overridden(ParentNode::Stylesheet(stylesheet), &mut names);
}
}
pub(super) fn compress_empty_simple_block(&self, simple_block: &mut SimpleBlock) {
let mut names: AHashMap<Name, isize> = Default::default();
simple_block.value.retain(|rule| match rule {
ComponentValue::Rule(Rule::QualifiedRule(box QualifiedRule { block, .. }))
| ComponentValue::Rule(Rule::AtRule(box AtRule {
block: Some(block), ..
}))
| ComponentValue::StyleBlock(StyleBlock::QualifiedRule(box QualifiedRule {
block,
..
}))
| ComponentValue::StyleBlock(StyleBlock::AtRule(box AtRule {
block: Some(block),
..
}))
| ComponentValue::DeclarationOrAtRule(DeclarationOrAtRule::AtRule(box AtRule {
block: Some(block),
..
}))
| ComponentValue::KeyframeBlock(KeyframeBlock { block, .. })
if block.value.is_empty() =>
{
false
}
_ => {
if let ComponentValue::Rule(rule) = rule {
self.collect_names(rule, &mut names);
}
true
}
});
if !names.is_empty() {
self.discard_overridden(ParentNode::SimpleBlock(simple_block), &mut names);
}
}
}
fn need_keep_by_name(name: &JsWord) -> bool {
matches!(
name.to_ascii_lowercase(),
js_word!("color-profile") | js_word!("layer")
)
}

View File

@ -13,13 +13,13 @@ mod container;
mod ctx;
mod declaration;
mod easing_function;
mod empty;
mod frequency;
mod import;
mod keyframes;
mod length;
mod math;
mod media;
mod rules;
mod selector;
mod supports;
mod time;
@ -59,7 +59,7 @@ impl VisitMut for Compressor {
fn visit_mut_stylesheet(&mut self, n: &mut Stylesheet) {
n.visit_mut_children_with(self);
self.compress_empty_stylesheet(n);
self.compress_stylesheet(n);
if !self.need_utf8_at_rule {
match n.rules.get(0) {
@ -77,7 +77,7 @@ impl VisitMut for Compressor {
fn visit_mut_simple_block(&mut self, n: &mut SimpleBlock) {
n.visit_mut_children_with(self);
self.compress_empty_simple_block(n);
self.compress_simple_block(n);
}
fn visit_mut_time(&mut self, n: &mut Time) {

View File

@ -0,0 +1,582 @@
use std::mem::take;
use swc_atoms::{js_word, JsWord};
use swc_common::{collections::AHashMap, EqIgnoreSpan, Span, Spanned, SyntaxContext};
use swc_css_ast::*;
use swc_css_visit::{Visit, VisitMutWith, VisitWith};
use super::Compressor;
enum ParentNode<'a> {
Stylesheet(&'a mut Stylesheet),
SimpleBlock(&'a mut SimpleBlock),
}
#[derive(Eq, Hash, PartialEq)]
enum Name {
CounterStyle(JsWord),
// We need to keep prefixed keyframes, i.e. `@-webkit-keyframes`
Keyframes(JsWord, JsWord),
}
struct CompatibilityChecker {
pub allow_to_merge: bool,
}
impl Default for CompatibilityChecker {
fn default() -> Self {
CompatibilityChecker {
allow_to_merge: true,
}
}
}
// TODO improve me https://github.com/cssnano/cssnano/blob/master/packages/postcss-merge-rules/src/lib/ensureCompatibility.js#L62, need browserslist
impl Visit for CompatibilityChecker {
fn visit_pseudo_class_selector(&mut self, _n: &PseudoClassSelector) {
self.allow_to_merge = false;
}
fn visit_pseudo_element_selector(&mut self, _n: &PseudoElementSelector) {
self.allow_to_merge = false;
}
fn visit_attribute_selector(&mut self, n: &AttributeSelector) {
if n.modifier.is_some() {
self.allow_to_merge = false;
}
}
}
impl Compressor {
fn get_at_rule_name(&self, at_rule: &AtRule) -> JsWord {
match &at_rule.name {
AtRuleName::Ident(Ident { value, .. }) => value.to_ascii_lowercase(),
AtRuleName::DashedIdent(DashedIdent { value, .. }) => value.to_ascii_lowercase(),
}
}
fn collect_names(&self, rule: &Rule, names: &mut AHashMap<Name, isize>) {
if let Rule::AtRule(box at_rule) = rule {
match &at_rule.prelude {
Some(box AtRulePrelude::CounterStylePrelude(CustomIdent {
value: name, ..
})) => {
names
.entry(Name::CounterStyle(name.clone()))
.and_modify(|mana| *mana += 1)
.or_insert(1);
}
Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::CustomIdent(
box CustomIdent { value: name, .. },
)))
| Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::Str(box Str {
value: name,
..
}))) => {
names
.entry(Name::Keyframes(
self.get_at_rule_name(at_rule),
name.clone(),
))
.and_modify(|mana| *mana += 1)
.or_insert(1);
}
_ => {}
}
}
}
fn discard_overridden(&self, parent_node: ParentNode, names: &mut AHashMap<Name, isize>) {
let mut discarder = |at_rule: &AtRule| match &at_rule.prelude {
Some(box AtRulePrelude::CounterStylePrelude(CustomIdent { value: name, .. })) => {
if let Some(counter) = names.get_mut(&Name::CounterStyle(name.clone())) {
if *counter > 1 {
*counter -= 1;
false
} else {
true
}
} else {
false
}
}
Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::CustomIdent(
box CustomIdent { value: name, .. },
)))
| Some(box AtRulePrelude::KeyframesPrelude(KeyframesName::Str(box Str {
value: name,
..
}))) => {
let counter = names.get_mut(&Name::Keyframes(
self.get_at_rule_name(at_rule),
name.clone(),
));
if let Some(counter) = counter {
if *counter > 1 {
*counter -= 1;
false
} else {
true
}
} else {
false
}
}
_ => true,
};
match parent_node {
ParentNode::Stylesheet(stylesheet) => {
stylesheet.rules.retain(|rule| match rule {
Rule::AtRule(box at_rule) => discarder(at_rule),
_ => true,
});
}
ParentNode::SimpleBlock(simple_block) => simple_block.value.retain(|rule| match rule {
ComponentValue::Rule(Rule::AtRule(box at_rule)) => discarder(at_rule),
_ => true,
}),
}
}
fn merge_selector_list(&self, left: &SelectorList, right: &SelectorList) -> SelectorList {
let mut children = left.children.clone();
children.extend(right.children.clone());
SelectorList {
span: Span::new(left.span_lo(), right.span_hi(), SyntaxContext::empty()),
children,
}
}
fn merge_simple_block(&self, left: &SimpleBlock, right: &SimpleBlock) -> SimpleBlock {
let mut value = left.value.clone();
value.extend(right.value.clone());
SimpleBlock {
span: Span::new(left.span_lo(), right.span_hi(), SyntaxContext::empty()),
name: left.name.clone(),
value,
}
}
fn can_merge_qualified_rules(&self, left: &QualifiedRule, right: &QualifiedRule) -> bool {
let left_selector_list = match &left.prelude {
QualifiedRulePrelude::SelectorList(selector_list) => selector_list,
_ => return false,
};
let right_selector_list = match &right.prelude {
QualifiedRulePrelude::SelectorList(selector_list) => selector_list,
_ => return false,
};
let mut checker = CompatibilityChecker::default();
left_selector_list.visit_with(&mut checker);
right_selector_list.visit_with(&mut checker);
checker.allow_to_merge
}
fn try_merge_qualified_rules(
&mut self,
left: &QualifiedRule,
right: &QualifiedRule,
) -> Option<QualifiedRule> {
if !self.can_merge_qualified_rules(left, right) {
return None;
}
// Merge when declarations are exactly equal
// e.g. h1 { color: red } h2 { color: red }
if left.block.eq_ignore_span(&right.block) {
if let (
QualifiedRulePrelude::SelectorList(prev_selector_list),
QualifiedRulePrelude::SelectorList(current_selector_list),
) = (&left.prelude, &right.prelude)
{
let selector_list =
self.merge_selector_list(prev_selector_list, current_selector_list);
let mut qualified_rule = QualifiedRule {
span: Span::new(
left.span.span_lo(),
right.span.span_lo(),
SyntaxContext::empty(),
),
prelude: QualifiedRulePrelude::SelectorList(selector_list),
block: left.block.clone(),
};
qualified_rule.visit_mut_children_with(self);
return Some(qualified_rule);
}
}
// Merge when both selectors are exactly equal
// e.g. a { color: blue } a { font-weight: bold }
if left.prelude.eq_ignore_span(&right.prelude) {
let block = self.merge_simple_block(&left.block, &right.block);
let mut qualified_rule = QualifiedRule {
span: Span::new(
left.span.span_lo(),
right.span.span_hi(),
SyntaxContext::empty(),
),
prelude: left.prelude.clone(),
block,
};
qualified_rule.visit_mut_children_with(self);
return Some(qualified_rule);
}
// Partial merge: check if the rule contains a subset of the last; if
// so create a joined selector with the subset, if smaller.
// TODO improve me
None
}
fn is_mergeable_at_rule(&self, at_rule: &AtRule) -> bool {
let name = match &at_rule.name {
AtRuleName::Ident(Ident { value, .. }) => value,
_ => return false,
};
match name.to_ascii_lowercase() {
js_word!("media")
| js_word!("supports")
| js_word!("container")
| js_word!("layer")
| js_word!("nest") => true,
_ => false,
}
}
fn try_merge_at_rule(&mut self, left: &AtRule, right: &AtRule) -> Option<AtRule> {
// Merge when both at-rule's prelude is exactly equal
// e.g.
// @media print { .color { color: red; } }
// @media print { .color { color: blue; } }
if left.prelude.eq_ignore_span(&right.prelude) {
if let Some(left_block) = &left.block {
if let Some(right_block) = &right.block {
let block = self.merge_simple_block(left_block, right_block);
let mut at_rule = AtRule {
span: Span::new(
left.span.span_lo(),
right.span.span_lo(),
SyntaxContext::empty(),
),
name: left.name.clone(),
prelude: left.prelude.clone(),
block: Some(block),
};
at_rule.visit_mut_children_with(self);
return Some(at_rule);
}
}
}
None
}
pub(super) fn compress_stylesheet(&mut self, stylesheet: &mut Stylesheet) {
let mut names: AHashMap<Name, isize> = Default::default();
let mut prev_rule: Option<Rule> = None;
let mut remove_rules_list = vec![];
let mut prev_index = 0;
let mut index = 0;
stylesheet.rules.retain_mut(|rule| {
let result = match rule {
Rule::AtRule(box AtRule {
name: AtRuleName::Ident(Ident { value, .. }),
block: Some(block),
..
}) if !need_keep_by_name(value) && block.value.is_empty() => false,
Rule::QualifiedRule(box QualifiedRule { block, .. }) if block.value.is_empty() => {
false
}
Rule::AtRule(box at_rule @ AtRule { .. })
if self.is_mergeable_at_rule(at_rule)
&& matches!(prev_rule, Some(Rule::AtRule(_))) =>
{
if let Some(Rule::AtRule(box prev_rule)) = &prev_rule {
if let Some(at_rule) = self.try_merge_at_rule(prev_rule, at_rule) {
*rule = Rule::AtRule(Box::new(at_rule));
remove_rules_list.push(prev_index);
}
}
true
}
Rule::QualifiedRule(box qualified_rule @ QualifiedRule { .. })
if matches!(prev_rule, Some(Rule::QualifiedRule(_))) =>
{
if let Some(Rule::QualifiedRule(box prev_rule)) = &prev_rule {
if let Some(qualified_rule) =
self.try_merge_qualified_rules(prev_rule, qualified_rule)
{
*rule = Rule::QualifiedRule(Box::new(qualified_rule));
remove_rules_list.push(prev_index);
}
}
true
}
_ => {
self.collect_names(rule, &mut names);
true
}
};
if result {
match rule {
Rule::AtRule(box at_rule @ AtRule { .. })
if self.is_mergeable_at_rule(at_rule) =>
{
prev_index = index;
prev_rule = Some(rule.clone());
}
Rule::QualifiedRule(_) => {
prev_index = index;
prev_rule = Some(rule.clone());
}
_ => {
prev_rule = None;
}
}
index += 1;
}
result
});
if !names.is_empty() {
self.discard_overridden(ParentNode::Stylesheet(stylesheet), &mut names);
}
if !remove_rules_list.is_empty() {
stylesheet.rules = take(&mut stylesheet.rules)
.into_iter()
.enumerate()
.filter_map(|(idx, value)| {
if remove_rules_list.contains(&idx) {
None
} else {
Some(value)
}
})
.collect::<Vec<_>>();
// To merge
// .foo {
// background: red;
// }
//
// .bar {
// background: red;
// }
//
// .foo {
// color: green;
// }
//
// .bar {
// color: green;
// }
self.compress_stylesheet(stylesheet);
}
}
pub(super) fn compress_simple_block(&mut self, simple_block: &mut SimpleBlock) {
let mut names: AHashMap<Name, isize> = Default::default();
let mut prev_rule: Option<ComponentValue> = None;
let mut remove_rules_list = vec![];
let mut prev_index = 0;
let mut index = 0;
simple_block.value.retain_mut(|rule| {
let result = match rule {
ComponentValue::Rule(Rule::AtRule(box AtRule {
block: Some(block), ..
}))
| ComponentValue::Rule(Rule::QualifiedRule(box QualifiedRule { block, .. }))
| ComponentValue::StyleBlock(StyleBlock::QualifiedRule(box QualifiedRule {
block,
..
}))
| ComponentValue::StyleBlock(StyleBlock::AtRule(box AtRule {
block: Some(block),
..
}))
| ComponentValue::DeclarationOrAtRule(DeclarationOrAtRule::AtRule(box AtRule {
block: Some(block),
..
}))
| ComponentValue::KeyframeBlock(KeyframeBlock { block, .. })
if block.value.is_empty() =>
{
false
}
ComponentValue::Rule(Rule::AtRule(box at_rule @ AtRule { .. }))
if prev_rule.is_some() && self.is_mergeable_at_rule(at_rule) =>
{
if let Some(ComponentValue::Rule(Rule::AtRule(box prev_rule))) = &prev_rule {
if let Some(at_rule) = self.try_merge_at_rule(prev_rule, at_rule) {
*rule = ComponentValue::Rule(Rule::AtRule(Box::new(at_rule)));
remove_rules_list.push(prev_index);
}
}
true
}
ComponentValue::StyleBlock(StyleBlock::AtRule(box at_rule @ AtRule { .. }))
if prev_rule.is_some() && self.is_mergeable_at_rule(at_rule) =>
{
if let Some(ComponentValue::StyleBlock(StyleBlock::AtRule(box prev_rule))) =
&prev_rule
{
if let Some(at_rule) = self.try_merge_at_rule(prev_rule, at_rule) {
*rule =
ComponentValue::StyleBlock(StyleBlock::AtRule(Box::new(at_rule)));
remove_rules_list.push(prev_index);
}
}
true
}
ComponentValue::Rule(Rule::QualifiedRule(
box qualified_rule @ QualifiedRule { .. },
)) if prev_rule.is_some() => {
if let Some(ComponentValue::Rule(Rule::QualifiedRule(box prev_rule))) =
&prev_rule
{
if let Some(qualified_rule) =
self.try_merge_qualified_rules(prev_rule, qualified_rule)
{
*rule =
ComponentValue::Rule(Rule::QualifiedRule(Box::new(qualified_rule)));
remove_rules_list.push(prev_index);
}
}
true
}
ComponentValue::StyleBlock(StyleBlock::QualifiedRule(
box qualified_rule @ QualifiedRule { .. },
)) if prev_rule.is_some() => {
if let Some(ComponentValue::StyleBlock(StyleBlock::QualifiedRule(
box prev_rule,
))) = &prev_rule
{
if let Some(qualified_rule) =
self.try_merge_qualified_rules(prev_rule, qualified_rule)
{
*rule = ComponentValue::StyleBlock(StyleBlock::QualifiedRule(
Box::new(qualified_rule),
));
remove_rules_list.push(prev_index);
}
}
true
}
_ => {
if let ComponentValue::Rule(rule) = rule {
self.collect_names(rule, &mut names);
}
true
}
};
if result {
match rule {
ComponentValue::Rule(Rule::AtRule(box at_rule))
| ComponentValue::StyleBlock(StyleBlock::AtRule(box at_rule))
if self.is_mergeable_at_rule(at_rule) =>
{
prev_index = index;
prev_rule = Some(rule.clone());
}
ComponentValue::Rule(Rule::QualifiedRule(_))
| ComponentValue::StyleBlock(StyleBlock::QualifiedRule(_)) => {
prev_index = index;
prev_rule = Some(rule.clone());
}
_ => {
prev_rule = None;
}
}
index += 1;
}
result
});
if !names.is_empty() {
self.discard_overridden(ParentNode::SimpleBlock(simple_block), &mut names);
}
if !remove_rules_list.is_empty() {
simple_block.value = take(&mut simple_block.value)
.into_iter()
.enumerate()
.filter_map(|(idx, value)| {
if remove_rules_list.contains(&idx) {
None
} else {
Some(value)
}
})
.collect::<Vec<_>>();
// To merge
// .foo {
// & .foo {
// background: red;
// }
//
// & .bar {
// background: red;
// }
//
// & .foo {
// color: green;
// }
//
// & .bar {
// color: green;
// }
// }
self.compress_simple_block(simple_block);
}
}
}
fn need_keep_by_name(name: &JsWord) -> bool {
matches!(name.to_ascii_lowercase(), js_word!("color-profile"))
}

View File

@ -1 +1 @@
.class1{opacity:0}.class2{opacity:0}.class3{opacity:.5}.class4{opacity:.5}.class5{opacity:1}.class6{opacity:1}.class7{shape-image-threshold:.7}.class8{fill-opacity:.5}.class9{stroke-opacity:.5}.class10{shape-image-threshold:.5}.class11{opacity:53%}.class12{opacity:0}.class13{color:#7b7b7b}.class14{color:rgba(123,123,123,.2)}.class15{color:rgba(123,123,123,1%)}.class16{color:rgba(123,123,123,0)}.class17{color:#7b7b7b}.class18{color:rgba(123,123,123,.2)}.class19{color:rgba(123,123,123,.5)}.class20{color:rgba(123,123,123,.53)}.class21{color:rgba(123,123,123,.1)}.class22{color:rgba(123,123,123,.1)}.class23{color:rgba(123,123,123,1%)}.class24{color:rgba(123,123,123,9%)}.class25{color:rgba(123,123,123,0)}.class26{color:rgba(123,123,123,0)}
.class1{opacity:0}.class2{opacity:0}.class3,.class4{opacity:.5}.class5{opacity:1}.class6{opacity:1}.class7{shape-image-threshold:.7}.class8{fill-opacity:.5}.class9{stroke-opacity:.5}.class10{shape-image-threshold:.5}.class11{opacity:53%}.class12{opacity:0}.class13{color:#7b7b7b}.class14{color:rgba(123,123,123,.2)}.class15{color:rgba(123,123,123,1%)}.class16{color:rgba(123,123,123,0)}.class17{color:#7b7b7b}.class18{color:rgba(123,123,123,.2)}.class19{color:rgba(123,123,123,.5)}.class20{color:rgba(123,123,123,.53)}.class21,.class22{color:rgba(123,123,123,.1)}.class23{color:rgba(123,123,123,1%)}.class24{color:rgba(123,123,123,9%)}.class25,.class26{color:rgba(123,123,123,0)}

View File

@ -1 +1 @@
.foo{animation-name:"none","unset",foo\ bar}.foo{animation-name:"none",foo}.foo{animation-name:none,none}.foo{animation-name:"inherit"}.foo{animation-name:"initial"}.foo{animation-name:"unset"}.foo{animation-name:"revert"}.foo{animation-name:"revert-layer"}.foo{animation-name:"default"}.foo{animation-name:foo,"revert"}.foo{animation-name:string,"revert"}.foo{animation-name:string,foo,"revert"}.foo{animation:none}.foo{animation:"none"}.foo{animation:"None"}.foo{animation:"none",none}.foo{animation:none,none}.foo{animation:"none"none}.foo{animation:none none}.foo{animation:ease ease 2s}.foo{animation:"none"2s both}.foo{animation:both"none"2s}.foo{animation:"none"2s none}.foo{animation:none"none"2s}.foo{animation:none,"none"2s forwards}.foo{animation:"unset"}.foo{animation:string.5s}.foo{animation:"unset".5s}.foo{animation:none,"unset".5s}.foo{animation:"unset"0s 3s infinite,none}.foo{animation:2s ease ease}.foo{animation:3s alternate reverse}
.foo{animation-name:"none","unset",foo\ bar;animation-name:"none",foo;animation-name:none,none;animation-name:"inherit";animation-name:"initial";animation-name:"unset";animation-name:"revert";animation-name:"revert-layer";animation-name:"default";animation-name:foo,"revert";animation-name:string,"revert";animation-name:string,foo,"revert";animation:none;animation:"none";animation:"None";animation:"none",none;animation:none,none;animation:"none"none;animation:none none;animation:ease ease 2s;animation:"none"2s both;animation:both"none"2s;animation:"none"2s none;animation:none"none"2s;animation:none,"none"2s forwards;animation:"unset";animation:string.5s;animation:"unset".5s;animation:none,"unset".5s;animation:"unset"0s 3s infinite,none;animation:2s ease ease;animation:3s alternate reverse}

View File

@ -1 +1 @@
@layer default,theme,components;@layer foo.bar;@layer foo.bar,baz;@layer framework{}@layer a{@layer b{div{color:yellow;margin:0}}}@layer framework{@layer base{p{margin-block:.75em}}@layer theme{p{color:#222}}}@layer framework.theme{blockquote{color:rebeccapurple}}@layer{@layer foo{color: red;}@layer foo{color: red;}}@layer{@layer foo{color: red;}}@layer{@layer foo{color: red;}}@layer framework{h1,h2{color:maroon;background:white}@media(prefers-color-scheme:dark){h1,h2{color:red;background:black}}}@layer foo{.foo{color:red}}@layer foo{.foo{background:#fff}.baz{color:#fff}}
@layer default,theme,components;@layer foo.bar;@layer foo.bar,baz;@layer a{@layer b{div{color:yellow;margin:0}}}@layer framework{@layer base{p{margin-block:.75em}}@layer theme{p{color:#222}}}@layer framework.theme{blockquote{color:rebeccapurple}}@layer{@layer foo{color: red;color: red;color: red;color: red;}}@layer framework{h1,h2{color:maroon;background:white}@media(prefers-color-scheme:dark){h1,h2{color:red;background:black}}}@layer foo{.foo{color:red;background:#fff}.baz{color:#fff}}

View File

@ -1 +1 @@
@media print{body{font-size:10pt}}@media print{body{font-size:10pt}}@media(min-width:900px){a{color:red}}@media only screen and (min-width:320px){body{line-height:1.4}}@media(400px<=width<=700px){body{line-height:1.4}}@media screen and (min-width:900px){article{padding:1rem 3rem}}@media(height>600px){body{line-height:1.4}}@media(400px<=width<=700px){body{line-height:1.4}}@media(foo:bar){body{line-height:1.4}}@media(min-width:30em)and (orientation:landscape){.test{color:red}}@media screen and (min-width:30em)and (orientation:landscape){.test{color:red}}@media screen and (min-width:30em)and (max-width:300px)and (orientation:landscape){.test{color:red}}@media(min-height:680px),screen and (orientation:portrait){.test{color:red}}@media(not (color))or (hover){.test{color:red}}@media only screen and ((min-width:320px)and (max-width:1480px)){body{background:red}}@media((min-width:320px)and (max-width:1480px)){body{background:red}}@media((min-width:320px)or (max-width:1480px)){body{background:red}}@media(min-width:320px)and (max-width:1480px)and (orientation:landscape){body{background:red}}@media(min-width:320px)and (max-width:1480px)and (orientation:landscape){body{background:red}}@media(min-width:320px)or (max-width:1480px)or (orientation:landscape){body{background:red}}@media(min-width:320px)or (max-width:1480px)or (orientation:landscape){body{background:red}}@media screen and (min-width:320px)and (max-width:1480px)and (orientation:landscape){body{background:red}}@media screen and (min-width:320px)and (max-width:1480px)and (orientation:landscape){body{background:red}}@media not (resolution:-300dpi){body{background:green}}@media(grid)and (max-width:15em){body{background:green}}@media(max-width:calc(5px + 1rem)){body{color:red}}@media(110px<width<=1010px){body{color:red}}
@media print{body{font-size:10pt}}@media(min-width:900px){a{color:red}}@media only screen and (min-width:320px){body{line-height:1.4}}@media(400px<=width<=700px){body{line-height:1.4}}@media screen and (min-width:900px){article{padding:1rem 3rem}}@media(height>600px){body{line-height:1.4}}@media(400px<=width<=700px){body{line-height:1.4}}@media(foo:bar){body{line-height:1.4}}@media(min-width:30em)and (orientation:landscape){.test{color:red}}@media screen and (min-width:30em)and (orientation:landscape){.test{color:red}}@media screen and (min-width:30em)and (max-width:300px)and (orientation:landscape){.test{color:red}}@media(min-height:680px),screen and (orientation:portrait){.test{color:red}}@media(not (color))or (hover){.test{color:red}}@media only screen and ((min-width:320px)and (max-width:1480px)){body{background:red}}@media((min-width:320px)and (max-width:1480px)){body{background:red}}@media((min-width:320px)or (max-width:1480px)){body{background:red}}@media(min-width:320px)and (max-width:1480px)and (orientation:landscape){body{background:red}}@media(min-width:320px)or (max-width:1480px)or (orientation:landscape){body{background:red}}@media screen and (min-width:320px)and (max-width:1480px)and (orientation:landscape){body{background:red}}@media not (resolution:-300dpi){body{background:green}}@media(grid)and (max-width:15em){body{background:green}}@media(max-width:calc(5px + 1rem)){body{color:red}}@media(110px<width<=1010px){body{color:red}}

View File

@ -1 +1 @@
@supports(display:flex){a{color:red}}@supports(display:grid)and (display:flex){a{color:red}}@supports(display:grid)or (display:flex){a{color:red}}@supports(display:flex){a{color:red}}@supports(not (display:grid)){div{float:right}}@supports(transform-origin:5%5%){div{float:right}}@supports(display:grid)and (not (display:inline-grid)){div{float:right}}@supports(display:grid)and (display:flex){a{color:red}}@supports(display:flex)or (display:grid)or (display:table)or (display:inline-grid){div{color:red}}@supports(display:flex)or (display:grid)or (display:table)or (display:inline-grid){div{color:red}}@supports(display:flex)or (display:grid)or (display:table)or (display:inline-grid){div{color:red}}@supports(display:flex)and (display:grid)and (display:table)and (display:inline-grid){div{color:red}}@supports(display:flex)and (display:grid)and (display:table)and (display:inline-grid){div{color:red}}@supports(display:flex)and (display:grid)and (display:table)and (display:inline-grid){div{color:red}}@supports((display:flex)and (display:grid))or (display:table)or (display:inline-grid){div{color:red}}@supports((display:flex)or (display:grid))and (display:table)and (display:inline-grid){div{color:red}}@supports(display:flex)and ((display:grid)or (display:table))and (display:inline-grid){div{color:red}}@supports(display:flex)or ((display:grid)and (display:table))or (display:inline-grid){div{color:red}}@supports(display:flex)and (display:grid)and ((display:table)or (display:inline-grid)){div{color:red}}@supports(display:flex)or (display:grid)or ((display:table)and (display:inline-grid)){div{color:red}}@supports(display:flex!important){div{color:red}}@supports((display:grid)and (display:table))or ((display:flex)and (display:inline)){a{color:red}}@supports((display:grid)or (display:table))and ((display:flex)or (display:inline)){a{color:red}}@supports(display:grid)and (display:table)and (display:flex)and (display:inline){a{color:red}}@supports(display:grid)or (display:table)or (display:flex)or (display:inline){a{color:red}}@supports(display:grid)or (display:table)or ((display:flex)and (display:inline)){a{color:red}}@supports(display:grid)and (display:table)and ((display:flex)or (display:inline)){a{color:red}}@supports((display:grid)and (display:table))or (display:flex)or (display:inline){a{color:red}}@supports((display:grid)and (display:table))or (display:flex)or (display:inline){a{color:red}}@supports((display:grid)or (display:table))and (display:flex)and (display:inline){a{color:red}}@supports((display:grid)or (display:table))and (display:flex)and (display:inline){a{color:red}}@supports(display:grid)and (display:table)and (display:flex)and (display:inline-table){a{color:red}}@supports(display:grid)or (display:table)or (display:flex)or (display:inline-table){a{color:red}}@supports(display:grid)or ((display:table)and (display:flex))or (display:inline-table){a{color:red}}@supports(display:grid)and ((display:table)or (display:flex))and (display:inline-table){a{color:red}}
@supports(display:flex){a{color:red}}@supports(display:grid)and (display:flex){a{color:red}}@supports(display:grid)or (display:flex){a{color:red}}@supports(display:flex){a{color:red}}@supports(not (display:grid)){div{float:right}}@supports(transform-origin:5%5%){div{float:right}}@supports(display:grid)and (not (display:inline-grid)){div{float:right}}@supports(display:grid)and (display:flex){a{color:red}}@supports(display:flex)or (display:grid)or (display:table)or (display:inline-grid){div{color:red}}@supports(display:flex)and (display:grid)and (display:table)and (display:inline-grid){div{color:red}}@supports((display:flex)and (display:grid))or (display:table)or (display:inline-grid){div{color:red}}@supports((display:flex)or (display:grid))and (display:table)and (display:inline-grid){div{color:red}}@supports(display:flex)and ((display:grid)or (display:table))and (display:inline-grid){div{color:red}}@supports(display:flex)or ((display:grid)and (display:table))or (display:inline-grid){div{color:red}}@supports(display:flex)and (display:grid)and ((display:table)or (display:inline-grid)){div{color:red}}@supports(display:flex)or (display:grid)or ((display:table)and (display:inline-grid)){div{color:red}}@supports(display:flex!important){div{color:red}}@supports((display:grid)and (display:table))or ((display:flex)and (display:inline)){a{color:red}}@supports((display:grid)or (display:table))and ((display:flex)or (display:inline)){a{color:red}}@supports(display:grid)and (display:table)and (display:flex)and (display:inline){a{color:red}}@supports(display:grid)or (display:table)or (display:flex)or (display:inline){a{color:red}}@supports(display:grid)or (display:table)or ((display:flex)and (display:inline)){a{color:red}}@supports(display:grid)and (display:table)and ((display:flex)or (display:inline)){a{color:red}}@supports((display:grid)and (display:table))or (display:flex)or (display:inline){a{color:red}}@supports((display:grid)or (display:table))and (display:flex)and (display:inline){a{color:red}}@supports(display:grid)and (display:table)and (display:flex)and (display:inline-table){a{color:red}}@supports(display:grid)or (display:table)or (display:flex)or (display:inline-table){a{color:red}}@supports(display:grid)or ((display:table)and (display:flex))or (display:inline-table){a{color:red}}@supports(display:grid)and ((display:table)or (display:flex))and (display:inline-table){a{color:red}}

View File

@ -1 +1 @@
@container(inline-size>=0){h2{font-size:2cqw}}@container(inline-size>=0){h2{font-size:2cqh}}@container(inline-size>=0){h2{font-size:2cqi}}@container(inline-size>=0){h2{font-size:2cqb}}@container(inline-size>=0){h2{font-size:2cqmin}}@container(inline-size>=0){h2{font-size:2cqmax}}@container(inline-size>=200px){h2{font-size:2cqw}}@container(inline-size>=200px){h2{font-size:2cqw}}
@container(inline-size>=0){h2{font-size:2cqw;font-size:2cqh;font-size:2cqi;font-size:2cqb;font-size:2cqmin;font-size:2cqmax}}@container(inline-size>=200px){h2{font-size:2cqw}}

View File

@ -1 +1 @@
.class1{width:calc(var(--mouseX)*1px)}.class2{width:calc(10px - 100px*var(--mouseX))}.class3{width:calc(-90px - var(--mouseX))}.class4{width:calc(10px - 100px/var(--mouseX))}.class5{width:calc(-90px + var(--mouseX))}.class6{width:calc(var(--popupHeight)/2)}.class7{width:calc(var(--popupHeight)/2 + var(--popupWidth)/2)}.class8{--foo:calc(var(--bar) / 8)}.class9{transform:translatey(calc(-100% - var(--tooltip-calculated-offset)))}.class10{width:calc(var(--xxx,var(--yyy))/2)}.class11{width:var(--foo)}.class12{width:var(--foo)}.class13{width:calc(var(--foo) + 10px)}.class14{width:calc(var(--foo) + var(--bar))}.class15{width:calc(var(--foo) + var(--bar) + var(--baz))}.class16{width:calc(var(--foo) + var(--bar) + var(--baz))}.class17{width:calc(var(--foo) - var(--bar) - var(--baz))}.class18{width:calc(var(--foo) - var(--bar) + var(--baz))}.class19{width:calc(var(--foo) + var(--bar) - var(--baz))}.class20{width:calc(var(--foo) + var(--bar) - var(--baz))}.class21{width:calc(var(--foo) - var(--bar) - var(--baz))}.class22{width:calc(calc(var(--foo) + var(--bar))*var(--baz))}.class23{width:calc(var(--foo)*calc(var(--bar) + var(--baz)))}.class24{width:calc(calc(var(--foo) + var(--bar))/var(--baz))}.class25{width:calc(var(--foo)/calc(var(--bar) + var(--baz)))}
.class1{width:calc(var(--mouseX)*1px)}.class2{width:calc(10px - 100px*var(--mouseX))}.class3{width:calc(-90px - var(--mouseX))}.class4{width:calc(10px - 100px/var(--mouseX))}.class5{width:calc(-90px + var(--mouseX))}.class6{width:calc(var(--popupHeight)/2)}.class7{width:calc(var(--popupHeight)/2 + var(--popupWidth)/2)}.class8{--foo:calc(var(--bar) / 8)}.class9{transform:translatey(calc(-100% - var(--tooltip-calculated-offset)))}.class10{width:calc(var(--xxx,var(--yyy))/2)}.class11,.class12{width:var(--foo)}.class13{width:calc(var(--foo) + 10px)}.class14{width:calc(var(--foo) + var(--bar))}.class15,.class16{width:calc(var(--foo) + var(--bar) + var(--baz))}.class17{width:calc(var(--foo) - var(--bar) - var(--baz))}.class18{width:calc(var(--foo) - var(--bar) + var(--baz))}.class19,.class20{width:calc(var(--foo) + var(--bar) - var(--baz))}.class21{width:calc(var(--foo) - var(--bar) - var(--baz))}.class22{width:calc(calc(var(--foo) + var(--bar))*var(--baz))}.class23{width:calc(var(--foo)*calc(var(--bar) + var(--baz)))}.class24{width:calc(calc(var(--foo) + var(--bar))/var(--baz))}.class25{width:calc(var(--foo)/calc(var(--bar) + var(--baz)))}

View File

@ -1 +1 @@
@media(min-width:20px){.class1{color:red}}@media(min-width:20px){.class1{color:red}}@media(color:1){.class1{color:red}}@media(min-width:0){.class1{color:red}}@media(min-width:0){.class1{color:red}}
@media(min-width:20px){.class1{color:red}}@media(color:1){.class1{color:red}}@media(min-width:0){.class1{color:red}}

View File

@ -1 +1 @@
.class1{width:2px}.class2{width:2px;height:5px}.class3{width:1.5rem}.class4{width:2em}.class5{width:calc(2ex/2)}.class6{width:60px}.class7{width:calc(-0px + 100%)}.class8{width:calc(200px - 100%)}.class9{width:2px}.class10{width:2px}.class11{width:3rem}.class12{width:calc(100% + 1px)}.class13{width:calc(2rem - .14285em)}@supports(width:calc(100% - constant(safe-area-inset-left))){.class14{width:calc(100% - constant(safe-area-inset-left))}}.class15{width:calc(100% + 1163.5px - 75.37%)}.class16{width:calc(((100% + 123.5px)/.7537 - 100vw + 60px)/2 + 30px)}.class17{width:calc(75.37% - 763.5px)}.class18{width:calc(1163.5px - 10%)}.class19{width:calc((0em - 10px)/2)}.class20{width:200px}.class21{width:0}.class22{width:200px}.class23{width:calc(200px/1)}.class24{width:-200px}.class25{width:0}.class26{width:-200px}.class27{width:calc(200px/-1)}.class28{width:200px}.class29{width:200px}.class30{width:200px}.class31{width:22px}.class32{width:200px}.class33{width:22e9px}.class34{width:90px}.class35{width:100%}.class36{width:22px}.class37{width:200px}
.class1{width:2px}.class2{width:2px;height:5px}.class3{width:1.5rem}.class4{width:2em}.class5{width:calc(2ex/2)}.class6{width:60px}.class7{width:calc(-0px + 100%)}.class8{width:calc(200px - 100%)}.class9{width:2px}.class10{width:2px}.class11{width:3rem}.class12{width:calc(100% + 1px)}.class13{width:calc(2rem - .14285em)}@supports(width:calc(100% - constant(safe-area-inset-left))){.class14{width:calc(100% - constant(safe-area-inset-left))}}.class15{width:calc(100% + 1163.5px - 75.37%)}.class16{width:calc(((100% + 123.5px)/.7537 - 100vw + 60px)/2 + 30px)}.class17{width:calc(75.37% - 763.5px)}.class18{width:calc(1163.5px - 10%)}.class19{width:calc((0em - 10px)/2)}.class20{width:200px}.class21{width:0}.class22{width:200px}.class23{width:calc(200px/1)}.class24{width:-200px}.class25{width:0}.class26{width:-200px}.class27{width:calc(200px/-1)}.class28,.class29,.class30{width:200px}.class31{width:22px}.class32{width:200px}.class33{width:22e9px}.class34{width:90px}.class35{width:100%}.class36{width:22px}.class37{width:200px}

View File

@ -1 +1 @@
@supports(width:calc(100px + 100px)){div{background:red}}@supports(width:calc(100px + 100px)){div{background:red}}@supports(width:calc(0px*100)){div{background:red}}@supports(width:calc(0px + 0px)){div{background:red}}@supports(width:calc(100px*sqrt(9))){div{background:red}}
@supports(width:calc(100px + 100px)){div{background:red}}@supports(width:calc(0px*100)){div{background:red}}@supports(width:calc(0px + 0px)){div{background:red}}@supports(width:calc(100px*sqrt(9))){div{background:red}}

View File

@ -1 +1 @@
.class1{width:calc(1px + 1)}.class2{width:calc(100% - 180px)}.class3{width:calc(100% - 30px)}.class4{width:.95s}.class5{width:calc(99.99%*1/1 - 0rem)}.class6{width:calc(55% + 5em)}.class7{width:calc(50px - 0em)}.class8{width:0}.class8{width:0}
.class1{width:calc(1px + 1)}.class2{width:calc(100% - 180px)}.class3{width:calc(100% - 30px)}.class4{width:.95s}.class5{width:calc(99.99%*1/1 - 0rem)}.class6{width:calc(55% + 5em)}.class7{width:calc(50px - 0em)}.class8{width:0}

View File

@ -1 +1 @@
.class1{width:2px}.class2{width:2px}.class3{width:-webkit-calc(50% - 25px)}.class4{width:-webkit-calc(1px + 2px/2)}.class5{width:2px}.class6{width:2px}
.class1,.class2{width:2px}.class3{width:-webkit-calc(50% - 25px)}.class4{width:-webkit-calc(1px + 2px/2)}.class5,.class6{width:2px}

View File

@ -1 +1 @@
.color{color:rgb(from rgba(0,0,0,0)255 255 255)}.color-1{color:rgb(from red 255 255 255)}.color-2{color:rgb(from red 255 255 255)}.color-3{color:rgb(from#f00 255 255 255)}.color-4{color:rgb(from#eee8aa 255 255 255)}.color-5{color:rgb(from#ff0 255 255 255)}.color-6{color:rgb(from snow 255 255 255)}.color-7{color:rgba(123,123,123,0)}.color-8{color:#7b7b7b}.color-9{color:#7b7b7b}.color-10{color:#7b7b7b}.color-11{color:#7b7b7b}.color-12{color:rgba(51,102,77,.23)}.color-13{color:#7b7b7b}.color-14{color:#6496c8}.class-15{color:#7b7b7b}.class-16{color:rgba(123,123,123,.99)}.class-17{color:#7b7b7b}.class-18{color:rgba(179,82,31,.13)}.class-19{color:rgba(180,82,31,.13)}.class-20{color:rgba(181,82,31,.13)}.class-21{color:rgba(182,82,31,.13)}.class-22{color:rgba(184,82,31,.13)}.class-23{color:rgba(181,181,181,.13)}.class-24{color:rgba(182,181,181,.13)}.class-25{color:rgba(181,181,181,.1%)}.class-26{color:rgba(181,181,181,.4%)}.color-27{color:rgb(from#eee8aa 255 255 255)}.color-28{color:rgb(from teal 255 255 255)}.color-29{color:rgb(from red 255 255 255)}.color-30{color:rgb(from red 255 255 255)}.class-31{color:#ff0800;color:gray;color:#000;color:#80ff00;color:#a6ff00;color:#f9ff00;color:#80ff00;color:red;color:red;color:red;color:#00ffae;color:red;color:#ff00bf;color:#8000ff;color:#0040ff;color:#0ff;color:#00ff40;color:#80ff00;color:#ffbf00;color:red;color:red;color:#ff00bf;color:rgba(128,0,255,.5);color:rgba(0,64,255,.5);color:rgba(0,255,255,.5);color:rgba(0,255,64,.5);color:rgba(128,255,0,.5);color:rgba(255,191,0,.5);color:rgba(255,0,0,.5);color:red;color:#ff00bf;color:#8000ff;color:#0040ff;color:#0ff;color:#00ff40;color:#80ff00;color:#ffbf00;color:red;color:red;color:#ff00bf;color:rgba(128,0,255,.5);color:rgba(0,64,255,.5);color:rgba(0,255,255,.5);color:rgba(0,255,64,.5);color:rgba(128,255,0,.5);color:rgba(255,191,0,.5);color:rgba(255,0,0,.5);color:#ff0400;color:#ff0800;color:#ff0d00}.class-32{color:gray;color:#4d7f4d;color:#fff;color:#fd3;color:#ccb333;color:green;color:#000;color:gray;color:#33b333;color:gray;color:gray;color:hwb(90deg 50%50%,.2);color:gray;color:hwb(90 50%50%.2);color:#6b8056;color:#4d7f4d;color:rgba(77,127,77,.5);color:red;color:red;color:rgba(255,0,0,0);color:rgba(255,0,0,0);color:#0f0;color:#0f0;color:#cfc;color:#cfc;color:green;color:green;color:rgba(77,127,77,0);color:rgba(77,127,77,0);color:rgba(170,170,170,0);color:rgba(170,170,170,0);color:#4d7f4d}.class-33{color:red}.class-34{color:rgba(2,3,4,.5)}.class-35{color:rgba(2,3,4,.5)}.class-36{color:#0f0}.class-37{color:rgba(0,255,0,.25)}.class-38{color:#000304}.class-39{color:#64c8ff}.class-40{color:rgba(20,10,0,0)}.class-41{color:#fff}.class-41{color:#000}.class-42{color:rgba(0,0,0,0)}.class-43{color:maroon}.class-44{color:rgba(128,0,0,0)}.class-45{color:rgba(0,0,0,.5)}.class-46{color:#300}.class-47{color:rgba(51,0,0,0)}.class-48{color:rgba(0,0,0,.5)}.class-49{color:#000}.class-50{color:rgba(0,0,0,0)}.class-51{color:maroon}.class-52{color:rgba(128,0,0,0)}.class-53{color:rgba(0,0,0,.5)}.class-54{color:#300}.class-55{color:rgba(51,0,0,0)}.class-56{color:rgba(0,0,0,.5)}.class-57{color:#59a659}.class-58{color:rgba(77,127,77,.5)}.class-59{color:red}.class-60{color:red}.class-61{color:rgba(255,0,0,0)}.class-62{color:rgba(255,0,0,0)}.class-63{color:#0f0}.class-64{color:#0f0}.class-65{color:#cfc}.class-66{color:#cfc}.class-67{color:green}.class-68{color:green}.class-69{color:rgba(77,127,77,0)}.class-70{color:rgba(77,127,77,0)}.class-71{color:rgba(170,170,170,0)}.class-72{color:rgba(170,170,170,0)}.class-73{color:#fff}.class-74{color:#000}.class-75{color:#fff}.class-76{color:#000}.class-77{color:#000}.class-78{color:#000}.class-79{color:#fff}.class-80{color:#646464}.class-81{color:#646464}.class-82{color:rgba(100,100,100,0)}.class-83{color:rgba(100,100,100,0)}
.color{color:rgb(from rgba(0,0,0,0)255 255 255)}.color-1,.color-2{color:rgb(from red 255 255 255)}.color-3{color:rgb(from#f00 255 255 255)}.color-4{color:rgb(from#eee8aa 255 255 255)}.color-5{color:rgb(from#ff0 255 255 255)}.color-6{color:rgb(from snow 255 255 255)}.color-7{color:rgba(123,123,123,0)}.color-8,.color-9,.color-10,.color-11{color:#7b7b7b}.color-12{color:rgba(51,102,77,.23)}.color-13{color:#7b7b7b}.color-14{color:#6496c8}.class-15{color:#7b7b7b}.class-16{color:rgba(123,123,123,.99)}.class-17{color:#7b7b7b}.class-18{color:rgba(179,82,31,.13)}.class-19{color:rgba(180,82,31,.13)}.class-20{color:rgba(181,82,31,.13)}.class-21{color:rgba(182,82,31,.13)}.class-22{color:rgba(184,82,31,.13)}.class-23{color:rgba(181,181,181,.13)}.class-24{color:rgba(182,181,181,.13)}.class-25{color:rgba(181,181,181,.1%)}.class-26{color:rgba(181,181,181,.4%)}.color-27{color:rgb(from#eee8aa 255 255 255)}.color-28{color:rgb(from teal 255 255 255)}.color-29,.color-30{color:rgb(from red 255 255 255)}.class-31{color:#ff0800;color:gray;color:#000;color:#80ff00;color:#a6ff00;color:#f9ff00;color:#80ff00;color:red;color:red;color:red;color:#00ffae;color:red;color:#ff00bf;color:#8000ff;color:#0040ff;color:#0ff;color:#00ff40;color:#80ff00;color:#ffbf00;color:red;color:red;color:#ff00bf;color:rgba(128,0,255,.5);color:rgba(0,64,255,.5);color:rgba(0,255,255,.5);color:rgba(0,255,64,.5);color:rgba(128,255,0,.5);color:rgba(255,191,0,.5);color:rgba(255,0,0,.5);color:red;color:#ff00bf;color:#8000ff;color:#0040ff;color:#0ff;color:#00ff40;color:#80ff00;color:#ffbf00;color:red;color:red;color:#ff00bf;color:rgba(128,0,255,.5);color:rgba(0,64,255,.5);color:rgba(0,255,255,.5);color:rgba(0,255,64,.5);color:rgba(128,255,0,.5);color:rgba(255,191,0,.5);color:rgba(255,0,0,.5);color:#ff0400;color:#ff0800;color:#ff0d00}.class-32{color:gray;color:#4d7f4d;color:#fff;color:#fd3;color:#ccb333;color:green;color:#000;color:gray;color:#33b333;color:gray;color:gray;color:hwb(90deg 50%50%,.2);color:gray;color:hwb(90 50%50%.2);color:#6b8056;color:#4d7f4d;color:rgba(77,127,77,.5);color:red;color:red;color:rgba(255,0,0,0);color:rgba(255,0,0,0);color:#0f0;color:#0f0;color:#cfc;color:#cfc;color:green;color:green;color:rgba(77,127,77,0);color:rgba(77,127,77,0);color:rgba(170,170,170,0);color:rgba(170,170,170,0);color:#4d7f4d}.class-33{color:red}.class-34,.class-35{color:rgba(2,3,4,.5)}.class-36{color:#0f0}.class-37{color:rgba(0,255,0,.25)}.class-38{color:#000304}.class-39{color:#64c8ff}.class-40{color:rgba(20,10,0,0)}.class-41{color:#fff;color:#000}.class-42{color:rgba(0,0,0,0)}.class-43{color:maroon}.class-44{color:rgba(128,0,0,0)}.class-45{color:rgba(0,0,0,.5)}.class-46{color:#300}.class-47{color:rgba(51,0,0,0)}.class-48{color:rgba(0,0,0,.5)}.class-49{color:#000}.class-50{color:rgba(0,0,0,0)}.class-51{color:maroon}.class-52{color:rgba(128,0,0,0)}.class-53{color:rgba(0,0,0,.5)}.class-54{color:#300}.class-55{color:rgba(51,0,0,0)}.class-56{color:rgba(0,0,0,.5)}.class-57{color:#59a659}.class-58{color:rgba(77,127,77,.5)}.class-59,.class-60{color:red}.class-61,.class-62{color:rgba(255,0,0,0)}.class-63,.class-64{color:#0f0}.class-65,.class-66{color:#cfc}.class-67,.class-68{color:green}.class-69,.class-70{color:rgba(77,127,77,0)}.class-71,.class-72{color:rgba(170,170,170,0)}.class-73{color:#fff}.class-74{color:#000}.class-75{color:#fff}.class-76,.class-77,.class-78{color:#000}.class-79{color:#fff}.class-80,.class-81{color:#646464}.class-82,.class-83{color:rgba(100,100,100,0)}

View File

@ -1 +1 @@
.class-1{border-bottom-left-radius:40px}.class-2{border-bottom-left-radius:40px}.class-3{border-bottom-left-radius:50%}
.class-1,.class-2{border-bottom-left-radius:40px}.class-3{border-bottom-left-radius:50%}

View File

@ -1 +1 @@
.class-1{border-bottom-right-radius:40px}.class-2{border-bottom-right-radius:40px}.class-3{border-bottom-right-radius:50%}
.class-1,.class-2{border-bottom-right-radius:40px}.class-3{border-bottom-right-radius:50%}

View File

@ -1 +1 @@
.class-1{border-spacing:2px}.class-2{border-spacing:1cm 2em}.class-3{border-spacing:1cm}.class-4{border-spacing:1cm}.class-5{border-spacing:0 1cm}.class-6{border-spacing:0}.class-7{border-spacing:0}
.class-1{border-spacing:2px}.class-2{border-spacing:1cm 2em}.class-3,.class-4{border-spacing:1cm}.class-5{border-spacing:0 1cm}.class-6{border-spacing:0}.class-7{border-spacing:0}

View File

@ -1 +1 @@
.class-1{border-top-left-radius:40px}.class-2{border-top-left-radius:40px}.class-3{border-top-left-radius:50%}
.class-1,.class-2{border-top-left-radius:40px}.class-3{border-top-left-radius:50%}

View File

@ -1 +1 @@
.class-1{border-top-right-radius:40px}.class-2{border-top-right-radius:40px}.class-3{border-top-right-radius:50%}
.class-1,.class-2{border-top-right-radius:40px}.class-3{border-top-right-radius:50%}

View File

@ -1 +1 @@
.class-1{border-width:0 1px}.class-2{border-width:1px 2em 0 4rem}.class-3{border-width:1px 2em 1.5cm}.class-4{border-width:thin}.class-5{border-width:2px}.class-6{border-width:2px}.class-7{border-width:2px}.class-8{border-width:2px 0}.class-9{border-width:0}
.class-1{border-width:0 1px}.class-2{border-width:1px 2em 0 4rem}.class-3{border-width:1px 2em 1.5cm}.class-4{border-width:thin}.class-5,.class-6,.class-7{border-width:2px}.class-8{border-width:2px 0}.class-9{border-width:0}

View File

@ -1 +1 @@
.class1{display:block}.class2{display:BLOCK}.class3{display:block}.class4{display:BLOCK}.class5{display:flow-root}.class6{display:inline}.class7{display:inline-block}.class8{display:run-in}.class9{display:list-item}.class10{display:list-item}.class11{display:list-item}.class12{display:inline list-item}.class13{display:inline flow-root list-item}.class14{display:inline list-item}.class15{display:flow-root list-item}.class16{display:flex}.class17{display:inline flex}.class18{display:grid}.class19{display:inline grid}.class20{display:ruby}.class21{display:block ruby}.class22{display:table}.class23{display:inline table}.class23{display:block}.class23{display:inline}.class23{display:inline-block}.class23{display:flex}.class23{display:inline-flex}.class23{display:grid}.class23{display:inline-grid}.class23{display:flow-root}.class23{display:none}.class23{display:contents}.class23{display:table-row}.class23{display:inherit}.class23{display:initial}.class23{display:revert}.class23{display:unset}.class24{display:-webkit-flex}.class25{display:-moz-box}
.class1{display:block}.class2{display:BLOCK}.class3{display:block}.class4{display:BLOCK}.class5{display:flow-root}.class6{display:inline}.class7{display:inline-block}.class8{display:run-in}.class9,.class10,.class11{display:list-item}.class12{display:inline list-item}.class13{display:inline flow-root list-item}.class14{display:inline list-item}.class15{display:flow-root list-item}.class16{display:flex}.class17{display:inline flex}.class18{display:grid}.class19{display:inline grid}.class20{display:ruby}.class21{display:block ruby}.class22{display:table}.class23{display:inline table;display:block;display:inline;display:inline-block;display:flex;display:inline-flex;display:grid;display:inline-grid;display:flow-root;display:none;display:contents;display:table-row;display:inherit;display:initial;display:revert;display:unset}.class24{display:-webkit-flex}.class25{display:-moz-box}

View File

@ -1 +1 @@
.class1{font-weight:1}.class1{font-weight:400}.class1{font-weight:1000}.class2{font-weight:400}.class3{font-weight:700}.class3{font-weight:700}.class4{font-weight:400 700}.class5{font-weight:600 700}
.class1{font-weight:1;font-weight:400;font-weight:1000}.class2{font-weight:400}.class3{font-weight:700;font-weight:700}.class4{font-weight:400 700}.class5{font-weight:600 700}

View File

@ -1 +1 @@
.class-1{inset-block:10px}.class-2{inset-block:1em .5em}.class-3{inset-block:inherit}.class-4{inset-block:10px}.class-5{inset-block:1rem}.class-9{inset-block:auto}.class-10{inset-block:auto}
.class-1{inset-block:10px}.class-2{inset-block:1em .5em}.class-3{inset-block:inherit}.class-4{inset-block:10px}.class-5{inset-block:1rem}.class-9,.class-10{inset-block:auto}

View File

@ -1 +1 @@
.class-1{inset-inline:10px}.class-2{inset-inline:1em .5em}.class-3{inset-inline:inherit}.class-4{inset-inline:10px}.class-5{inset-inline:1rem}.class-9{inset-inline:auto}.class-10{inset-inline:auto}
.class-1{inset-inline:10px}.class-2{inset-inline:1em .5em}.class-3{inset-inline:inherit}.class-4{inset-inline:10px}.class-5{inset-inline:1rem}.class-9,.class-10{inset-inline:auto}

View File

@ -1 +1 @@
.class1{inset:20px}.class2{inset:20px 21px 22px 23px}.class4{inset:20px 21px 22px}.class5{inset:20px 21px}.class6{inset:20px}.class7{inset:20px 21px}.class8{inset:20px}.class10{inset:20px}.class11{inset:20px 20px 21px}.class12{inset:var(--inset)}.class13{inset:20px var(--inset)}.class14{inset:20px 20px var(--inset)}.class15{inset:20px 20px 20px var(--inset)}.class16{inset:var(--inset)}.class17{inset:var(--inset)var(--inset)}.class18{inset:var(--inset)var(--inset)var(--inset)var(--inset)}.class19{inset:20px}.class20{inset:20px 3em}.class-21{inset:10%5%5%}
.class1{inset:20px}.class2{inset:20px 21px 22px 23px}.class4{inset:20px 21px 22px}.class5{inset:20px 21px}.class6{inset:20px}.class7{inset:20px 21px}.class8,.class10{inset:20px}.class11{inset:20px 20px 21px}.class12{inset:var(--inset)}.class13{inset:20px var(--inset)}.class14{inset:20px 20px var(--inset)}.class15{inset:20px 20px 20px var(--inset)}.class16{inset:var(--inset)}.class17{inset:var(--inset)var(--inset)}.class18{inset:var(--inset)var(--inset)var(--inset)var(--inset)}.class19{inset:20px}.class20{inset:20px 3em}.class-21{inset:10%5%5%}

View File

@ -1 +1 @@
.class-1{margin-inline:10px}.class-2{margin-inline:1em .5em}.class-3{margin-inline:inherit}.class-4{margin-inline:10px}.class-5{margin-inline:1rem}.class-9{margin-inline:auto}.class-10{margin-inline:auto}
.class-1{margin-inline:10px}.class-2{margin-inline:1em .5em}.class-3{margin-inline:inherit}.class-4{margin-inline:10px}.class-5{margin-inline:1rem}.class-9,.class-10{margin-inline:auto}

View File

@ -1 +1 @@
.class1{margin:20px}.class2{margin:20px 21px 22px 23px}.class4{margin:20px 21px 22px}.class5{margin:20px 21px}.class6{margin:20px}.class7{margin:20px 21px}.class8{margin:20px}.class10{margin:20px}.class11{margin:20px 20px 21px}.class12{margin:var(--margin)}.class13{margin:20px var(--margin)}.class14{margin:20px 20px var(--margin)}.class15{margin:20px 20px 20px var(--margin)}.class16{margin:var(--margin)}.class17{margin:var(--margin)var(--margin)}.class18{margin:var(--margin)var(--margin)var(--margin)var(--margin)}.class19{margin:20px}.class20{margin:20px 3em}
.class1{margin:20px}.class2{margin:20px 21px 22px 23px}.class4{margin:20px 21px 22px}.class5{margin:20px 21px}.class6{margin:20px}.class7{margin:20px 21px}.class8,.class10{margin:20px}.class11{margin:20px 20px 21px}.class12{margin:var(--margin)}.class13{margin:20px var(--margin)}.class14{margin:20px 20px var(--margin)}.class15{margin:20px 20px 20px var(--margin)}.class16{margin:var(--margin)}.class17{margin:var(--margin)var(--margin)}.class18{margin:var(--margin)var(--margin)var(--margin)var(--margin)}.class19{margin:20px}.class20{margin:20px 3em}

View File

@ -1 +1 @@
.class-1{padding-inline:10px}.class-2{padding-inline:1em .5em}.class-3{padding-inline:inherit}.class-4{padding-inline:10px}.class-5{padding-inline:1rem}.class-9{padding-inline:auto}.class-10{padding-inline:auto}
.class-1{padding-inline:10px}.class-2{padding-inline:1em .5em}.class-3{padding-inline:inherit}.class-4{padding-inline:10px}.class-5{padding-inline:1rem}.class-9,.class-10{padding-inline:auto}

View File

@ -1 +1 @@
.class1{padding:20px}.class2{padding:20px 21px 22px 23px}.class4{padding:20px 21px 22px}.class5{padding:20px 21px}.class6{padding:20px}.class7{padding:20px 21px}.class8{padding:20px}.class10{padding:20px}.class11{padding:20px 20px 21px}.class12{padding:var(--padding)}.class13{padding:20px var(--padding)}.class14{padding:20px 20px var(--padding)}.class15{padding:20px 20px 20px var(--padding)}.class16{padding:var(--padding)}.class17{padding:var(--padding)var(--padding)}.class18{padding:var(--padding)var(--padding)var(--padding)var(--padding)}.class19{padding:20px}.class20{padding:20px 3em}
.class1{padding:20px}.class2{padding:20px 21px 22px 23px}.class4{padding:20px 21px 22px}.class5{padding:20px 21px}.class6{padding:20px}.class7{padding:20px 21px}.class8,.class10{padding:20px}.class11{padding:20px 20px 21px}.class12{padding:var(--padding)}.class13{padding:20px var(--padding)}.class14{padding:20px 20px var(--padding)}.class15{padding:20px 20px 20px var(--padding)}.class16{padding:var(--padding)}.class17{padding:var(--padding)var(--padding)}.class18{padding:var(--padding)var(--padding)var(--padding)var(--padding)}.class19{padding:20px}.class20{padding:20px 3em}

View File

@ -1 +1 @@
.class1{scroll-margin:20px}.class2{scroll-margin:20px 21px 22px 23px}.class4{scroll-margin:20px 21px 22px}.class5{scroll-margin:20px 21px}.class6{scroll-margin:20px}.class7{scroll-margin:20px 21px}.class8{scroll-margin:20px}.class10{scroll-margin:20px}.class11{scroll-margin:20px 20px 21px}.class12{scroll-margin:var(--scroll-margin)}.class13{scroll-margin:20px var(--scroll-margin)}.class14{scroll-margin:20px 20px var(--scroll-margin)}.class15{scroll-margin:20px 20px 20px var(--scroll-margin)}.class16{scroll-margin:var(--scroll-margin)}.class17{scroll-margin:var(--scroll-margin)var(--scroll-margin)}.class18{scroll-margin:var(--scroll-margin)var(--scroll-margin)var(--scroll-margin)var(--scroll-margin)}.class19{scroll-margin:20px}.class20{scroll-margin:20px 3em}
.class1{scroll-margin:20px}.class2{scroll-margin:20px 21px 22px 23px}.class4{scroll-margin:20px 21px 22px}.class5{scroll-margin:20px 21px}.class6{scroll-margin:20px}.class7{scroll-margin:20px 21px}.class8,.class10{scroll-margin:20px}.class11{scroll-margin:20px 20px 21px}.class12{scroll-margin:var(--scroll-margin)}.class13{scroll-margin:20px var(--scroll-margin)}.class14{scroll-margin:20px 20px var(--scroll-margin)}.class15{scroll-margin:20px 20px 20px var(--scroll-margin)}.class16{scroll-margin:var(--scroll-margin)}.class17{scroll-margin:var(--scroll-margin)var(--scroll-margin)}.class18{scroll-margin:var(--scroll-margin)var(--scroll-margin)var(--scroll-margin)var(--scroll-margin)}.class19{scroll-margin:20px}.class20{scroll-margin:20px 3em}

View File

@ -1 +1 @@
.class1{scroll-padding:20px}.class2{scroll-padding:20px 21px 22px 23px}.class4{scroll-padding:20px 21px 22px}.class5{scroll-padding:20px 21px}.class6{scroll-padding:20px}.class7{scroll-padding:20px 21px}.class8{scroll-padding:20px}.class10{scroll-padding:20px}.class11{scroll-padding:20px 20px 21px}.class12{scroll-padding:var(--scroll-padding)}.class13{scroll-padding:20px var(--scroll-padding)}.class14{scroll-padding:20px 20px var(--scroll-padding)}.class15{scroll-padding:20px 20px 20px var(--scroll-padding)}.class16{scroll-padding:var(--scroll-padding)}.class17{scroll-padding:var(--scroll-padding)var(--scroll-padding)}.class18{scroll-padding:var(--scroll-padding)var(--scroll-padding)var(--scroll-padding)var(--scroll-padding)}.class19{scroll-padding:20px}.class20{scroll-padding:20px 3em}.class21{scroll-padding:10%}.class22{scroll-padding:10%20%}.class23{scroll-padding:10%}
.class1{scroll-padding:20px}.class2{scroll-padding:20px 21px 22px 23px}.class4{scroll-padding:20px 21px 22px}.class5{scroll-padding:20px 21px}.class6{scroll-padding:20px}.class7{scroll-padding:20px 21px}.class8,.class10{scroll-padding:20px}.class11{scroll-padding:20px 20px 21px}.class12{scroll-padding:var(--scroll-padding)}.class13{scroll-padding:20px var(--scroll-padding)}.class14{scroll-padding:20px 20px var(--scroll-padding)}.class15{scroll-padding:20px 20px 20px var(--scroll-padding)}.class16{scroll-padding:var(--scroll-padding)}.class17{scroll-padding:var(--scroll-padding)var(--scroll-padding)}.class18{scroll-padding:var(--scroll-padding)var(--scroll-padding)var(--scroll-padding)var(--scroll-padding)}.class19{scroll-padding:20px}.class20{scroll-padding:20px 3em}.class21{scroll-padding:10%}.class22{scroll-padding:10%20%}.class23{scroll-padding:10%}

View File

@ -1 +1 @@
.class-1{animation:fade 3s cubic-bezier(.25,.1,.25,1)}.class-2{animation-timing-function:cubic-bezier(.25,.1,.25,1)}.class-3{transition:fade 3s cubic-bezier(.25,.1,.25,1)}.class-4{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-5{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-6{foo:cubic-bezier(.25,.1,.25,1,0,0,0,0)}.class-7{transition-timing-function:cubic-bezier(0,0,1,1)}.class-8{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-9{transition-timing-function:cubic-bezier(.42,0,1,1)}.class-10{transition-timing-function:cubic-bezier(0,0,.58,1)}.class-11{transition-timing-function:cubic-bezier(.42,0,.58,1)}.class-12{transition-timing-function:steps(1,start)}.class-12{transition-timing-function:steps(1,START)}.class-13{transition-timing-function:steps(1,start)}.class-14{transition-timing-function:steps(1,jump-start)}.class-15{transition-timing-function:steps(1,JUMP-START)}.class-16{transition-timing-function:steps(1,jump-start)}.class-17{transition-timing-function:steps(1,end)}.class-18{transition-timing-function:steps(1,END)}.class-19{transition-timing-function:steps(1,end)}.class-20{transition-timing-function:steps(1,jump-end)}.class-21{transition-timing-function:steps(1,JUMP-END)}.class-22{transition-timing-function:steps(1,jump-end)}.class-23{transition-timing-function:steps(1)}.class-24{transition-timing-functionf:steps(1,end)}.class-25{transition-timing-function:steps(1)}.class-26{transition-timing-function:steps(5,start)}.class-27{transition-timing-function:steps(5,jump-start)}.class-28{transition-timing-function:steps(10,end)}.class-29{transition-timing-function:steps(10,jump-end)}.class-30{transition-timing-function:steps(15)}.class-31{transition-timing-function:cubic-bezier(0,0,1,1)}.class-32{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-33{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-34{animation-timing-function:cubic-bezier(0,0,1,1),cubic-bezier(0,0,1,1),steps(1,start)}.class-35{animation-timing-function:cubic-bezier()}.class-36{animation-timing-function:steps()}.class-37{animation-timing-function:cubic-bezier(var(--foo),var(--bar),var(--baz),var(--foz))}.class-38{animation-timing-function:cubic-bezier(.25,var(--foo),.25,1)}
.class-1{animation:fade 3s cubic-bezier(.25,.1,.25,1)}.class-2{animation-timing-function:cubic-bezier(.25,.1,.25,1)}.class-3{transition:fade 3s cubic-bezier(.25,.1,.25,1)}.class-4{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-5{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-6{foo:cubic-bezier(.25,.1,.25,1,0,0,0,0)}.class-7{transition-timing-function:cubic-bezier(0,0,1,1)}.class-8{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-9{transition-timing-function:cubic-bezier(.42,0,1,1)}.class-10{transition-timing-function:cubic-bezier(0,0,.58,1)}.class-11{transition-timing-function:cubic-bezier(.42,0,.58,1)}.class-12{transition-timing-function:steps(1,start);transition-timing-function:steps(1,START)}.class-13{transition-timing-function:steps(1,start)}.class-14{transition-timing-function:steps(1,jump-start)}.class-15{transition-timing-function:steps(1,JUMP-START)}.class-16{transition-timing-function:steps(1,jump-start)}.class-17{transition-timing-function:steps(1,end)}.class-18{transition-timing-function:steps(1,END)}.class-19{transition-timing-function:steps(1,end)}.class-20{transition-timing-function:steps(1,jump-end)}.class-21{transition-timing-function:steps(1,JUMP-END)}.class-22{transition-timing-function:steps(1,jump-end)}.class-23{transition-timing-function:steps(1)}.class-24{transition-timing-functionf:steps(1,end)}.class-25{transition-timing-function:steps(1)}.class-26{transition-timing-function:steps(5,start)}.class-27{transition-timing-function:steps(5,jump-start)}.class-28{transition-timing-function:steps(10,end)}.class-29{transition-timing-function:steps(10,jump-end)}.class-30{transition-timing-function:steps(15)}.class-31{transition-timing-function:cubic-bezier(0,0,1,1)}.class-32,.class-33{transition-timing-function:cubic-bezier(.25,.1,.25,1)}.class-34{animation-timing-function:cubic-bezier(0,0,1,1),cubic-bezier(0,0,1,1),steps(1,start)}.class-35{animation-timing-function:cubic-bezier()}.class-36{animation-timing-function:steps()}.class-37{animation-timing-function:cubic-bezier(var(--foo),var(--bar),var(--baz),var(--foz))}.class-38{animation-timing-function:cubic-bezier(.25,var(--foo),.25,1)}

View File

@ -1 +1 @@
.class1{width:0}.class2{width:100px}.class3{width:100px}.class4{width:100px}.class5{padding:1in 0 0}.class6{padding:calc(var(--foo,0px) + 10px)0 calc(var(--foo,0px) + 10px)}.class7{padding:max(10px,var(--foo,0px))0 max(10px,var(--foo,0px))}.class8{right:max(100vw,0rem)}.class9{right:max(100vw,0rem)}.class10{top:0}@media(min-width:0){.foo{color:red}}@media(min-width:0){.bar{color:red}}.class11{font:normal normal 400 0/0 cursive}.class12{grid-template-columns:repeat(2,50px 0)100px}.class13{margin:0}.class14{transform:translate(0)}.class15{padding:min(1vw,0in)max(1vw,0px)clamp(0em,1vw,10px)0}.class16{padding:1px 0 2px 3px}.class17{padding:1px 2px 0 3px}.class18{width:0}.class19{width:0}.class20{top:0}.class21{width:0}.class22{width:.1mm}.class23{width:10cm}.class24{width:100cm}.class25{width:123mm}.class26{width:0}.class27{width:1cm}.class28{width:10cm}.class29{width:100cm}.class30{width:1mm}.class31{width:.123cm}.class32{width:.1mm}.class33{width:1.123cm}.class34{width:1q}.class35{width:40q}.class38{width:.25mm}.class39{width:1in}.class40{width:1in}.class41{width:2in}.class42{width:7.2pt}.class44{width:.72pt}.class45{width:1pc}.class46{width:1.2pt}.class47{width:.12pt}.class48{width:1in}.class49{width:2in}.class50{width:.6pc}.class51{width:1in}.class52{width:1mm}.class53{width:1in}.class54{width:1in}.class55{width:.5mm}.class56{width:80q}.class57{width:3cm}.class58{width:1px}.class59{width:4q}.class80{width:8q}.class81{width:12q}.class82{width:96q}.class83{width:.254cm}.class84{margin:-1px}.class85{width:1in}.class86{width:.254cm}.class87{width:.254mm}.class88{width:.025400000000000002mm}.class89{width:.00254mm}.class88{width:.6pc}.class89{width:1px}.class90{width:.075pt}@media(min-width:0){.class1{color:red}}@media(min-width:0){.class1{color:red}}@container(inline-size>=0){h2{font-size:calc(1.2em + 1cqi)}}@container(inline-size>=0){h2{font-size:calc(1.2em + 1cqi)}}
.class1{width:0}.class2,.class3,.class4{width:100px}.class5{padding:1in 0 0}.class6{padding:calc(var(--foo,0px) + 10px)0 calc(var(--foo,0px) + 10px)}.class7{padding:max(10px,var(--foo,0px))0 max(10px,var(--foo,0px))}.class8,.class9{right:max(100vw,0rem)}.class10{top:0}@media(min-width:0){.foo,.bar{color:red}}.class11{font:normal normal 400 0/0 cursive}.class12{grid-template-columns:repeat(2,50px 0)100px}.class13{margin:0}.class14{transform:translate(0)}.class15{padding:min(1vw,0in)max(1vw,0px)clamp(0em,1vw,10px)0}.class16{padding:1px 0 2px 3px}.class17{padding:1px 2px 0 3px}.class18,.class19{width:0}.class20{top:0}.class21{width:0}.class22{width:.1mm}.class23{width:10cm}.class24{width:100cm}.class25{width:123mm}.class26{width:0}.class27{width:1cm}.class28{width:10cm}.class29{width:100cm}.class30{width:1mm}.class31{width:.123cm}.class32{width:.1mm}.class33{width:1.123cm}.class34{width:1q}.class35{width:40q}.class38{width:.25mm}.class39,.class40{width:1in}.class41{width:2in}.class42{width:7.2pt}.class44{width:.72pt}.class45{width:1pc}.class46{width:1.2pt}.class47{width:.12pt}.class48{width:1in}.class49{width:2in}.class50{width:.6pc}.class51{width:1in}.class52{width:1mm}.class53,.class54{width:1in}.class55{width:.5mm}.class56{width:80q}.class57{width:3cm}.class58{width:1px}.class59{width:4q}.class80{width:8q}.class81{width:12q}.class82{width:96q}.class83{width:.254cm}.class84{margin:-1px}.class85{width:1in}.class86{width:.254cm}.class87{width:.254mm}.class88{width:.025400000000000002mm}.class89{width:.00254mm}.class88{width:.6pc}.class89{width:1px}.class90{width:.075pt}@media(min-width:0){.class1{color:red}}@container(inline-size>=0){h2{font-size:calc(1.2em + 1cqi)}}

View File

@ -0,0 +1,461 @@
a {color: blue;font-weight: bold} p {color: blue;font-weight: bold}
.break { color: red; }
h1{color:red;line-height:1.5;font-size:2em}h2{color:red;line-height:1.5;font-size:2em}
.break { color: red; }
h1{color:red;line-height:1.5;font-size:2em}h2{font-size:2em;color:red;line-height:1.5}
.break { color: red; }
h1{color:red;line-height:1.5;font-size:2em}h2{color:red;line-height:1.5;font-size:2em}h3{color:red;line-height:1.5;font-size:2em}
.break { color: red; }
h1{color:red;line-height:1.5;font-size:2em}h2{color:red;line-height:1.5;font-size:2em}h2{color:red;line-height:1.5;font-size:2em}
.break { color: red; }
h1 {color: blue}h1{font-weight: bold}
.break { color: red; }
h1{display:block}h1{text-decoration:underline}
.break { color: red; }
h1{color:red;display:block}h1{text-decoration:underline}
.break { color: red; }
h1{font-size:2em;color:#000}h1{background:#fff;line-height:1.5}
.break { color: red; }
@media print{h1{display:block}h1{color:red}}
.break { color: red; }
code::selection{background:red}code::-moz-selection{background:red}
.break { color: red; }
.foo { &.bar { color: red; } }.foo { &.bar { color: red; } }
.break { color: red; }
.foo { &.bar { color: red; } &.bar { color: red; } }
.break { color: red; }
.foo { @media screen { &.bar { color: red; } &.bar { color: red; }} }
.break { color: red; }
@media print{h1{display:block}p{display:block}}
.break { color: red; }
@media print{h1{color:red;text-decoration:none}h2{text-decoration:none}}h3{text-decoration:none}
.break { color: red; }
h3{text-decoration:none}@media print{h1{color:red;text-decoration:none}h2{text-decoration:none}}
.break { color: red; }
@media screen and (max-width:480px){h1{display:block}}@media screen and (min-width:480px){h2{display:block}}
.break { color: red; }
@media screen and (max-width:200px){h1{color:red}}@media screen and (min-width:480px){h1{display:block}}
.break { color: red; }
@-webkit-keyframes test{0%{color:#000}to{color:#fff}}@keyframes test{0%{color:#000}to{color:#fff}}
.break { color: red; }
h1{display:block}@media print{h1{color:red}}
.break { color: red; }
@media print{h1{display:block}}h1{color:red}
.break { color: red; }
h1{color:red}h2{color:red;text-decoration:underline}
.break { color: red; }
h1{color:red}h2{color:red;text-decoration:underline}h3{color:green;text-decoration:underline}
.break { color: red; }
h1{color:red;text-decoration:underline}h2{text-decoration:underline;color:green}h3{font-weight:bold;color:green}
.break { color: red; }
.test0{color:red;border:none;margin:0}.test1{color:green;border:none;margin:0}
.break { color: red; }
h1{color:red;font-weight:bold}h2{font-weight:bold}h3{text-decoration:none}
.break { color: red; }
.test-1,.test-2{margin-top:10px}.another-test{margin-top:10px;margin-bottom:30px}
.break { color: red; }
.test-1{margin-top:10px;margin-bottom:20px}.test-2{margin-top:10px}.another-test{margin-top:10px;margin-bottom:30px}
.break { color: red; }
.foo{margin:0;display:block}.barim{display:block;line-height:1}.bazaz{font-size:3em;margin:0}
.break { color: red; }
.foobam{font-family:serif;display:block}.barim{display:block;line-height:1}.bazaz{font-size:3em;font-family:serif}
.break { color: red; }
.foo{font-family:serif;display:block}.barim{display:block;line-height:1}.bazaz{font-size:3em;font-family:serif}
.break { color: red; }
h1{border:1px solid red;background-color:red;background-position:50% 100%}h1{border:1px solid red;background-color:red}h1{border:1px solid red}
.break { color: red; }
h1{color:black}h2{color:black;font-weight:bold}h3{color:black;font-weight:bold}
.break { color: red; }
.test0{color:red;border:none;margin:0}.longlonglonglong{color:green;border:none;margin:0}
.break { color: red; }
code::-moz-selection{background:red}code::-moz-selection{background:red}
.break { color: red; }
code:-ms-input-placeholder{background:red}code::-ms-input-placeholder{background:red}
.break { color: red; }
input[type=range] { -webkit-appearance: none !important; } input[type=range]::-webkit-slider-runnable-track { height: 2px; width: 100px; background: red; border: none; } input[type=range]::-webkit-slider-thumb { -webkit-appearance: none !important; border: none; width: 10px; height: 10px; background: red; } input[type=range]::-moz-range-thumb { border: none; width: 10px; height: 10px; background: red; }
.break { color: red; }
h1{color:red;text-align:right;text-decoration:underline}h2{text-align:right;text-decoration:underline}
.break { color: red; }
h1{color:red;text-align:right;text-decoration:underline}h2{text-align:right;text-decoration:underline;color:green}
.break { color: red; }
h1{background:white;color:red;text-align:right;text-decoration:underline}h2{text-align:right;text-decoration:underline;color:red}
.break { color: red; }
h1{color:red;text-align:center;text-transform:small-caps}h2{text-align:center;color:red}
.break { color: red; }
h1{text-align:left;text-transform:small-caps}h2{text-align:right;text-transform:small-caps}
.break { color: red; }
@keyframes a {0%{transform-origin:right bottom;transform:rotate(-90deg);opacity:0}100%{transform-origin:right bottom;transform:rotate(0);opacity:1}}
.break { color: red; }
h2{margin-bottom:20px}h1{margin:10px;margin-bottom:20px}
.break { color: red; }
h2{color:red;margin-bottom:20px}h1{color:red;margin:10px;margin-bottom:20px}
.break { color: red; }
h2{margin:0;margin-bottom:20px}h1{margin:0;margin-top:20px}
.break { color: red; }
h2{margin:0}h1{margin-top:20px;margin:0}
.break { color: red; }
.box1{display:inline-block;display:block}.box2{display:inline-block}
.break { color: red; }
h1{ & h2{} & h3{}}
.break { color: red; }
h1{display:block;display:block}h2{display:block;display:block}
.break { color: red; }
.a {-webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);-webkit-overflow-scrolling: touch}.b{-webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);}
.break { color: red; }
h1,h2{display:block}h2,h1{display:block}
.break { color: red; }
.one, .two, .three { font-family: "lorem"; font-weight: normal; } .four { font-family: "lorem", serif; font-weight: normal; }.five { font-family: "lorem"; font-weight: normal; } @font-face { font-family: "lorem"; font-weight: normal; src: url(/assets/lorem.eot); src: url(/assets/lorem.eot?#iefix) format("embedded-opentype"), url(/assets/lorem.woff) format("woff"), url(/assets/lorem.ttf) format("truetype"); }
.break { color: red; }
.foo { font-weight: normal; } .bar { font-family: "my-font"; font-weight: normal; } @font-face { font-family: "my-font"; font-weight: normal; src: url("my-font.ttf"); }
.break { color: red; }
.a{font-family:Arial;font-family:Helvetica;}.b{font-family:Arial;}
.break { color: red; }
.a{-webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);-webkit-overflow-scrolling: touch}.b{-webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);}
.break { color: red; }
body { overflow: hidden; overflow-y: scroll; overflow-x: hidden;} main { overflow: hidden }
.break { color: red; }
.a{ border-color:transparent; border-bottom-color:#111111; border-bottom-style:solid; }.b{ border-color:transparent; border-bottom-color:#222222; border-bottom-style:solid; }
.break { color: red; }
.fb-col-md-6 { color: red; border-color:blue; flex: 0 0 auto; flex-basis: 50%; } .fb-col-md-7 { color: red; border-color:blue; flex: 0 0 auto; flex-basis: 58.3%; }
.break { color: red; }
.one { border: 1px solid black; border-top: none; } .two { border: 1px solid black; }
.break { color: red; }
.dispendium-theme.fr-toolbar.fr-top { border-radius: 0; background-clip: padding-box; box-shadow: none; border: 1px solid #E0E0E0; border-bottom: 0; } .dispendium-theme.fr-toolbar.fr-bottom { border-radius: 0; background-clip: padding-box; box-shadow: none; border: 1px solid #E0E0E0; border-top: 0; }
.break { color: red; }
.share .comment-count:before { content: ' '; position: absolute; width: 0; height: 0; right: 7px; top: 26px; border: 5px solid; border-color: #326891 #326891 transparent transparent; } .share .comment-count:after { content: ' '; position: absolute; width: 0; height: 0; right: 8px; top: 24px; border: 5px solid; border-color: #fff #fff transparent transparent; }
.break { color: red; }
@keyframes foo{0%{visibility:visible;transform:scale3d(.85,.85,.85);opacity:0}to{visibility:visible;opacity:1}}
.break { color: red; }
.foo{background:#fff;-webkit-background-clip:text}.bar{background:#000;-webkit-background-clip:text}
.break { color: red; }
.a{background-color:#fff}.a{background-color:#717F83;color:#fff}
.break { color: red; }
::placeholder{color:blue}h1{color:blue}
.break { color: red; }
div{color:#fff}a ~ b{color:#fff}
.break { color: red; }
div{color:#fff}a > b{color:#fff}
.break { color: red; }
div{color:#fff}[href]{color:#fff}
.break { color: red; }
div{color:#fff}[href="foo"]{color:#fff}
.break { color: red; }
div{color:#fff}[href~="foo"]{color:#fff}
.break { color: red; }
div{color:#fff}[href|="foo"]{color:#fff}
.break { color: red; }
div{color:#fff}[href^="foo"]{color:#fff}
.break { color: red; }
div{color:#fff}[href$="foo"]{color:#fff}
.break { color: red; }
div{color:#fff}[href*="foo"]{color:#fff}
.break { color: red; }
div{color:#fff}[href="foo" i]{color:#fff}
.break { color: red; }
:active{color:blue}h1{color:blue}
.break { color: red; }
:after{color:blue}h1{color:blue}
.break { color: red; }
::after{color:blue}h1{color:blue}
.break { color: red; }
::placeholder{color:blue}h1{color:blue}
.break { color: red; }
:host(tag){display:block}a{display:block}
.break { color: red; }
p {color: blue} :unknown {color: blue}
.break { color: red; }
p {color: blue} ::unknown {color: blue}
.break { color: red; }
@media print{h1{display:block}}@media print{h1{color:red}}
.break { color: red; }
@media print{h1{display:block}}@MEDIA print{h1{color:red}}
.break { color: red; }
@media (min-width: 48rem){.wrapper{display: block}}@supports (display: flex){@media (min-width: 48rem){.wrapper{display:flex}}}
.break { color: red; }
@media print{h1{display:block}}@media print{h1{color:red}h2{padding:10px}}
.break { color: red; }
@media print{h1{display:block;color:red}h2{padding:10px}}@media print{}
.break { color: red; }
@media (width:40px){.red{color:red}}@media (width:40px){.green{color:green}}@media (width:40px){.blue{color:blue}}@supports (--var:var){.white{color:white}}@supports (--var:var){.black{color:black}}
.break { color: red; }
@media (width:40px){.red{color:red}}@media (width:40px){.green{color:green}}@media (width:40px){.blue{color:blue}}@supports (--var:var){@media (width:40px){.white{color:white}}}@supports (--var:var){@media (width:40px){.black{color:black}}}
.break { color: red; }
@media print{h1{display:block}}@media screen{h1{color:red}h2{padding:10px}}
.break { color: red; }
@media (min-width: 48rem){.wrapper{display: block}}@supports (display: flex){@media (min-width: 48rem){.wrapper{display:flex}}}
.break { color: red; }
@media print{h1{display:block}}@supports (color:red){@media print and (color:1){h1{color:red}h2{padding:10px}}}
.break { color: red; }
@media (width:40px){h1{border:1px solid red;background-color:red;background-position:50% 100%}}@media (width:40px){h1{border:1px solid red;background-color:red}}@media (width:40px){h1{border:1px solid red}}
.break { color: red; }
@media (width:40px){h1{color:black}h2{color:black;font-weight:bold}}@media (width:40px){h3{color:black;font-weight:bold}}
.break { color: red; }
.a{color:red;display:flex;font-size:10px;}.c{all:unset;color:red;display:flex;font-size:10px;}
.break { color: red; }
.foo{color:red}.bar{all:unset;color:red}
.break { color: red; }
.a{color:red;display:flex;font-size:10px;direction:tlr;}.c{all:unset;color:red;display:flex;font-size:10px;direction:tlr;}
.break { color: red; }
a{color : green;} a:focus-visible{ color : green;} a:focus-visible{ background : red}
.break { color: red; }
a,a:link{color:#555}a:visited{color:#555}
.break { color: red; }
h1{color:#001;color:#002;color:#003}h2{color:#001;color:#002}
.break { color: red; }
.foo{@media screen { color: red; }}.bar{@media screen { color: red; }}
.break { color: red; }
.foo{@media screen { color: red; }}.foo{@media screen { color: red; }}
.break { color: red; }
.foo{@media screen { color: red; }}.foo{@media print { color: red; }}
.break { color: red; }
@supports (display: flex) { .flex-container > * {text-shadow: 0px 0px 2px blue;float: none;} }@supports (display: flex) { .flex-container { display: flex;} }
.break { color: red; }
.foo{@media screen { color: red; }}.foo{@media print { color: red; } @media print { color: red; }}
.break { color: red; }
.foo{@media screen { color: red; }}.foo{@media print { color: red; } @media screen { color: red; }}
.break { color: red; }
.foo {
color: red;
@nest & > .bar {
color: blue;
}
@nest & > .baz {
color: blue;
}
}
.break { color: red; }
@supports (flex-wrap: wrap) {
@media (min-width: 50em) {
.foo {
background: blue;
}
}
@media (min-width: 50em) {
.foo {
background: blue;
}
}
}
.break { color: red; }
@supports (flex-wrap: wrap) {
.class { color: red }
}
@supports (flex-wrap: wrap) {
.class-1 { color: red }
}
.break { color: red; }
@supports (flex-wrap: wrap) {
.class { color: red }
}
@supports (flex-wrap: wrap) {
.class { color: red }
}
.break { color: red; }
.foo {
@media (min-width: 800px) {
& .bar {
color: red;
}
& .baz {
color: red;
}
}
@supports (flex-wrap: wrap) {
& .class { color: red }
}
@supports (flex-wrap: wrap) {
& .class { color: red }
}
}
.break { color: red; }
.class {
color: red;
& {
color: red;
}
}
.break { color: red; }
@supports (display: flex) {
.class {
display: flex;
}
}
@supports (display: grid) {
.class {
display: flex;
}
}
.break { color: red; }
@media (min-width: 200px) {
article {
display: flex;
}
}
@media (min-width: 600px) {
article {
display: flex;
}
}
.break { color: red; }
@container my-layout (inline-size > 45em) {
.foo {
color: red;
}
}
@container my-layout (inline-size > 45em) {
.foo {
background: yellow;
}
.bar {
color: white;
}
}
.break { color: red; }
@layer foo {
.foo {
color: red;
}
}
@layer foo {
.foo {
background: #fff;
}
.baz {
color: #fff;
}
}
.break { color: red; }
.foo {
color: red;
}
.bar {
color: red;
}
.break { color: red; }
.foo {
color: red;
}
.foo {
background: green;
}
.break { color: red; }
.foo {
background: red;
}
.bar {
background: red;
}
.foo {
color: green;
}
.bar {
color: green;
}
.break { color: red; }
.foo, .bar {
background: red;
}
.foo {
color: green;
}
.bar {
color: green;
}
.break { color: red; }
.foo {
background: red;
}
.foo {
color: green;
}
.bar {
background: red;
}
.bar {
color: green;
}
.break { color: red; }
@media (hover) {
.foo {
color: red;
}
}
@media (hover) {
.foo {
background: #fff;
}
.baz {
color: #fff;
}
}
.break { color: red; }
@supports (flex: 1) {
.foo {
color: red;
}
}
@supports (flex: 1) {
.foo {
background: #fff;
}
.baz {
color: #fff;
}
}
.break { color: red; }
.foo {
& .foo {
background: red;
}
& .bar {
background: red;
}
& .foo {
color: green;
}
& .bar {
color: green;
}
}
.break { color: red; }
.foo {
background: red;
}
.bar {
background: red;
}
.foo {
color: green;
}
.bar {
color: green;
}
.foo {
color: green;
}
.foo {
color: green;
}
.bar {
color: green;
}
.foo {
color: green;
}
.bar {
color: green;
}

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
a[color=blue]{color:blue}a[color=""]{color:blue}a[color="-"]{color:blue}a[color="."]{color:blue}a[color=" "]{color:blue}a[color=" a "]{color:blue}a[color=" a"]{color:blue}a[color="a "]{color:blue}a[color='"']{color:blue}a[color="B&W?"]{color:blue}a[color=G]{color:blue}a[color=😂]{color:blue}a[color=👩🦼]{color:blue}a[color="1"]{color:blue}a[color=--]{color:blue}a[color="-1"]{color:blue}a[color="-404"]{color:blue}a[color=-x]{color:blue}a[color=blue]{color:blue}a[color=blue i]{color:blue}a[class="woop woop woop"]{color:blue}a[class=woop_woop_woop]{color:blue}h1[class=" *.js "]+.js{color:blue}h1:before{color:blue}h1:before{color:blue}h1:after{color:blue}h1:first-letter{color:blue}h1:first-line{color:blue}*{color:blue}[hreflang|=en]{color:blue}.warning{color:blue}#myid{color:blue}:before{content:"test";color:blue}.class[hreflang|=en]{color:blue}foo|*[hreflang|=en]{color:blue}*|*[hreflang|=en]{color:blue}div{& [hreflang|=en]{color:blue}}div{&[hreflang|=en]{color:blue}}div{&div{color:blue}}div{&*{color:blue}}div{&{color:blue}}div{&.class{color:blue}}*|*:is(:hover,:focus){color:blue}*|*:is(*:hover,*:focus){color:blue}*|*:has(:not(h1,h2,h3,h4,h5,h6)){color:blue}div :first-child{color:blue}legend+*{color:blue}*+legend{color:blue}*+*{color:blue}p:first-child{color:blue}p:first-child{color:blue}p:nth-child(odd){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n){color:blue}p:first-child{color:blue}p:first-child{color:blue}p:first-child{color:blue}p:first-child{color:blue}p:nth-child(5){color:blue}p:nth-child(-5){color:blue}p:nth-child(-5){color:blue}p:nth-child(-5){color:blue}p:nth-child(-n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(-n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(n-3){color:blue}p:nth-child(-3){color:blue}p:nth-child(-3){color:blue}p:nth-child(-3){color:blue}p:nth-child(n){color:blue}p:nth-child(n){color:blue}p:nth-child(-n){color:blue}p:nth-child(5n){color:blue}p:nth-child(-5n){color:blue}p:nth-child(5n){color:blue}p:nth-child(-2n+1){color:blue}p:nth-child(n){color:blue}p:nth-child(n){color:blue}p:nth-child(-n){color:blue}p:nth-child(n){color:blue}p:nth-of-type(odd){color:blue}p:nth-last-col(odd){color:blue}p:nth-col(odd){color:blue}p:nth-child(n-2){color:blue}p:nth-child(n+2){color:blue}p:nth-child(-n+2){color:blue}p:nth-child(n){color:blue}p:nth-child(-n){color:blue}p:nth-child(n){color:blue}p:nth-child(5){color:blue}p:nth-child(n){color:blue}p:nth-child(n){color:blue}p:nth-child(-n+6){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n+5){color:blue}p:nth-child(2n+4){color:blue}p:nth-child(2n+3){color:blue}p:nth-child(2n+2){color:blue}p:nth-child(odd){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n+10){color:blue}p:nth-child(n+8):nth-child(-n+15){color:blue}p:nth-last-of-type(2n+2){color:blue}body>h2:not(:first-of-type):not(:last-of-type){color:blue}.class:first-child{color:red}.class:first-child{color:red}.class:nth-child(-1){color:red}.class:last-child{color:red}.class:last-child{color:red}.class:nth-last-child(-1){color:red}.class:first-of-type{color:red}.class:first-of-type{color:red}.class:nth-of-type(-1){color:red}.class:last-of-type{color:red}.class:last-of-type{color:red}.class:nth-last-of-type(-1){color:red}.foo.foo.foo{color:red}.class#id#id{color:red}#id#id.class{color:red}#id.class#id{color:red}#id#id#id{color:red}[attr][attr][attr]{color:red}[attr].class[attr].class[attr]{color:red}h1,h2,h3,h4,h5,h6{color:blue}.class{color:blue}div.class,.class{color:blue}a:is(a>b){color:red}a:is(a>b){color:red}a:is(a>b,form>label){color:red}a:has(>a){color:red}a:has(>a){color:red}.row-cols-3>*{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%}*,:before,:after{box-sizing:border-box;border:1px solid#dee2e6}.foo{& *{color:red}}.foo{&*{color:red}}.beta{&:hover{order:1}}.alpha>.beta{&+&{order:2}}a{& .bar{color:red}}a{&.bar{color:red}}.class{&.bar{color:red}}
a[color=blue],a[color=""],a[color="-"],a[color="."],a[color=" "],a[color=" a "],a[color=" a"],a[color="a "],a[color='"'],a[color="B&W?"],a[color=G],a[color=😂],a[color=👩🦼],a[color="1"],a[color=--],a[color="-1"],a[color="-404"],a[color=-x]{color:blue}a[color=blue i]{color:blue}a[class="woop woop woop"],a[class=woop_woop_woop],h1[class=" *.js "]+.js{color:blue}h1:before{color:blue}h1:before{color:blue}h1:after{color:blue}h1:first-letter{color:blue}h1:first-line{color:blue}*,[hreflang|=en],.warning,#myid{color:blue}:before{content:"test";color:blue}.class[hreflang|=en],foo|*[hreflang|=en],*|*[hreflang|=en]{color:blue}div{& [hreflang|=en],&[hreflang|=en],&div,&*,&,&.class{color:blue}}*|*:is(:hover,:focus){color:blue}*|*:is(*:hover,*:focus){color:blue}*|*:has(:not(h1,h2,h3,h4,h5,h6)){color:blue}div :first-child{color:blue}legend+*,*+legend,*+*{color:blue}p:first-child{color:blue}p:first-child{color:blue}p:nth-child(odd){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n){color:blue}p:first-child{color:blue}p:first-child{color:blue}p:first-child{color:blue}p:first-child{color:blue}p:nth-child(5){color:blue}p:nth-child(-5){color:blue}p:nth-child(-5){color:blue}p:nth-child(-5){color:blue}p:nth-child(-n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(-n+3){color:blue}p:nth-child(n+3){color:blue}p:nth-child(n-3){color:blue}p:nth-child(-3){color:blue}p:nth-child(-3){color:blue}p:nth-child(-3){color:blue}p:nth-child(n){color:blue}p:nth-child(n){color:blue}p:nth-child(-n){color:blue}p:nth-child(5n){color:blue}p:nth-child(-5n){color:blue}p:nth-child(5n){color:blue}p:nth-child(-2n+1){color:blue}p:nth-child(n){color:blue}p:nth-child(n){color:blue}p:nth-child(-n){color:blue}p:nth-child(n){color:blue}p:nth-of-type(odd){color:blue}p:nth-last-col(odd){color:blue}p:nth-col(odd){color:blue}p:nth-child(n-2){color:blue}p:nth-child(n+2){color:blue}p:nth-child(-n+2){color:blue}p:nth-child(n){color:blue}p:nth-child(-n){color:blue}p:nth-child(n){color:blue}p:nth-child(5){color:blue}p:nth-child(n){color:blue}p:nth-child(n){color:blue}p:nth-child(-n+6){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n+5){color:blue}p:nth-child(2n+4){color:blue}p:nth-child(2n+3){color:blue}p:nth-child(2n+2){color:blue}p:nth-child(odd){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(odd){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n){color:blue}p:nth-child(2n+10){color:blue}p:nth-child(n+8):nth-child(-n+15){color:blue}p:nth-last-of-type(2n+2){color:blue}body>h2:not(:first-of-type):not(:last-of-type){color:blue}.class:first-child{color:red}.class:first-child{color:red}.class:nth-child(-1){color:red}.class:last-child{color:red}.class:last-child{color:red}.class:nth-last-child(-1){color:red}.class:first-of-type{color:red}.class:first-of-type{color:red}.class:nth-of-type(-1){color:red}.class:last-of-type{color:red}.class:last-of-type{color:red}.class:nth-last-of-type(-1){color:red}.foo.foo.foo,.class#id#id,#id#id.class,#id.class#id,#id#id#id,[attr][attr][attr],[attr].class[attr].class[attr]{color:red}h1,h2,h3,h4,h5,h6,.class,div.class{color:blue}a:is(a>b){color:red}a:is(a>b){color:red}a:is(a>b,form>label){color:red}a:has(>a){color:red}a:has(>a){color:red}.row-cols-3>*{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%}*,:before,:after{box-sizing:border-box;border:1px solid#dee2e6}.foo{& *,&*{color:red}}.beta{&:hover{order:1}}.alpha>.beta{&+&{order:2}}a{& .bar,&.bar{color:red}}.class{&.bar{color:red}}

View File

@ -1 +1 @@
@namespace islands url(http://bar.yandex.ru/ui/islands);@namespace islands url(http://bar.yandex.ru/ui/islands);.class1{background:url(https://example.com/image.png)}.class2{background:url(image.png)}.class3{background:url(image.png)}.class4{background:url(image.png)}.class5{background:src("image.png")}.class6{background:url()}.class7{background:url()}.class8{background:url()}.class9{background:url(image\(.png)}.class10{background:url(image\).png)}.class11{background:url(image\ image.png)}.class12{background:url(image\'image.png)}.class13{background:url(image\"image.png)}.class14{background:url(image.png)}.class16{background:url("image.png"param(var(--foo)))}.class17{background:url("http://website.com/assets_(test).png")}.class18{background:url(test.svg#icon)}.class19{background:url("image.png"param(var(--url,url(image.png))))}.class20{background:src(var(--url))}.class21{background:url(image.png)}
@namespace islands url(http://bar.yandex.ru/ui/islands);@namespace islands url(http://bar.yandex.ru/ui/islands);.class1{background:url(https://example.com/image.png)}.class2{background:url(image.png)}.class3{background:url(image.png)}.class4{background:url(image.png)}.class5{background:src("image.png")}.class6,.class7{background:url()}.class8{background:url()}.class9{background:url(image\(.png)}.class10{background:url(image\).png)}.class11{background:url(image\ image.png)}.class12{background:url(image\'image.png)}.class13{background:url(image\"image.png)}.class14{background:url(image.png)}.class16{background:url("image.png"param(var(--foo)))}.class17{background:url("http://website.com/assets_(test).png")}.class18{background:url(test.svg#icon)}.class19{background:url("image.png"param(var(--url,url(image.png))))}.class20{background:src(var(--url))}.class21{background:url(image.png)}

View File

@ -1 +1 @@
.deg{transform:rotate(0);transform:rotate(0);transform:rotate(9deg);transform:rotate(-9deg);transform:rotate(10deg);transform:rotate(180deg);transform:rotate(180deg);transform:rotate(0);transform:rotate(0);transform:rotate(350deg);transform:rotate(-9deg);transform:rotate(0);transform:rotate(360.5deg);transform:rotate(-360.5deg);transform:rotate(1deg);transform:rotate(-1deg)}.grad{transform:rotate(0);transform:rotate(0);transform:rotate(9grad);transform:rotate(-9grad);transform:rotate(9deg);transform:rotate(180deg);transform:rotate(180deg);transform:rotate(0);transform:rotate(0);transform:rotate(0);transform:rotate(0);transform:rotate(0);transform:rotate(800.5grad);transform:rotate(-800.5grad);transform:rotate(821grad);transform:rotate(-821grad)}.rad{transform:rotate(0);transform:rotate(0);transform:rotate(1rad);transform:rotate(1.5rad);transform:rotate(-1.5rad)}.turn{transform:rotate(0);transform:rotate(0);transform:rotate(180deg);transform:rotate(180deg);transform:rotate(0);transform:rotate(0);transform:rotate(180deg);transform:rotate(0);transform:rotate(180deg);transform:rotate(0)}.cross{transform:rotate(90deg);transform:rotate(90deg);transform:rotate(90deg);transform:rotate(1.57rad);transform:rotate(3.1416rad)}.class1{transform:rotate(0)}.class2{transform:skewx(0)}.class3{transform:skewx(0)}.class4{transform:skewy(0)}.class5{transform:rotate3d(10,10,10,0)}.class6{transform:rotatex(0)}.class7{transform:rotatey(0)}.class8{transform:rotate(0)}.class9{transform:rotate(0)}.class10{transform:rotate(0)}.class11{transform:rotate(0)}@keyframes spinner-border{to{transform:rotate(360deg)}}
.deg{transform:rotate(0);transform:rotate(0);transform:rotate(9deg);transform:rotate(-9deg);transform:rotate(10deg);transform:rotate(180deg);transform:rotate(180deg);transform:rotate(0);transform:rotate(0);transform:rotate(350deg);transform:rotate(-9deg);transform:rotate(0);transform:rotate(360.5deg);transform:rotate(-360.5deg);transform:rotate(1deg);transform:rotate(-1deg)}.grad{transform:rotate(0);transform:rotate(0);transform:rotate(9grad);transform:rotate(-9grad);transform:rotate(9deg);transform:rotate(180deg);transform:rotate(180deg);transform:rotate(0);transform:rotate(0);transform:rotate(0);transform:rotate(0);transform:rotate(0);transform:rotate(800.5grad);transform:rotate(-800.5grad);transform:rotate(821grad);transform:rotate(-821grad)}.rad{transform:rotate(0);transform:rotate(0);transform:rotate(1rad);transform:rotate(1.5rad);transform:rotate(-1.5rad)}.turn{transform:rotate(0);transform:rotate(0);transform:rotate(180deg);transform:rotate(180deg);transform:rotate(0);transform:rotate(0);transform:rotate(180deg);transform:rotate(0);transform:rotate(180deg);transform:rotate(0)}.cross{transform:rotate(90deg);transform:rotate(90deg);transform:rotate(90deg);transform:rotate(1.57rad);transform:rotate(3.1416rad)}.class1{transform:rotate(0)}.class2,.class3{transform:skewx(0)}.class4{transform:skewy(0)}.class5{transform:rotate3d(10,10,10,0)}.class6{transform:rotatex(0)}.class7{transform:rotatey(0)}.class8{transform:rotate(0)}.class9,.class10{transform:rotate(0)}.class11{transform:rotate(0)}@keyframes spinner-border{to{transform:rotate(360deg)}}

View File

@ -1 +1 @@
table.colortable{& td{text-align:center;&.c{text-transform:uppercase}&:first-child,&:first-child+td{border:1px solid black}}& th{text-align:center;background:black;color:white}}table.colortable{& th{text-align:center;background:black;color:white}}.foo{display:grid}.foo{color:red}.foo{color:blue}
table.colortable{& td{text-align:center;&.c{text-transform:uppercase}&:first-child,&:first-child+td{border:1px solid black}}& th{text-align:center;background:black;color:white}}.foo{display:grid;color:red;color:blue}

View File

@ -1 +1 @@
ul{list-style:thumbs}@color-profile --swop5c{}.header{background-color:color(--swop5c 0%70%20%0%)}div{color:var(--my-color)}@page:first{color:green;@top-left{content:"foo";color:blue}@top-right{content:"bar"}}@layer utilities{}@layer utilities{}div{color:red}div{color:red}
ul{list-style:thumbs}@color-profile --swop5c{}.header{background-color:color(--swop5c 0%70%20%0%)}div{color:var(--my-color)}@page:first{color:green;@top-left{content:"foo";color:blue}@top-right{content:"bar"}}div{color:red}

View File

@ -1 +1 @@
h1{color:darkslateblue}@layer reset.type{}@layer framework{.title{font-weight:100}@layer theme{h1,h2{color:maroon}}}@layer reset{[hidden]{display:none}}
h1{color:darkslateblue}@layer framework{.title{font-weight:100}@layer theme{h1,h2{color:maroon}}}@layer reset{[hidden]{display:none}}

View File

@ -0,0 +1,14 @@
div {}
.foo {
color: red;
}
div {}
div {}
div {}
div {}
.foo {
color: red;
}

View File

@ -0,0 +1 @@
.foo{color:red}

View File

@ -0,0 +1,14 @@
div {}
.foo {
color: red;
}
div {}
div {}
div {}
div {}
.bar {
color: red;
}

View File

@ -0,0 +1 @@
.foo,.bar{color:red}

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,4 @@
<!doctype html><html lang=en><title>Document</title><style>a{color:red}b{color:blue}p{color:white;background-color:blue;padding:5px;border:1px solid black}p{color:blue;background-color:yellow}</style><style media="all and (max-width:500px)">p{color:blue;background-color:yellow}</style><style>.first{color:red}.second{color:red}</style><style media=all>p{color:blue}p{color:red}</style><div>test</div>
<!doctype html><html lang=en><title>Document</title><style>a{color:red}b{color:blue}p{color:white;background-color:blue;padding:5px;border:1px solid black;color:blue;background-color:yellow}</style><style media="all and (max-width:500px)">p{color:blue;background-color:yellow}</style><style>.first,.second{color:red}</style><style media=all>p{color:blue;color:red}</style><div>test</div>
<style>a{color:red}</style>
<div>test</div>
<style>a{color:red}</style>

View File

@ -72,5 +72,9 @@
<div>test</div>
<style></style>
<style>a { color: red }</style>
<div>test</div>
<style>a { color: red }</style>
<style>html { color: red }</style>
<style>body { color: red }</style>
</body>
</html>

View File

@ -1,7 +1,9 @@
<!doctype html><html lang=en><title>Document</title><style>a{color:red}b{color:blue}p{color:white;background-color:blue;padding:5px;border:1px solid black}p{color:blue;background-color:yellow}</style><style media="all and (max-width:500px)">p{color:blue;background-color:yellow}</style><style>.first{color:red}.second{color:red}</style><style media=all>p{color:blue}p{color:red}</style><h1>Text</h1>
<!doctype html><html lang=en><title>Document</title><style>a{color:red}b{color:blue}p{color:white;background-color:blue;padding:5px;border:1px solid black;color:blue;background-color:yellow}</style><style media="all and (max-width:500px)">p{color:blue;background-color:yellow}</style><style>.first,.second{color:red}</style><style media=all>p{color:blue;color:red}</style><h1>Text</h1>
<div>Text</div>
<style>a{color:red}b{color:blue}</style>
<div>test</div>
<style>a{color:red}</style>
<div>test</div>
<style>a{color:red}</style>
<style>a{color:red}</style>
<div>test</div>
<style>a,html,body{color:red}</style>

View File

@ -4,7 +4,7 @@
<svg>
<style>a{color:red}</style>
</svg>
<style>p{color:red}a{color:red}@media all{p{color:red}}.test{color:red}</style>
<style>p,a{color:red}@media all{p{color:red}}.test{color:red}</style>
<svg viewBox="0 0 10 10">
<style>circle{fill:gold;stroke:maroon;stroke-width:2px}</style>

View File

@ -29,4 +29,4 @@
foo
baz
</pre> <div> a <input> c </div> <div>Empty </div> <!--[if lte IE 6]> <span>A</span> <span title=" sigificant whitespace ">blah blah</span> <![endif]--> <div> <a href=#> <span> <b> foo </b> <i> bar </i> </span> </a> </div> <div>a b</div> <div>a b c d</div> <div> text </div> <span> text </span> <span> text </span> <div> <style>a{color:red}</style> <span>test</span> <style>a{color:red}</style> </div> <div> <style>a{color:red}a{color:red}</style> </div> <div> <style>a{color:red}</style> <span>test</span> <span>test</span> <style>a{color:red}</style> </div> <div> <script>console.log("test")</script><script>console.log("test")</script> </div>
</pre> <div> a <input> c </div> <div>Empty </div> <!--[if lte IE 6]> <span>A</span> <span title=" sigificant whitespace ">blah blah</span> <![endif]--> <div> <a href=#> <span> <b> foo </b> <i> bar </i> </span> </a> </div> <div>a b</div> <div>a b c d</div> <div> text </div> <span> text </span> <span> text </span> <div> <style>a{color:red}</style> <span>test</span> <style>a{color:red}</style> </div> <div> <style>a{color:red}</style> </div> <div> <style>a{color:red}</style> <span>test</span> <span>test</span> <style>a{color:red}</style> </div> <div> <script>console.log("test")</script><script>console.log("test")</script> </div>

View File

@ -275,7 +275,7 @@
</div>
<div>
<style>a{color:red}a{color:red}</style>
<style>a{color:red}</style>
</div>
<div>

View File

@ -29,4 +29,4 @@
foo
baz
</pre><div>a <input> c</div><div>Empty</div><!--[if lte IE 6]> <span>A</span> <span title=" sigificant whitespace ">blah blah</span> <![endif]--><div><a href=#> <span><b>foo </b><i> bar </i></span></a></div><div>a b</div><div>a b c d</div><div>text</div><span> text </span><span> text </span><div><span>test</span> <span>test</span></div><div><span>test</span> <command>test</command><span>test</span></div><div><span>test</span><link rel=stylesheet href=""> <span>test</span></div><div><span>test</span><meta name=content> <span>test</span></div><div><span>test</span><script>console.log("test")</script> <span>test</span></div><div><span>test</span><style>a{color:red}</style> <span>test</span></div><div><span>test</span><title>test</title> <span>test</span></div><div><meta name=test><meta name=test></div><div><link rel=stylesheet href=""><link rel=stylesheet href=""></div><div><script>console.log("test")</script><script>console.log("test")</script></div><div><script>console.log("test")</script> <span>test</span><script>console.log("test")</script></div><div><style>a{color:red}a{color:red}</style></div><div><script>console.log("test")</script><style>a{color:red}</style></div><div><span itemscope><meta itemprop=name content="The Castle">test</span> <span>test</span></div><div><meta name=test></div><div><style>a{color:red}</style></div><div><meta name=test><div>test</div><meta name=test></div><div><meta name=test> <span>test</span><meta name=test></div><svg> <title>test</title> <metadata>test</metadata> <desc>test</desc> </svg><svg> <a>test</a> <a>test</a> </svg><svg><text x=20 y=35><tspan font-weight=bold fill=red>This is bold and red</tspan> <tspan font-weight=bold fill=red>This is bold and red</tspan></text></svg><svg> <tspan>test</tspan><foreignObject>test</foreignObject></svg><svg><text x=20 y=35><tspan font-weight=bold fill=red>This is bold and red</tspan> <tspan font-weight=bold fill=red>This is bold and red</tspan></text></svg><svg viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice" style=width:100%;height:100%;position:absolute;top:0;left:0;z-index:-1> <linearGradient id=gradient><stop class=begin offset=0% /><stop class=end offset=100% /></linearGradient><rect width=100 height=100 style=fill:url(#gradient) /> <circle cx=50 cy=50 r=30 style=fill:url(#gradient) /> </svg><svg> <script>console.log("test")</script></svg><svg> <style>a{color:red}</style></svg><div><span>test</span> a b <span>test</span> <span>test</span> a b <span>test</span> <span>test</span> a b <span>test</span></div><div><foo-bar> <span>test</span> </foo-bar> <foo-bar> <span>test</span> </foo-bar></div><div><svg> <linearGradient id=gradient /> </svg><span>a</span></div>
</pre><div>a <input> c</div><div>Empty</div><!--[if lte IE 6]> <span>A</span> <span title=" sigificant whitespace ">blah blah</span> <![endif]--><div><a href=#> <span><b>foo </b><i> bar </i></span></a></div><div>a b</div><div>a b c d</div><div>text</div><span> text </span><span> text </span><div><span>test</span> <span>test</span></div><div><span>test</span> <command>test</command><span>test</span></div><div><span>test</span><link rel=stylesheet href=""> <span>test</span></div><div><span>test</span><meta name=content> <span>test</span></div><div><span>test</span><script>console.log("test")</script> <span>test</span></div><div><span>test</span><style>a{color:red}</style> <span>test</span></div><div><span>test</span><title>test</title> <span>test</span></div><div><meta name=test><meta name=test></div><div><link rel=stylesheet href=""><link rel=stylesheet href=""></div><div><script>console.log("test")</script><script>console.log("test")</script></div><div><script>console.log("test")</script> <span>test</span><script>console.log("test")</script></div><div><style>a{color:red}</style></div><div><script>console.log("test")</script><style>a{color:red}</style></div><div><span itemscope><meta itemprop=name content="The Castle">test</span> <span>test</span></div><div><meta name=test></div><div><style>a{color:red}</style></div><div><meta name=test><div>test</div><meta name=test></div><div><meta name=test> <span>test</span><meta name=test></div><svg> <title>test</title> <metadata>test</metadata> <desc>test</desc> </svg><svg> <a>test</a> <a>test</a> </svg><svg><text x=20 y=35><tspan font-weight=bold fill=red>This is bold and red</tspan> <tspan font-weight=bold fill=red>This is bold and red</tspan></text></svg><svg> <tspan>test</tspan><foreignObject>test</foreignObject></svg><svg><text x=20 y=35><tspan font-weight=bold fill=red>This is bold and red</tspan> <tspan font-weight=bold fill=red>This is bold and red</tspan></text></svg><svg viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice" style=width:100%;height:100%;position:absolute;top:0;left:0;z-index:-1> <linearGradient id=gradient><stop class=begin offset=0% /><stop class=end offset=100% /></linearGradient><rect width=100 height=100 style=fill:url(#gradient) /> <circle cx=50 cy=50 r=30 style=fill:url(#gradient) /> </svg><svg> <script>console.log("test")</script></svg><svg> <style>a{color:red}</style></svg><div><span>test</span> a b <span>test</span> <span>test</span> a b <span>test</span> <span>test</span> a b <span>test</span></div><div><foo-bar> <span>test</span> </foo-bar> <foo-bar> <span>test</span> </foo-bar></div><div><svg> <linearGradient id=gradient /> </svg><span>a</span></div>

View File

@ -1 +1 @@
<!doctype html><meta charset=utf-8><title>element-details - web component using &lt;template> and &lt;slot></title><style>dl{margin-left:6px}dt{font-weight:700;color:#217ac0;font-size:110%}dt{font-family:Consolas,"Liberation Mono",Courier}dd{margin-left:16px}</style><h1>element-details - web component using <code>&lt;template></code> and <code>&lt;slot></code></h1><template id=element-details-template-1> VALUE: !<slot>?</slot>! </template> <element-details> <span>test</span> <span>foo</span> </element-details> <script>customElements.define("element-details",class extends HTMLElement{constructor(){super();let e=document.getElementById("element-details-template-1").content;this.attachShadow({mode:"open"}).appendChild(e.cloneNode(true))}})</script>
<!doctype html><meta charset=utf-8><title>element-details - web component using &lt;template> and &lt;slot></title><style>dl{margin-left:6px}dt{font-weight:700;color:#217ac0;font-size:110%;font-family:Consolas,"Liberation Mono",Courier}dd{margin-left:16px}</style><h1>element-details - web component using <code>&lt;template></code> and <code>&lt;slot></code></h1><template id=element-details-template-1> VALUE: !<slot>?</slot>! </template> <element-details> <span>test</span> <span>foo</span> </element-details> <script>customElements.define("element-details",class extends HTMLElement{constructor(){super();let e=document.getElementById("element-details-template-1").content;this.attachShadow({mode:"open"}).appendChild(e.cloneNode(true))}})</script>

View File

@ -1 +1 @@
<!doctype html><meta charset=utf-8><title>element-details - web component using &lt;template> and &lt;slot></title><style>dl{margin-left:6px}dt{font-weight:700;color:#217ac0;font-size:110%}dt{font-family:Consolas,"Liberation Mono",Courier}dd{margin-left:16px}</style><h1>element-details - web component using <code>&lt;template></code> and <code>&lt;slot></code></h1><template id=element-details-template-1> VALUE: <slot name=q>?</slot> </template><template id=element-details-template-2> VALUE:<slot name=q>?</slot> </template><template id=element-details-template-3><div>VALUE:</div><slot name=q>?</slot> </template> <element-details> <span slot=q>1</span> </element-details> <element-details> <span slot=q>2</span> </element-details> <element-details-more> <span slot=q>3</span> </element-details-more> <element-details-more> <span slot=q>4</span> </element-details-more> <script>customElements.define("element-details",class extends HTMLElement{constructor(){super();let e=document.getElementById("element-details-template-1").content;this.attachShadow({mode:"open"}).appendChild(e.cloneNode(true))}});customElements.define("element-details-more",class extends HTMLElement{constructor(){super();let e=document.getElementById("element-details-template-2").content;this.attachShadow({mode:"open"}).appendChild(e.cloneNode(true))}})</script>
<!doctype html><meta charset=utf-8><title>element-details - web component using &lt;template> and &lt;slot></title><style>dl{margin-left:6px}dt{font-weight:700;color:#217ac0;font-size:110%;font-family:Consolas,"Liberation Mono",Courier}dd{margin-left:16px}</style><h1>element-details - web component using <code>&lt;template></code> and <code>&lt;slot></code></h1><template id=element-details-template-1> VALUE: <slot name=q>?</slot> </template><template id=element-details-template-2> VALUE:<slot name=q>?</slot> </template><template id=element-details-template-3><div>VALUE:</div><slot name=q>?</slot> </template> <element-details> <span slot=q>1</span> </element-details> <element-details> <span slot=q>2</span> </element-details> <element-details-more> <span slot=q>3</span> </element-details-more> <element-details-more> <span slot=q>4</span> </element-details-more> <script>customElements.define("element-details",class extends HTMLElement{constructor(){super();let e=document.getElementById("element-details-template-1").content;this.attachShadow({mode:"open"}).appendChild(e.cloneNode(true))}});customElements.define("element-details-more",class extends HTMLElement{constructor(){super();let e=document.getElementById("element-details-template-2").content;this.attachShadow({mode:"open"}).appendChild(e.cloneNode(true))}})</script>