fix: update validation error message to overlay layout to prevent content shifting
This commit is contained in:
@@ -239,10 +239,10 @@ export function HeroSection({ content }: { content?: HeroContent }) {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Validation Error Message */}
|
||||
{/* Validation Error Message (overlay — does not push layout) */}
|
||||
{validationError && (
|
||||
<div className="mt-3 flex justify-center px-2">
|
||||
<div className="text-white font-serif text-xs md:text-sm bg-red-500/90 rounded-[7px] py-1.5 px-3 inline-flex items-center gap-2 max-w-fit shadow-md">
|
||||
<div className="pointer-events-none fixed inset-x-0 top-20 z-50 flex justify-center px-4 md:absolute md:top-auto md:bottom-[-56px] md:inset-x-0">
|
||||
<div className="pointer-events-auto text-white font-serif text-xs md:text-sm bg-red-500/95 rounded-[7px] py-2 px-3 inline-flex items-center gap-2 max-w-[92%] shadow-lg">
|
||||
<span className="text-left">{validationError}</span>
|
||||
<button
|
||||
onClick={handleClearError}
|
||||
|
||||
Reference in New Issue
Block a user