edit homepage to use hero from daisyui

project/npda/templates/home.html

@@ -3,18 +3,26 @@
 {% block content %}
 
 <section class="bg-rcpch_dark_blue font-montserrat">
-    <div class="py-8 px-4 mx-auto max-w-screen-xl text-center lg:py-16 lg:px-12">
-        <h1 class="mb-4 text-4xl font-extrabold font-arial tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl text-white">National Paediatric Diabetes Audit</h1>
-        <p class="mb-8 text-lg font-normal lg:text-xl sm:px-16 xl:px-48 text-white">We are now accepting data for the 2023-24 audit year. Download the current dataset, templates for submitting data via CSV and questionnaire and our user guide.</p>
-        <div class="flex flex-col mb-8 lg:mb-16 space-y-4 sm:flex-row sm:justify-center sm:space-y-0 sm:space-x-4">
-            <a href="http://0.0.0.0:8007/" class="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-primary-700 hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 focus:ring-primary-900">
-                Learn more
-                <svg class="ml-2 -mr-1 w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
-                    <path fill-rule="evenodd" d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z" clip-rule="evenodd"></path>
-                </svg>
-            </a>
-        </div>
+    <div
+  class="hero min-h-screen bg-rcpch_dark_blue font-montserrat "
+  style="background-image: url({% static 'images/procedural-generation-bg.gif'  %});">
+  <div class="hero-overlay bg-opacity-70 backdrop-hue-rotate-30	backdrop-blur-sm"></div>
+  <div class="w-full hero-content text-neutral-content flex flex-wrap items-center justify-around">
+     <img
+      src="{% static 'npda-logo.png' %}"
+      class="rounded-lg shadow-2xl order-2 md:order-1 max-w-[50%]" />
+    <div class="max-w-md order-1 md:order-2">
+      <h1 class="mb-5 text-5xl font-bold text-center">National Paediatric Diabetes Audit</h1>
+      <p class="mb-5 text-center">
+        We are now accepting data for the 2023-24 audit year. Download the current dataset, templates for submitting data via CSV and questionnaire and our user guide.
+      </p>
+      <a href="http://0.0.0.0:8007/" class="btn w-full">Read User Guide</a>
     </div>
+    <img
+      src="{% static 'rcpch-logo.jpg' %}"
+      class="rounded-lg shadow-2xl order-3  max-w-[50%]" />
+  </div>
+</div>
 </section>
 {% if can_upload_csv %}
 <section class="container-mx-auto pt-4 px-4 flex items-center justify-center rounded-none">