Merge branch 'feature/Theme'
This commit is contained in:
18
package.json
18
package.json
@@ -17,29 +17,29 @@
|
|||||||
"cross-env": "^7.0",
|
"cross-env": "^7.0",
|
||||||
"eslint": "^6.8.0",
|
"eslint": "^6.8.0",
|
||||||
"eslint-config-standard": "^14.1.1",
|
"eslint-config-standard": "^14.1.1",
|
||||||
"eslint-loader": "^3.0.3",
|
"eslint-loader": "^3.0.4",
|
||||||
"eslint-plugin-import": "^2.20.2",
|
"eslint-plugin-import": "^2.22.0",
|
||||||
"eslint-plugin-node": "^11.1.0",
|
"eslint-plugin-node": "^11.1.0",
|
||||||
"eslint-plugin-promise": "^4.2.1",
|
"eslint-plugin-promise": "^4.2.1",
|
||||||
"eslint-plugin-standard": "^4.0.1",
|
"eslint-plugin-standard": "^4.0.1",
|
||||||
"eslint-plugin-vue": "^6.2.2",
|
"eslint-plugin-vue": "^6.2.2",
|
||||||
"laravel-mix": "^5.0.1",
|
"laravel-mix": "^5.0.1",
|
||||||
"laravel-mix-eslint": "^0.1.3",
|
"laravel-mix-eslint": "^0.1.3",
|
||||||
"laravel-mix-purgecss": "^5.0.0-rc.2",
|
"laravel-mix-purgecss": "^5.0.0",
|
||||||
"lodash": "^4.17.13",
|
"lodash": "^4.17.19",
|
||||||
"resolve-url-loader": "^2.3.1",
|
"resolve-url-loader": "^2.3.1",
|
||||||
"sass": "^1.20.1",
|
"sass": "^1.26.10",
|
||||||
"sass-loader": "^8.0.0",
|
"sass-loader": "^8.0.0",
|
||||||
"vue": "^2.5.17",
|
"vue": "^2.5.17",
|
||||||
"vue-router": "^3.1.6",
|
"vue-router": "^3.3.4",
|
||||||
"vue-template-compiler": "^2.6.10",
|
"vue-template-compiler": "^2.6.10",
|
||||||
"vuex": "^3.1.3"
|
"vuex": "^3.5.1"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"dropzone": "^5.7.0",
|
"dropzone": "^5.7.2",
|
||||||
"laravel-mix-svg-vue": "^0.2.6",
|
"laravel-mix-svg-vue": "^0.2.6",
|
||||||
"markdown-it": "^10.0.0",
|
"markdown-it": "^10.0.0",
|
||||||
"markdown-it-checkbox": "^1.1.0",
|
"markdown-it-checkbox": "^1.1.0",
|
||||||
"tailwindcss": "^1.3.5"
|
"tailwindcss": "^1.5.2"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,6 +4,12 @@
|
|||||||
* Released under the MIT License.
|
* Released under the MIT License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
/*!
|
||||||
|
* vuex v3.5.1
|
||||||
|
* (c) 2020 Evan You
|
||||||
|
* @license MIT
|
||||||
|
*/
|
||||||
|
|
||||||
/*! https://mths.be/punycode v1.4.1 by @mathias */
|
/*! https://mths.be/punycode v1.4.1 by @mathias */
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -14,9 +20,3 @@
|
|||||||
* Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
|
* Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
|
||||||
* Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
|
* Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/**
|
|
||||||
* vuex v3.1.3
|
|
||||||
* (c) 2020 Evan You
|
|
||||||
* @license MIT
|
|
||||||
*/
|
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<div v-if="authUser" class="w-full overflow-y-auto">
|
<div v-if="authUser" class="w-full overflow-y-auto">
|
||||||
<TopBar />
|
<TopBar />
|
||||||
<main>
|
<main>
|
||||||
<router-view :key="$route.fullPath"></router-view>
|
<router-view :key="$route.fullPath" class="bg-gray-200"></router-view>
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="relative mb-2">
|
<div class="relative mb-2">
|
||||||
<label v-if="label" :for="name" class="pb-2 font-bold text-xl ml-1">{{ label }}</label>
|
<label v-if="label" :for="name" class="pb-2 font-bold text-xl ml-1">{{ label }}</label>
|
||||||
<input :id="name" :type="type" :placeholder="placeholder" v-model="value" @input="updateField()" :class="'w-full rounded p-2 ' + classes + ' ' + errorClassObject()">
|
<input :id="name" :type="type" :placeholder="placeholder" v-model="value" @input="updateField()" :class="'w-full p-2 ' + classes + ' ' + errorClassObject()">
|
||||||
<p class="text-red-600 m-0" v-text="errorMessage()">Error Here</p>
|
<p class="text-red-600 m-0" v-text="errorMessage()">Error Here</p>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="top-bar flex justify-between bg-gray-600">
|
<div class="top-bar relative z-10 flex justify-between bg-marine h-16">
|
||||||
<router-link v-if="authUser" :to="'/profile'" class="flex items-center m-2">
|
<router-link v-if="authUser" :to="'/profile'" class="flex items-center m-2">
|
||||||
<Avatar :avatar="authUser.data.attributes.thumbnail_cover_image.data.attributes.path" size="small" :alt="authUser.data.attributes.name" class="w-10 h-10"/>
|
<Avatar :avatar="authUser.data.attributes.thumbnail_cover_image.data.attributes.path" size="small" :alt="authUser.data.attributes.name" class="w-10 h-10"/>
|
||||||
<span class="ml-2 text-gray-100 hover:text-white">{{ authUser.data.attributes.name }}</span>
|
<span class="ml-2 text-gray-100 hover:text-white">{{ authUser.data.attributes.name }}</span>
|
||||||
@@ -11,7 +11,7 @@
|
|||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
<router-link to="/dashboard" v-if="authUser" class="text-gray-100 hover:text-white">
|
<router-link to="/dashboard" v-if="authUser" class="text-gray-100 hover:text-white">
|
||||||
<svg-vue icon="params" class="w-10 m-2 fill-current" />
|
<svg-vue icon="params" class="w-10 m-3 fill-current" />
|
||||||
</router-link>
|
</router-link>
|
||||||
<router-link v-else to="/login">
|
<router-link v-else to="/login">
|
||||||
Se connecter
|
Se connecter
|
||||||
|
|||||||
@@ -1,16 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="m-2">
|
<div class="card block">
|
||||||
<div class="card">
|
|
||||||
<div class="text-black m-2 p-2 flex flex-col">
|
|
||||||
<h2>Raspberry Links</h2>
|
<h2>Raspberry Links</h2>
|
||||||
<ul class="mt-2">
|
<ul class="mt-2">
|
||||||
<li><a v-for="(link, index) in links" :href="link.link" :key="index" target="_blank" class="block text-lg">{{ link.name }}</a></li>
|
<li><a v-for="(link, index) in links" :href="link.link" :key="index" target="_blank" class="block text-lg">{{ link.name }}</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -1,8 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="m-2">
|
<div class="card flex flex-col">
|
||||||
<div class="card">
|
|
||||||
<div class="text-black m-2 p-2 flex flex-col">
|
|
||||||
<h2>Météo Home</h2>
|
<h2>Météo Home</h2>
|
||||||
<ul class="mt-2">
|
<ul class="mt-2">
|
||||||
<li v-for="(captor, index) in captors" :key="index" class="block mb-4">
|
<li v-for="(captor, index) in captors" :key="index" class="block mb-4">
|
||||||
@@ -20,8 +18,6 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -1,5 +1,111 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="m-2 p-2 bg-white">
|
<div class="mx-2 p-2">
|
||||||
|
<div class="flex flex-wrap -mx-2">
|
||||||
|
<div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card bg-marine text-white shadow">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="text-xl">Active Users</div>
|
||||||
|
<div class="text-3xl font-bold">72</div>
|
||||||
|
<div class="mt-4">
|
||||||
|
<a href="#" class="text-white hover:text-marine-light uppercase">View Refferals -></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="w-full sm:w-1/2 md:w-2/3 lg:w-3/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<span>Users</span>
|
||||||
|
<span class="flex-none text-green text-sm">268 %</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-2xl font-bold">15K</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-wrap -mx-2">
|
||||||
|
<div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<span>Users</span>
|
||||||
|
<span class="flex-none text-green text-sm">268 %</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-2xl font-bold">15K</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<span>Sessions</span>
|
||||||
|
<span class="flex-none text-green text-sm">268 %</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-2xl font-bold">17K</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="flex justify-between items-start">
|
||||||
|
<span>Bouncing Rate</span>
|
||||||
|
<span class="flex-none text-red text-sm">- 158 %</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-2xl font-bold">62.7 %</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex-initial sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<span>Session duration best of</span>
|
||||||
|
<span class="flex-none text-green text-sm">189 %</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-2xl font-bold">1 m 32 s</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex-initial sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<span>Session duration best of</span>
|
||||||
|
<span class="flex-none text-green text-sm">189 %</span>
|
||||||
|
</div>
|
||||||
|
<div class="text-2xl font-bold">1 m 32 s</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex-initial sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="-m-4">
|
||||||
|
<img src="https://portal.bricooli.fr/storage/images/default-cover.jpg" alt="" class="w-full rounded rounded-b-none">
|
||||||
|
</div>
|
||||||
|
<div class="h-full flex flex-col mt-6">
|
||||||
|
<h1 class="text-xl text-marine">Memo Name test</h1>
|
||||||
|
<span class="mt-auto self-end bg-gray-400 text-white tag">Il y a 3 mois</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex-initial sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="-m-4">
|
||||||
|
<img src="https://portal.bricooli.fr/storage/images/default-cover.jpg" alt="" class="w-full rounded rounded-b-none">
|
||||||
|
</div>
|
||||||
|
<div class="h-full flex flex-col mt-6">
|
||||||
|
<h1 class="text-xl text-marine">Memo Name test</h1>
|
||||||
|
<p class="no-indent">Anim consequat duis culpa in anim aliquip dolore amet laboris eu fugiat commodo reprehenderit aute amet velit sit culpa et proident irure pariatur</p>
|
||||||
|
<span class="mt-auto self-end bg-gray-400 text-white tag">Il y a 3 mois</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex-initial sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4">
|
||||||
|
<div class="card">
|
||||||
|
<div class="-m-4">
|
||||||
|
<img src="https://portal.bricooli.fr/storage/images/default-cover.jpg" alt="" class="w-full rounded rounded-b-none">
|
||||||
|
</div>
|
||||||
|
<div class="h-full flex flex-col mt-6">
|
||||||
|
<h1 class="text-xl text-marine">Memo Name test</h1>
|
||||||
|
<p class="no-indent">Anim consequat duis culpa in anim aliquip dolore amet laboris eu fugiat commodo reprehenderit</p>
|
||||||
|
<span class="mt-auto self-end bg-gray-400 text-white tag">Il y a 3 mois</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="box">
|
||||||
<h1>testeur CSS</h1>
|
<h1>testeur CSS</h1>
|
||||||
<h2>testeur CSS</h2>
|
<h2>testeur CSS</h2>
|
||||||
<h3>testeur CSS</h3>
|
<h3>testeur CSS</h3>
|
||||||
@@ -64,6 +170,7 @@
|
|||||||
<input type="submit" class="mb-1">
|
<input type="submit" class="mb-1">
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-4">
|
<div class="mx-2 p-2">
|
||||||
|
<div class="box">
|
||||||
<div class="flex justify-between">
|
<div class="flex justify-between">
|
||||||
<h1 class="page-title">Administration</h1>
|
<h1 class="page-title">Administration</h1>
|
||||||
<a href="#" @click.prevent="logout" class="btn">
|
<a href="#" @click.prevent="logout" class="btn">
|
||||||
@@ -8,6 +9,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<UserAdmin />
|
<UserAdmin />
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -1,11 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-4">
|
<div class="mx-2 p-2">
|
||||||
<h1 class="page-title">Home</h1>
|
<div class="flex flex-wrap -mx-2">
|
||||||
<div class="flex flex-wrap -m-2 mt-2">
|
<OpenWeatherCard class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 mb-4" />
|
||||||
<OpenWeatherCard class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" />
|
<MemoHome class="w-full sm:w-1/2 md:w-1/3 lg:w-1/3 mb-4" />
|
||||||
<MemoHome class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" />
|
<AutomaticLinksHome class="w-full sm:w-1/2 md:w-1/3 lg:w-5/12 mb-4" />
|
||||||
<AutomaticLinksHome class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" />
|
<AutomaticMeteoHome class="w-full sm:w-1/2 md:w-1/3 lg:w-1/3 mb-4" />
|
||||||
<AutomaticMeteoHome class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,12 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-4">
|
<div class="mx-2 p-2">
|
||||||
<form @submit.prevent="submitForm">
|
|
||||||
<div class="flex justify-between flex-center mb-4">
|
<div class="flex justify-between flex-center mb-4">
|
||||||
<router-link to="/memos/" class="btn">Back</router-link>
|
<router-link to="/memos/" class="btn">Back</router-link>
|
||||||
<button class="btn-primary">Add New Memo</button>
|
<button class="btn-primary">Add New Memo</button>
|
||||||
</div>
|
</div>
|
||||||
|
<form @submit.prevent="submitForm" class="box">
|
||||||
<InputField name="name" label="Title" placeholder="Your Title" required @update:field="form.name = $event" :errors="errors" />
|
<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>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -13,12 +13,12 @@
|
|||||||
classes="cover"
|
classes="cover"
|
||||||
:alt="form.name"/>
|
:alt="form.name"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4">
|
<div class="mx-2 p-2">
|
||||||
<form @submit.prevent="submitForm">
|
|
||||||
<div class="flex justify-between mb-4">
|
<div class="flex justify-between mb-4">
|
||||||
<router-link :to="'/memos/' + this.$route.params.id" class="btn">Back</router-link>
|
<router-link :to="'/memos/' + this.$route.params.id" class="btn">Back</router-link>
|
||||||
<button class="btn-primary">Save</button>
|
<button class="btn-primary">Save</button>
|
||||||
</div>
|
</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" />
|
<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" />
|
<TextAreaField class="memo-text-area" name="memo" :data="form.memo" placeholder="Your Memo" required @update:field="form.memo = $event" :errors="errors" />
|
||||||
</form>
|
</form>
|
||||||
|
|||||||
@@ -1,21 +1,21 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="card m-2">
|
<div class="card">
|
||||||
<div v-if="loading" class="p-2">
|
<div v-if="loading">
|
||||||
<h2>Memos</h2>
|
<h2>Memos</h2>
|
||||||
<Loader />
|
<Loader />
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="p-2">
|
<div v-else>
|
||||||
<router-link to="/memos"><h2 class="mb-4 text-gray-900">{{ memos.count }} Memos</h2></router-link>
|
<router-link to="/memos" class="mb-4 no-underline"><h2>{{ memos.count }} Memos</h2></router-link>
|
||||||
<router-link :to="memos.last_updated.links.self" class="m-2 block">
|
<router-link :to="memos.last_updated.links.self" class="m-2 block no-underline">
|
||||||
<div class="flex justify-between text-black">
|
<div class="flex justify-between text-black">
|
||||||
Dernier édité
|
Dernier édité
|
||||||
<span class="inline-block bg-gray-400 text-white text-center rounded-full px-3 py-1 text-sm font-semibold">{{ memos.last_updated.data.last_updated }}</span>
|
<span class="inline-block bg-gray-400 text-white text-center rounded-full px-3 py-1 text-sm font-semibold">{{ memos.last_updated.data.last_updated }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="text-2xl font-bold">{{ memos.last_updated.data.name }}</div>
|
<div class="text-2xl font-bold">{{ memos.last_updated.data.name }}</div>
|
||||||
</router-link>
|
</router-link>
|
||||||
<hr class="border border-gray-900">
|
<hr class="border border-marine">
|
||||||
<router-link :to="memos.last_created.links.self" class="m-2 block">
|
<router-link :to="memos.last_created.links.self" class="m-2 block no-underline">
|
||||||
<div class="flex justify-between text-black">
|
<div class="flex justify-between text-black">
|
||||||
Dernier créé
|
Dernier créé
|
||||||
<span class="inline-block bg-gray-400 text-white text-center rounded-full px-3 py-1 text-sm font-semibold">{{ memos.last_created.data.last_updated }}</span>
|
<span class="inline-block bg-gray-400 text-white text-center rounded-full px-3 py-1 text-sm font-semibold">{{ memos.last_created.data.last_updated }}</span>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-4">
|
<div class="mx-2 p-2">
|
||||||
<div class="flex justify-between flex-center mb-4">
|
<div class="flex justify-between flex-center mb-4">
|
||||||
<a href="#" class="btn" @click="$router.back()">Back</a>
|
<a href="#" class="btn" @click="$router.back()">Back</a>
|
||||||
<router-link :to="'/memos/create'" class="btn-primary">Add New Memo</router-link>
|
<router-link :to="'/memos/create'" class="btn-primary">Add New Memo</router-link>
|
||||||
@@ -9,14 +9,14 @@
|
|||||||
<div v-if="memos.lenght === 0">
|
<div v-if="memos.lenght === 0">
|
||||||
<p>No memos yet. <router-link to="/memos/create">Get Started ></router-link></p>
|
<p>No memos yet. <router-link to="/memos/create">Get Started ></router-link></p>
|
||||||
</div>
|
</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">
|
<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="m-2 max-w-lg rounded overflow-hidden shadow-lg bg-white">
|
<div class="card">
|
||||||
<img :src="memo.data.attributes.thumbnail_cover_image.data.attributes.path" alt="" class="w-full">
|
<div class="-m-4">
|
||||||
<div class="px-6 py-4">
|
<img :src="memo.data.attributes.thumbnail_cover_image.data.attributes.path" alt="" class="w-full rounded rounded-b-none">
|
||||||
<h1 class="text-gray-700">{{ memo.data.name }}</h1>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-end py-2">
|
<div class="h-full flex flex-col mt-6">
|
||||||
<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>
|
<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>
|
||||||
</div>
|
</div>
|
||||||
</router-link>
|
</router-link>
|
||||||
|
|||||||
@@ -30,7 +30,7 @@
|
|||||||
<!-- <TagBox :memo="memo" />-->
|
<!-- <TagBox :memo="memo" />-->
|
||||||
<div class="p-4">
|
<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 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>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -3,9 +3,8 @@
|
|||||||
<div v-if="loading">
|
<div v-if="loading">
|
||||||
<Loader />
|
<Loader />
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="m-2">
|
<div v-else class="card">
|
||||||
<div class="card">
|
<div class="flex flex-col">
|
||||||
<div class="text-black m-2 p-2 flex flex-col">
|
|
||||||
<h2>{{ meteo.city.name }}</h2>
|
<h2>{{ meteo.city.name }}</h2>
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<div class="flex flex-col justify-end">
|
<div class="flex flex-col justify-end">
|
||||||
@@ -15,14 +14,13 @@
|
|||||||
<div><strong>{{ meteo.list[0].main.pressure }}</strong> hPa</div>
|
<div><strong>{{ meteo.list[0].main.pressure }}</strong> hPa</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col flex-1 justify-end items-end">
|
<div class="flex flex-col flex-1 justify-end items-end">
|
||||||
<i v-bind:class="'owf owf-5x owf-' + meteo.list[0].weather[0].id"></i>
|
<i v-bind:class="'current-fill text-marine owf owf-5x owf-' + meteo.list[0].weather[0].id"></i>
|
||||||
<div><strong>{{ meteo.list[0].weather[0].description }}</strong></div>
|
<div><strong>{{ meteo.list[0].weather[0].description }}</strong></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -15,7 +15,7 @@
|
|||||||
<input type="text"
|
<input type="text"
|
||||||
v-model="toDo.data.attributes.data.name"
|
v-model="toDo.data.attributes.data.name"
|
||||||
@keypress.enter="updateToDo"
|
@keypress.enter="updateToDo"
|
||||||
class="flex-1 rounded-sm border border-primary-600 pl-1">
|
class="flex-1 rounded-sm border border-primary-600 p-0 pl-1">
|
||||||
<span @click="edit = !edit">
|
<span @click="edit = !edit">
|
||||||
<svg-vue icon="close" class="inline w-4 fill-current cursor-pointer mx-2" />
|
<svg-vue icon="close" class="inline w-4 fill-current cursor-pointer mx-2" />
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="p-4">
|
<div class="mx-2 p-2">
|
||||||
<div v-if="modal" class="modal-container" @click="modal = ! modal"></div>
|
<div v-if="modal" class="modal-container" @click="modal = ! modal"></div>
|
||||||
<div v-if="modal" class="modal px-2">
|
<div v-if="modal" class="modal px-2">
|
||||||
<p class="m-2 text-center">Add a new to-do list ?</p>
|
<p class="m-2 text-center">Add a new to-do list ?</p>
|
||||||
@@ -22,8 +22,8 @@
|
|||||||
:key="index"
|
:key="index"
|
||||||
:to="'/to-do-lists/' + toDoList.data.to_do_list_id"
|
:to="'/to-do-lists/' + toDoList.data.to_do_list_id"
|
||||||
:to-do-list="toDoList"
|
:to-do-list="toDoList"
|
||||||
class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" >
|
class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 no-underline" >
|
||||||
<div class="bg-gray-300 rounded text-black m-2 p-2">
|
<div class="rounded bg-white text-black m-2 p-2">
|
||||||
<div class="flex justify-between">
|
<div class="flex justify-between">
|
||||||
<span class="font-bold">{{ toDoList.data.attributes.data.name }}</span>
|
<span class="font-bold">{{ toDoList.data.attributes.data.name }}</span>
|
||||||
<span>
|
<span>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="px-4 py-2">
|
<div class="mx-2 p-2">
|
||||||
<div v-if="modal" class="modal-container" @click="modal = ! modal"></div>
|
<div v-if="modal" class="modal-container" @click="modal = ! modal"></div>
|
||||||
<div v-if="modal" class="modal">
|
<div v-if="modal" class="modal">
|
||||||
<p class="m-2 text-center">Are you sure you want to delete this list ?</p>
|
<p class="m-2 text-center">Are you sure you want to delete this list ?</p>
|
||||||
@@ -12,15 +12,18 @@
|
|||||||
<router-link to="/to-do-lists/" class="btn">Back</router-link>
|
<router-link to="/to-do-lists/" class="btn">Back</router-link>
|
||||||
<a href="#" class="btn-alert" @click="modal = ! modal">Delete</a>
|
<a href="#" class="btn-alert" @click="modal = ! modal">Delete</a>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!loading" class="bg-gray-400 rounded p-1">
|
<div v-if="!loading" class="bg-marine-medium rounded p-1">
|
||||||
<h1 class="mb-2 ml-2 todo" >
|
<h1 class="mb-2 ml-2 h-10 todo text-white flex items-center" >
|
||||||
<span v-if="!listNameEdit" class="text-2xl font-bold flex items-center">{{ toDoList.data.attributes.data.name }}
|
<span v-if="!listNameEdit" class="text-2xl font-bold flex items-center">{{ toDoList.data.attributes.data.name }}
|
||||||
<span @click="listNameEdit = !listNameEdit">
|
<span @click="listNameEdit = !listNameEdit">
|
||||||
<svg-vue icon="edit" class="edit-icon inline w-4 fill-current cursor-pointer ml-2" />
|
<svg-vue icon="edit" class="edit-icon inline w-4 fill-current cursor-pointer ml-2" />
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
<span v-else class="flex items-center">
|
<span v-else class="flex items-center">
|
||||||
<input type="text" class="p-1 rounded-sm mt-1 -ml-1" v-model="listName" @keydown.enter="updateList">
|
<input type="text"
|
||||||
|
class="px-1 py-0 text-2xl text-white font-bold bg-marine-medium rounded-sm -ml-1"
|
||||||
|
v-model="listName"
|
||||||
|
@keydown.enter="updateList">
|
||||||
<span @click="listNameEdit = !listNameEdit">
|
<span @click="listNameEdit = !listNameEdit">
|
||||||
<svg-vue icon="close" class="inline w-4 fill-current cursor-pointer ml-2" />
|
<svg-vue icon="close" class="inline w-4 fill-current cursor-pointer ml-2" />
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
@@ -25,6 +25,11 @@
|
|||||||
<h1 class="relative z-10 text-white text-shadow text-3xl left-80 bottom-0">{{ authUser.data.attributes.name }}</h1>
|
<h1 class="relative z-10 text-white text-shadow text-3xl left-80 bottom-0">{{ authUser.data.attributes.name }}</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="m-2">
|
||||||
|
<div class="box">
|
||||||
|
Texte
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -7,6 +7,11 @@
|
|||||||
:alt="user.attributes.name"/>
|
:alt="user.attributes.name"/>
|
||||||
</div>
|
</div>
|
||||||
<h1>{{ user.attributes.name }}</h1>
|
<h1>{{ user.attributes.name }}</h1>
|
||||||
|
<div class="m-2">
|
||||||
|
<div class="box">
|
||||||
|
Texte
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="authUser.data.attributes.is_admin">
|
<div v-if="authUser.data.attributes.is_admin">
|
||||||
<div class="box-toggle">
|
<div class="-mx-4 box-toggle">
|
||||||
<div class="box-toggle-header" @click="userAddToggle = !userAddToggle">
|
<div class="box-toggle-header" @click="userAddToggle = !userAddToggle">
|
||||||
<h2 class="mb-1">Ajouter un membre</h2>
|
<h2 class="mb-1">Ajouter un membre</h2>
|
||||||
<svg-vue icon="arrow" v-bind:class="{ open: userAddToggle }" />
|
<svg-vue icon="arrow" v-bind:class="{ open: userAddToggle }" />
|
||||||
@@ -28,7 +28,7 @@
|
|||||||
</form>
|
</form>
|
||||||
</transition>
|
</transition>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-2 box-toggle">
|
<div class="-mx-4 mb-2 box-toggle">
|
||||||
<div class="box-toggle-header" @click="userListToggle = !userListToggle">
|
<div class="box-toggle-header" @click="userListToggle = !userListToggle">
|
||||||
<h2>Liste des utilisateurs</h2>
|
<h2>Liste des utilisateurs</h2>
|
||||||
<svg-vue icon="arrow" v-bind:class="{ open: userListToggle }" />
|
<svg-vue icon="arrow" v-bind:class="{ open: userListToggle }" />
|
||||||
|
|||||||
45
resources/sass/components/_base.scss
vendored
45
resources/sass/components/_base.scss
vendored
@@ -1,3 +1,40 @@
|
|||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4 {
|
||||||
|
@apply font-bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
@apply text-4xl;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
@apply text-3xl;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
@apply text-2xl;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
@apply text-xl;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
@apply mb-2 mt-1;
|
||||||
|
text-indent: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
input,
|
||||||
|
textarea {
|
||||||
|
@apply border py-2 px-4 rounded;
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
@apply ;
|
||||||
|
}
|
||||||
|
|
||||||
.text-shadow {
|
.text-shadow {
|
||||||
text-shadow: 1px 1px 2px #000;
|
text-shadow: 1px 1px 2px #000;
|
||||||
}
|
}
|
||||||
@@ -33,3 +70,11 @@
|
|||||||
.min-h-16 {
|
.min-h-16 {
|
||||||
min-height: 4rem;
|
min-height: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.indent {
|
||||||
|
text-indent: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-indent {
|
||||||
|
text-indent: unset;
|
||||||
|
}
|
||||||
|
|||||||
2
resources/sass/components/_btn.scss
vendored
2
resources/sass/components/_btn.scss
vendored
@@ -1,7 +1,7 @@
|
|||||||
// Button
|
// Button
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
@apply border border-transparent inline-block bg-gray-600 text-white font-semibold whitespace-no-wrap py-2 px-4 shadow-sm rounded cursor-pointer;
|
@apply border border-transparent inline-block bg-gray-600 text-white font-semibold whitespace-no-wrap py-2 px-4 shadow-sm rounded cursor-pointer no-underline;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
@apply text-white bg-gray-800 transition-all duration-300;
|
@apply text-white bg-gray-800 transition-all duration-300;
|
||||||
|
|||||||
17
resources/sass/components/_elements.scss
vendored
17
resources/sass/components/_elements.scss
vendored
@@ -5,10 +5,10 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@apply text-gray-700;
|
@apply text-marine underline;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
@apply text-gray-900;
|
@apply text-marine;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -27,10 +27,9 @@ a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.box-toggle {
|
.box-toggle {
|
||||||
@apply shadow;
|
|
||||||
|
|
||||||
&-header {
|
&-header {
|
||||||
@apply flex justify-between items-center px-4 py-2 text-white bg-gray-800 font-bold cursor-pointer;
|
@apply flex justify-between items-center px-4 py-2 text-white bg-marine font-bold cursor-pointer;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
@apply w-8 fill-current;
|
@apply w-8 fill-current;
|
||||||
@@ -53,7 +52,7 @@ a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.card {
|
.card {
|
||||||
@apply bg-gray-300 rounded text-black;
|
@apply bg-white rounded m-2 p-4 h-full flex flex-col justify-between;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
@apply max-w-full max-h-48 max-w-48 m-auto fill-current;
|
@apply max-w-full max-h-48 max-w-48 m-auto fill-current;
|
||||||
@@ -63,3 +62,11 @@ a {
|
|||||||
@apply text-2xl text-center font-bold;
|
@apply text-2xl text-center font-bold;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.box {
|
||||||
|
@apply bg-white rounded p-4 my-2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
@apply inline-block rounded-full px-3 py-1 text-sm font-semibold;
|
||||||
|
}
|
||||||
|
|||||||
8
resources/sass/components/nav.scss
vendored
8
resources/sass/components/nav.scss
vendored
@@ -1,10 +1,10 @@
|
|||||||
|
|
||||||
nav {
|
nav {
|
||||||
@apply w-48 h-screen bg-gray-800 flex flex-col justify-between shadow;
|
@apply w-48 h-screen bg-marine flex flex-col justify-between shadow;
|
||||||
transition: width 0.3s;
|
transition: width 0.3s;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
@apply fill-current text-gray-300 w-12 p-2;
|
@apply fill-current text-white w-12 p-2;
|
||||||
transition: color 0.3s;
|
transition: color 0.3s;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
@@ -13,7 +13,7 @@ nav {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
@apply block;
|
@apply block text-white;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
@apply w-40 m-2;
|
@apply w-40 m-2;
|
||||||
@@ -22,7 +22,7 @@ nav {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.nav-item {
|
.nav-item {
|
||||||
@apply flex items-center text-gray-100;
|
@apply flex items-center text-white;
|
||||||
transition: background-color 0.3s;
|
transition: background-color 0.3s;
|
||||||
|
|
||||||
span {
|
span {
|
||||||
|
|||||||
28
resources/sass/pages/memos.scss
vendored
28
resources/sass/pages/memos.scss
vendored
@@ -1,34 +1,6 @@
|
|||||||
|
|
||||||
.memo-style {
|
.memo-style {
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4 {
|
|
||||||
@apply font-bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
@apply text-4xl;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
@apply text-3xl;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
@apply text-2xl;
|
|
||||||
}
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
@apply text-xl;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
@apply mb-2 mt-1;
|
|
||||||
text-indent: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre,
|
pre,
|
||||||
code {
|
code {
|
||||||
@apply bg-gray-700 text-white p-1;
|
@apply bg-gray-700 text-white p-1;
|
||||||
|
|||||||
5
tailwind.config.js
vendored
5
tailwind.config.js
vendored
@@ -8,6 +8,11 @@ module.exports = {
|
|||||||
},
|
},
|
||||||
extend: {
|
extend: {
|
||||||
colors: {
|
colors: {
|
||||||
|
marine: {
|
||||||
|
light: '#364f80',
|
||||||
|
medium:'#2e446e',
|
||||||
|
default: '#223251',
|
||||||
|
},
|
||||||
cyan: '#9cdbff',
|
cyan: '#9cdbff',
|
||||||
green: {
|
green: {
|
||||||
light: '#333',
|
light: '#333',
|
||||||
|
|||||||
Reference in New Issue
Block a user