ui

bcgov · Feb 12, 2025 · c0e7904 · c0e7904
1 parent 6dc429a
commit c0e7904
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 13 deletions.
diff --git a/sources/packages/web/src/assets/css/student.scss b/sources/packages/web/src/assets/css/student.scss
@@ -36,3 +36,21 @@
   height: 100%;
   min-height: 350px;
 }
+
+// Mobile-specific styles
+.mobile-view {
+  :deep(.v-container) {
+    padding: 9px !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    margin: 0 !important;
+  }
+
+  :deep(.v-row) {
+    margin: 0 !important;
+  }
+
+  :deep(.v-col) {
+    padding: 9px !important;
+  }
+}
diff --git a/sources/packages/web/src/components/layouts/student/StudentPageContainer.vue b/sources/packages/web/src/components/layouts/student/StudentPageContainer.vue
@@ -2,7 +2,7 @@
   <full-page-container
     :layout-template="layoutTemplate"
     :full-width="fullWidth"
-    :class="{ 'mobile-container': isMobile }"
+    :class="{ 'mobile-view': isMobile }"
   >
     <template #header>
       <slot name="header"></slot>
@@ -50,9 +50,3 @@ export default defineComponent({
   },
 });
 </script>
-
-<style scoped>
-.mobile-container :deep(.v-container) {
-  padding: 5px !important;
-}
-</style>
diff --git a/sources/packages/web/src/views/student/StudentApplicationSummary.vue b/sources/packages/web/src/views/student/StudentApplicationSummary.vue
@@ -1,20 +1,18 @@
 <template>
-  <student-page-container
-    :full-width="true"
-    :class="{ 'mobile-margin': isMobile }"
-  >
+  <student-page-container :full-width="true">
     <template #header>
       <header-navigator title="Applications" subTitle="My Applications">
         <template #buttons>
-          <start-application />
+          <start-application :class="{ 'mb-2': isMobile }" />
         </template>
       </header-navigator>
     </template>
     <v-row>
-      <v-col cols="12">
+      <v-col cols="12" :class="{ 'pa-0': isMobile }">
         <student-applications
           :manage-application="true"
           :enable-view-application-on-name="true"
+          :dense="isMobile"
           @editApplicationAction="editApplicationAction"
           @openConfirmCancel="confirmCancelApplication"
           @goToApplication="goToApplication"