From fb2e9f1358a0c5e51b027dcb615a6b399c21026e Mon Sep 17 00:00:00 2001 From: Yiffy Dev Date: Sun, 3 Nov 2024 17:52:28 +0500 Subject: [PATCH] test: add more integration tests with insta. Like it! --- .gitignore | 3 + Cargo.toml | 1 + README.md | 14 +- tests/assets/mixin-module.sass | 19 ++ tests/assets/mixin-module.scss | 24 +++ tests/assets/mixins.sass | 5 - tests/assets/mixins.scss | 9 - tests/assets/module-forward.sass | 3 + tests/assets/module-forward.scss | 3 + tests/assets/module-usage.sass | 15 ++ tests/assets/module-usage.scss | 20 ++ tests/assets/prelude.css | 3 + tests/assets/prelude.sass | 5 + tests/assets/prelude.scss | 6 + tests/assets/sole-code.sass | 17 ++ tests/assets/sole-code.scss | 22 +++ tests/assets/use-forwarded.sass | 14 ++ tests/assets/use-forwarded.scss | 20 ++ tests/macros.rs | 182 ++++++++++++++++++ .../compilation_with_buildy@bundle.css.snap | 7 + ..._buildy@scopes__module_usage_sass.css.snap | 7 + ..._buildy@scopes__module_usage_scss.css.snap | 7 + ...ith_buildy@scopes__sole_code_sass.css.snap | 7 + ...ith_buildy@scopes__sole_code_scss.css.snap | 7 + ...buildy@scopes__use_forwarded_sass.css.snap | 7 + ...buildy@scopes__use_forwarded_scss.css.snap | 7 + 26 files changed, 413 insertions(+), 21 deletions(-) create mode 100644 tests/assets/mixin-module.sass create mode 100644 tests/assets/mixin-module.scss delete mode 100644 tests/assets/mixins.sass delete mode 100644 tests/assets/mixins.scss create mode 100644 tests/assets/module-forward.sass create mode 100644 tests/assets/module-forward.scss create mode 100644 tests/assets/module-usage.sass create mode 100644 tests/assets/module-usage.scss create mode 100644 tests/assets/prelude.css create mode 100644 tests/assets/prelude.sass create mode 100644 tests/assets/prelude.scss create mode 100644 tests/assets/sole-code.sass create mode 100644 tests/assets/sole-code.scss create mode 100644 tests/assets/use-forwarded.sass create mode 100644 tests/assets/use-forwarded.scss create mode 100644 tests/macros.rs create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@bundle.css.snap create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_sass.css.snap create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_scss.css.snap create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_sass.css.snap create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_scss.css.snap create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_sass.css.snap create mode 100644 tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_scss.css.snap diff --git a/.gitignore b/.gitignore index e2bc000..ae8e48f 100644 --- a/.gitignore +++ b/.gitignore @@ -3,3 +3,6 @@ rust-toolchain.toml .vscode .profile /Cargo.lock +/tests/sabry_intermediate +/tests/sabry_output +/playground diff --git a/Cargo.toml b/Cargo.toml index ffb981b..ed2ec1b 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -43,6 +43,7 @@ sabry_intrnl = {workspace = true} [dev-dependencies] leptos = {version = "0.7.0-gamma3"} +insta = {version = "^1.41", features = ["glob"]} [features] default = ["procmacro"] diff --git a/README.md b/README.md index 6f530d9..0a4e396 100644 --- a/README.md +++ b/README.md @@ -51,7 +51,7 @@ Code your SASS in separate files to get proper syntax highlighting, or do sass-i ```rust sabry::styly!(component {".btn {color: green;}"}); -sabry::styly!(extras "tests/assets/mixins.scss"); +sabry::styly!(extras "tests/assets/mixin-module.scss"); ``` @@ -88,7 +88,7 @@ sabry::styly!(breadbadge {" Keep things as private and modular as you wish ```rust -sabry::styly!(pub cats "tests/assets/mixins.scss"); +sabry::styly!(pub cats "tests/assets/mixin-module.scss"); sabry::styly!(dogs {"#howl {border: none;}"}); ``` ```rust,ignore @@ -148,7 +148,7 @@ And a proc-macro // lib.rs use sabry::sassy; -sassy!(mixins "tests/assets/mixins.scss"); +sassy!(mixins "tests/assets/mixin-module.scss"); sassy!(styles {" $primary-color: black; @mixin colored($col: primary) { @@ -443,8 +443,8 @@ Examples: use sabry::sassy; sassy!(module1 {"$primary-color: red;"}); -sassy!(module2 "tests/assets/mixins.scss"); -sassy!(module3:sass "tests/assets/mixins.sass"); +sassy!(module2 "tests/assets/mixin-module.scss"); +sassy!(module3:sass "tests/assets/mixin-module.sass"); // works, but there are catches. sassy!(module4:sass {" @mixin colored($col: primary) @@ -514,7 +514,7 @@ You can read more about scoping and hashing in the [scoping](#scoping) section. By default generated `mod` is private. You can make both mod and wrapper style constant public by adding the `pub` to macro call: ```rust -sabry::styly!(pub whatever "tests/assets/mixins.scss"); +sabry::styly!(pub whatever "tests/assets/mixin-module.scss"); ``` #### Constant styly scopes @@ -524,7 +524,7 @@ As you've seen above, scope doe not contain any style code by itself. That's the However you could still compile styles into the artifact by simply adding the `const` to the macro call: ```rust -sabry::styly!(const scope "tests/assets/mixins.scss"); +sabry::styly!(const scope "tests/assets/mixin-module.scss"); ``` Which results in following: ```rust,ignore diff --git a/tests/assets/mixin-module.sass b/tests/assets/mixin-module.sass new file mode 100644 index 0000000..cff411f --- /dev/null +++ b/tests/assets/mixin-module.sass @@ -0,0 +1,19 @@ + +@mixin color($color: black) + @if $color == black + color: white + background-color: green + @else if $color == white + color: red + background-color: black + @else + color: #c6c6c6 + background-color: #00ffff + &::after + content: 'Colored' + color: $color + background-color: blue + &:hover + transform: scale(2) + &:hover + transform: translateX(10%) diff --git a/tests/assets/mixin-module.scss b/tests/assets/mixin-module.scss new file mode 100644 index 0000000..f8887c0 --- /dev/null +++ b/tests/assets/mixin-module.scss @@ -0,0 +1,24 @@ + +@mixin surface($color: black){ + @if $color == black{ + color: white; + background-color: green; + }@else if $color == white{ + color: red; + background-color: black; + }@else{ + color: #c6c6c6; + background-color: #00ffff; + } + &::after{ + content: 'Colored'; + color: $color; + background-color: blue; + &:hover{ + transform: scale(2); + } + } + &:hover{ + transform: translateX(10%); + } +} diff --git a/tests/assets/mixins.sass b/tests/assets/mixins.sass deleted file mode 100644 index 45a1ec6..0000000 --- a/tests/assets/mixins.sass +++ /dev/null @@ -1,5 +0,0 @@ -@mixin colored($color: primary) - @if $color == primary - color: white - @else - color: $col diff --git a/tests/assets/mixins.scss b/tests/assets/mixins.scss deleted file mode 100644 index d201fd0..0000000 --- a/tests/assets/mixins.scss +++ /dev/null @@ -1,9 +0,0 @@ -$primary-color: black; - -@mixin colored($col: primary) { - @if $col == primary { - color: $primary-color; - } @else { - color: $col; - } -} diff --git a/tests/assets/module-forward.sass b/tests/assets/module-forward.sass new file mode 100644 index 0000000..ad1e734 --- /dev/null +++ b/tests/assets/module-forward.sass @@ -0,0 +1,3 @@ + +@forward 'mixins_a' +@forward 'mixins_c' diff --git a/tests/assets/module-forward.scss b/tests/assets/module-forward.scss new file mode 100644 index 0000000..8352864 --- /dev/null +++ b/tests/assets/module-forward.scss @@ -0,0 +1,3 @@ + +@forward 'mixins_a'; +@forward 'mixins_c'; diff --git a/tests/assets/module-usage.sass b/tests/assets/module-usage.sass new file mode 100644 index 0000000..3137332 --- /dev/null +++ b/tests/assets/module-usage.sass @@ -0,0 +1,15 @@ +@use 'mixins_a' as * +@use 'mixins_c' as * + +.coated + @include color(green) + @include surface(black) + &-dark + @include surface(red) + a + @include surface(blue) + img + @include color(black) + span + @include color(green) + display: block diff --git a/tests/assets/module-usage.scss b/tests/assets/module-usage.scss new file mode 100644 index 0000000..921333c --- /dev/null +++ b/tests/assets/module-usage.scss @@ -0,0 +1,20 @@ +@use 'mixins_a' as *; +@use 'mixins_c' as *; + +.coated{ + @include color(green); + @include surface(black); + &-dark{ + @include surface(red); + a{ + @include surface(blue); + img{ + @include color(black); + } + } + } + span{ + @include color(green); + display: block; + } +} diff --git a/tests/assets/prelude.css b/tests/assets/prelude.css new file mode 100644 index 0000000..0995dad --- /dev/null +++ b/tests/assets/prelude.css @@ -0,0 +1,3 @@ +html { + background-color: dark; +} diff --git a/tests/assets/prelude.sass b/tests/assets/prelude.sass new file mode 100644 index 0000000..c78cbb1 --- /dev/null +++ b/tests/assets/prelude.sass @@ -0,0 +1,5 @@ +@use 'mixins_a' as * +@use 'mixins_c' as * + +body + @include color() diff --git a/tests/assets/prelude.scss b/tests/assets/prelude.scss new file mode 100644 index 0000000..28384b9 --- /dev/null +++ b/tests/assets/prelude.scss @@ -0,0 +1,6 @@ +@use 'mixins_a' as *; +@use 'mixins_c' as *; + +body { + @include surface(); +} diff --git a/tests/assets/sole-code.sass b/tests/assets/sole-code.sass new file mode 100644 index 0000000..ccc06a1 --- /dev/null +++ b/tests/assets/sole-code.sass @@ -0,0 +1,17 @@ +.fuzz + background-color: red + display: block + &-dark + background-color: black + color: white + a + text-transform: uppercase + img + position: absolute + top: 0 + left: 10rem + span + position: relative + display: grid + grid-template-areas: 'a b c' 'd e f' 'x x x' + display: block diff --git a/tests/assets/sole-code.scss b/tests/assets/sole-code.scss new file mode 100644 index 0000000..dcb73cc --- /dev/null +++ b/tests/assets/sole-code.scss @@ -0,0 +1,22 @@ +.fuzz{ + background-color: red; + display: block; + &-dark{ + background-color: black; + color: white; + a{ + text-transform: uppercase; + img{ + position: absolute; + top: 0; + left: 10rem; + } + } + } + span{ + position: relative; + display: grid; + grid-template-areas: 'a b c' 'd e f' 'x x x'; + display: block; + } +} diff --git a/tests/assets/use-forwarded.sass b/tests/assets/use-forwarded.sass new file mode 100644 index 0000000..e1b91e3 --- /dev/null +++ b/tests/assets/use-forwarded.sass @@ -0,0 +1,14 @@ +@use 'module_a' as * + +.coated + @include color(green) + @include surface(black) + &-dark + @include surface(red) + a + @include surface(blue) + img + @include color(black) + span + @include color(green) + display: block diff --git a/tests/assets/use-forwarded.scss b/tests/assets/use-forwarded.scss new file mode 100644 index 0000000..ce68c48 --- /dev/null +++ b/tests/assets/use-forwarded.scss @@ -0,0 +1,20 @@ +@use 'module_c' as *; + + +.coated{ + @include color(green); + @include surface(black); + &-dark{ + @include surface(red); + a{ + @include surface(blue); + img{ + @include color(black); + } + } + } + span{ + @include color(green); + display: block; + } +} diff --git a/tests/macros.rs b/tests/macros.rs new file mode 100644 index 0000000..e944f3d --- /dev/null +++ b/tests/macros.rs @@ -0,0 +1,182 @@ +use std::fs; + +use insta::{glob, Settings}; + +use sabry::{ + buildmagic::SabryBuilder, + config::{BehavHashCollision, BehavSassModCollision, SabryConfig}, + sassy, styly, usey, +}; + +pub mod sass { + use sabry::sassy; + + sassy!(mixins_sass:sass "tests/assets/mixin-module.sass"); + sassy!(mixins_inline_sass:sass {" + @mixin color($color: black) + @if $color == black + color: white + background-color: green + @else if $color == white + color: red + background-color: black + @else + color: #c6c6c6 + background-color: #00ffff + &::after + content: 'Colored' + color: $color + background-color: blue + &:hover + transform: scale(2) + &:hover + transform: translateX(10%) +"}); + sassy!(module_sass:sass "tests/assets/module-forward.sass"); + sassy!(module_inline_sass:sass {" +@forward 'mixins_a' +@forward 'mixins_c' +"}); + pub(crate) use mixins_inline_sass as mixins_inline_a; + pub(crate) use mixins_sass as mixins_a; + pub(crate) use module_inline_sass as module_inline_a; + pub(crate) use module_sass as module_a; +} + +pub mod scss { + use sabry::sassy; + + sassy!(mixins_scss:scss "tests/assets/mixin-module.scss"); + sassy!(mixins_inline_scss:scss {" + @mixin surface($color: black){ + @if $color == black{ + color: white; + background-color: green; + }@else if $color == white{ + color: red; + background-color: black; + }@else{ + color: #c6c6c6; + background-color: #00ffff; + } + &::after{ + content: 'Colored'; + color: $color; + background-color: blue; + &:hover{ + transform: scale(2); + } + } + &:hover{ + transform: translateX(10%); + } + } +"}); + sassy!(module_scss:scss "tests/assets/module-forward.scss"); + sassy!(module_inline_scss:scss {" +@forward 'mixins_a'; +@forward 'mixins_c'; +"}); + + pub(crate) use mixins_inline_scss as mixins_inline_c; + pub(crate) use mixins_scss as mixins_c; + pub(crate) use module_inline_scss as module_inline_c; + pub(crate) use module_scss as module_c; +} + +styly!(sole_code_sass:sass "tests/assets/sole-code.sass"); +styly!(sole_code_scss:scss "tests/assets/sole-code.scss"); +styly!(module_usage_sass:sass "tests/assets/module-usage.sass"); +styly!(module_usage_scss:scss "tests/assets/module-usage.scss"); +styly!(use_forwarded_sass:sass "tests/assets/use-forwarded.sass"); +styly!(use_forwarded_scss:scss "tests/assets/use-forwarded.scss"); + +#[test] +fn ensure_inline_matches_file() { + assert_eq!(sass::mixins_a!(), sass::mixins_inline_a!()); + assert_eq!(scss::mixins_c!(), scss::mixins_inline_c!()); + + assert_eq!(sass::module_a!(), sass::module_inline_a!()); + assert_eq!(scss::module_c!(), scss::module_inline_c!()); +} + +#[test] +fn syntax_contract() { + assert_eq!(scss::mixins_inline_c!(syntax), "scss"); + assert_eq!(scss::mixins_c!(syntax), "scss"); + assert_eq!(scss::module_inline_c!(syntax), "scss"); + assert_eq!(scss::module_c!(syntax), "scss"); + + assert_eq!(sass::mixins_a!(syntax), "sass"); + assert_eq!(sass::mixins_inline_a!(syntax), "sass"); + assert_eq!(sass::module_a!(syntax), "sass"); + assert_eq!(sass::module_inline_a!(syntax), "sass"); +} + +fn gen_config() -> SabryConfig { + let mut config = SabryConfig::require().unwrap(); + config.css.bundle = Some("tests/sabry_output/bundle.css".into()); + config.css.scopes = Some("tests/sabry_output/scopes".into()); + config.css.minify = true; + config.css.prelude = Some(vec!["tests/assets/prelude.css".into()]); + + config.sass.prelude = Some(vec![ + "tests/assets/prelude.sass".into(), + "tests/assets/prelude.scss".into(), + ]); + config.sass.intermediate_dir = "tests/sabry_intermediate".into(); + config.sass.scanroot = "tests".into(); + config.sass.module_name_collision = BehavSassModCollision::Merge; + + config.hash.collision = BehavHashCollision::Error; + config.hash.size = 16; + config.hash.use_code_size = true; + config.hash.use_code_text = true; + config.hash.use_item_names = true; + config.hash.use_scope_name = true; + + config.lightningcss.targets.android = Some("10".into()); + config.lightningcss.targets.chrome = Some("100".into()); + config.lightningcss.targets.edge = Some("80".into()); + config.lightningcss.targets.firefox = Some("100".into()); + config.lightningcss.targets.ie = Some("8".into()); + config.lightningcss.targets.ios_saf = Some("13.2".into()); + config.lightningcss.targets.opera = Some("80".into()); + config.lightningcss.targets.safari = Some("11".into()); + config.lightningcss.targets.samsung = Some("80".into()); + + config +} + +fn gen_builder() -> SabryBuilder { + let config = gen_config(); + let builder = SabryBuilder::new(config); + + builder +} + +#[test] +fn compilation_with_buildy() { + let mut builder = gen_builder(); + builder + .build(usey!( + sass::mixins_a!(), + sass::module_a!(), + scss::mixins_c!(), + scss::module_c!() + )) + .unwrap(); + + glob!("sabry_output/**/*.css", |path| { + let generated = fs::read_to_string(path).unwrap(); + + let mut settings = Settings::clone_current(); + settings.set_snapshot_path("sabry_output_snapshots"); + settings.set_prepend_module_to_snapshot(false); + settings.set_omit_expression(true); + settings.remove_info(); + settings.bind(|| { + insta::assert_snapshot!(generated); + }); + }); +} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@bundle.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@bundle.css.snap new file mode 100644 index 0000000..e0d861c --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@bundle.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/bundle.css +snapshot_kind: text +--- +.smfXzGrnTs2kl9jPP0nk6w.fuzz{background-color:red;display:block}.smfXzGrnTs2kl9jPP0nk6w.fuzz-dark{color:#fff;background-color:#000}.smfXzGrnTs2kl9jPP0nk6w.fuzz-dark a.smfXzGrnTs2kl9jPP0nk6w{text-transform:uppercase}.smfXzGrnTs2kl9jPP0nk6w.fuzz-dark a.smfXzGrnTs2kl9jPP0nk6w img.smfXzGrnTs2kl9jPP0nk6w{position:absolute;top:0;left:10rem}.smfXzGrnTs2kl9jPP0nk6w.fuzz span.smfXzGrnTs2kl9jPP0nk6w{grid-template-areas:"a b c""d e f""x x x";display:block;position:relative}.FT5yVVwswyLvNU3dIk0qw.fuzz{background-color:red;display:block}.FT5yVVwswyLvNU3dIk0qw.fuzz-dark{color:#fff;background-color:#000}.FT5yVVwswyLvNU3dIk0qw.fuzz-dark a.FT5yVVwswyLvNU3dIk0qw{text-transform:uppercase}.FT5yVVwswyLvNU3dIk0qw.fuzz-dark a.FT5yVVwswyLvNU3dIk0qw img.FT5yVVwswyLvNU3dIk0qw{position:absolute;top:0;left:10rem}.FT5yVVwswyLvNU3dIk0qw.fuzz span.FT5yVVwswyLvNU3dIk0qw{grid-template-areas:"a b c""d e f""x x x";display:block;position:relative}.n5vGKZlIscA58H8d7ZMOhSw.coated{color:#fff;background-color:green}.n5vGKZlIscA58H8d7ZMOhSw.coated:after{content:"Colored";color:#000;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark{color:#c6c6c6;background-color:#0ff}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark:after{content:"Colored";color:red;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw{color:#c6c6c6;background-color:#0ff}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw:after{content:"Colored";color:#00f;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw{color:#fff;background-color:green}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw:after{content:"Colored";color:#000;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw{color:#c6c6c6;background-color:#0ff;display:block}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw:after{content:"Colored";color:green;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated{color:#fff;background-color:green}.n6ROVrVzYikGtxgKBYy11kA.coated:after{content:"Colored";color:#000;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark{color:#c6c6c6;background-color:#0ff}.n6ROVrVzYikGtxgKBYy11kA.coated-dark:after{content:"Colored";color:red;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA{color:#c6c6c6;background-color:#0ff}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA:after{content:"Colored";color:#00f;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA{color:#fff;background-color:green}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA:after{content:"Colored";color:#000;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA{color:#c6c6c6;background-color:#0ff;display:block}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA:after{content:"Colored";color:green;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated{color:#fff;background-color:green}.qK4fsMeZRSTGObSesXXRBA.coated:after{content:"Colored";color:#000;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated-dark{color:#c6c6c6;background-color:#0ff}.qK4fsMeZRSTGObSesXXRBA.coated-dark:after{content:"Colored";color:red;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA{color:#c6c6c6;background-color:#0ff}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA:after{content:"Colored";color:#00f;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA{color:#fff;background-color:green}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA:after{content:"Colored";color:#000;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA{color:#c6c6c6;background-color:#0ff;display:block}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA:after{content:"Colored";color:green;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated{color:#fff;background-color:green}.FMHIHNH4_QHxbUqdVmS1A.coated:after{content:"Colored";color:#000;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark{color:#c6c6c6;background-color:#0ff}.FMHIHNH4_QHxbUqdVmS1A.coated-dark:after{content:"Colored";color:red;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A{color:#c6c6c6;background-color:#0ff}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A:after{content:"Colored";color:#00f;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A{color:#fff;background-color:green}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A:after{content:"Colored";color:#000;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A{color:#c6c6c6;background-color:#0ff;display:block}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A:after{content:"Colored";color:green;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A:hover{-ms-transform:translate(10%);transform:translate(10%)} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_sass.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_sass.css.snap new file mode 100644 index 0000000..e26b0f4 --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_sass.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/scopes/module_usage_sass.css +snapshot_kind: text +--- +.n5vGKZlIscA58H8d7ZMOhSw.coated{color:#fff;background-color:green}.n5vGKZlIscA58H8d7ZMOhSw.coated:after{content:"Colored";color:#000;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark{color:#c6c6c6;background-color:#0ff}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark:after{content:"Colored";color:red;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw{color:#c6c6c6;background-color:#0ff}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw:after{content:"Colored";color:#00f;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw{color:#fff;background-color:green}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw:after{content:"Colored";color:#000;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated-dark a.n5vGKZlIscA58H8d7ZMOhSw img.n5vGKZlIscA58H8d7ZMOhSw:hover{-ms-transform:translate(10%);transform:translate(10%)}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw{color:#c6c6c6;background-color:#0ff;display:block}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw:after{content:"Colored";color:green;background-color:#00f}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw:after:hover{-ms-transform:scale(2);transform:scale(2)}.n5vGKZlIscA58H8d7ZMOhSw.coated span.n5vGKZlIscA58H8d7ZMOhSw:hover{-ms-transform:translate(10%);transform:translate(10%)} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_scss.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_scss.css.snap new file mode 100644 index 0000000..c24335b --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__module_usage_scss.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/scopes/module_usage_scss.css +snapshot_kind: text +--- +.n6ROVrVzYikGtxgKBYy11kA.coated{color:#fff;background-color:green}.n6ROVrVzYikGtxgKBYy11kA.coated:after{content:"Colored";color:#000;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark{color:#c6c6c6;background-color:#0ff}.n6ROVrVzYikGtxgKBYy11kA.coated-dark:after{content:"Colored";color:red;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA{color:#c6c6c6;background-color:#0ff}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA:after{content:"Colored";color:#00f;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA{color:#fff;background-color:green}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA:after{content:"Colored";color:#000;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated-dark a.n6ROVrVzYikGtxgKBYy11kA img.n6ROVrVzYikGtxgKBYy11kA:hover{-ms-transform:translate(10%);transform:translate(10%)}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA{color:#c6c6c6;background-color:#0ff;display:block}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA:after{content:"Colored";color:green;background-color:#00f}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA:after:hover{-ms-transform:scale(2);transform:scale(2)}.n6ROVrVzYikGtxgKBYy11kA.coated span.n6ROVrVzYikGtxgKBYy11kA:hover{-ms-transform:translate(10%);transform:translate(10%)} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_sass.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_sass.css.snap new file mode 100644 index 0000000..922db8e --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_sass.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/scopes/sole_code_sass.css +snapshot_kind: text +--- +.smfXzGrnTs2kl9jPP0nk6w.fuzz{background-color:red;display:block}.smfXzGrnTs2kl9jPP0nk6w.fuzz-dark{color:#fff;background-color:#000}.smfXzGrnTs2kl9jPP0nk6w.fuzz-dark a.smfXzGrnTs2kl9jPP0nk6w{text-transform:uppercase}.smfXzGrnTs2kl9jPP0nk6w.fuzz-dark a.smfXzGrnTs2kl9jPP0nk6w img.smfXzGrnTs2kl9jPP0nk6w{position:absolute;top:0;left:10rem}.smfXzGrnTs2kl9jPP0nk6w.fuzz span.smfXzGrnTs2kl9jPP0nk6w{grid-template-areas:"a b c""d e f""x x x";display:block;position:relative} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_scss.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_scss.css.snap new file mode 100644 index 0000000..a7760eb --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__sole_code_scss.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/scopes/sole_code_scss.css +snapshot_kind: text +--- +.FT5yVVwswyLvNU3dIk0qw.fuzz{background-color:red;display:block}.FT5yVVwswyLvNU3dIk0qw.fuzz-dark{color:#fff;background-color:#000}.FT5yVVwswyLvNU3dIk0qw.fuzz-dark a.FT5yVVwswyLvNU3dIk0qw{text-transform:uppercase}.FT5yVVwswyLvNU3dIk0qw.fuzz-dark a.FT5yVVwswyLvNU3dIk0qw img.FT5yVVwswyLvNU3dIk0qw{position:absolute;top:0;left:10rem}.FT5yVVwswyLvNU3dIk0qw.fuzz span.FT5yVVwswyLvNU3dIk0qw{grid-template-areas:"a b c""d e f""x x x";display:block;position:relative} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_sass.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_sass.css.snap new file mode 100644 index 0000000..3695b70 --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_sass.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/scopes/use_forwarded_sass.css +snapshot_kind: text +--- +.qK4fsMeZRSTGObSesXXRBA.coated{color:#fff;background-color:green}.qK4fsMeZRSTGObSesXXRBA.coated:after{content:"Colored";color:#000;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated-dark{color:#c6c6c6;background-color:#0ff}.qK4fsMeZRSTGObSesXXRBA.coated-dark:after{content:"Colored";color:red;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA{color:#c6c6c6;background-color:#0ff}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA:after{content:"Colored";color:#00f;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA{color:#fff;background-color:green}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA:after{content:"Colored";color:#000;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated-dark a.qK4fsMeZRSTGObSesXXRBA img.qK4fsMeZRSTGObSesXXRBA:hover{-ms-transform:translate(10%);transform:translate(10%)}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA{color:#c6c6c6;background-color:#0ff;display:block}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA:after{content:"Colored";color:green;background-color:#00f}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA:after:hover{-ms-transform:scale(2);transform:scale(2)}.qK4fsMeZRSTGObSesXXRBA.coated span.qK4fsMeZRSTGObSesXXRBA:hover{-ms-transform:translate(10%);transform:translate(10%)} diff --git a/tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_scss.css.snap b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_scss.css.snap new file mode 100644 index 0000000..b8adffa --- /dev/null +++ b/tests/sabry_output_snapshots/compilation_with_buildy@scopes__use_forwarded_scss.css.snap @@ -0,0 +1,7 @@ +--- +source: tests/macros.rs +assertion_line: 170 +input_file: tests/sabry_output/scopes/use_forwarded_scss.css +snapshot_kind: text +--- +.FMHIHNH4_QHxbUqdVmS1A.coated{color:#fff;background-color:green}.FMHIHNH4_QHxbUqdVmS1A.coated:after{content:"Colored";color:#000;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark{color:#c6c6c6;background-color:#0ff}.FMHIHNH4_QHxbUqdVmS1A.coated-dark:after{content:"Colored";color:red;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated-dark:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A{color:#c6c6c6;background-color:#0ff}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A:after{content:"Colored";color:#00f;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A{color:#fff;background-color:green}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A:after{content:"Colored";color:#000;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated-dark a.FMHIHNH4_QHxbUqdVmS1A img.FMHIHNH4_QHxbUqdVmS1A:hover{-ms-transform:translate(10%);transform:translate(10%)}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A{color:#c6c6c6;background-color:#0ff;display:block}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A:after{content:"Colored";color:green;background-color:#00f}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A:after:hover{-ms-transform:scale(2);transform:scale(2)}.FMHIHNH4_QHxbUqdVmS1A.coated span.FMHIHNH4_QHxbUqdVmS1A:hover{-ms-transform:translate(10%);transform:translate(10%)}