From 67f2c2969b21198e6b6f172ecaa36953ee97492c Mon Sep 17 00:00:00 2001
From: James Collins <james.collins@outlook.com.au>
Date: Thu, 26 Jan 2023 11:36:11 +1000
Subject: [PATCH] added breakLarge option

---
 resources/js/components/SMRow.vue | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/SMRow.vue b/resources/js/components/SMRow.vue
index 838e5dd..adebc08 100644
--- a/resources/js/components/SMRow.vue
+++ b/resources/js/components/SMRow.vue
@@ -1,5 +1,6 @@
 <template>
-    <div :class="['row', { 'flex-fill': fill }]">
+    <div
+        :class="['row', { 'row-break-lg': breakLarge }, { 'flex-fill': fill }]">
         <slot></slot>
     </div>
 </template>
@@ -9,6 +10,12 @@ defineProps({
     fill: {
         type: Boolean,
         default: false,
+        required: false,
+    },
+    breakLarge: {
+        type: Boolean,
+        default: false,
+        required: false,
     },
 });
 </script>
@@ -16,13 +23,19 @@ defineProps({
 <style lang="scss">
 .row {
     display: flex;
-    // margin: map-get($spacer, 2) auto;
+    flex-direction: row;
     margin: 0 auto;
     align-items: top;
     width: 100%;
     max-width: 1200px;
 }
 
+@media screen and (max-width: 992px) {
+    .row.row-break-lg {
+        flex-direction: column;
+    }
+}
+
 @media screen and (max-width: 768px) {
     .row {
         flex-direction: column;