dietpi/pocketbase-quasar-lista
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Nuevo login and register

Browse Source
This commit is contained in:
clonbg
2023-02-24 17:22:18 +01:00
parent 5877603a50
commit 7b2d1db15e
2 changed files with 110 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/pages/LoginPage.vue
View File

@@ -1,7 +1,59 @@
<template>
<div class="flex flex-center">
<h1>Huevos login</h1>
<div
class="bg-light-green window-height window-width row justify-center items-center"
>
<div class="column">
<div class="row">
<h5 class="text-h5 text-white q-my-md">Company & Co</h5>
</div>
<div class="row">
<q-card square bordered class="q-pa-lg shadow-1">
<q-card-section>
<q-form class="q-gutter-md">
<q-input
square
filled
clearable
v-model="email"
type="email"
label="email"
/>
<q-input
square
filled
clearable
v-model="password"
type="password"
label="password"
/>
</q-form>
</q-card-section>
<q-card-actions class="q-px-md">
<q-btn
unelevated
color="light-green-7"
size="lg"
class="full-width"
label="Login"
/>
</q-card-actions>
<q-card-section class="text-center q-pa-none">
<p class="text-grey-6">Not reigistered? Created an Account</p>
</q-card-section>
</q-card>
</div>
</div>
</div>
</template>
<script></script>
<script setup>
import { ref } from "vue";
const email = ref("");
const password = ref("");
</script>
<style>
.q-card {
width: 360px;
}
</style>

58
src/pages/RegisterPage.vue
View File

@@ -1,7 +1,59 @@
<template>
<div class="flex flex-center">
<h1>Registro huevos</h1>
<div
class="bg-light-green window-height window-width row justify-center items-center"
>
<div class="column">
<div class="row">
<h5 class="text-h5 text-white q-my-md">Company & Co</h5>
</div>
<div class="row">
<q-card square bordered class="q-pa-lg shadow-1">
<q-card-section>
<q-form class="q-gutter-md">
<q-input
square
filled
clearable
v-model="email"
type="email"
label="email"
/>
<q-input
square
filled
clearable
v-model="password"
type="password"
label="password"
/>
</q-form>
</q-card-section>
<q-card-actions class="q-px-md">
<q-btn
unelevated
color="light-green-7"
size="lg"
class="full-width"
label="Register"
/>
</q-card-actions>
<q-card-section class="text-center q-pa-none">
<p class="text-grey-6">Are you registered? Go to Login</p>
</q-card-section>
</q-card>
</div>
</div>
</div>
</template>
<script></script>
<script setup>
import { ref } from "vue";
const email = ref("");
const password = ref("");
</script>
<style>
.q-card {
width: 360px;
}
</style>