views/contact: Upgrade syntax to latest Tailwind

1 files changed, 16 insertions, 18 deletions

diff --git a/views/contact.view.php b/views/contact.view.php
index 9a76e7e..69ed52d 100644
--- a/views/contact.view.php
+++ b/views/contact.view.php
@@ -1,7 +1,7 @@
 <?php require __DIR__ . '/partials/header.php'; ?>
 
     <?php if (isset($formSuccess)) : ?>
-    <div class="bg-teal-lightest border-t-4 border-blue rounded-b text-teal-darkest
+    <div class="bg-teal-100 border-t-4 border-blue-500 rounded-b text-teal-900
     px-4 py-3 shadow-md" role="alert">
         <div class="flex">
             <div>
@@ -14,28 +14,26 @@
     <?php endif; ?>
 
     <div>
-        <h1 class="text-3xl text-red-light">Contact</h1>
-        <br>
-        <h2 class="text-xl font-normal text-grey-darkest leading-normal">
+        <h1 class="text-3xl text-red-500 font-bold mb-3">Contact</h1>
+        <h2 class="text-xl text-gray-800 leading-normal mb-6">
             Interested in collaborating together?
             Send a message by using the form below.
         </h2>
     </div>
-    <br>
 
     <form class="w-full max-w-md rounded" method="post" action="/contact/">
         <div class="flex flex-wrap -mx-3 mb-6">
 
             <div class="w-full md:w-1/2 px-3 mb-6 md:mb-0">
 
-                <label class="block uppercase tracking-wide text-grey-darker text-xs
+                <label class="block uppercase tracking-wide text-gray-700 text-xs
                 font-bold mb-2" for="name">
                     Name
                 </label>
 
-                <input class="shadow-md appearance-none block w-full bg-grey-lightest
-                text-grey-darker border border-grey-lighter rounded py-3 px-4 mb-3
-                leading-tight focus:outline-none focus:bg-white focus:border-grey"
+                <input class="shadow-md appearance-none block w-full bg-gray-100
+                text-gray-700 border border-gray-100 rounded py-3 px-4 mb-3
+                leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
                 name="26471" id="name" type="text"
                 value="<?php echo $name ?? '' ?>">
 
@@ -43,19 +41,19 @@
 
             <div class="w-full md:w-1/2 px-3">
 
-                <label class="block uppercase tracking-wide text-grey-darker text-xs font-bold mb-2"
+                <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
                 for="email">
                     Email (&lowast;)
                 </label>
 
-                <input class="shadow-md appearance-none block w-full bg-grey-lightest text-grey-darker
-                border <?php echo $border = isset($emailError) ? 'border-red' : 'border-grey-lighter';?>
+                <input class="shadow-md appearance-none block w-full bg-gray-100 text-gray-700
+                border <?php echo $border = isset($emailError) ? 'border-red-600' : 'border-gray-100';?>
                 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white
-                focus:border-grey" name="26472" id="email" type="email" required="required"
+                focus:border-gray-500" name="26472" id="email" type="email" required="required"
                 value="<?php echo $email ?? '' ?>">
 
                 <?php if (isset($emailError)) : ?>
-                    <p class="text-red text-xs"><?php echo $emailError ?></p>
+                    <p class="text-red-600 text-xs"><?php echo $emailError ?></p>
                 <?php endif; ?>
 
             </div>
@@ -63,20 +61,20 @@
         </div>
         <div class="flex flex-wrap -mx-3 mb-6">
             <div class="w-full px-3">
-                <label class="block uppercase tracking-wide text-grey-darker text-xs
+                <label class="block uppercase tracking-wide text-gray-700 text-xs
                 font-bold mb-2" for="message">
                     Message (&lowast;)
                 </label>
                 <textarea class="shadow-md appearance-none block w-full
-                bg-grey-lightest text-grey-darker border border-grey-lighter
+                bg-gray-100 text-gray-700 border border-gray-100
                 rounded py-3 px-4 mb-3 leading-tight focus:outline-none
-                focus:bg-white focus:border-grey" name="26473" id="message"
+                focus:bg-white focus:border-gray-500" name="26473" id="message"
                 rows="4" required="required"><?php echo $message ?? '' ?></textarea>
             </div>
         </div>
 
         <div class="text-center sm:text-left">
-            <button class="shadow bg-blue-light hover:bg-blue
+            <button class="shadow bg-blue-400 hover:bg-blue-500
             focus:shadow-outline focus:outline-none text-white
             font-bold py-2 px-4 rounded" type="submit">
                 Send Message