107 lines
5.1 KiB
Vue
107 lines
5.1 KiB
Vue
<template>
|
|
<v-container fluid>
|
|
<v-row dense
|
|
align-content="stretch"
|
|
align="stretch"
|
|
>
|
|
<v-col
|
|
v-for="(note, index) in notes"
|
|
:key="index"
|
|
cols="12" md="6" xl="3"
|
|
class="viewer">
|
|
<Note
|
|
class="item"
|
|
:title="note.title"
|
|
:tags="note.tags"
|
|
>
|
|
{{ note.content }}
|
|
</Note>
|
|
</v-col>
|
|
|
|
</v-row>
|
|
|
|
<v-btn to="/create" fab fixed bottom right large color="accent">
|
|
<v-icon>mdi-plus</v-icon>
|
|
</v-btn>
|
|
|
|
</v-container>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import Note from '@/components/Note'
|
|
|
|
export default {
|
|
name: "notes",
|
|
title: "Notes",
|
|
components: {
|
|
Note,
|
|
},
|
|
data: () => ({
|
|
selector: ".viewer",
|
|
options: {
|
|
columnWidth: "200",
|
|
percentPosition: true,
|
|
gutter: 0,
|
|
itemSelector: ".item"
|
|
},
|
|
notes: [
|
|
{
|
|
title: "Elec analogique",
|
|
tags: ["Ephec"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
{
|
|
title: "Melvin fait du ski",
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
|
|
},
|
|
{
|
|
title: "Daniel étudie elec",
|
|
tags: ["Ephec", "Ephec", "Ephec", "Ephec", "Ephec", "Ephec"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
{
|
|
title: "Daniel étudie elec",
|
|
tags: ["Ephec", "Ephec", "Ephec", "Ephec", "Ephec", "Ephec"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab est in rerum."
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
{
|
|
title: "Portfolio",
|
|
tags: ["Ephec", "Dev"],
|
|
content: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt doloremque harum iste itaque laboriosam modi placeat quia sequi. Accusamus consectetur dolor doloribus eaque et incidunt ipsa iste, iure magnam maxime minus, modi nam odit possimus quam recusandae reprehenderit sit totam?"
|
|
},
|
|
]
|
|
})
|
|
}
|
|
</script>
|