versia-pub/server
2
0
Fork 0
mirror of https://github.com/versia-pub/server.git synced 2025-12-06 08:28:19 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: Improve pages UI

Browse source
This commit is contained in:
Jesse Wierzbinski 2023-12-09 10:17:29 -10:00
parent 1d77d80db9
commit 99fc402f38
No known key found for this signature in database
3 changed files with 10 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
pages/favicon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 13 KiB

4
pages/index.html
View file

@ -3,9 +3,9 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/png" href="/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue + TS</title> <title>Lysand</title>
</head> </head>
<body> <body>

12
pages/login.vue
View file

@ -1,5 +1,9 @@
<template> <template>
<div class="flex min-h-screen flex-col justify-center px-6 py-12 lg:px-8"> <div class="flex min-h-screen relative flex-col justify-center px-6 py-12 lg:px-8">
<div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
<div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
</div>
<div class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm"> <div class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
<form class="space-y-6" method="POST" <form class="space-y-6" method="POST"
:action="`/auth/login?redirect_uri=${redirect_uri}&response_type=${response_type}&client_id=${client_id}&scope=${scope}`"> :action="`/auth/login?redirect_uri=${redirect_uri}&response_type=${response_type}&client_id=${client_id}&scope=${scope}`">
@ -23,11 +27,11 @@
<div v-if="oauthProviders && oauthProviders.length > 0" class="w-full flex flex-col gap-3"> <div v-if="oauthProviders && oauthProviders.length > 0" class="w-full flex flex-col gap-3">
<h2 class="text-sm text-gray-700">Or sign in with</h2> <h2 class="text-sm text-gray-700">Or sign in with</h2>
<div class="grid grid-cols-1 gap-4 w-full"> <div class="grid grid-cols-2 gap-4 w-full">
<a v-for="provider of oauthProviders" :key="provider.id" <a v-for="provider of oauthProviders" :key="provider.id"
:href="`/oauth/authorize-external?issuer=${provider.id}&redirect_uri=${redirect_uri}&response_type=${response_type}&clientId=${client_id}&scope=${scope}`" :href="`/oauth/authorize-external?issuer=${provider.id}&redirect_uri=${redirect_uri}&response_type=${response_type}&clientId=${client_id}&scope=${scope}`"
class="flex flex-row rounded ring-1 gap-2 p-2 ring-black/10 hover:shadow duration-200"> class="flex flex-row justify-center rounded ring-1 gap-2 p-2 ring-black/10 hover:shadow duration-200">
<img :src="provider.icon" :alt="provider.name" class="w-8 h-8" /> <img :src="provider.icon" :alt="provider.name" class="w-6 h-6" />
<div class="flex flex-col gap-0 justify-center"> <div class="flex flex-col gap-0 justify-center">
<h3 class="font-bold">{{ provider.name }}</h3> <h3 class="font-bold">{{ provider.name }}</h3>
</div> </div>