adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-08 00: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
parent 5821f7c688
commit dc5e8e7de2
3 changed files with 25 additions and 8 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;
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<{
flash: {
bannerText?: string;
@@ -26,10 +35,16 @@ const show = ref(true);
<div
v-if="show && message"
data-testid="banner"
class="bg-secondary border-b border-border-secondary">
<div class="mx-auto py-1 px-3 sm:px-6 lg:px-8">
:class="
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="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">
<svg
v-if="style === 'success'"
@@ -74,7 +89,9 @@ const show = ref(true);
</svg>
</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 }}
</p>
</div>

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

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

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

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