adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-16 04:02:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

move banners on login and register cards into the cards

Browse Source
This commit is contained in:
Gregor Vostrak
2026-05-29 15:33:35 +02:00
committed by Constantin Graf
parent 24c19e7e7c
commit 56ea0ed90e
4 changed files with 28 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
resources/js/Components/Banner.vue
View File

@@ -5,6 +5,15 @@ import { usePage } from '@inertiajs/vue3';
const ALLOWED_STYLES = ['success', 'danger', 'info', 'warning'] as const; const ALLOWED_STYLES = ['success', 'danger', 'info', 'warning'] as const;
type BannerStyle = (typeof ALLOWED_STYLES)[number]; type BannerStyle = (typeof ALLOWED_STYLES)[number];
withDefaults(
defineProps<{
// Render as a self-contained rounded alert that sits inside a card
// (e.g. the auth card on login/register) instead of a full-width page banner.
card?: boolean;
}>(),
{ card: false }
);
const page = usePage<{ const page = usePage<{
flash: { flash: {
bannerText?: string; bannerText?: string;
@@ -26,10 +35,16 @@ const show = ref(true);
<div <div
v-if="show && message" v-if="show && message"
data-testid="banner" data-testid="banner"
class="bg-secondary border-b border-border-secondary"> :class="
<div class="mx-auto py-1 px-3 sm:px-6 lg:px-8"> card
? 'bg-secondary border border-border-secondary rounded-lg mb-4'
: 'bg-secondary border-b border-border-secondary'
">
<div :class="card ? 'py-2 px-3' : 'mx-auto py-1 px-3 sm:px-6 lg:px-8'">
<div class="flex items-center justify-between flex-wrap"> <div class="flex items-center justify-between flex-wrap">
<div class="w-0 flex-1 flex items-center min-w-0"> <div
class="w-0 flex-1 flex min-w-0"
:class="card ? 'items-start' : 'items-center'">
<span class="flex"> <span class="flex">
<svg <svg
v-if="style === 'success'" v-if="style === 'success'"
@@ -74,7 +89,9 @@ const show = ref(true);
</svg> </svg>
</span> </span>
<p class="ms-3 font-medium text-sm text-text-primary truncate"> <p
class="ms-3 font-medium text-sm text-text-primary"
:class="{ truncate: !card }">
{{ message }} {{ message }}
</p> </p>
</div> </div>

4
resources/js/Pages/Auth/Login.vue
View File

@@ -37,8 +37,6 @@ const page = usePage<{
<template> <template>
<Head title="Log in" /> <Head title="Log in" />
<Banner />
<AuthenticationCard> <AuthenticationCard>
<template #logo> <template #logo>
<AuthenticationCardLogo /> <AuthenticationCardLogo />
@@ -52,6 +50,8 @@ const page = usePage<{
</Link> </Link>
</template> </template>
<Banner card />
<div v-if="status" class="mb-4 font-medium text-sm text-green-400"> <div v-if="status" class="mb-4 font-medium text-sm text-green-400">
{{ status }} {{ status }}
</div> </div>

4
resources/js/Pages/Auth/Register.vue
View File

@@ -42,8 +42,6 @@ const page = usePage<{
<template> <template>
<Head title="Register" /> <Head title="Register" />
<Banner />
<AuthenticationCard> <AuthenticationCard>
<template #logo> <template #logo>
<AuthenticationCardLogo /> <AuthenticationCardLogo />
@@ -58,6 +56,8 @@ const page = usePage<{
</Link> </Link>
</template> </template>
<Banner card />
<div <div
v-if="page.props.flash?.message" v-if="page.props.flash?.message"
class="bg-red-400 text-black text-center w-full px-3 py-1 mb-4 rounded-lg"> class="bg-red-400 text-black text-center w-full px-3 py-1 mb-4 rounded-lg">

4
resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.vue
View File

@@ -283,7 +283,9 @@ const page = usePage<{
@click="clickResend"> @click="clickResend">
Resend verification email Resend verification email
</Button> </Button>
<p v-else class="ms-3 font-medium text-green-400">Verification email sent.</p> <p v-else class="ms-3 font-medium text-green-400">
Verification email sent.
</p>
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"