Color fix process in welcome view

Raccoon254 · May 17, 2024 · 6ab0adb · 6ab0adb
1 parent 11f5d8f
commit 6ab0adb
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 5 deletions.
diff --git a/resources/css/app.css b/resources/css/app.css
@@ -5,3 +5,13 @@
 .center{
     @apply flex items-center justify-center;
 }
+
+/* Components */
+.btn {
+    @apply px-4 py-2 bg-blue-500 text-white rounded;
+}
+
+/* Input */
+.input {
+    @apply px-4 py-2 border border-gray-300 rounded;
+}
diff --git a/resources/views/welcome.blade.php b/resources/views/welcome.blade.php
@@ -15,17 +15,17 @@
 <body class="font-sans antialiased">
 <div class="bg-gray-50">
     <div class="container mx-auto py-12 px-4 sm:px-6 lg:px-8">
-        <div class="flex flex-col md:flex-row items-center justify-between">
+        <div class="flex px-1 sm:px-4 lg:px-8 flex-col md:flex-row items-center justify-between">
             <div class="text-center md:text-left">
                 <h1 class="text-4xl font-bold text-black/90 mb-4">Welcome to Scholarspace</h1>
                 <p class="text-lg text-black/50 mb-8">Your trusted platform for assignment help.</p>
-                <div class="flex justify-center text-black/90 md:justify-start">
+                <div class="flex justify-center md:justify-start">
                     <a href="{{ route('login') }}"
-                       class="bg-blue-500 hover:bg-blue-600 font-semibold py-2 px-4 rounded-md mr-4">
+                       class="bg-blue-500 text-white/90 hover:bg-blue-600 font-semibold py-2 px-4 rounded-md mr-4">
                         Login
                     </a>
                     <a href="{{ route('register') }}"
-                       class="bg-green-500 hover:bg-green-600 font-semibold py-2 px-4 rounded-md">
+                       class="bg-green-500 text-black/90 hover:bg-green-600 font-semibold py-2 px-4 rounded-md">
                         Register
                     </a>
                 </div>
@@ -42,9 +42,12 @@ class="bg-green-500 hover:bg-green-600 font-semibold py-2 px-4 rounded-md">
             <p class="text-lg text-black/50">Our simple and efficient process for getting your assignments done.</p>
         </div>
         <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+            @php
+             $colors = ['text-blue-500', 'text-green-500', 'text-yellow-500', 'text-red-500'];
+            @endphp
             @foreach($process_steps as $item)
                 <div class="bg-white rounded-lg shadow-md shadow-gray-200 p-6">
-                    <i class="{{ $item['icon'] }} fa-3x {{ $item['color'] }} mb-4"></i>
+                    <i class="{{ $item['icon'] }} fa-3x {{ $colors[$loop->index % 4] }} mb-4"></i>
                     <h3 class="text-xl font-bold text-black/90 mb-2">{{ $item['title'] }}</h3>
                     <p class="text-black/50">{{ $item['text'] }}</p>
                 </div>