Merge pull request #24 from killbotXD/V0.1.1-patch-1

Fix UI crashes
devlup-labs · Aug 19, 2020 · a2a9853 · a2a9853
2 parents 6d884ef + 01eacaf
commit a2a9853
Show file tree

Hide file tree

Showing 16 changed files with 64 additions and 43 deletions.
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/img/icons/favicon-16x16.png b/public/img/icons/favicon-16x16.png
diff --git a/public/img/icons/favicon-32x32.png b/public/img/icons/favicon-32x32.png
diff --git a/src/components/FestivalCarousel.vue b/src/components/FestivalCarousel.vue
@@ -1,6 +1,11 @@
 <template lang="pug">
-  v-carousel(cycle hide-delimiter-background show-arrows-on-hover).text-center
+  v-carousel(
+    cycle
+    hide-delimiter-background
+    show-arrows-on-hover
+    height="auto" ).text-center
     v-carousel-item(
+      height="auto"
       transition="fade-transition"
       reverse-transition="fade-transition"
       v-for="({ node }, i) in festivalsList" :key="i"

diff --git a/src/components/OfficeBearerCard.vue b/src/components/OfficeBearerCard.vue
@@ -4,17 +4,15 @@
       v-stepper-content.pa-0(step="1")
         v-card(:height="avatarSize * 3")
           v-img(
-            v-if="profile.cover.sizes"
-            :src="profile.cover.sizes.find(e => e.name === 'full_size').url"
+            :src="profile.cover.sizes.length?profile.cover.sizes.find(e => e.name === 'full_size').url:require('@/assets/cover4.svg')"
             :height="avatarSize"
           )
-          v-img(v-else src="../assets/cover4.svg" :height="avatarSize")
           v-card-text.pt-0.text-center
             v-avatar.elevation-4.ma-2(
               :size="avatarSize"
               :style="{'margin-top': `-${avatarSize / 2}px !important`}"
             )
-              v-img(:src="profile.avatar.sizes?profile.avatar.sizes.find(e => e.name === 'full_size').url:require('@/assets/avatar_default.png')")
+              v-img(:src="profile.avatar.sizes.length?profile.avatar.sizes.find(e => e.name === 'full_size').url:require('@/assets/avatar_default.png')")
             h2(class="black--text").font-weight-bold.mt-5 {{ profile.user.firstName }} {{ profile.user.lastName }}
             p.font-weight-regular.mt-2 {{ designation.toString() }}
           v-card-actions

diff --git a/src/components/common/CustomLightGallery.vue b/src/components/common/CustomLightGallery.vue
@@ -9,7 +9,7 @@
               @click.stop="show(j)"
             )
               v-img(
-                :src="node.image.sizes[0].url"
+                :src="node.image.sizes.find(e => e.name === 'full_size').url"
                 height="250px"
                 v-on="on"
               )
@@ -37,7 +37,7 @@
                   v-row.justify-center.mb-1
                     span.font-weight-light.headline.pa-2 {{ node.title }}
                   v-row
-                    v-img(:src="node.image.sizes[0].url")
+                    v-img(:src="node.image.sizes.find(e => e.name === 'full_size').url")
 </template>
 
 <script>

diff --git a/src/components/common/Footer.vue b/src/components/common/Footer.vue
@@ -2,16 +2,14 @@
   div
     section
       v-card.elevation-0(color="blue darken-1 white--text" flat tile)
-        v-layout(row wrap align-center style="{background: #000000}").justify-center
-          v-flex.md6
-            v-layout(row).ml-12
+        v-row(style="{background: #000000}").justify-center
+          v-col(cols="12" md="6").text-center
+            v-layout(row)
               v-container
                 span ABOUT US
                 p Student Gymkhana IITJ
-                br
-                span Coming Soon!
-          v-flex.md6.justify-end
-            v-layout(row).text-end.mr-12
+          v-col(cols="12" md="6").text-center
+            v-layout(row)
               v-container(class="white--text")
                 p QUICK LINKS
                 p
@@ -31,4 +29,8 @@ export default {
 };
 </script>
 
