xlibs-components
Version:
Modern React component library with Aceternity, MagicUI, and ShadCN components for building beautiful web applications
33 lines (32 loc) • 2.86 kB
JavaScript
"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { LoginPage } from "./login-page";
import { LoginForm } from '../../components/login-form.js';
// Basic usage - matches your original code
export function BasicLoginPage() {
return (_jsx(LoginPage, {}));
}
// With custom styling and logo
export function CustomLoginPage() {
return (_jsx(LoginPage, { showLogo: true, title: "Welcome to Our Platform", subtitle: "Please sign in to continue", maxWidth: "md", background: "gradient", className: "min-h-screen" }));
}
// With background image - Data Analytics Theme
export function LoginPageWithImage() {
return (_jsx(LoginPage, { showLogo: true, title: "Enterprise BI", subtitle: "Sign in to your account", maxWidth: "md", background: "gradient", showBackgroundImage: true, backgroundImage: "https://images.unsplash.com/photo-1460925895917-afdab827c52f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2015&q=80" }));
}
// With different background image - Dashboard Theme
export function LoginPageWithOfficeImage() {
return (_jsx(LoginPage, { showLogo: true, title: "Modern Workspace", subtitle: "Access your digital workspace", maxWidth: "lg", background: "pattern", showBackgroundImage: true, backgroundImage: "https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80" }));
}
// With custom children (custom form)
export function CustomFormLoginPage() {
return (_jsx(LoginPage, { showLogo: true, maxWidth: "lg", background: "pattern", showBackgroundImage: true, children: _jsxs("div", { className: "bg-white rounded-lg shadow-lg p-8", children: [_jsx("h2", { className: "text-2xl font-bold mb-6 text-center", children: "Custom Login" }), _jsx(LoginForm, { demoCredentials: {
email: "demo@example.com",
password: "demo123"
} })] }) }));
}
// With custom logo
export function CustomLogoLoginPage() {
const customLogo = (_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-12 h-12 bg-gradient-to-r from-purple-500 to-pink-500 rounded-lg flex items-center justify-center", children: _jsx("span", { className: "text-white font-bold text-lg", children: "\uD83D\uDE80" }) }), _jsx("h1", { className: "text-2xl font-bold text-gray-900", children: "MyApp" })] }));
return (_jsx(LoginPage, { showLogo: true, logo: customLogo, title: "Welcome to MyApp", subtitle: "Your amazing application", maxWidth: "xl", background: "gradient", showBackgroundImage: true, backgroundImage: "https://images.unsplash.com/photo-1551434678-e076c223a692?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80" }));
}