Clean: SASS - apply AtEach

This commit is contained in:
alstjr7375 2022-03-18 10:11:07 +09:00
parent d6f604dbdc
commit bef58329db
6 changed files with 66 additions and 38 deletions

View file

@ -7,7 +7,7 @@
@include assert {
@include output {
$input: "hover: hover" "max-width: 1024px";
@include media.each($input) {
@include media.each($input...) {
body {
font-size: 16px;
}
@ -28,7 +28,7 @@
@include output {
$input: "hover: hover" "max-width: 1024px";
body {
@include media.each($input) {
@include media.each($input...) {
font-size: 16px;
}
}

View file

@ -12,7 +12,26 @@
}
}
@include expect {
@supports -moz-bool-pref("userChrome.tab.photon") {
@supports -moz-bool-pref(userChrome.tab.photon) {
body {
font-size: 16px;
}
}
}
}
}
@include test("multiple") {
@include assert {
@include output {
@include option.Option("userChrome.tab.photon", "userChrome.padding.photon") {
body {
font-size: 16px;
}
}
}
@include expect {
@supports -moz-bool-pref(userChrome.tab.photon) or -moz-bool-pref(userChrome.padding.photon) {
body {
font-size: 16px;
}
@ -33,7 +52,26 @@
}
}
@include expect {
@supports not -moz-bool-pref("userChrome.tab.photon") {
@supports not -moz-bool-pref(userChrome.tab.photon) {
body {
font-size: 16px;
}
}
}
}
}
@include test("multiple") {
@include assert {
@include output {
@include option.Option("userChrome.tab.photon", "userChrome.padding.photon") {
body {
font-size: 16px;
}
}
}
@include expect {
@supports -moz-bool-pref(userChrome.tab.photon) or -moz-bool-pref(userChrome.padding.photon) {
body {
font-size: 16px;
}

View file

@ -3,18 +3,20 @@
@mixin AtEach($name, $list, $prefix: null, $seperator: ", ") {
$listL: list.length($list);
$first: list.nth($list, 1);
@if $listL >= 1 and $first != null {
$blocks: "#{$prefix}(#{$first})";
@if $listL > 1 {
@for $i from 2 through ($listL) {
$nextBlock: list.nth($list, $i);
$nextBlock: "#{$seperator}#{$prefix}(#{$nextBlock})";
$blocks: "#{$blocks}#{$nextBlock}";
@if $listL >= 1 {
$first: list.nth($list, 1);
@if $first != null and $first != () {
$blocks: "#{$prefix}(#{$first})";
@if $listL > 1 {
@for $i from 2 through ($listL) {
$nextBlock: list.nth($list, $i);
$nextBlock: "#{$seperator}#{$prefix}(#{$nextBlock})";
$blocks: "#{$blocks}#{$nextBlock}";
}
}
@#{$name} #{"#{$blocks}"} {
@content;
}
}
@#{$name} #{"#{$blocks}"} {
@content;
}
}
}

View file

@ -1,21 +1,7 @@
@use "sass:list";
@use "list" as list-utils;
@use "each";
@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 + "), ");
}
}
@if ($listL >= 1) and list.nth($list, 1) != null {
$media: list.nth($list, $listL);
$list: list.set-nth($list, $listL, "(" + $media + ")");
@media #{list-utils.to-string($list)} {
@content;
}
@mixin each($list...) {
@include each.AtEach("media", $list) {
@content;
}
}

View file

@ -1,3 +1,5 @@
@use "each";
$tabProton: "userChrome.tab.proton";
$tabConnectToWindow: "userChrome.tab.connect_to_window";
$tabBoxShadow: "userChrome.tab.box_shadow";
@ -9,14 +11,14 @@ $tabProtonLikePadding: "userChrome.tab.proton_like_padding";
$tabMultiSelected: "userChrome.tab.multi_selected";
@mixin Option($optionName) {
@supports -moz-bool-pref("#{$optionName}") {
@mixin Option($optionNames...) {
@include each.AtEach("supports", $optionNames, "-moz-bool-pref", " or ") {
@content;
}
}
@mixin NotOption($optionName) {
@supports not -moz-bool-pref("#{$optionName}") {
@mixin NotOption($optionNames...) {
@include each.AtEach("supports", $optionNames, "not -moz-bool-pref", " or ") {
@content;
}
}

View file

@ -54,7 +54,7 @@ $_os-media: map.merge(
}
}
@include media.each($osMedias) {
@include media.each($osMedias...) {
@content;
}