kamilniemczycki/toby
1
0
Fork 0
Code Issues Pull Requests 2 Projects Releases Activity

#2 - authentication via google (#16)

Browse Source 
* #2 - wip

* #2 - wip

* #2 - ui fixes to login page

* #2 - fix

* #2 - fix

* #2 - add title to login page

* Apply suggestions from code review

Co-authored-by: Krzysztof Rewak <krzysztof.rewak@blumilk.pl>

* #2 - cr fix

* #2 - cr fix

Co-authored-by: EwelinaLasowy <ewelina.lasowy@blumilk.pl>
Co-authored-by: Krzysztof Rewak <krzysztof.rewak@blumilk.pl>
This commit is contained in:
Adrian Hopek
2022-01-13 14:19:11 +01:00
committed by GitHub
parent e015f02892
commit 0869395aab
31 changed files with 534 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
resources/js/Pages/Dashboard.vue
View File

@@ -18,7 +18,7 @@
<div class="flex-shrink-0">
<img
class="mx-auto h-20 w-20 rounded-full"
:src="user.imageUrl"
:src="user.avatar"
alt=""
>
</div>
@@ -255,7 +255,6 @@ import {
} from '@heroicons/vue/outline';
import {computed} from 'vue';
import {usePage} from '@inertiajs/inertia-vue3';
export default {
name: 'Dashboard',
setup() {
@@ -362,7 +361,6 @@ export default {
'Tenetur libero voluptatem rerum occaecati qui est molestiae exercitationem. Voluptate quisquam iure assumenda consequatur ex et recusandae. Alias consectetur voluptatibus. Accusamus a ab dicta et. Consequatur quis dignissimos voluptatem nisi.',
},
];
return {
user,
stats,

85
resources/js/Pages/Login.vue Normal file
View File

@@ -0,0 +1,85 @@
<template>
<InertiaHead title="Zaloguj się" />
<transition
enter-active-class="transform ease-out duration-300 transition"
enter-from-class="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-2"
enter-to-class="translate-y-0 opacity-100 sm:translate-x-0"
leave-active-class="transition ease-in duration-100"
leave-from-class="opacity-100"
leave-to-class="opacity-0"
>
<div
v-if="errors.oauth"
class="absolute inset-x-2 top-2 sm:mx-auto sm:w-full sm:max-w-md bg-red-500 shadow-lg rounded-lg pointer-events-auto ring-1 ring-black ring-opacity-5 overflow-hidden"
>
<div class="p-4">
<div class="flex items-center">
<div class="w-0 flex-1 flex justify-between">
<ExclamationIcon class="h-5 w-5 text-white" />
<p class="w-0 flex-1 text-sm font-medium text-white">
{{ errors.oauth }}
</p>
</div>
<div class="ml-4 flex-shrink-0 flex">
<button
class="bg-red-500 rounded-md inline-flex text-red-100 hover:text-red-400 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-600"
@click="delete errors.oauth"
>
<span class="sr-only">Close</span>
<XIcon
class="h-5 w-5"
aria-hidden="true"
/>
</button>
</div>
</div>
</div>
</div>
</transition>
<div
class="sm:mx-auto sm:w-full sm:max-w-md text-white space-y-4 flex flex-col items-center rounded-lg px-4 py-8"
>
<img
class="mx-auto h-50 w-auto"
src="img/logo.png"
alt="Blumilk"
>
<a
href="/login/google/start"
class="inline-flex justify-center py-2 px-6 rounded-md shadow-sm bg-blumilk-500 text-md font-medium text-white hover:bg-blumilk-700"
>
Zaloguj się za pomocą Google
<svg
class="w-5 h-5 ml-2"
fill="currentColor"
viewBox="0 0 24 24"
>
<path
d="M6 12C6 15.3137 8.68629 18 12 18C14.6124 18 16.8349 16.3304 17.6586 14H12V10H21.8047V14H21.8C20.8734 18.5645 16.8379 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C15.445 2 18.4831 3.742 20.2815 6.39318L17.0039 8.68815C15.9296 7.06812 14.0895 6 12 6C8.68629 6 6 8.68629 6 12Z"
fill="currentColor"
/>
</svg>
</a>
</div>
</template>
<script>
import GuestLayout from '@/Shared/Layout/GuestLayout';
import {XIcon} from '@heroicons/vue/solid';
import {ExclamationIcon} from '@heroicons/vue/solid';
export default {
name: 'Login',
components: {
XIcon,
ExclamationIcon,
},
layout: GuestLayout,
props: {
errors: {
type: Object,
default: () => ({oauth: null}),
}
},
};
</script>