Merge pull request #106 from tobias-g1/develop

Resolve issues surrounding CSS & Missed code within steemgigs page

src/components/layout/footer.vue

@@ -125,7 +125,7 @@ export default {
         background-color: #6361d0;
         background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.09'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
         height: auto !important;
-        padding: 50px 100px;
+        padding: 50px 100px !important;;
         color: white;
         h3, h4, a {
             color: white;
@@ -150,7 +150,7 @@ export default {
     }
       @media only screen and (max-width: 600px) {
           .sg-footer {
-            padding: 50px 30px;
+            padding: 50px 30px !important;
           }
       }
 

src/components/layout/nav.vue

@@ -292,5 +292,6 @@ export default {
     color: #ACACAC;
     font-weight: bold;
     margin-right: 10px;
+    cursor: pointer;
   }
 </style>

src/components/snippets/category-preview.vue

@@ -54,7 +54,8 @@ export default {
   props: {
     post_type: String,
     header: String,
-    description: String
+    description: String,
+    limit: Number
   },
   methods: {
     async loadPosts () {
@@ -64,7 +65,7 @@ export default {
           'type': this.post_type,
           'pageNumber': 1,
           'order': this.selectedOrder,
-          'limit': 4
+          'limit': this.limit
         }
         await Api.search(searchQuery).then(result => {
           this.searchResults = result.data.results

src/components/views/home.vue

@@ -10,19 +10,19 @@
       </carousel>
       <!-- Gigs -->
       <el-row :gutter="15">
-      <categoryPreview post_type="steemgigs_post" header="SteemGigs" description="See what the SteemGigs community has to offer" />
+      <categoryPreview post_type="steemgigs_post" :limit="cardCount.gigs" header="SteemGigs" description="See what the SteemGigs community has to offer" />
       </el-row>
       <!-- Gigs Requests -->
       <el-row :gutter="15">
-      <categoryPreview post_type="steemgigs_request" header="SteemGig Requests" description="Custom requests as provided by our community."></categoryPreview>
+      <categoryPreview post_type="steemgigs_request" :limit="cardCount.requests" header="SteemGig Requests" description="Custom requests as provided by our community."></categoryPreview>
       </el-row>
        <!-- Testimonial -->
        <el-row :gutter="15">
-         <categoryPreview post_type="steemgigs_testimonial" header="Testimonials" description="SteemGigs success-stories written by our users"></categoryPreview>
+         <categoryPreview post_type="steemgigs_testimonial" :limit='cardCount.testimonials' header="Testimonials" description="SteemGigs success-stories written by our users"></categoryPreview>
       </el-row>
       <!-- SurpassingGoogle -->
       <el-row :gutter="15">
-      <categoryPreview post_type="steemgigs_surpassinggoogle" header="SurpassingGoogle" description="The Knowledge-Bank of SteemGigs"></categoryPreview>
+      <categoryPreview post_type="steemgigs_surpassinggoogle" :limit="cardCount.surpassinggoogle" header="SurpassingGoogle" description="The Knowledge-Bank of SteemGigs"></categoryPreview>
       </el-row>
     </el-main>
   </div>
@@ -51,7 +51,13 @@ export default {
       userTags: [],
       errorText: '',
       successText: '',
-      isPosting: false
+      isPosting: false,
+      cardCount: {
+        gigs: 8,
+        requests: 4,
+        testimonials: 4,
+        surpassinggoogle: 4
+      }
     }
   },
   methods: {

src/components/views/landing.vue

@@ -10,7 +10,7 @@
             <el-button class="primary" type="primary" slot="append" @click="search()">Search</el-button>
           </el-input>
         </el-col>
-        <el-col class="hero-img fill-height flex-col" :xs="0" :sm="0" :md="12" :lg="12" :xl="12">
+        <el-col class="hero-img fill-height flex-col" :xs="1" :sm="1" :md="12" :lg="12" :xl="12">
           <img src="/static/img/landing/landing_1.svg" alt="">
         </el-col>
       </el-row>
@@ -381,6 +381,9 @@ export default {
       section {
         padding: 50px 30px;
       }
+      .hero-img {
+        display: none;
+      }
     }
 }
 
@@ -392,6 +395,7 @@ export default {
     }
     img {
       padding: 60px;
+      display: flex;
     }
     .el-input-group__append {
       background-color: #6361D0 !important;

src/pages/platform/steemgigs.vue

@@ -24,6 +24,7 @@ import Page from '@/components/page'
 import CatNav from '@/components/layout/catNav'
 import LoadingPlaceholder from '@/components/widgets/gigLoading'
 import GigCard from '@/components/snippets/gigCard'
+import Api from '@/services/api'
 
 export default {
   components: {
@@ -34,12 +35,32 @@ export default {
   },
   data () {
     return {
-      loading: true
+      loading: true,
+      gigs: ''
     }
   },
-  computed: {
-    gigs () {
-      return this.$store.state.posts.steemgigs || []
+  mounted () {
+    this.getSteemGigs()
+  },
+  methods: {
+    async getSteemGigs () {
+      try {
+        let searchQuery = {
+          'type': 'steemgigs_post',
+          'pageNumber': 1,
+          'order': 'newest',
+          'limit': 50
+        }
+        await Api.search(searchQuery).then(result => {
+          this.gigs = result.data.results
+        })
+      } catch (err) {
+        // Send error toast notification upon error
+        this.$notify.error({
+          title: 'Error',
+          message: `Sorry, there seems to have been an error. Error Details - ${err}`
+        })
+      }
     }
   }
 }