Homepage progress

.idea/.gitignore

@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/

.idea/Komodo-Hub.iml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="PYTHON_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="jdk" jdkName="Python 3.14" jdkType="Python SDK" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/inspectionProfiles/Project_Default.xml

@@ -0,0 +1,14 @@
+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="PyPep8NamingInspection" enabled="true" level="WEAK WARNING" enabled_by_default="true">
+      <option name="ignoredErrors">
+        <list>
+          <option value="N802" />
+          <option value="N803" />
+          <option value="N806" />
+        </list>
+      </option>
+    </inspection_tool>
+  </profile>
+</component>

.idea/inspectionProfiles/profiles_settings.xml

@@ -0,0 +1,6 @@
+<component name="InspectionProjectProfileManager">
+  <settings>
+    <option name="USE_PROJECT_PROFILE" value="false" />
+    <version value="1.0" />
+  </settings>
+</component>

.idea/misc.xml

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="Black">
+    <option name="sdkName" value="Python 3.14" />
+  </component>
+  <component name="ProjectRootManager" version="2" project-jdk-name="Python 3.14" project-jdk-type="Python SDK" />
+</project>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/Komodo-Hub.iml" filepath="$PROJECT_DIR$/.idea/Komodo-Hub.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

.~lock.Komodo_Hub_System_Specification.odt#

@@ -0,0 +1 @@
+,cheshand,Mac,05.02.2026 20:20,/Users/cheshand/.local/share/onlyoffice;

homepage.html

@@ -1,10 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Komodo Hub</title>
-</head>
-<body>
-
-</body>
-</html>

static/styles.css

@@ -1,7 +1,7 @@
 :root {
-  --text: #000000;
+  --text: #cdffca;
-  --background: #ffffff;
+  --background: #094d21;
-  --primary: #869cf7;
+  --primary: #229b3c;
   --secondary: #cc2229;
   --accent: #505e86;
   --transparent: #01030cbf;
@@ -379,8 +379,8 @@ input:focus {
 
 .link_button {
   text-decoration: none;
-  color: var(--background);
+  color: var(--text);
-  margin: 0.5rem 0;
+  margin: 1rem;
   padding: 1rem;
   border-radius: 10px;
   font-size: 20px;

templates/button.html

@@ -0,0 +1,11 @@
+{% macro button(url="#", 
+                button_text="Click Me", 
+                extra_classes="",
+                id="") %}
+<a href="{{ url }}" 
+   class="link_button {{ extra_classes }}" 
+   {% if id %}id="{{ id }}"{% endif %}
+>
+    {{ button_text }}
+</a>
+{% endmacro %}

templates/home/home.jinja

@@ -3,5 +3,49 @@
 {% block head %}
 {% endblock %}
 {% block content %}
-<h1>Hello world</h1>
+{% from 'button.html' import button %}
+<!-- Banner section -->
+<section id="hero" style="padding: 100px 20px; text-align: center;">
+    <img src="/images/image.png"> 
+    <h1>Protecting Indonesia's Endangered Species Together</h1>
+    <p>Komodo Hub is dedicated to safeguarding the incredible biodiversity of Indonesia. Join us in our mission to conserve and protect these precious creatures for future generations.</p>
+        {{ button(url='#', button_text='Donate Now', extra_classes='green') }}
+        {{ button(url='#featured-species', button_text='Explore Species', extra_classes='blue') }}
+        {{ button(url='/register', button_text='Join the Movement', extra_classes='red') }}
+    </div>
+</section>
+<!-- Brief about section -->
+<section id="about" style="padding: 50px 20px; text-align: center;">
+    <h2>What is Komodo Hub?</h2>
+    <p style="max-width: 800px; margin: 0 auto;">Komodo Hub is a digital platform designed to support conservation and species protection efforts across Indonesia. We connect passionate individuals, educators, and organizations to make a tangible difference.</p>
+    <a href="/about" style="display: inline-block; margin-top: 20px; color: #008CBA; text-decoration: none;">Read More &rarr;</a>
+</section>
+<!-- Featured Species -->
+<section id="featured-species" style="padding: 50px 20px; background-color: #f9f9f9; text-align: center;">
+    <h2>Featured Species</h2>
+    <div style="display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; margin-top: 30px;">
+        <div style="border: 1px solid #ddd; padding: 20px; border-radius: 8px; width: 250px;">
+            <h3><a href="/species/komodo-dragon" style="text-decoration: none; color: #333;">Komodo Dragon</a></h3>
+            <p>Main category: Reptile</p>
+        </div>
+        <div style="border: 1px solid #ddd; padding: 20px; border-radius: 8px; width: 250px;">
+            <h3><a href="/species/sumatran-tiger" style="text-decoration: none; color: #333;">Sumatran Tiger</a></h3>
+            <p>Main category: Mammal</p>
+        </div>
+        <div style="border: 1px solid #ddd; padding: 20px; border-radius: 8px; width: 250px;">
+            <h3><a href="/species/orangutan" style="text-decoration: none; color: #333;">Orangutan</a></h3>
+            <p>Main category: Mammal</p>
+        </div>
+    </div>
+    <a href="/species" style="display: inline-block; margin-top: 40px; background-color: #555; color: white; padding: 10px 20px; text-decoration: none; border-radius: 5px;">View All Species</a>
+</section>
+<!-- Schools & communities section -->
+<section id="schools-communities" style="padding: 50px 20px; text-align: center; background-color: #fff;">
+    <h2>Schools & Communities</h2>
+    <p style="max-width: 800px; margin: 0 auto;">Schools and communities play a vital role in conservation. Discover how your group can get involved through educational programs, fundraising, and awareness campaigns.</p>
+    <div style="margin-top: 30px;">
+        <a href="/schools-register" style="background-color: #2196F3; color: white; padding: 15px 25px; text-decoration: none; border-radius: 5px; margin: 0 10px;">Register Your School</a>
+        <a href="/communities-register" style="background-color: #FF9800; color: white; padding: 15px 25px; text-decoration: none; border-radius: 5px; margin: 0 10px;">Join as a Community</a>
+    </div>
+</section>
 {% endblock %}