stream/stream.ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update ui

Browse Source
This commit is contained in:
Mr.Dat
2026-01-27 17:53:25 +07:00
parent 7a1f5d5ae0
commit a9e5ea61f8
12 changed files with 73 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/routes/auth/layout.vue
View File

@@ -1,25 +1,25 @@
<template>
<div class=":uno: w-full max-w-md shadow-xl bg-white p-8 rounded-xl m-auto relative before:(content-[''] absolute inset-[-5px] translate-0 z-[-1] opacity-50 rounded-xl bg-[linear-gradient(135deg,var(--glow-stop-1)_0,var(--glow-stop-2)_25%,var(--glow-stop-3)_50%,var(--glow-stop-4)_75%,var(--glow-stop-5)_100%)] animate-[glow-enter-blur_1s_ease_.5s_both]) after:(content-[''] absolute inset-[-1px] translate-0 z-[-1] opacity-50 rounded-xl
bg-[linear-gradient(135deg,transparent_0,transparent_34%,transparent_49%,#fff_57%,#fff_64%,var(--glow-stop-1)_66%,var(--glow-stop-2)_75%,var(--glow-stop-3)_83%,var(--glow-stop-4)_92%,var(--glow-stop-5)_100%)] bg-[length:300%_300%] bg-[position:0_0] bg-no-repeat
transition-background-position duration-800 ease animate-[glow-enter-stroke_.5s_ease_.5s_both])">
<div class="text-center mb-8">
<router-link to="/" class="inline-flex items-center justify-center w-12 h-12 mb-4">
<img class="w-12 h-12" src="/apple-touch-icon.png" alt="Logo" />
</router-link>
<h2 class="text-2xl font-bold text-gray-900">
{{ content[route.name as keyof typeof content]?.title || '' }}
</h2>
<p class="text-gray-500 text-sm mt-1">
{{ content[route.name as keyof typeof content]?.subtitle || '' }}
</p>
<vue-head :input="{
title: content[route.name as keyof typeof content]?.headTitle || 'Authentication',
meta: [
{ name: 'description', content: content[route.name as keyof typeof content]?.subtitle || '' }
]
}" />
<div class="mx-a max-w-md w-full min-h-screen flex flex-col items-center px-4 justify-center">
<div class="w-full h-6 mb-10"></div>
<div
class=":uno: w-full shadow-xl bg-white p-6 rounded-xl relative before:(content-[''] absolute inset-[-5px] translate-0 z-[-1] opacity-50 rounded-xl bg-[linear-gradient(135deg,var(--glow-stop-1)_0,var(--glow-stop-2)_25%,var(--glow-stop-3)_50%,var(--glow-stop-4)_75%,var(--glow-stop-5)_100%)] animate-[glow-enter-blur_1s_ease_.5s_both]) after:(content-[''] absolute inset-[-1px] translate-0 z-[-1] opacity-50 rounded-xl bg-[linear-gradient(135deg,transparent_0,transparent_34%,transparent_49%,#fff_57%,#fff_64%,var(--glow-stop-1)_66%,var(--glow-stop-2)_75%,var(--glow-stop-3)_83%,var(--glow-stop-4)_92%,var(--glow-stop-5)_100%)] bg-[length:300%_300%] bg-[position:0_0] bg-no-repeat transition-background-position duration-800 ease animate-[glow-enter-stroke_.5s_ease_.5s_both])">
<div class="mb-6">
<h2 class="text-xl font-medium text-gray-900">
{{ content[route.name as keyof typeof content]?.title || '' }}
</h2>
<vue-head :input="{
title: content[route.name as keyof typeof content]?.headTitle || 'Authentication',
meta: [
{ name: 'description', content: content[route.name as keyof typeof content]?.subtitle || '' }
]
}" />
</div>
<router-view />
</div>
<router-view />
<router-link to="/" class="inline-flex items-center justify-center w-6 h-6 mt-10 group w-full">
<img class="w-6 h-6" src="/apple-touch-icon.png" alt="Logo" />&ensp;<span
class="text-[#6a6a6a] font-medium group-hover:text-gray-900">EcoStream</span>
</router-link>
</div>
</template>
<script setup lang="ts">
@@ -29,7 +29,7 @@ const route = useRoute();
const content = {
login: {
headTitle: "Login to your account",
title: 'Welcome back',
title: 'Sign in to your dashboard',
subtitle: 'Please enter your details to sign in.'
},
signup: {