This commit is contained in:
2026-01-22 19:31:05 +01:00
parent 1251584b13
commit 3682673852
7 changed files with 161 additions and 61 deletions

View File

@@ -68,7 +68,7 @@ export default function FeedbackPage() {
// Loading
if (loading) {
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-blue-50 to-indigo-100">
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-[#FAF8F5] via-[#C6C0B3] to-[#4C5F4E]">
<div className="w-10 h-10 border-3 border-indigo-200 border-t-indigo-600 rounded-full animate-spin"></div>
</div>
);
@@ -77,7 +77,7 @@ export default function FeedbackPage() {
// Not found
if (!feedback) {
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-blue-50 to-indigo-100 px-6">
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-[#FAF8F5] via-[#C6C0B3] to-[#4C5F4E] px-6">
<div className="text-center bg-white rounded-2xl p-8 shadow-lg">
<p className="text-gray-500 text-lg">This feedback form is not available.</p>
</div>
@@ -88,9 +88,9 @@ export default function FeedbackPage() {
// Success
if (submitted) {
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-emerald-50 to-teal-100 px-6">
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-[#FAF8F5] via-[#C6C0B3] to-[#4C5F4E] px-6">
<div className="max-w-sm w-full bg-white rounded-3xl shadow-xl p-10 text-center">
<div className="w-20 h-20 bg-gradient-to-br from-emerald-400 to-teal-500 rounded-full flex items-center justify-center mx-auto mb-6 shadow-lg">
<div className="w-20 h-20 bg-gradient-to-br from-[#4C5F4E] to-[#FAF8F5] rounded-full flex items-center justify-center mx-auto mb-6 shadow-lg">
<Check className="w-10 h-10 text-white" strokeWidth={2.5} />
</div>
@@ -114,17 +114,17 @@ export default function FeedbackPage() {
// Rating Form
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50 px-6 py-12">
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-[#FAF8F5] via-[#C6C0B3] to-[#4C5F4E] px-6 py-12">
<div className="max-w-md w-full">
{/* Card */}
<div className="bg-white rounded-3xl shadow-xl overflow-hidden">
{/* Colored Header */}
<div className="bg-gradient-to-r from-indigo-500 to-purple-600 text-white p-8 text-center">
<div className="bg-gradient-to-r from-[#4C5F4E] via-[#C6C0B3] to-[#FAF8F5] p-8 text-center">
<div className="w-14 h-14 bg-white/20 rounded-2xl flex items-center justify-center mx-auto mb-4">
<Star className="w-7 h-7 text-white" />
</div>
<h1 className="text-2xl font-bold mb-1">How was your experience?</h1>
<p className="text-white/80">{feedback.businessName}</p>
<h1 className="text-2xl font-bold mb-1 text-gray-900">How was your experience?</h1>
<p className="text-gray-700">{feedback.businessName}</p>
</div>
{/* Content */}
@@ -142,8 +142,8 @@ export default function FeedbackPage() {
>
<Star
className={`w-11 h-11 transition-all ${star <= (hoverRating || rating)
? 'text-amber-400 fill-amber-400 drop-shadow-sm'
: 'text-gray-200'
? 'text-amber-400 fill-amber-400 drop-shadow-sm'
: 'text-gray-200'
}`}
/>
</button>
@@ -175,8 +175,8 @@ export default function FeedbackPage() {
onClick={handleSubmit}
disabled={rating === 0 || submitting}
className={`w-full py-4 rounded-xl font-semibold flex items-center justify-center gap-2 transition-all ${rating === 0
? 'bg-gray-100 text-gray-400 cursor-not-allowed'
: 'bg-gradient-to-r from-indigo-500 to-purple-600 text-white hover:from-indigo-600 hover:to-purple-700 shadow-lg shadow-indigo-200'
? 'bg-gray-100 text-gray-400 cursor-not-allowed'
: 'bg-gradient-to-r from-[#4C5F4E] to-[#0C342C] text-white hover:from-[#5a705c] hover:to-[#0E4036] shadow-lg shadow-emerald-200'
}`}
>
<Send className="w-4 h-4" />
@@ -186,7 +186,7 @@ export default function FeedbackPage() {
</div>
{/* Footer */}
<p className="text-center text-sm text-indigo-300 mt-6">
<p className="text-center text-sm text-white/60 mt-6">
Powered by QR Master
</p>
</div>