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,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>