refact theme todo with bug drag

This commit is contained in:
2020-07-26 22:15:30 +02:00
parent 8f66aee23d
commit 18fbf2f601
15 changed files with 99 additions and 33 deletions

View File

@@ -1,12 +1,12 @@
<template>
<div class="p-4">
<form @submit.prevent="submitForm">
<div class="flex justify-between flex-center mb-4">
<router-link to="/memos/" class="btn">Back</router-link>
<button class="btn-primary">Add New Memo</button>
</div>
<div class="mx-2 p-2">
<div class="flex justify-between flex-center mb-4">
<router-link to="/memos/" class="btn">Back</router-link>
<button class="btn-primary">Add New Memo</button>
</div>
<form @submit.prevent="submitForm" class="box">
<InputField name="name" label="Title" placeholder="Your Title" required @update:field="form.name = $event" :errors="errors" />
<TextAreaField class="" name="memo" placeholder="Your Memo" required @update:field="form.memo = $event" :errors="errors" />
<TextAreaField name="memo" placeholder="Your Memo" required @update:field="form.memo = $event" :errors="errors" />
</form>
</div>
</template>

View File

@@ -13,12 +13,12 @@
classes="cover"
:alt="form.name"/>
</div>
<div class="p-4">
<form @submit.prevent="submitForm">
<div class="mx-2 p-2">
<div class="flex justify-between mb-4">
<router-link :to="'/memos/' + this.$route.params.id" class="btn">Back</router-link>
<button class="btn-primary">Save</button>
</div>
<form @submit.prevent="submitForm" class="box">
<InputField name="name" :data="form.name" label="Title" placeholder="Your Title" required @update:field="form.name = $event" :errors="errors" />
<TextAreaField class="memo-text-area" name="memo" :data="form.memo" placeholder="Your Memo" required @update:field="form.memo = $event" :errors="errors" />
</form>

View File

@@ -1,5 +1,5 @@
<template>
<div class="p-4">
<div class="mx-2 p-2">
<div class="flex justify-between flex-center mb-4">
<a href="#" class="btn" @click="$router.back()">Back</a>
<router-link :to="'/memos/create'" class="btn-primary">Add New Memo</router-link>
@@ -9,14 +9,14 @@
<div v-if="memos.lenght === 0">
<p>No memos yet. <router-link to="/memos/create">Get Started ></router-link></p>
</div>
<router-link v-for="memo in memos" :key="memo.data.memo_id" :to="'/memos/' + memo.data.memo_id" class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4">
<div class="m-2 max-w-lg rounded overflow-hidden shadow-lg bg-white">
<img :src="memo.data.attributes.thumbnail_cover_image.data.attributes.path" alt="" class="w-full">
<div class="px-6 py-4">
<h1 class="text-gray-700">{{ memo.data.name }}</h1>
<router-link v-for="memo in memos" :key="memo.data.memo_id" :to="'/memos/' + memo.data.memo_id" class="flex-initial sm:mx-auto md:w-1/2 md:mx-0 lg:w-1/3 xl:w-1/4 mb-4 no-underline">
<div class="card">
<div class="-m-4">
<img :src="memo.data.attributes.thumbnail_cover_image.data.attributes.path" alt="" class="w-full rounded rounded-b-none">
</div>
<div class="flex justify-end py-2">
<span class="inline-block bg-gray-400 text-white rounded-full px-3 py-1 text-sm font-semibold mr-2">{{ memo.data.last_updated }}</span>
<div class="h-full flex flex-col mt-6">
<h1 class="text-xl text-marine">{{ memo.data.name }}</h1>
<span class="mt-auto self-end bg-gray-400 text-white tag">{{ memo.data.last_updated }}</span>
</div>
</div>
</router-link>

View File

@@ -30,7 +30,7 @@
<!-- <TagBox :memo="memo" />-->
<div class="p-4">
<div class="memo-style rounded-t-sm p-4 pb-3 -mb-1 bg-white" v-html="memoMarkdown"></div>
<div class="box memo-style rounded-t-sm p-4 pb-3 -mb-1 bg-white" v-html="memoMarkdown"></div>
<div class="bg-gray-400 text-white rounded-b-sm px-2 py-1 flex justify-end">@last update<span class="font-semibold ml-1">{{ memo.last_updated }}</span></div>
</div>
</div>