-<style scoped></style>
+<style scoped>
+section {
+  overflow-x: hidden;
+}
+</style>
diff --git a/src/components/common/cards/CaptainComponent.vue b/src/components/common/cards/CaptainComponent.vue
@@ -3,12 +3,7 @@
     v-flex
       v-avatar.elevation-4.ma-2(size="180")
         v-img(
-          v-if="profile.avatar.sizes"
-          :src="profile.avatar.sizes.find(e => e.name === 'full_size').url"
-        )
-        v-img(
-          v-else
-          src="require('@/assets/avatar_default.png')"
+          :src="profile.avatar.sizes.length?profile.avatar.sizes.find(e => e.name === 'full_size').url:require('@/assets/avatar_default.png')"
         )
     v-flex.mt-4.font-weight-medium
       | {{ profile.user.firstName }} {{ profile.user.lastName }}

diff --git a/src/components/common/cards/CoreMemberComponent.vue b/src/components/common/cards/CoreMemberComponent.vue
@@ -3,13 +3,7 @@
     v-flex.md4
       v-card.elevation-6
         v-img(
-          v-if="profile.avatar.sizes"
-          :src="profile.avatar.sizes.find(e => e.name === 'full_size').url" max-height="200"
-        )
-        v-img(
-          v-else
-          src="require('@/assets/avatar_default.png')"
-          max-height="200"
+          :src="profile.avatar.sizes.length?profile.avatar.sizes.find(e => e.name === 'medium_square_crop').url:require('@/assets/avatar_default.png')"
         )
     v-flex.md4
       v-layout(column).align-center.ma-4

diff --git a/src/components/common/cards/StripedCard.vue b/src/components/common/cards/StripedCard.vue
@@ -8,7 +8,7 @@
         width="80%"
       )
         v-img(
-          :src="node.cover.sizes.length ? node.cover.sizes.find(e => e.name === 'full_size').url : require('../../../assets/cover4.svg')"
+          :src="node.cover.sizes.length ? node.cover.sizes.find(e => e.name === 'medium_square_crop').url : require('../../../assets/cover4.svg')"
           min-height="250px"
         )
           v-layout.align-end.fill-height

diff --git a/src/components/common/headers/Header.vue b/src/components/common/headers/Header.vue
@@ -1,19 +1,29 @@
 <template lang="pug">
   v-app-bar.px-md-12(app dark dense v-if="!$apollo.queries.societies.loading")
     img.mr-4(:src="logo" height="40")
-    v-toolbar-items
-      v-btn(text :to="{name: 'home'}" exact) Home
+    v-toolbar-items(hidden-sm-and-down)
+      v-btn(text :to="{name: 'home'}" exact)
+        v-icon(:left="$vuetify.breakpoint.mdAndUp") mdi-home
+        span(v-if="$vuetify.breakpoint.mdAndUp") Home
       v-menu(bottom=''  offset-y transition='slide-y-transition')
         template(v-slot:activator='{ on }')
+
           v-btn(text dark v-on='on')
-            | Societies
+            v-icon(:left="$vuetify.breakpoint.mdAndUp") mdi-account-multiple
+            span(v-if="$vuetify.breakpoint.mdAndUp") Societies
             v-icon(right) mdi-chevron-down
         v-list
           v-list-item(v-for='({ node }, i) in societies.edges' :key='i' link :to="{name: 'society', params: {slug: node.slug}}")
             v-list-item-title {{ node.name }}
-      v-btn(text :to="{name: 'konnekt-home'}") Konnekt
-      v-btn(text :to="{name: 'forum-home'}") Forum
-      v-btn(text :to="{name: 'office-bearers'}") People
+      v-btn(text :to="{name: 'konnekt-home'}")
+        v-icon(:left="$vuetify.breakpoint.mdAndUp") mdi-web
+        span(v-if="$vuetify.breakpoint.mdAndUp") Konnekt
+      v-btn(text :to="{name: 'forum-home'}")
+        v-icon(:left="$vuetify.breakpoint.mdAndUp") mdi-forum
+        span(v-if="$vuetify.breakpoint.mdAndUp") Forum
+      v-btn(text :to="{name: 'office-bearers'}")
+        v-icon(:left="$vuetify.breakpoint.mdAndUp") mdi-clipboard-account
+        span(v-if="$vuetify.breakpoint.mdAndUp") People
     v-spacer
 </template>
 
@@ -28,6 +38,20 @@ export default {
     }
   },
   name: "Header",
