@sb1/ffe-grid 100.6.0 → 100.7.0
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.
- package/css/ffe-grid.css +258 -103
- package/package.json +4 -4
package/css/ffe-grid.css
CHANGED
|
@@ -5,11 +5,13 @@
|
|
|
5
5
|
}
|
|
6
6
|
.ffe-grid__row,
|
|
7
7
|
.ffe-grid__row-wrapper {
|
|
8
|
+
display: -ms-grid;
|
|
8
9
|
display: grid;
|
|
9
10
|
gap: var(--ffe-spacing-sm);
|
|
10
11
|
margin: 0 auto;
|
|
11
12
|
max-width: var(--app-width);
|
|
12
|
-
grid-
|
|
13
|
+
-ms-grid-columns: (1fr)[12];
|
|
14
|
+
grid-template-columns: repeat(12, 1fr);
|
|
13
15
|
}
|
|
14
16
|
.ffe-grid--gap-none .ffe-grid__row,
|
|
15
17
|
.ffe-grid--gap-none .ffe-grid__row-wrapper {
|
|
@@ -550,7 +552,9 @@
|
|
|
550
552
|
max-width: none;
|
|
551
553
|
}
|
|
552
554
|
.ffe-grid__col {
|
|
553
|
-
grid-column:
|
|
555
|
+
-ms-grid-column-span: 12;
|
|
556
|
+
-ms-grid-column: auto;
|
|
557
|
+
grid-column: auto / span 12;
|
|
554
558
|
}
|
|
555
559
|
.ffe-grid__col--bg-primary {
|
|
556
560
|
background-color: var(--ffe-color-surface-primary-default);
|
|
@@ -566,368 +570,519 @@
|
|
|
566
570
|
}
|
|
567
571
|
.ffe-grid__col--sm-0 {
|
|
568
572
|
display: block;
|
|
569
|
-
grid-column:
|
|
573
|
+
-ms-grid-column-span: 0;
|
|
574
|
+
-ms-grid-column: auto;
|
|
575
|
+
grid-column: auto / span 0;
|
|
570
576
|
display: none;
|
|
571
577
|
}
|
|
572
578
|
.ffe-grid__col--sm-1 {
|
|
573
579
|
display: block;
|
|
574
|
-
grid-column:
|
|
580
|
+
-ms-grid-column-span: 1;
|
|
581
|
+
-ms-grid-column: auto;
|
|
582
|
+
grid-column: auto / span 1;
|
|
575
583
|
}
|
|
576
584
|
.ffe-grid__col--sm-2 {
|
|
577
585
|
display: block;
|
|
578
|
-
grid-column:
|
|
586
|
+
-ms-grid-column-span: 2;
|
|
587
|
+
-ms-grid-column: auto;
|
|
588
|
+
grid-column: auto / span 2;
|
|
579
589
|
}
|
|
580
590
|
.ffe-grid__col--sm-3 {
|
|
581
591
|
display: block;
|
|
582
|
-
grid-column:
|
|
592
|
+
-ms-grid-column-span: 3;
|
|
593
|
+
-ms-grid-column: auto;
|
|
594
|
+
grid-column: auto / span 3;
|
|
583
595
|
}
|
|
584
596
|
.ffe-grid__col--sm-4 {
|
|
585
597
|
display: block;
|
|
586
|
-
grid-column:
|
|
598
|
+
-ms-grid-column-span: 4;
|
|
599
|
+
-ms-grid-column: auto;
|
|
600
|
+
grid-column: auto / span 4;
|
|
587
601
|
}
|
|
588
602
|
.ffe-grid__col--sm-5 {
|
|
589
603
|
display: block;
|
|
590
|
-
grid-column:
|
|
604
|
+
-ms-grid-column-span: 5;
|
|
605
|
+
-ms-grid-column: auto;
|
|
606
|
+
grid-column: auto / span 5;
|
|
591
607
|
}
|
|
592
608
|
.ffe-grid__col--sm-6 {
|
|
593
609
|
display: block;
|
|
594
|
-
grid-column:
|
|
610
|
+
-ms-grid-column-span: 6;
|
|
611
|
+
-ms-grid-column: auto;
|
|
612
|
+
grid-column: auto / span 6;
|
|
595
613
|
}
|
|
596
614
|
.ffe-grid__col--sm-7 {
|
|
597
615
|
display: block;
|
|
598
|
-
grid-column:
|
|
616
|
+
-ms-grid-column-span: 7;
|
|
617
|
+
-ms-grid-column: auto;
|
|
618
|
+
grid-column: auto / span 7;
|
|
599
619
|
}
|
|
600
620
|
.ffe-grid__col--sm-8 {
|
|
601
621
|
display: block;
|
|
602
|
-
grid-column:
|
|
622
|
+
-ms-grid-column-span: 8;
|
|
623
|
+
-ms-grid-column: auto;
|
|
624
|
+
grid-column: auto / span 8;
|
|
603
625
|
}
|
|
604
626
|
.ffe-grid__col--sm-9 {
|
|
605
627
|
display: block;
|
|
606
|
-
grid-column:
|
|
628
|
+
-ms-grid-column-span: 9;
|
|
629
|
+
-ms-grid-column: auto;
|
|
630
|
+
grid-column: auto / span 9;
|
|
607
631
|
}
|
|
608
632
|
.ffe-grid__col--sm-10 {
|
|
609
633
|
display: block;
|
|
610
|
-
grid-column:
|
|
634
|
+
-ms-grid-column-span: 10;
|
|
635
|
+
-ms-grid-column: auto;
|
|
636
|
+
grid-column: auto / span 10;
|
|
611
637
|
}
|
|
612
638
|
.ffe-grid__col--sm-11 {
|
|
613
639
|
display: block;
|
|
614
|
-
grid-column:
|
|
640
|
+
-ms-grid-column-span: 11;
|
|
641
|
+
-ms-grid-column: auto;
|
|
642
|
+
grid-column: auto / span 11;
|
|
615
643
|
}
|
|
616
644
|
.ffe-grid__col--sm-12 {
|
|
617
645
|
display: block;
|
|
618
|
-
grid-column:
|
|
646
|
+
-ms-grid-column-span: 12;
|
|
647
|
+
-ms-grid-column: auto;
|
|
648
|
+
grid-column: auto / span 12;
|
|
619
649
|
}
|
|
620
650
|
.ffe-grid__col--sm-offset-1 {
|
|
621
|
-
grid-column
|
|
651
|
+
-ms-grid-column: 2;
|
|
652
|
+
grid-column-start: 2;
|
|
622
653
|
}
|
|
623
654
|
.ffe-grid__col--sm-offset-2 {
|
|
624
|
-
grid-column
|
|
655
|
+
-ms-grid-column: 3;
|
|
656
|
+
grid-column-start: 3;
|
|
625
657
|
}
|
|
626
658
|
.ffe-grid__col--sm-offset-3 {
|
|
627
|
-
grid-column
|
|
659
|
+
-ms-grid-column: 4;
|
|
660
|
+
grid-column-start: 4;
|
|
628
661
|
}
|
|
629
662
|
.ffe-grid__col--sm-offset-4 {
|
|
630
|
-
grid-column
|
|
663
|
+
-ms-grid-column: 5;
|
|
664
|
+
grid-column-start: 5;
|
|
631
665
|
}
|
|
632
666
|
.ffe-grid__col--sm-offset-5 {
|
|
633
|
-
grid-column
|
|
667
|
+
-ms-grid-column: 6;
|
|
668
|
+
grid-column-start: 6;
|
|
634
669
|
}
|
|
635
670
|
.ffe-grid__col--sm-offset-6 {
|
|
636
|
-
grid-column
|
|
671
|
+
-ms-grid-column: 7;
|
|
672
|
+
grid-column-start: 7;
|
|
637
673
|
}
|
|
638
674
|
.ffe-grid__col--sm-offset-7 {
|
|
639
|
-
grid-column
|
|
675
|
+
-ms-grid-column: 8;
|
|
676
|
+
grid-column-start: 8;
|
|
640
677
|
}
|
|
641
678
|
.ffe-grid__col--sm-offset-8 {
|
|
642
|
-
grid-column
|
|
679
|
+
-ms-grid-column: 9;
|
|
680
|
+
grid-column-start: 9;
|
|
643
681
|
}
|
|
644
682
|
.ffe-grid__col--sm-offset-9 {
|
|
645
|
-
grid-column
|
|
683
|
+
-ms-grid-column: 10;
|
|
684
|
+
grid-column-start: 10;
|
|
646
685
|
}
|
|
647
686
|
.ffe-grid__col--sm-offset-10 {
|
|
648
|
-
grid-column
|
|
687
|
+
-ms-grid-column: 11;
|
|
688
|
+
grid-column-start: 11;
|
|
649
689
|
}
|
|
650
690
|
.ffe-grid__col--sm-offset-11 {
|
|
651
|
-
grid-column
|
|
691
|
+
-ms-grid-column: 12;
|
|
692
|
+
grid-column-start: 12;
|
|
652
693
|
}
|
|
653
694
|
.ffe-grid__col--sm-offset-12 {
|
|
654
|
-
grid-column
|
|
695
|
+
-ms-grid-column: 13;
|
|
696
|
+
grid-column-start: 13;
|
|
655
697
|
}
|
|
656
698
|
@media (min-width: 768px) {
|
|
657
699
|
.ffe-grid__col--md-0 {
|
|
658
700
|
display: block;
|
|
659
|
-
grid-column:
|
|
701
|
+
-ms-grid-column-span: 0;
|
|
702
|
+
-ms-grid-column: auto;
|
|
703
|
+
grid-column: auto / span 0;
|
|
660
704
|
display: none;
|
|
661
705
|
}
|
|
662
706
|
.ffe-grid__col--md-1 {
|
|
663
707
|
display: block;
|
|
664
|
-
grid-column:
|
|
708
|
+
-ms-grid-column-span: 1;
|
|
709
|
+
-ms-grid-column: auto;
|
|
710
|
+
grid-column: auto / span 1;
|
|
665
711
|
}
|
|
666
712
|
.ffe-grid__col--md-2 {
|
|
667
713
|
display: block;
|
|
668
|
-
grid-column:
|
|
714
|
+
-ms-grid-column-span: 2;
|
|
715
|
+
-ms-grid-column: auto;
|
|
716
|
+
grid-column: auto / span 2;
|
|
669
717
|
}
|
|
670
718
|
.ffe-grid__col--md-3 {
|
|
671
719
|
display: block;
|
|
672
|
-
grid-column:
|
|
720
|
+
-ms-grid-column-span: 3;
|
|
721
|
+
-ms-grid-column: auto;
|
|
722
|
+
grid-column: auto / span 3;
|
|
673
723
|
}
|
|
674
724
|
.ffe-grid__col--md-4 {
|
|
675
725
|
display: block;
|
|
676
|
-
grid-column:
|
|
726
|
+
-ms-grid-column-span: 4;
|
|
727
|
+
-ms-grid-column: auto;
|
|
728
|
+
grid-column: auto / span 4;
|
|
677
729
|
}
|
|
678
730
|
.ffe-grid__col--md-5 {
|
|
679
731
|
display: block;
|
|
680
|
-
grid-column:
|
|
732
|
+
-ms-grid-column-span: 5;
|
|
733
|
+
-ms-grid-column: auto;
|
|
734
|
+
grid-column: auto / span 5;
|
|
681
735
|
}
|
|
682
736
|
.ffe-grid__col--md-6 {
|
|
683
737
|
display: block;
|
|
684
|
-
grid-column:
|
|
738
|
+
-ms-grid-column-span: 6;
|
|
739
|
+
-ms-grid-column: auto;
|
|
740
|
+
grid-column: auto / span 6;
|
|
685
741
|
}
|
|
686
742
|
.ffe-grid__col--md-7 {
|
|
687
743
|
display: block;
|
|
688
|
-
grid-column:
|
|
744
|
+
-ms-grid-column-span: 7;
|
|
745
|
+
-ms-grid-column: auto;
|
|
746
|
+
grid-column: auto / span 7;
|
|
689
747
|
}
|
|
690
748
|
.ffe-grid__col--md-8 {
|
|
691
749
|
display: block;
|
|
692
|
-
grid-column:
|
|
750
|
+
-ms-grid-column-span: 8;
|
|
751
|
+
-ms-grid-column: auto;
|
|
752
|
+
grid-column: auto / span 8;
|
|
693
753
|
}
|
|
694
754
|
.ffe-grid__col--md-9 {
|
|
695
755
|
display: block;
|
|
696
|
-
grid-column:
|
|
756
|
+
-ms-grid-column-span: 9;
|
|
757
|
+
-ms-grid-column: auto;
|
|
758
|
+
grid-column: auto / span 9;
|
|
697
759
|
}
|
|
698
760
|
.ffe-grid__col--md-10 {
|
|
699
761
|
display: block;
|
|
700
|
-
grid-column:
|
|
762
|
+
-ms-grid-column-span: 10;
|
|
763
|
+
-ms-grid-column: auto;
|
|
764
|
+
grid-column: auto / span 10;
|
|
701
765
|
}
|
|
702
766
|
.ffe-grid__col--md-11 {
|
|
703
767
|
display: block;
|
|
704
|
-
grid-column:
|
|
768
|
+
-ms-grid-column-span: 11;
|
|
769
|
+
-ms-grid-column: auto;
|
|
770
|
+
grid-column: auto / span 11;
|
|
705
771
|
}
|
|
706
772
|
.ffe-grid__col--md-12 {
|
|
707
773
|
display: block;
|
|
708
|
-
grid-column:
|
|
774
|
+
-ms-grid-column-span: 12;
|
|
775
|
+
-ms-grid-column: auto;
|
|
776
|
+
grid-column: auto / span 12;
|
|
709
777
|
}
|
|
710
778
|
.ffe-grid__col--md-offset-1 {
|
|
711
|
-
grid-column
|
|
779
|
+
-ms-grid-column: 2;
|
|
780
|
+
grid-column-start: 2;
|
|
712
781
|
}
|
|
713
782
|
.ffe-grid__col--md-offset-2 {
|
|
714
|
-
grid-column
|
|
783
|
+
-ms-grid-column: 3;
|
|
784
|
+
grid-column-start: 3;
|
|
715
785
|
}
|
|
716
786
|
.ffe-grid__col--md-offset-3 {
|
|
717
|
-
grid-column
|
|
787
|
+
-ms-grid-column: 4;
|
|
788
|
+
grid-column-start: 4;
|
|
718
789
|
}
|
|
719
790
|
.ffe-grid__col--md-offset-4 {
|
|
720
|
-
grid-column
|
|
791
|
+
-ms-grid-column: 5;
|
|
792
|
+
grid-column-start: 5;
|
|
721
793
|
}
|
|
722
794
|
.ffe-grid__col--md-offset-5 {
|
|
723
|
-
grid-column
|
|
795
|
+
-ms-grid-column: 6;
|
|
796
|
+
grid-column-start: 6;
|
|
724
797
|
}
|
|
725
798
|
.ffe-grid__col--md-offset-6 {
|
|
726
|
-
grid-column
|
|
799
|
+
-ms-grid-column: 7;
|
|
800
|
+
grid-column-start: 7;
|
|
727
801
|
}
|
|
728
802
|
.ffe-grid__col--md-offset-7 {
|
|
729
|
-
grid-column
|
|
803
|
+
-ms-grid-column: 8;
|
|
804
|
+
grid-column-start: 8;
|
|
730
805
|
}
|
|
731
806
|
.ffe-grid__col--md-offset-8 {
|
|
732
|
-
grid-column
|
|
807
|
+
-ms-grid-column: 9;
|
|
808
|
+
grid-column-start: 9;
|
|
733
809
|
}
|
|
734
810
|
.ffe-grid__col--md-offset-9 {
|
|
735
|
-
grid-column
|
|
811
|
+
-ms-grid-column: 10;
|
|
812
|
+
grid-column-start: 10;
|
|
736
813
|
}
|
|
737
814
|
.ffe-grid__col--md-offset-10 {
|
|
738
|
-
grid-column
|
|
815
|
+
-ms-grid-column: 11;
|
|
816
|
+
grid-column-start: 11;
|
|
739
817
|
}
|
|
740
818
|
.ffe-grid__col--md-offset-11 {
|
|
741
|
-
grid-column
|
|
819
|
+
-ms-grid-column: 12;
|
|
820
|
+
grid-column-start: 12;
|
|
742
821
|
}
|
|
743
822
|
.ffe-grid__col--md-offset-12 {
|
|
744
|
-
grid-column
|
|
823
|
+
-ms-grid-column: 13;
|
|
824
|
+
grid-column-start: 13;
|
|
745
825
|
}
|
|
746
826
|
}
|
|
747
827
|
@media (min-width: 1024px) {
|
|
748
828
|
.ffe-grid__col--lg-0 {
|
|
749
829
|
display: block;
|
|
750
|
-
grid-column:
|
|
830
|
+
-ms-grid-column-span: 0;
|
|
831
|
+
-ms-grid-column: auto;
|
|
832
|
+
grid-column: auto / span 0;
|
|
751
833
|
display: none;
|
|
752
834
|
}
|
|
753
835
|
.ffe-grid__col--lg-1 {
|
|
754
836
|
display: block;
|
|
755
|
-
grid-column:
|
|
837
|
+
-ms-grid-column-span: 1;
|
|
838
|
+
-ms-grid-column: auto;
|
|
839
|
+
grid-column: auto / span 1;
|
|
756
840
|
}
|
|
757
841
|
.ffe-grid__col--lg-2 {
|
|
758
842
|
display: block;
|
|
759
|
-
grid-column:
|
|
843
|
+
-ms-grid-column-span: 2;
|
|
844
|
+
-ms-grid-column: auto;
|
|
845
|
+
grid-column: auto / span 2;
|
|
760
846
|
}
|
|
761
847
|
.ffe-grid__col--lg-3 {
|
|
762
848
|
display: block;
|
|
763
|
-
grid-column:
|
|
849
|
+
-ms-grid-column-span: 3;
|
|
850
|
+
-ms-grid-column: auto;
|
|
851
|
+
grid-column: auto / span 3;
|
|
764
852
|
}
|
|
765
853
|
.ffe-grid__col--lg-4 {
|
|
766
854
|
display: block;
|
|
767
|
-
grid-column:
|
|
855
|
+
-ms-grid-column-span: 4;
|
|
856
|
+
-ms-grid-column: auto;
|
|
857
|
+
grid-column: auto / span 4;
|
|
768
858
|
}
|
|
769
859
|
.ffe-grid__col--lg-5 {
|
|
770
860
|
display: block;
|
|
771
|
-
grid-column:
|
|
861
|
+
-ms-grid-column-span: 5;
|
|
862
|
+
-ms-grid-column: auto;
|
|
863
|
+
grid-column: auto / span 5;
|
|
772
864
|
}
|
|
773
865
|
.ffe-grid__col--lg-6 {
|
|
774
866
|
display: block;
|
|
775
|
-
grid-column:
|
|
867
|
+
-ms-grid-column-span: 6;
|
|
868
|
+
-ms-grid-column: auto;
|
|
869
|
+
grid-column: auto / span 6;
|
|
776
870
|
}
|
|
777
871
|
.ffe-grid__col--lg-7 {
|
|
778
872
|
display: block;
|
|
779
|
-
grid-column:
|
|
873
|
+
-ms-grid-column-span: 7;
|
|
874
|
+
-ms-grid-column: auto;
|
|
875
|
+
grid-column: auto / span 7;
|
|
780
876
|
}
|
|
781
877
|
.ffe-grid__col--lg-8 {
|
|
782
878
|
display: block;
|
|
783
|
-
grid-column:
|
|
879
|
+
-ms-grid-column-span: 8;
|
|
880
|
+
-ms-grid-column: auto;
|
|
881
|
+
grid-column: auto / span 8;
|
|
784
882
|
}
|
|
785
883
|
.ffe-grid__col--lg-9 {
|
|
786
884
|
display: block;
|
|
787
|
-
grid-column:
|
|
885
|
+
-ms-grid-column-span: 9;
|
|
886
|
+
-ms-grid-column: auto;
|
|
887
|
+
grid-column: auto / span 9;
|
|
788
888
|
}
|
|
789
889
|
.ffe-grid__col--lg-10 {
|
|
790
890
|
display: block;
|
|
791
|
-
grid-column:
|
|
891
|
+
-ms-grid-column-span: 10;
|
|
892
|
+
-ms-grid-column: auto;
|
|
893
|
+
grid-column: auto / span 10;
|
|
792
894
|
}
|
|
793
895
|
.ffe-grid__col--lg-11 {
|
|
794
896
|
display: block;
|
|
795
|
-
grid-column:
|
|
897
|
+
-ms-grid-column-span: 11;
|
|
898
|
+
-ms-grid-column: auto;
|
|
899
|
+
grid-column: auto / span 11;
|
|
796
900
|
}
|
|
797
901
|
.ffe-grid__col--lg-12 {
|
|
798
902
|
display: block;
|
|
799
|
-
grid-column:
|
|
903
|
+
-ms-grid-column-span: 12;
|
|
904
|
+
-ms-grid-column: auto;
|
|
905
|
+
grid-column: auto / span 12;
|
|
800
906
|
}
|
|
801
907
|
.ffe-grid__col--lg-offset-1 {
|
|
802
|
-
grid-column
|
|
908
|
+
-ms-grid-column: 2;
|
|
909
|
+
grid-column-start: 2;
|
|
803
910
|
}
|
|
804
911
|
.ffe-grid__col--lg-offset-2 {
|
|
805
|
-
grid-column
|
|
912
|
+
-ms-grid-column: 3;
|
|
913
|
+
grid-column-start: 3;
|
|
806
914
|
}
|
|
807
915
|
.ffe-grid__col--lg-offset-3 {
|
|
808
|
-
grid-column
|
|
916
|
+
-ms-grid-column: 4;
|
|
917
|
+
grid-column-start: 4;
|
|
809
918
|
}
|
|
810
919
|
.ffe-grid__col--lg-offset-4 {
|
|
811
|
-
grid-column
|
|
920
|
+
-ms-grid-column: 5;
|
|
921
|
+
grid-column-start: 5;
|
|
812
922
|
}
|
|
813
923
|
.ffe-grid__col--lg-offset-5 {
|
|
814
|
-
grid-column
|
|
924
|
+
-ms-grid-column: 6;
|
|
925
|
+
grid-column-start: 6;
|
|
815
926
|
}
|
|
816
927
|
.ffe-grid__col--lg-offset-6 {
|
|
817
|
-
grid-column
|
|
928
|
+
-ms-grid-column: 7;
|
|
929
|
+
grid-column-start: 7;
|
|
818
930
|
}
|
|
819
931
|
.ffe-grid__col--lg-offset-7 {
|
|
820
|
-
grid-column
|
|
932
|
+
-ms-grid-column: 8;
|
|
933
|
+
grid-column-start: 8;
|
|
821
934
|
}
|
|
822
935
|
.ffe-grid__col--lg-offset-8 {
|
|
823
|
-
grid-column
|
|
936
|
+
-ms-grid-column: 9;
|
|
937
|
+
grid-column-start: 9;
|
|
824
938
|
}
|
|
825
939
|
.ffe-grid__col--lg-offset-9 {
|
|
826
|
-
grid-column
|
|
940
|
+
-ms-grid-column: 10;
|
|
941
|
+
grid-column-start: 10;
|
|
827
942
|
}
|
|
828
943
|
.ffe-grid__col--lg-offset-10 {
|
|
829
|
-
grid-column
|
|
944
|
+
-ms-grid-column: 11;
|
|
945
|
+
grid-column-start: 11;
|
|
830
946
|
}
|
|
831
947
|
.ffe-grid__col--lg-offset-11 {
|
|
832
|
-
grid-column
|
|
948
|
+
-ms-grid-column: 12;
|
|
949
|
+
grid-column-start: 12;
|
|
833
950
|
}
|
|
834
951
|
.ffe-grid__col--lg-offset-12 {
|
|
835
|
-
grid-column
|
|
952
|
+
-ms-grid-column: 13;
|
|
953
|
+
grid-column-start: 13;
|
|
836
954
|
}
|
|
837
955
|
}
|
|
838
956
|
@media (min-width: 1280px) {
|
|
839
957
|
.ffe-grid__col--xl-0 {
|
|
840
958
|
display: block;
|
|
841
|
-
grid-column:
|
|
959
|
+
-ms-grid-column-span: 0;
|
|
960
|
+
-ms-grid-column: auto;
|
|
961
|
+
grid-column: auto / span 0;
|
|
842
962
|
display: none;
|
|
843
963
|
}
|
|
844
964
|
.ffe-grid__col--xl-1 {
|
|
845
965
|
display: block;
|
|
846
|
-
grid-column:
|
|
966
|
+
-ms-grid-column-span: 1;
|
|
967
|
+
-ms-grid-column: auto;
|
|
968
|
+
grid-column: auto / span 1;
|
|
847
969
|
}
|
|
848
970
|
.ffe-grid__col--xl-2 {
|
|
849
971
|
display: block;
|
|
850
|
-
grid-column:
|
|
972
|
+
-ms-grid-column-span: 2;
|
|
973
|
+
-ms-grid-column: auto;
|
|
974
|
+
grid-column: auto / span 2;
|
|
851
975
|
}
|
|
852
976
|
.ffe-grid__col--xl-3 {
|
|
853
977
|
display: block;
|
|
854
|
-
grid-column:
|
|
978
|
+
-ms-grid-column-span: 3;
|
|
979
|
+
-ms-grid-column: auto;
|
|
980
|
+
grid-column: auto / span 3;
|
|
855
981
|
}
|
|
856
982
|
.ffe-grid__col--xl-4 {
|
|
857
983
|
display: block;
|
|
858
|
-
grid-column:
|
|
984
|
+
-ms-grid-column-span: 4;
|
|
985
|
+
-ms-grid-column: auto;
|
|
986
|
+
grid-column: auto / span 4;
|
|
859
987
|
}
|
|
860
988
|
.ffe-grid__col--xl-5 {
|
|
861
989
|
display: block;
|
|
862
|
-
grid-column:
|
|
990
|
+
-ms-grid-column-span: 5;
|
|
991
|
+
-ms-grid-column: auto;
|
|
992
|
+
grid-column: auto / span 5;
|
|
863
993
|
}
|
|
864
994
|
.ffe-grid__col--xl-6 {
|
|
865
995
|
display: block;
|
|
866
|
-
grid-column:
|
|
996
|
+
-ms-grid-column-span: 6;
|
|
997
|
+
-ms-grid-column: auto;
|
|
998
|
+
grid-column: auto / span 6;
|
|
867
999
|
}
|
|
868
1000
|
.ffe-grid__col--xl-7 {
|
|
869
1001
|
display: block;
|
|
870
|
-
grid-column:
|
|
1002
|
+
-ms-grid-column-span: 7;
|
|
1003
|
+
-ms-grid-column: auto;
|
|
1004
|
+
grid-column: auto / span 7;
|
|
871
1005
|
}
|
|
872
1006
|
.ffe-grid__col--xl-8 {
|
|
873
1007
|
display: block;
|
|
874
|
-
grid-column:
|
|
1008
|
+
-ms-grid-column-span: 8;
|
|
1009
|
+
-ms-grid-column: auto;
|
|
1010
|
+
grid-column: auto / span 8;
|
|
875
1011
|
}
|
|
876
1012
|
.ffe-grid__col--xl-9 {
|
|
877
1013
|
display: block;
|
|
878
|
-
grid-column:
|
|
1014
|
+
-ms-grid-column-span: 9;
|
|
1015
|
+
-ms-grid-column: auto;
|
|
1016
|
+
grid-column: auto / span 9;
|
|
879
1017
|
}
|
|
880
1018
|
.ffe-grid__col--xl-10 {
|
|
881
1019
|
display: block;
|
|
882
|
-
grid-column:
|
|
1020
|
+
-ms-grid-column-span: 10;
|
|
1021
|
+
-ms-grid-column: auto;
|
|
1022
|
+
grid-column: auto / span 10;
|
|
883
1023
|
}
|
|
884
1024
|
.ffe-grid__col--xl-11 {
|
|
885
1025
|
display: block;
|
|
886
|
-
grid-column:
|
|
1026
|
+
-ms-grid-column-span: 11;
|
|
1027
|
+
-ms-grid-column: auto;
|
|
1028
|
+
grid-column: auto / span 11;
|
|
887
1029
|
}
|
|
888
1030
|
.ffe-grid__col--xl-12 {
|
|
889
1031
|
display: block;
|
|
890
|
-
grid-column:
|
|
1032
|
+
-ms-grid-column-span: 12;
|
|
1033
|
+
-ms-grid-column: auto;
|
|
1034
|
+
grid-column: auto / span 12;
|
|
891
1035
|
}
|
|
892
1036
|
.ffe-grid__col--xl-offset-1 {
|
|
893
|
-
grid-column
|
|
1037
|
+
-ms-grid-column: 2;
|
|
1038
|
+
grid-column-start: 2;
|
|
894
1039
|
}
|
|
895
1040
|
.ffe-grid__col--xl-offset-2 {
|
|
896
|
-
grid-column
|
|
1041
|
+
-ms-grid-column: 3;
|
|
1042
|
+
grid-column-start: 3;
|
|
897
1043
|
}
|
|
898
1044
|
.ffe-grid__col--xl-offset-3 {
|
|
899
|
-
grid-column
|
|
1045
|
+
-ms-grid-column: 4;
|
|
1046
|
+
grid-column-start: 4;
|
|
900
1047
|
}
|
|
901
1048
|
.ffe-grid__col--xl-offset-4 {
|
|
902
|
-
grid-column
|
|
1049
|
+
-ms-grid-column: 5;
|
|
1050
|
+
grid-column-start: 5;
|
|
903
1051
|
}
|
|
904
1052
|
.ffe-grid__col--xl-offset-5 {
|
|
905
|
-
grid-column
|
|
1053
|
+
-ms-grid-column: 6;
|
|
1054
|
+
grid-column-start: 6;
|
|
906
1055
|
}
|
|
907
1056
|
.ffe-grid__col--xl-offset-6 {
|
|
908
|
-
grid-column
|
|
1057
|
+
-ms-grid-column: 7;
|
|
1058
|
+
grid-column-start: 7;
|
|
909
1059
|
}
|
|
910
1060
|
.ffe-grid__col--xl-offset-7 {
|
|
911
|
-
grid-column
|
|
1061
|
+
-ms-grid-column: 8;
|
|
1062
|
+
grid-column-start: 8;
|
|
912
1063
|
}
|
|
913
1064
|
.ffe-grid__col--xl-offset-8 {
|
|
914
|
-
grid-column
|
|
1065
|
+
-ms-grid-column: 9;
|
|
1066
|
+
grid-column-start: 9;
|
|
915
1067
|
}
|
|
916
1068
|
.ffe-grid__col--xl-offset-9 {
|
|
917
|
-
grid-column
|
|
1069
|
+
-ms-grid-column: 10;
|
|
1070
|
+
grid-column-start: 10;
|
|
918
1071
|
}
|
|
919
1072
|
.ffe-grid__col--xl-offset-10 {
|
|
920
|
-
grid-column
|
|
1073
|
+
-ms-grid-column: 11;
|
|
1074
|
+
grid-column-start: 11;
|
|
921
1075
|
}
|
|
922
1076
|
.ffe-grid__col--xl-offset-11 {
|
|
923
|
-
grid-column
|
|
1077
|
+
-ms-grid-column: 12;
|
|
1078
|
+
grid-column-start: 12;
|
|
924
1079
|
}
|
|
925
1080
|
.ffe-grid__col--xl-offset-12 {
|
|
926
|
-
grid-column
|
|
1081
|
+
-ms-grid-column: 13;
|
|
1082
|
+
grid-column-start: 13;
|
|
927
1083
|
}
|
|
928
1084
|
}
|
|
929
1085
|
.ffe-grid__col--center {
|
|
930
|
-
display: -webkit-box;
|
|
931
1086
|
display: -ms-flexbox;
|
|
932
1087
|
display: flex;
|
|
933
1088
|
place-items: center;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sb1/ffe-grid",
|
|
3
|
-
"version": "100.
|
|
3
|
+
"version": "100.7.0",
|
|
4
4
|
"description": "A grid component for use within the FFE framework",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ffe"
|
|
@@ -23,13 +23,13 @@
|
|
|
23
23
|
"build": "lessc less/ffe-grid.less css/ffe-grid.css --autoprefix"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@sb1/ffe-core": "^100.
|
|
26
|
+
"@sb1/ffe-core": "^100.7.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@sb1/ffe-buildtool": "^100.
|
|
29
|
+
"@sb1/ffe-buildtool": "^100.7.0"
|
|
30
30
|
},
|
|
31
31
|
"publishConfig": {
|
|
32
32
|
"access": "public"
|
|
33
33
|
},
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "206ebc01a87406a446cd81ee712e2e192ab3f193"
|
|
35
35
|
}
|