:recycle: breaking out tabs in summary bar

frontend/src/components/ProfileCard.vue

@@ -44,8 +44,8 @@ import SummaryBar from './SummaryBar.vue'
 import TagList from './TagList.vue'
 import PairingButton from './PairingButton.vue'
 
-// const isPaired = ref(true)
-const isPaired = ref(false)
+const isPaired = ref(true)
+// const isPaired = ref(false)
 
 const props = defineProps({
     card: {

frontend/src/components/SummaryBar.vue

@@ -9,8 +9,28 @@ section.w-flex.column.pb5
                     p(v-if="tabContent[item].matchPerc") {{ tabContent[item].matchPerc }}%
                     p(v-else)  
                     p {{ item }}
-            template(v-if="isTab" #item-content="{ item }")
-                .tab 
+            // About Tab
+            template(#item-content.1="{ item }")
+                .tab--about
+                    p {{ tabContent[item].tab }}
+                    br
+                    p {{ tabContent[item].tab }}
+                    br
+                    hr
+            
+            // Passion Tab
+            template(#item-content.2="{ item }")
+                .tab--passion
+                    p {{ tabContent[item].tab }}
+
+            // Aspirations Tab
+            template(#item-content.3="{ item }")
+                .tab--aspirations
+                    p {{ tabContent[item].tab }}
+
+            // Skills Tab
+            template(#item-content.4="{ item }")
+                .tab--skills
                     p {{ tabContent[item].tab }}
 
         // Untabbed Layout