fix: NewsList template display 2 columns of new when used in small co…

…lumn - EXO-70464 Meeds-io/MIPs#113 update breakpoint definition This commit adapts breakpoint usage in news template
exoplatform · Mar 22, 2024 · bfedc76 · bfedc76
1 parent 472412d
commit bfedc76
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/webapp/src/main/webapp/news-list-view/components/views/NewsListTemplateView.vue b/webapp/src/main/webapp/news-list-view/components/views/NewsListTemplateView.vue
@@ -69,7 +69,7 @@ export default {
   computed: {
     numberOfColumns(){
       const thresholds = this.$vuetify.breakpoint?.thresholds;
-      return this.parentWidth < thresholds.xs ? 12 : this.parentWidth < thresholds.sm ? 6 : this.parentWidth < thresholds.lg ? 4 : 3;
+      return this.parentWidth < thresholds.sm ? 12 : this.parentWidth < thresholds.md ? 6 : this.parentWidth < thresholds.lg ? 4 : 3;
     }
   },
   created() {
@@ -141,4 +141,4 @@ export default {
     },
   }
 };
-</script>
+</script>
diff --git a/webapp/src/main/webapp/news-list-view/components/views/NewsMosaicView.vue b/webapp/src/main/webapp/news-list-view/components/views/NewsMosaicView.vue
@@ -100,7 +100,7 @@ export default {
   },
   computed: {
     isMobile() {
-      return this.$vuetify.breakpoint.name === 'xs' || this.$vuetify.breakpoint.name === 'sm';
+      return this.$vuetify.breakpoint.name === 'xs' || this.$vuetify.breakpoint.name === 'sm' || this.$vuetify.breakpoint.name === 'md';
     },
     isSmallBreakpoint() {
       return this.$vuetify.breakpoint.width < 651;