Update contact form dark mode

This commit is contained in:
DariusIII
2025-10-29 16:50:24 +01:00
parent f58c03a4e3
commit e2a43e654c
+18 -18
View File
@@ -8,28 +8,28 @@
<h4 class="text-xl font-semibold text-gray-800 dark:text-gray-200 mb-0">Contact Us</h4>
<nav class="mt-2" aria-label="breadcrumb">
<ol class="flex space-x-2 text-sm">
<li><a href="{{ url($site['home_link'] ?? '/') }}" class="text-blue-600 dark:text-blue-400 hover:text-blue-800">Home</a></li>
<li class="text-gray-500">/</li>
<li class="text-gray-600">Contact</li>
<li><a href="{{ url($site['home_link'] ?? '/') }}" class="text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-300">Home</a></li>
<li class="text-gray-500 dark:text-gray-400">/</li>
<li class="text-gray-600 dark:text-gray-300">Contact</li>
</ol>
</nav>
</div>
<div class="px-6 py-8 lg:px-12 lg:py-10">
@if(isset($msg) && $msg != '')
<div class="mb-6 p-4 bg-green-50 border border-green-200 text-green-800 rounded-lg">
<div class="mb-6 p-4 bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-700 text-green-800 dark:text-green-200 rounded-lg">
<i class="fa fa-check-circle mr-2"></i>{!! $msg !!}
</div>
@endif
@if(session('success'))
<div class="mb-6 p-4 bg-green-50 border border-green-200 text-green-800 rounded-lg">
<div class="mb-6 p-4 bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-700 text-green-800 dark:text-green-200 rounded-lg">
<i class="fa fa-check-circle mr-2"></i>{{ session('success') }}
</div>
@endif
@if($errors->any())
<div class="mb-6 p-4 bg-red-50 border border-red-200 text-red-800 rounded-lg">
<div class="mb-6 p-4 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-700 text-red-800 dark:text-red-200 rounded-lg">
<i class="fa fa-exclamation-circle mr-2"></i>
<ul class="mb-0 list-disc list-inside">
@foreach($errors->all() as $error)
@@ -41,7 +41,7 @@
<div class="mb-6">
<h3 class="text-2xl font-semibold text-gray-800 dark:text-gray-200 mb-3">Have a question?</h3>
<p class="text-gray-600">Don't hesitate to send us a message. Our team will be happy to help you.</p>
<p class="text-gray-600 dark:text-gray-400">Don't hesitate to send us a message. Our team will be happy to help you.</p>
</div>
{!! Form::open(['url' => route('contact-us'), 'method' => 'POST']) !!}
@@ -51,15 +51,15 @@
</label>
<div class="flex">
<span class="inline-flex items-center px-3 bg-gray-50 dark:bg-gray-900 border border-r-0 border-gray-300 dark:border-gray-600 rounded-l-md">
<i class="fas fa-user text-gray-500"></i>
<i class="fas fa-user text-gray-500 dark:text-gray-400"></i>
</span>
<input id="username" type="text" name="username" value="{{ old('username') }}"
placeholder="Your name"
class="flex-1 block w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-r-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('username') border-red-500 @enderror"
class="flex-1 block w-full px-4 py-3 bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-r-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 placeholder-gray-400 dark:placeholder-gray-500 @error('username') border-red-500 @enderror"
required>
</div>
@error('username')
<div class="text-red-500 text-sm mt-1">{{ $message }}</div>
<div class="text-red-500 dark:text-red-400 text-sm mt-1">{{ $message }}</div>
@enderror
</div>
@@ -69,15 +69,15 @@
</label>
<div class="flex">
<span class="inline-flex items-center px-3 bg-gray-50 dark:bg-gray-900 border border-r-0 border-gray-300 dark:border-gray-600 rounded-l-md">
<i class="fas fa-envelope text-gray-500"></i>
<i class="fas fa-envelope text-gray-500 dark:text-gray-400"></i>
</span>
<input type="email" id="useremail" name="useremail" value="{{ old('useremail') }}"
placeholder="Your email address"
class="flex-1 block w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-r-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('useremail') border-red-500 @enderror"
class="flex-1 block w-full px-4 py-3 bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-r-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 placeholder-gray-400 dark:placeholder-gray-500 @error('useremail') border-red-500 @enderror"
required>
</div>
@error('useremail')
<div class="text-red-500 text-sm mt-1">{{ $message }}</div>
<div class="text-red-500 dark:text-red-400 text-sm mt-1">{{ $message }}</div>
@enderror
</div>
@@ -87,15 +87,15 @@
</label>
<div class="flex">
<span class="inline-flex items-start px-3 pt-3 bg-gray-50 dark:bg-gray-900 border border-r-0 border-gray-300 dark:border-gray-600 rounded-tl-md rounded-bl-md">
<i class="fas fa-comment text-gray-500"></i>
<i class="fas fa-comment text-gray-500 dark:text-gray-400"></i>
</span>
<textarea rows="7" name="comment" id="comment"
placeholder="Your message"
class="flex-1 block w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-r-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('comment') border-red-500 @enderror"
class="flex-1 block w-full px-4 py-3 bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-r-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500 placeholder-gray-400 dark:placeholder-gray-500 @error('comment') border-red-500 @enderror"
required>{{ old('comment') }}</textarea>
</div>
@error('comment')
<div class="text-red-500 text-sm mt-1">{{ $message }}</div>
<div class="text-red-500 dark:text-red-400 text-sm mt-1">{{ $message }}</div>
@enderror
</div>
@@ -104,7 +104,7 @@
{!! \App\Support\CaptchaHelper::display() !!}
</div>
@error(\App\Support\CaptchaHelper::getResponseFieldName())
<div class="text-red-500 text-center text-sm mb-6">{{ $message }}</div>
<div class="text-red-500 dark:text-red-400 text-center text-sm mb-6">{{ $message }}</div>
@enderror
@endif
@@ -117,7 +117,7 @@
</div>
<div class="bg-gray-50 dark:bg-gray-900 px-6 py-4 border-t border-gray-200 dark:border-gray-700 rounded-b-lg text-center">
<p class="mb-0 text-gray-600">
<p class="mb-0 text-gray-600 dark:text-gray-400">
<i class="fas fa-info-circle mr-1"></i>
We typically respond to messages within 1-2 business days.
</p>