diff options
author | Martijn Cuppens <martijn.cuppens@gmail.com> | 2020-02-28 21:35:24 +0300 |
---|---|---|
committer | Martijn Cuppens <martijn.cuppens@gmail.com> | 2020-02-29 16:26:02 +0300 |
commit | 08b998e20d9b9fbaf6f2a0bc93f186feea9277ae (patch) | |
tree | 236f5d686abf6557dc480c3678193062b379ba8c /test | |
parent | e8a654f459de62a8220f3d9451d87d55a87a0ea3 (diff) |
Add additional test
Diffstat (limited to 'test')
-rw-r--r-- | test/expected/test-12.css | 231 | ||||
-rw-r--r-- | test/less/test-12.less | 3 | ||||
-rw-r--r-- | test/postcss/tests.js | 4 | ||||
-rw-r--r-- | test/sass/test-12.scss | 3 | ||||
-rw-r--r-- | test/stylus/test-12.styl | 3 | ||||
-rw-r--r-- | test/tests.json | 4 |
6 files changed, 248 insertions, 0 deletions
diff --git a/test/expected/test-12.css b/test/expected/test-12.css new file mode 100644 index 0000000..bee12fb --- /dev/null +++ b/test/expected/test-12.css @@ -0,0 +1,231 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-1 { + font-size: calc(1.325rem + 0.9vmin); + } +} + +.selector-2 { + font-size: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-2 { + font-size: calc(1.325rem + 0.9vmin); + } +} + +.selector-3 { + font-size: 2rem !important; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-3 { + font-size: calc(1.325rem + 0.9vmin) !important; + } +} + +.selector-4 { + font-size: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-4 { + font-size: calc(1.325rem + 0.9vmin); + } +} + +.selector-5 { + font-size: 2em; +} + +.selector-6 { + font-size: inherit; +} + +@supports (display: flex) { + .selector-7 { + font-size: 1.75rem; + } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-7 { + font-size: calc(1.3rem + 0.6vmin); + } + } +} + +.selector-8 { + flex: 0 999 32rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-8 { + flex: 0 999 calc(4.325rem + 36.9vmin); + } +} + +.selector-9 { + padding: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-9 { + padding: calc(1.325rem + 0.9vmin); + } +} + +.selector-10 { + padding: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-10 { + padding: calc(1.325rem + 0.9vmin); + } +} + +.selector-11 { + padding-top: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-11 { + padding-top: calc(1.325rem + 0.9vmin); + } +} + +.selector-12 { + padding-right: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-12 { + padding-right: calc(1.325rem + 0.9vmin); + } +} + +.selector-13 { + padding-bottom: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-13 { + padding-bottom: calc(1.325rem + 0.9vmin); + } +} + +.selector-14 { + padding-left: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-14 { + padding-left: calc(1.325rem + 0.9vmin); + } +} + +.selector-15 { + margin: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-15 { + margin: calc(1.325rem + 0.9vmin); + } +} + +.selector-16 { + margin-top: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-16 { + margin-top: calc(1.325rem + 0.9vmin); + } +} + +.selector-17 { + margin-right: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-17 { + margin-right: calc(1.325rem + 0.9vmin); + } +} + +.selector-18 { + margin-bottom: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-18 { + margin-bottom: calc(1.325rem + 0.9vmin); + } +} + +.selector-19 { + margin-left: 2rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-19 { + margin-left: calc(1.325rem + 0.9vmin); + } +} + +.selector-20 { + margin: 2rem 3rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-20 { + margin: calc(1.325rem + 0.9vmin) calc(1.425rem + 2.1vmin); + } +} + +.selector-21 { + margin: 2rem 3rem !important; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-21 { + margin: calc(1.325rem + 0.9vmin) calc(1.425rem + 2.1vmin) !important; + } +} + +.selector-22 { + font-size: 0; +} + +.selector-23 { + margin: 0 3rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-23 { + margin: 0 calc(1.425rem + 2.1vmin); + } +} + +.selector-24 { + box-shadow: 0 0 2rem #f00, 0 0 3rem #0f0; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-24 { + box-shadow: 0 0 calc(1.325rem + 0.9vmin) #f00, + 0 0 calc(1.425rem + 2.1vmin) #0f0; + } +} + +.selector-25 { + --value: 3rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-25 { + --value: calc(1.425rem + 2.1vmin); + } +} + +.selector-26 { + font-size: 0.625rem; +} + +.selector-27 { + margin: -3rem; +} +@media (max-width: 1200px), (max-height: 1200px) { + .selector-27 { + margin: calc(-1.425rem - 2.1vmin); + } +} + +.selector-28 { + margin: -0.5rem; +} diff --git a/test/less/test-12.less b/test/less/test-12.less new file mode 100644 index 0000000..896c9b8 --- /dev/null +++ b/test/less/test-12.less @@ -0,0 +1,3 @@ +@import "main"; +@rfs-mode: "max-media-query"; +@rfs-two-dimensional: true; diff --git a/test/postcss/tests.js b/test/postcss/tests.js index 304e747..01205d9 100644 --- a/test/postcss/tests.js +++ b/test/postcss/tests.js @@ -45,5 +45,9 @@ module.exports = { }, 'test-11': { mode: 'max-media-query' + }, + 'test-12': { + mode: 'max-media-query', + twoDimensional: true } }; diff --git a/test/sass/test-12.scss b/test/sass/test-12.scss new file mode 100644 index 0000000..f7e77b1 --- /dev/null +++ b/test/sass/test-12.scss @@ -0,0 +1,3 @@ +$rfs-mode: max-media-query; +$rfs-two-dimensional: true; +@import "main"; diff --git a/test/stylus/test-12.styl b/test/stylus/test-12.styl new file mode 100644 index 0000000..f800dc9 --- /dev/null +++ b/test/stylus/test-12.styl @@ -0,0 +1,3 @@ +$rfs-mode = "max-media-query" +$rfs-two-dimensional = true +@import "main" diff --git a/test/tests.json b/test/tests.json index 726ebd1..7069506 100644 --- a/test/tests.json +++ b/test/tests.json @@ -42,5 +42,9 @@ { "id": "test-11", "name": "Use max-media-query mode" + }, + { + "id": "test-12", + "name": "Use max-media-query mode & enable two dimensional media queries" } ] |