+  data: () => ({
+    toolbarItems: [
+      { title: "Forum", icon: "mdi-forum", to: { name: "forum-home" } },
+      { title: "Konnekt", icon: "mdi-web", to: { name: "konnekt-home" } },
+      {
+        title: "Account",
+        icon: "mdi-account",
+        children: [
+          { title: "Profile", to: { name: "profile" } },
+          { title: "Logout" }
+        ]
+      }
+    ]
+  }),
   computed: {
     logo: () => GymkhanaLogo
   }

diff --git a/src/components/konnekt/ProfileTemplate.vue b/src/components/konnekt/ProfileTemplate.vue
@@ -2,7 +2,7 @@
   v-flex
     v-parallax(
       dark
-      src="require(@/assets/banner.jpg)"
+      :src="require('@/assets/banner.jpg')"
       :height="$vuetify.theme.options.parallaxHeight"
     )
       v-layout.justify-center.align-center.fill-height
@@ -47,6 +47,7 @@
             v-divider.mx-2
             v-card-text(v-if="profile.skills")
               v-chip.elevation-2.font-weight-bold.ma-1(
+                v-if="profile.skills.length"
                 xs2
                 color="light-blue darken-1 white--text"
                 v-for="(skill, i) in profile.skills.split(',')"

diff --git a/src/views/Club.vue b/src/views/Club.vue
@@ -30,7 +30,7 @@
             v-card-text(v-if="club.eventSet.edges.length")
               EventTable(:eventsList="club.eventSet.edges")
             v-card-text(v-else).text-center.subtitle-1.ml-2 There are currently no events.
-        v-flex.md7.offset-md1.elevation-0(flat tile depressed).pl-5.xs12
+        v-flex.md7.offset-md1.elevation-0(flat tile depressed).pl-md-5.xs12
           v-card-title.headline.justify-center
             v-icon(left large) mdi-newspaper-plus
             | Activities and News

diff --git a/src/views/Home.vue b/src/views/Home.vue
@@ -45,7 +45,7 @@
               v-col(v-else).text-center.title
                 | There is no News.
             v-col(md="6" sm="6")
-              v-row.pa-2.justify-center.title.font-weight-regular
+              v-row.pa-2.justify-center.title.font-weight-regular.text-center
                 v-icon(left) mdi-note-text
                 | Upcoming Events
               EventTable(
@@ -57,7 +57,7 @@
     v-parallax(
       v-if="!$apollo.queries.festivals.loading"
       src="../assets/hero.jpeg"
-      :height="carouselHeight"
+      :height="$vuetify.breakpoint.smAndDown?'auto':carouselHeight"
     )
       v-content.align-center.mask
         v-container.container--fluid.mb-12

diff --git a/src/views/ProfileDetail.vue b/src/views/ProfileDetail.vue
@@ -9,10 +9,9 @@
               v-on="on"
               dark
               icon
-              :to='{name : "profile-edit"}'
             )
               v-icon(size="30") mdi-plus
-          span Add Social Link
+          span Add Social Link! Coming Soon!
     v-tooltip(left color="black")
       template(v-slot:activator="{ on }")
         v-btn.ma-5(

diff --git a/src/views/ProfileEdit.vue b/src/views/ProfileEdit.vue
@@ -31,7 +31,7 @@
           v-col.pb-0
             p.mb-0.font-weight-light Skills
             v-chip.elevation-2.font-weight-bold.ma-1(
-              v-if="skills"
+              v-if="skills.length"
               xs2
               color="light-blue darken-1 white--text"
               v-for="(skill, i) in skills"
@@ -53,6 +53,7 @@
 import ProfileCard from "../components/ProfileCard";
 import { VIEWER_PROFILE_QUERY } from "../graphql/queries/viewerProfileQuery";
 import { UPDATE_PROFILE_MUTATION } from "../graphql/mutations/updateProfileMutation";
+
 export default {
   apollo: {
     viewer: {
@@ -118,7 +119,9 @@ export default {
       this.hometown = this.viewer.userprofile.hometown;
       this.about = this.viewer.userprofile.about;
       this.select = this.yearItems.find(e => e.text === this.viewer.userprofile.year);
-      this.skills = this.viewer.userprofile.skills.split(",");
+      if (this.viewer.userprofile.skills) {
+        this.skills = this.viewer.userprofile.skills.split(",");
+      }
       /* eslint-enable */
 
       return this.viewer.userprofile;