Стилус destructurable params mixin (margin-side: auto)

Как создать служебные миксины с разрушаемыми параметрами? Как и в стандартном css margin: inherit auto, где первый аргумент применяется к верху и низу, а второй справа и слева, если не указаны дополнительные аргументы.

margin-side(left, right)
  margin-left left
  margin-right right

.some-div
  margin-side auto
  // applied to both margin -left and -right

Используете условные выражения? Остальные параметры? Значения параметров по умолчанию? Не могу заставить его работать ни с одним из них ..

// thus far I've done it with
margin-side(left, right) ...
margin-sides(both) ...
// but it's error prone

Ура, спасибо!


stylus
person n-smits    schedule 13.04.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Я не уверен, что понимаю ваш вопрос.

Я думаю, это то, что вы пытаетесь сделать:

margin-side(vertical, horizontal = vertical)
  margin-top vertical
  margin-left horizontal
  margin-right horizontal
  margin-bottom vertical

.foo
  margin-side(10px)

.bar
  margin-side(5px, 7px)

попробовать в Интернете

person Yukulélé    schedule 14.04.2020
comment
Да, именно так. Я пробовал это, должно быть, что-то напутал, потому что это не сработало. Спасибо! - person n-smits; 15.04.2020
comment
не забывайте, что это поведение по умолчанию для свойства margin css, поэтому этот миксин, вероятно, бесполезен developer.mozilla.org/en-US/docs/Web/CSS/margin#Syntax - person Yukulélé; 15.04.2020
comment
Этот конкретный, опубликованный выше, да (это буквально то же самое, что и маржа). Под боком я имел в виду только горизонтальный. Итак, margin-side (left, right = left) {margin-left left; край-правый правый; } Еще один хороший пример - size (width, height = width) {...} - person n-smits; 16.04.2020