Skip to content

Commit 9e80711

Browse files
committed
EkCardGrid: Use simple grid if no pagination
If there is no need to paginate, just use a responsive grid. Also update current grid configuration to match: - 4 cards in large - 2 cards in medium - 1 card in small
1 parent fe3b218 commit 9e80711

1 file changed

Lines changed: 10 additions & 3 deletions

File tree

packages/ek-components/src/components/EkCardGrid.vue

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
<template>
22
<b-container
33
class="mb-5 mt-3 section-container"
4-
:fluid="variant === 'slidable-new'"
5-
:class="{ 'no-container-padding': variant === 'slidable' || variant === 'slidable-new' }"
4+
:fluid="displayVariant === 'EkSlidableCardGridNew'"
5+
:class="{ 'no-container-padding': (
6+
displayVariant === 'EkSlidableCardGrid' ||
7+
displayVariant === 'EkSlidableCardGridNew'
8+
) }"
69
>
710
<slot></slot>
811

@@ -42,7 +45,7 @@ export default {
4245
cardColumns: {
4346
type: Object,
4447
default() {
45-
return { cols: 6, md: 4, lg: 3 };
48+
return { cols: 6, sm: 12, md: 6, lg: 3 };
4649
},
4750
},
4851
variant: {
@@ -65,6 +68,10 @@ export default {
6568
},
6669
computed: {
6770
displayVariant() {
71+
if (this.variant === 'slidable-new' && this.itemsPerSlide.lg >= this.nodes.length) {
72+
// There is no need to display a more complex component if there is no pagination:
73+
return 'EkGridPage';
74+
}
6875
switch (this.variant) {
6976
case 'collapsible':
7077
return 'EkCollapsibleCardGrid';

0 commit comments

Comments
 (0)