b49fcadbba
* #99 - ui changes * #99 - logo fix * #99 - tailwind plugin for eslint * #99 - fix * #99 - fix * #99 - fix pagination * #99 - fix logo Co-authored-by: EwelinaLasowy <ewelina.lasowy@blumilk.pl>
76 lines
2.6 KiB
Vue
76 lines
2.6 KiB
Vue
<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="overflow-hidden absolute inset-x-2 top-2 bg-red-500 rounded-lg ring-1 ring-black ring-opacity-5 shadow-lg pointer-events-auto sm:mx-auto sm:w-full sm:max-w-md"
|
|
>
|
|
<div class="p-4">
|
|
<div class="flex items-center">
|
|
<div class="flex flex-1 justify-between w-0">
|
|
<ExclamationIcon class="mr-1 w-5 h-5 text-white" />
|
|
<p class="flex-1 w-0 text-sm font-medium text-white">
|
|
{{ errors.oauth }}
|
|
</p>
|
|
</div>
|
|
<div class="flex shrink-0 ml-4">
|
|
<button
|
|
class="inline-flex text-red-100 hover:text-red-400 bg-red-500 rounded-md focus:outline-none focus:ring-2 focus:ring-red-600 focus:ring-offset-2"
|
|
@click="delete errors.oauth"
|
|
>
|
|
<span class="sr-only">Close</span>
|
|
<XIcon class="w-5 h-5" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</transition>
|
|
<div
|
|
class="flex flex-col items-center py-8 px-4 space-y-4 text-white rounded-lg sm:mx-auto sm:w-full sm:max-w-md"
|
|
dusk="login-link"
|
|
>
|
|
<img
|
|
class="mx-auto w-auto h-50"
|
|
src="img/logo.png"
|
|
>
|
|
<a
|
|
href="/login/google/start"
|
|
class="inline-flex justify-center items-center py-2 px-6 font-medium text-white bg-blumilk-500 hover:bg-blumilk-700 rounded-md shadow-sm text-md"
|
|
>
|
|
Zaloguj się za pomocą Google
|
|
<svg
|
|
class="ml-2 w-5 h-5"
|
|
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 setup>
|
|
import { XIcon, ExclamationIcon } from '@heroicons/vue/solid'
|
|
|
|
defineProps({
|
|
errors: Object,
|
|
})
|
|
</script>
|
|
|
|
<script>
|
|
import GuestLayout from '@/Shared/Layout/GuestLayout'
|
|
|
|
export default { name: 'LoginPage', layout: GuestLayout }
|
|
</script>
|