feat: add sections components

This commit is contained in:
Oleg Proskurin 2025-10-25 22:01:26 +07:00
parent f46a8d66d3
commit ab85b5e1fa
4 changed files with 40 additions and 4 deletions

View File

@ -6,6 +6,7 @@ import { createProjectApiKey, listApiKeys } from '@/lib/actions/apiKeyActions';
import KeyDisplay from '@/components/admin/KeyDisplay';
import AdminFormInput from '@/components/admin/AdminFormInput';
import AdminButton from '@/components/admin/AdminButton';
import { Section } from '@/components/shared/Section';
const STORAGE_KEY = 'banatie_master_key';
@ -68,7 +69,7 @@ export default function ApiKeysPage() {
}
return (
<div className="max-w-6xl mx-auto px-6 py-8">
<Section>
{/* Page Header */}
<div className="mb-8">
<h1 className="text-4xl font-bold text-white mb-2">Project API Keys</h1>
@ -188,6 +189,6 @@ export default function ApiKeysPage() {
</div>
)}
</div>
</div>
</Section>
);
}

View File

@ -5,6 +5,7 @@ import { bootstrapMasterKey } from '@/lib/actions/apiKeyActions';
import KeyDisplay from '@/components/admin/KeyDisplay';
import AdminFormInput from '@/components/admin/AdminFormInput';
import AdminButton from '@/components/admin/AdminButton';
import { NarrowSection } from '@/components/shared/NarrowSection';
const STORAGE_KEY = 'banatie_master_key';
@ -66,7 +67,7 @@ export default function MasterKeyPage() {
};
return (
<div className="max-w-4xl mx-auto px-6 py-8">
<NarrowSection>
{/* Page Header */}
<div className="mb-8">
<h1 className="text-4xl font-bold text-white mb-2">Master Key Management</h1>
@ -132,6 +133,6 @@ export default function MasterKeyPage() {
Save Manual Key
</AdminButton>
</div>
</div>
</NarrowSection>
);
}

View File

@ -0,0 +1,17 @@
import { ReactNode } from 'react';
interface NarrowSectionProps {
children: ReactNode;
className?: string;
bgClassName?: string;
}
export const NarrowSection = ({ children, className = '', bgClassName = '' }: NarrowSectionProps) => {
return (
<div className={bgClassName}>
<div className={`max-w-4xl mx-auto px-6 py-8 ${className}`}>
{children}
</div>
</div>
);
};

View File

@ -0,0 +1,17 @@
import { ReactNode } from 'react';
interface SectionProps {
children: ReactNode;
className?: string;
bgClassName?: string;
}
export const Section = ({ children, className = '', bgClassName = '' }: SectionProps) => {
return (
<div className={bgClassName}>
<div className={`max-w-7xl mx-auto px-6 py-8 ${className}`}>
{children}
</div>
</div>
);
};