From bd0e6ab323b75df078604996427c6cd66dfcee7b Mon Sep 17 00:00:00 2001
From: Arne Schauf <git@asw.io>
Date: Tue, 6 Mar 2018 00:07:47 +0100
Subject: allow markdown in mod description

---
 src/pages/UploadCreate.vue | 19 +++++++++----------
 src/pages/UploadDetail.vue |  7 ++++++-
 2 files changed, 15 insertions(+), 11 deletions(-)

(limited to 'src/pages')

diff --git a/src/pages/UploadCreate.vue b/src/pages/UploadCreate.vue
index 26e7703..1c2506a 100644
--- a/src/pages/UploadCreate.vue
+++ b/src/pages/UploadCreate.vue
@@ -14,20 +14,22 @@
                      icon="fa-pencil">
               <q-input v-model="title" float-label="Title" />
             </q-field>
-            <q-field :error="errors.description !== undefined"
-                     :error-label="errors.description"
-                     icon="fa-bars">
-              <q-input v-model="description" type="textarea" float-label="Description" />
-            </q-field>
             <q-field :error="errors.tags !== undefined"
                      :error-label="errors.tags"
                      icon="fa-tags">
               <q-chips-input v-model="tags" float-label="Tags"></q-chips-input>
             </q-field>
+            <q-field :error="errors.description !== undefined"
+                     :error-label="errors.description"
+                     icon="fa-bars">
+              <q-input v-model="description" type="textarea" float-label="Description (Markdown possible)" />
+            </q-field>
           </div>
           <q-stepper-navigation>
             <q-btn color="primary" :disabled="!description || !title" @click="$refs.stepper.next()">Next</q-btn>
           </q-stepper-navigation>
+          <h5>Description Preview</h5>
+          <vue-markdown class="markdown indent" :html="false" :source="description"></vue-markdown>
         </q-step>
         <q-step name="pic" title="Add image">
           <p>You can upload an image, e.g. a screenshot, that will be used as a preview for your mod</p>
@@ -128,6 +130,7 @@
 <script>
   import Dropzone from 'vue2-dropzone'
   import 'vue2-dropzone/dist/vue2Dropzone.css'
+  import VueMarkdown from 'vue-markdown'
 
   import {
     LocalStorage,
@@ -136,6 +139,7 @@
   export default {
     components: {
       Dropzone,
+      VueMarkdown,
     },
     data () {
       return {
@@ -264,8 +268,3 @@
     },
   }
 </script>
-
-<style lang="styl" type="text/stylus" scoped>
-  .indent
-    margin: 1rem 3rem 2rem 3rem
-</style>
diff --git a/src/pages/UploadDetail.vue b/src/pages/UploadDetail.vue
index d85e3cc..223ad35 100644
--- a/src/pages/UploadDetail.vue
+++ b/src/pages/UploadDetail.vue
@@ -35,8 +35,11 @@
         </q-card-actions>
         <q-card-main>
           <p class="text-faded">
-            {{ upload.description }}
+            <vue-markdown class="markdown" :html="false" :source="upload.description"></vue-markdown>
           </p>
+        </q-card-main>
+        <q-card-title>Tags</q-card-title>
+        <q-card-main>
           <div class="group">
             <q-chip v-for="tag of upload.tags" :key="tag">{{ tag }}</q-chip>
           </div>
@@ -180,11 +183,13 @@
   import UploadVoter from 'components/UploadVoter'
   import CommentVoter from 'components/CommentVoter'
   import FileSaver from 'file-saver'
+  import VueMarkdown from 'vue-markdown'
 
   export default {
     components: {
       CommentVoter,
       UploadVoter,
+      VueMarkdown,
     },
     computed: {
       routeId () {
-- 
cgit v1.2.3-54-g00ecf