Option to limit card-deck to a maximum N columns

Only 3 supported for now
This commit is contained in:
Pablo Vazquez 2018-09-16 03:42:48 +02:00
parent fbc7c0fce7
commit 4e5a53a19b
2 changed files with 21 additions and 7 deletions

View File

@ -4,23 +4,37 @@
@extend .row @extend .row
.card .card
@extend .col-md-3 @extend .col-md-4
+media-xs
+media-sm
flex: 1 0 50% flex: 1 0 50%
max-width: 50% max-width: 50%
+media-sm +media-md
flex: 1 0 33% flex: 1 0 33%
max-width: 33% max-width: 33%
+media-md +media-lg
flex: 1 0 33%
max-width: 33%
+media-xl
flex: 1 0 25% flex: 1 0 25%
max-width: 25% max-width: 25%
+media-lg +media-xxl
flex: 1 0 20% flex: 1 0 20%
max-width: 20% max-width: 20%
&.card-3-columns .card
+media-xl
flex: 1 0 33%
max-width: 33%
+media-xxl
flex: 1 0 33%
max-width: 33%
&.card-deck-vertical &.card-deck-vertical
@extend .flex-column @extend .flex-column
flex-wrap: initial flex-wrap: initial

View File

@ -48,8 +48,8 @@ mixin nav-secondary-link()
a.nav-link&attributes(attributes) a.nav-link&attributes(attributes)
block block
mixin card-deck() mixin card-deck(max_columns)
.card-deck.card-padless.card-deck-responsive()&attributes(attributes) .card-deck.card-padless.card-deck-responsive(class="card-" + max_columns + "-columns")&attributes(attributes)
if block if block
block block
else else