style: refine validation error UI in HeroSection and improve FilterModal section header layout

This commit is contained in:
pradeepkumar
2026-04-18 08:14:46 +05:30
parent 39a8d846b4
commit 945f0dafaa
2 changed files with 7 additions and 7 deletions

View File

@@ -241,15 +241,15 @@ export function HeroSection({ content }: { content?: HeroContent }) {
{/* Validation Error Message */}
{validationError && (
<div className="absolute left-0 right-0 mt-2 text-center z-10 px-4">
<div className="text-white font-serif text-sm bg-red-500/90 rounded-[7px] py-2 px-4 inline-flex items-center gap-3 max-w-full">
<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">
<span className="text-left">{validationError}</span>
<button
onClick={handleClearError}
className="hover:bg-white/20 rounded-full p-0.5 transition-colors"
className="flex-shrink-0 hover:bg-white/20 rounded-full p-0.5 transition-colors"
title="Dismiss"
>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18 6L6 18M6 6L18 18" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
</svg>
</button>