added video to homepage and black as pre-commit

.pre-commit-config.yaml

@@ -0,0 +1,5 @@
+    repos:
+      - repo: https://github.com/psf/black
+        rev: stable
+        hooks:
+          - id: black

company_site/public/templates/base.html

@@ -25,6 +25,51 @@
       color: white;
       text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
     }
+
+    .hero {
+      
+      height: 60vh;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      color: white;
+      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
+    }
+
+    /* Video styling */
+    .hero video {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      height: 60vh;
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+      transform: translate(-50%, -50%);
+      z-index: -1; /* Place the video behind the content */
+      opacity: 0.7; /* Adjust opacity to darken the video */
+    }
+
+    /* Overlay to darken the video */
+    .hero::after {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.5); /* Adjust the opacity here */
+      z-index: -1; /* Place the overlay behind the content */
+    }
+
+    /* Hero content styling */
+    .hero-content {
+      z-index: 1; /* Ensure content is above the video and overlay */
+      color: white;
+      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
+    }
+
     .hero-section h1 {
       font-size: 4rem;
       font-weight: bold;

company_site/public/templates/public/new_index.html

@@ -1,11 +1,21 @@
 {% extends "base.html" %}
+{% load static %}
 
 {% block content %}
   <!-- Hero Section -->
-  <div class="hero-section">
-    <h1>AI ML Operations, LLC</h1>
-    <br />&nbsp;
-    <p>Taking AI and ML from concept to Production</p>
+  <div class="hero">
+   <!-- Video element -->
+    <video autoplay muted loop playsinline>
+      <source src="{% static 'public/videos/main.mp4' %}" type="video/mp4">
+      Your browser does not support the video tag.
+    </video>
+
+    <!-- Hero content -->
+    <div class="hero-content">
+      <h1>AI ML Operations, LLC</h1>
+      <p>Taking concepts to production</p>
+      
+    </div>
   </div>
 
   <!-- About Us Section -->

requirements.txt

@@ -1,7 +1,17 @@
 asgiref==3.7.2
+cfgv==3.4.0
+distlib==0.3.9
 Django==5.0
+django-enum==2.1.0
+django-phonenumber-field==8.0.0
+django-recaptcha==4.0.0
+filelock==3.17.0
+identify==2.6.9
+nodeenv==1.9.1
+phonenumbers==9.0.0
+platformdirs==4.3.6
+pre_commit==4.1.0
+PyYAML==6.0.2
 sqlparse==0.4.4
 typing_extensions==4.8.0
-django-enum
-django-recaptcha
-django-phonenumber-field[phonenumbers]
+virtualenv==20.29.3