mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2026-01-30 04:10:32 -08:00
Add: SASS - each media
This commit is contained in:
parent
93adcb715b
commit
bc5d5a0a4f
2 changed files with 63 additions and 0 deletions
45
__tests__/media.test.scss
Normal file
45
__tests__/media.test.scss
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
@use 'true' as *;
|
||||
@use "../src/utils/media";
|
||||
|
||||
// TODO: Need more tests..
|
||||
@include test-module("Create each media at once [mix]") {
|
||||
@include test("simple") {
|
||||
@include assert {
|
||||
@include output {
|
||||
$input: "hover: hover" "max-width: 1024px";
|
||||
@include media.each($input) {
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@include expect {
|
||||
@media (hover: hover), (max-width: 1024px) {
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include test("beyond") {
|
||||
@include assert {
|
||||
@include output {
|
||||
$input: "hover: hover" "max-width: 1024px";
|
||||
body {
|
||||
@include media.each($input) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@include expect {
|
||||
@media (hover: hover), (max-width: 1024px) {
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
18
src/utils/_media.scss
Normal file
18
src/utils/_media.scss
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
@use "sass:list";
|
||||
@use "list" as list-utils;
|
||||
|
||||
@mixin each($list) {
|
||||
$listL: list.length($list);
|
||||
@if $listL != 1 {
|
||||
@for $i from 1 through ($listL - 1) {
|
||||
$media: list.nth($list, $i);
|
||||
$list: list.set-nth($list, $i, "(" + $media + "), ");
|
||||
}
|
||||
}
|
||||
$media: list.nth($list, $listL);
|
||||
$list: list.set-nth($list, $listL, "(" + $media + ")");
|
||||
|
||||
@media #{list-utils.to-string($list)} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue