Workaround for nuxtjs layout bug
This commit is contained in:
parent
7e1425c25e
commit
3d2f950433
@ -4,9 +4,7 @@
|
||||
<v-content>
|
||||
<v-container fill-height>
|
||||
<v-row no-gutters justify="center">
|
||||
<v-col cols="12" sm="8" md="6">
|
||||
<nuxt />
|
||||
</v-col>
|
||||
<nuxt />
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-content>
|
||||
|
||||
@ -1,28 +0,0 @@
|
||||
<template>
|
||||
<v-app>
|
||||
<Navbar />
|
||||
<v-content>
|
||||
<v-container fill-height>
|
||||
<v-row no-gutters justify="center">
|
||||
<v-col cols="12">
|
||||
<nuxt />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-content>
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Navbar from '@/components/Navbar'
|
||||
|
||||
export default {
|
||||
components: { Navbar },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html {
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
@ -1,29 +1,31 @@
|
||||
<template>
|
||||
<v-card color="primary" dark>
|
||||
<v-btn icon to="/">
|
||||
<v-icon>mdi-arrow-left</v-icon>
|
||||
</v-btn>
|
||||
<v-card-title class="text-center justify-center py-6">
|
||||
<h1 class="font-weight-bold display-2">Account</h1>
|
||||
</v-card-title>
|
||||
<v-col cols="12" sm="8" md="6">
|
||||
<v-card color="primary" dark>
|
||||
<v-btn icon to="/">
|
||||
<v-icon>mdi-arrow-left</v-icon>
|
||||
</v-btn>
|
||||
<v-card-title class="text-center justify-center py-6">
|
||||
<h1 class="font-weight-bold display-2">Account</h1>
|
||||
</v-card-title>
|
||||
|
||||
<v-tabs v-model="tab" background-color="transparent" dark grow>
|
||||
<v-tab v-for="tab in tabs" :key="tab">
|
||||
{{ tab }}
|
||||
</v-tab>
|
||||
</v-tabs>
|
||||
<v-tabs v-model="tab" background-color="transparent" dark grow>
|
||||
<v-tab v-for="tab in tabs" :key="tab">
|
||||
{{ tab }}
|
||||
</v-tab>
|
||||
</v-tabs>
|
||||
|
||||
<v-tabs-items v-model="tab">
|
||||
<v-tab-item v-for="tab in tabs" :key="tab">
|
||||
<v-card flat>
|
||||
<v-card-text>
|
||||
<LoginForm v-if="tab === 'Login'"></LoginForm>
|
||||
<RegisterForm v-else></RegisterForm>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-tab-item>
|
||||
</v-tabs-items>
|
||||
</v-card>
|
||||
<v-tabs-items v-model="tab">
|
||||
<v-tab-item v-for="tab in tabs" :key="tab">
|
||||
<v-card flat>
|
||||
<v-card-text>
|
||||
<LoginForm v-if="tab === 'Login'"></LoginForm>
|
||||
<RegisterForm v-else></RegisterForm>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-tab-item>
|
||||
</v-tabs-items>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@ -1,48 +1,33 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<v-row dense>
|
||||
<v-col cols="12">
|
||||
<v-card color="#385F73" dark>
|
||||
<v-card-title class="headline">
|
||||
Unlimited notes now
|
||||
</v-card-title>
|
||||
<v-card-subtitle>
|
||||
Listen to your favorite artists and albums whenever and
|
||||
wherever, online and offline.
|
||||
</v-card-subtitle>
|
||||
<v-card-actions>
|
||||
<v-btn text>See a demo</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col cols="12">
|
||||
<v-card color="#1F7087" dark>
|
||||
<v-card-title class="headline">
|
||||
Wow
|
||||
</v-card-title>
|
||||
<v-card-subtitle>
|
||||
You can even search your notes
|
||||
</v-card-subtitle>
|
||||
<v-card-actions>
|
||||
<v-btn text>Create an account</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col cols="12">
|
||||
<v-card color="#952175" dark>
|
||||
<v-card-title class="headline">
|
||||
babar
|
||||
</v-card-title>
|
||||
<v-card-subtitle>
|
||||
You notes are safe with us
|
||||
</v-card-subtitle>
|
||||
<v-card-actions>
|
||||
<v-btn text>Privacy policy</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
<v-col cols="12">
|
||||
<v-container fluid>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(item, index) in items"
|
||||
:key="index"
|
||||
class="d-flex"
|
||||
cols="12"
|
||||
lg="6"
|
||||
>
|
||||
<v-card
|
||||
:color="item.color"
|
||||
dark
|
||||
style="min-height: 350px; width: 100%;"
|
||||
>
|
||||
<v-card-title class="headline">
|
||||
{{ item.title }}
|
||||
</v-card-title>
|
||||
<v-card-subtitle>
|
||||
{{ item.content }}
|
||||
</v-card-subtitle>
|
||||
<v-card-actions>
|
||||
<v-btn text>See a demo</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-col>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -51,8 +36,36 @@ export default {
|
||||
options: {
|
||||
auth: false,
|
||||
},
|
||||
data: () => ({
|
||||
items: [
|
||||
{
|
||||
title: 'Writes your notes in markdown',
|
||||
content:
|
||||
'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur aut consectetur debitis harum' +
|
||||
' illum in incidunt maxime modi quae velit? Aspernatur, consequatur error' +
|
||||
' mollitia nesciunt officiis porro ratione sequi voluptas?',
|
||||
color: 'indigo',
|
||||
},
|
||||
{
|
||||
title: '',
|
||||
content: '',
|
||||
color: 'purple',
|
||||
},
|
||||
{
|
||||
title: '',
|
||||
content: '',
|
||||
color: 'warning',
|
||||
},
|
||||
{
|
||||
title: '',
|
||||
content: '',
|
||||
color: 'teal darken-2',
|
||||
},
|
||||
],
|
||||
}),
|
||||
head: () => ({
|
||||
title: 'Home',
|
||||
}),
|
||||
}
|
||||
</script>
|
||||
&
|
||||
|
||||
@ -1,56 +1,58 @@
|
||||
<template>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="notes"
|
||||
:loading="loading"
|
||||
loading-text="Loading notes..."
|
||||
class="elevation-1"
|
||||
disable-sort
|
||||
>
|
||||
<template v-slot:top>
|
||||
<v-toolbar flat color="secondary">
|
||||
<h2 class="title white--text">
|
||||
Notes
|
||||
</h2>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn to="/create" outlined dark>
|
||||
New Note
|
||||
</v-btn>
|
||||
</v-toolbar>
|
||||
</template>
|
||||
<template v-slot:item.updatedAt="{ item }">
|
||||
{{ format(item.updatedAt) }}
|
||||
</template>
|
||||
<template v-slot:item.tags="{ item }">
|
||||
<div class="tags">
|
||||
<v-chip
|
||||
v-for="tag in item.tags"
|
||||
:key="tag"
|
||||
active
|
||||
<v-col cols="12">
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="notes"
|
||||
:loading="loading"
|
||||
loading-text="Loading notes..."
|
||||
class="elevation-1"
|
||||
disable-sort
|
||||
>
|
||||
<template v-slot:top>
|
||||
<v-toolbar flat color="secondary">
|
||||
<h2 class="title white--text">
|
||||
Notes
|
||||
</h2>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn to="/create" outlined dark>
|
||||
New Note
|
||||
</v-btn>
|
||||
</v-toolbar>
|
||||
</template>
|
||||
<template v-slot:item.updatedAt="{ item }">
|
||||
{{ format(item.updatedAt) }}
|
||||
</template>
|
||||
<template v-slot:item.tags="{ item }">
|
||||
<div class="tags">
|
||||
<v-chip
|
||||
v-for="tag in item.tags"
|
||||
:key="tag"
|
||||
active
|
||||
color="secondary"
|
||||
>
|
||||
{{ tag }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:item.actions="{ item }">
|
||||
<v-icon
|
||||
small
|
||||
color="secondary"
|
||||
dark
|
||||
class="mr-2"
|
||||
@click="editItem(item)"
|
||||
>
|
||||
{{ tag }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:item.actions="{ item }">
|
||||
<v-icon
|
||||
small
|
||||
color="secondary"
|
||||
dark
|
||||
class="mr-2"
|
||||
@click="editItem(item)"
|
||||
>
|
||||
mdi-pencil
|
||||
</v-icon>
|
||||
<v-icon small color="secondary" dark @click="deleteItem(item)">
|
||||
mdi-delete
|
||||
</v-icon>
|
||||
</template>
|
||||
<template v-slot:no-data>
|
||||
<v-btn color="primary" @click="initialize">Reset</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
mdi-pencil
|
||||
</v-icon>
|
||||
<v-icon small color="secondary" dark @click="deleteItem(item)">
|
||||
mdi-delete
|
||||
</v-icon>
|
||||
</template>
|
||||
<template v-slot:no-data>
|
||||
<v-btn color="primary" @click="initialize">Reset</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -59,7 +61,6 @@ import { format } from 'timeago.js'
|
||||
export default {
|
||||
name: 'Notes',
|
||||
title: 'Notes',
|
||||
layout: 'wide',
|
||||
data: () => ({
|
||||
loading: true,
|
||||
notes: [],
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user