Romain/portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

almost finish tailwind transform

Browse Source
This commit is contained in:
Romulus21
2020-04-26 19:23:18 +02:00
parent ca7177f676
commit 578c51eb1a
20 changed files with 188 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
resources/js/views/Memo/MemoCreate.vue
View File

@@ -1,14 +1,14 @@
<template>
<div class="memo-edit p-2">
<div class="flex-between mb-1">
<div class="p-4">
<div class="flex justify-between flex-center mb-4">
<router-link to="/memos/" class="btn">< Back</router-link>
<button @click="$router.back()" class="btn-alert mr-1">Cancel</button>
<button @click="$router.back()" class="btn-alert">Cancel</button>
</div>
<form @submit.prevent="submitForm">
<InputField name="name" label="Title" placeholder="Your Title" required @update:field="form.name = $event" :errors="errors" />
<TextAreaField class="memo-text-area" name="memo" placeholder="Your Memo" required @update:field="form.memo = $event" :errors="errors" />
<TextAreaField class="" name="memo" placeholder="Your Memo" required @update:field="form.memo = $event" :errors="errors" />
<div class="flex-end mt-1">
<div class="flex justify-end mt-2">
<button class="btn-primary">Add New Memo</button>
</div>
</form>

10
resources/js/views/Memo/MemoEdit.vue
View File

@@ -12,15 +12,15 @@
:model="form.type"
classes="cover"
:alt="form.name"/>
<div class="flex-between ml-2 mt-1 absolute t-0">
<router-link :to="'/memos/' + this.$route.params.id" class="btn-secondary">< Back</router-link>
</div>
</div>
<div class="p-2">
<div class="p-4">
<div class="flex justify-between mb-4">
<router-link :to="'/memos/' + this.$route.params.id" class="btn">< Back</router-link>
</div>
<form @submit.prevent="submitForm">
<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" />
<div class="flex-end mt-1">
<div class="flex justify-end mt-2">
<button class="btn-primary">Save</button>
</div>

18
resources/js/views/Memo/MemoIndex.vue
View File

@@ -5,17 +5,19 @@
<router-link :to="'/memos/create'" class="btn-primary">Add New Memo</router-link>
</div>
<Loader v-if="loading" />
<div v-else class="flex flex-wrap mb-4">
<div v-else class="flex flex-wrap -m-2">
<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="lg:w-1/4 p-2 max-w-lg rounded overflow-hidden shadow-lg bg-white">
<img :src="memo.data.attributes.cover_image.data.attributes.path" alt="" class="w-full">
<div class="px-6 py-4">
<h1 class="text-gray-700 text-">{{ memo.data.name }}</h1>
</div>
<div class="px-6 py-4">
<span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2">{{ memo.data.last_updated }}</span>
<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.cover_image.data.attributes.path" alt="" class="w-full">
<div class="px-6 py-4">
<h1 class="text-gray-700 text-">{{ memo.data.name }}</h1>
</div>
<div class="flex justify-end py-2">
<span class="inline-block bg-orange-400 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2">{{ memo.data.last_updated }}</span>
</div>
</div>
</router-link>
</div>

16
resources/js/views/Memo/MemoShow.vue
View File

@@ -4,8 +4,8 @@
<div v-else>
<div v-if="modal" class="modal-container" @click="modal = ! modal"></div>
<div v-if="modal" class="modal">
<p class="m-1 text-center">Are you sure you want to delete this record ?</p>
<div class="flex-center m-1 mt-2">
<p class="m-2 text-center">Are you sure you want to delete this record ?</p>
<div class="flex justify-center mx-2 my-4">
<button class="btn-secondary mr-2" @click="modal = ! modal">Cancel</button>
<button class="btn-alert" @click="destroy"> Delete</button>
</div>
@@ -16,22 +16,22 @@
class="cover"
:src="memo.attributes.cover_image.data.attributes.path"
/>
<div class="flex-col flex-between absolute memo-cover">
<div class="flex-between px-2 py-1">
<div class="absolute flex flex-col justify-between w-full top-0 bottom-0">
<div class="flex items-center justify-between p-4">
<router-link to="/memos/" class="btn-secondary">< Back</router-link>
<div class="flex-middle">
<router-link :to="'/memos/' + memo.memo_id + '/edit'" class="btn-secondary mr-1" >Edit</router-link>
<a href="#" class="btn-alert" @click="modal = ! modal">Delete</a>
</div>
</div>
<h1 class="memo-title flex-center">{{ memo.name }}</h1>
<h1 class="flex justify-center text-white text-3xl px-4 font-bold text-shadow">{{ memo.name }}</h1>
</div>
</div>
<!-- <TagBox :memo="memo" />-->
<div class="p-2">
<div class="p-4">
<p class="memo-style pt-1" v-html="memoMarkdown"></p>
<div class="memo-change">@last update : {{ memo.last_updated }}</div>
<p class="pt-2" v-html="memoMarkdown"></p>
<div class="bg-orange-400 rounded mt-2 px-2 py-1 flex justify-end">@last update {{ memo.last_updated }}</div>
</div>
</div>
</div>