@appartmint/mint 0.11.10 → 0.12.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -566,6 +566,126 @@ $bootstrap5: false !default;
566
566
  }
567
567
  }
568
568
 
569
+ /// Creates utility selectors for a box model property
570
+ /// @group Mixins
571
+ ///
572
+ /// @example scss - box-util mixin
573
+ /// @include box-util(margin, 1rem, 0); // -> & {
574
+ ///
575
+ @mixin box-util ($prop, $val) {
576
+ @if (type-of($prop) != 'string') {
577
+ @error 'The box-util mixin requires a string for the $prop argument.';
578
+ }
579
+
580
+ &-auto {
581
+ #{$prop}-left: auto;
582
+ #{$prop}-right: auto;
583
+
584
+ &-v {
585
+ #{$prop}: $val auto;
586
+
587
+ @for $i from 0 through 6 {
588
+ &#{$i} {
589
+ #{$prop}: $val * $i auto;
590
+ }
591
+ }
592
+ }
593
+
594
+ &-t {
595
+ #{$prop}-top: $val;
596
+ #{$prop}-left: auto;
597
+ #{$prop}-right: auto;
598
+
599
+ @for $i from 0 through 6 {
600
+ &#{$i} {
601
+ #{$prop}-top: $val * $i;
602
+ #{$prop}-left: auto;
603
+ #{$prop}-right: auto;
604
+ }
605
+ }
606
+ }
607
+
608
+ &-b {
609
+ #{$prop}-bottom: $val;
610
+ #{$prop}-left: auto;
611
+ #{$prop}-right: auto;
612
+
613
+ @for $i from 0 through 6 {
614
+ &#{$i} {
615
+ #{$prop}-bottom: $val * $i;
616
+ #{$prop}-left: auto;
617
+ #{$prop}-right: auto;
618
+ }
619
+ }
620
+ }
621
+ }
622
+
623
+ &-v {
624
+ #{$prop}-top: $val;
625
+ #{$prop}-bottom: $val;
626
+
627
+ @for $i from 0 through 6 {
628
+ &#{$i} {
629
+ #{$prop}-top: $val * $i;
630
+ #{$prop}-bottom: $val * $i;
631
+ }
632
+ }
633
+ }
634
+
635
+ &-t {
636
+ #{$prop}-top: $val;
637
+
638
+ @for $i from 0 through 6 {
639
+ &#{$i} {
640
+ #{$prop}-top: $val * $i;
641
+ }
642
+ }
643
+ }
644
+
645
+ &-b {
646
+ #{$prop}-bottom: $val;
647
+
648
+ @for $i from 0 through 6 {
649
+ &#{$i} {
650
+ #{$prop}-bottom: $val * $i;
651
+ }
652
+ }
653
+ }
654
+
655
+ &-h {
656
+ #{$prop}-left: $val;
657
+ #{$prop}-right: $val;
658
+
659
+ @for $i from 0 through 6 {
660
+ &#{$i} {
661
+ #{$prop}-left: $val * $i;
662
+ #{$prop}-right: $val * $i;
663
+ }
664
+ }
665
+ }
666
+
667
+ &-l {
668
+ #{$prop}-left: $val;
669
+
670
+ @for $i from 0 through 6 {
671
+ &#{$i} {
672
+ #{$prop}-left: $val * $i;
673
+ }
674
+ }
675
+ }
676
+
677
+ &-r {
678
+ #{$prop}-right: $val;
679
+
680
+ @for $i from 0 through 6 {
681
+ &#{$i} {
682
+ #{$prop}-right: $val * $i;
683
+ }
684
+ }
685
+ }
686
+ }
687
+
688
+
569
689
  /// Generates a property with a fluid value between specified screen sizes
570
690
  /// @group Mixins
571
691
  ///