Fix issue with settings page, truncate table data on overflow

cubing · Mar 25, 2021 · 48ccd5f · 48ccd5f
1 parent acbe4d1
commit 48ccd5f
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 9 deletions.
diff --git a/frontend/assets/main.css b/frontend/assets/main.css
@@ -6,3 +6,10 @@
   border-left: 5px solid var(--v-secondary-base);
   border-bottom: 5px solid var(--v-secondary-base);
 }
+
+.truncate {
+  max-width: 1px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
diff --git a/frontend/components/interface/crud/crudRecordInterface.vue b/frontend/components/interface/crud/crudRecordInterface.vue
@@ -267,6 +267,7 @@
             v-for="(headerItem, i) in headers"
             :key="i"
             :class="headerItem.align ? 'text-' + headerItem.align : null"
+            class="truncate"
           >
             <div v-if="headerItem.value === null">
               <nuxt-link

diff --git a/frontend/layouts/default.vue b/frontend/layouts/default.vue
@@ -139,7 +139,9 @@
     </v-main>
     <v-footer :absolute="!fixed" app>
       <VersionCheckText />
-      <span>&nbsp;&copy; {{ new Date().getFullYear() }}</span>
+      <span class="hidden-sm-and-down"
+        >&nbsp;&copy; {{ new Date().getFullYear() }}</span
+      >
       <span class="pl-2 hidden-sm-and-down"
         >CubePB is made possible by
         <a @click="openLink('https://thecubicle.com')">TheCubicle.com</a></span

diff --git a/frontend/pages/settings.vue b/frontend/pages/settings.vue
@@ -20,7 +20,7 @@
               readonly
             ></v-text-field>
             <v-text-field
-              v-model="inputs.wca_id"
+              v-model="inputs.wcaId"
               label="WCA ID"
               prepend-icon="mdi-account-details"
               readonly
@@ -71,7 +71,7 @@
             >
             <v-divider></v-divider>
             <v-switch
-              v-model="inputs.is_public"
+              v-model="inputs.isPublic"
               label="Public Profile Page"
               @change="inputsChanged = true"
             ></v-switch>
@@ -105,10 +105,10 @@ export default {
       inputs: {
         id: null,
         name: null,
-        wca_id: null,
+        wcaId: null,
         avatar: null,
         country: null,
-        is_public: null,
+        isPublic: null,
       },
 
       inputsChanged: false,
@@ -143,7 +143,7 @@ export default {
                 id: this.inputs.id,
               },
               fields: {
-                is_public: this.inputs.is_public,
+                isPublic: this.inputs.isPublic,
               },
             },
           },
@@ -172,7 +172,7 @@ export default {
                 id: this.inputs.id,
               },
               fields: {
-                is_public: this.inputs.is_public,
+                isPublic: this.inputs.isPublic,
               },
             },
           },
@@ -199,10 +199,10 @@ export default {
           getCurrentUser: {
             id: true,
             name: true,
-            wca_id: true,
+            wcaId: true,
             avatar: true,
             country: true,
-            is_public: true,
+            isPublic: true,
           },
         })