+ 
+
+ )}
+
+ {member.name}
+{member.role}
+
{/* Logo */}
-
- 
+
{/* Navigation */}
diff --git a/src/Pages/AUVTechnology.jsx b/src/Pages/AUVTechnology.jsx
index 000a38d..7adb1eb 100644
--- a/src/Pages/AUVTechnology.jsx
+++ b/src/Pages/AUVTechnology.jsx
@@ -1,54 +1,78 @@
import React, { useEffect, useRef, useState } from "react";
-import { Link } from "react-router-dom";
+import { useLocation, Link } from "react-router-dom";
import {
FaCogs,
FaBolt,
FaLaptopCode,
FaInfoCircle,
- FaArrowsAlt,
FaExpand,
} from "react-icons/fa";
import * as THREE from "three";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
import "../styles/AUVTechnology.css";
-
-// Helper component for hotspots that appear on the 3D model
-const Hotspot = ({ id, title, isActive, onClick }) => {
- return (
-
+
{/* Navigation */}
diff --git a/src/Pages/AUVTechnology.jsx b/src/Pages/AUVTechnology.jsx
index 000a38d..7adb1eb 100644
--- a/src/Pages/AUVTechnology.jsx
+++ b/src/Pages/AUVTechnology.jsx
@@ -1,54 +1,78 @@
import React, { useEffect, useRef, useState } from "react";
-import { Link } from "react-router-dom";
+import { useLocation, Link } from "react-router-dom";
import {
FaCogs,
FaBolt,
FaLaptopCode,
FaInfoCircle,
- FaArrowsAlt,
FaExpand,
} from "react-icons/fa";
import * as THREE from "three";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
import "../styles/AUVTechnology.css";
-
-// Helper component for hotspots that appear on the 3D model
-const Hotspot = ({ id, title, isActive, onClick }) => {
- return (
-
-
-
- {title}
+import techReport from "../assets/Design_and_Development_of_SubjuGator_9.pdf";
+
+// Hotspot button on the model
+const Hotspot = ({ id, title, isActive, onClick }) => (
+
+
+);
+
+// Specification card below the 3D canvas
+const SpecCard = ({ icon, title, description, list }) => (
+
+
- );
-};
+ {title}
+
+
+);
+
+export default function AUVTechnology() {
+ const location = useLocation();
+
+ // 1) Keep --vh up to date for mobile address-bar hiding
+ useEffect(() => {
+ const setVh = () =>
+ document.documentElement.style.setProperty(
+ "--vh",
+ `${window.innerHeight * 0.01}px`
+ );
+ setVh();
+ window.addEventListener("resize", setVh);
+ window.addEventListener("orientationchange", setVh);
+ return () => {
+ window.removeEventListener("resize", setVh);
+ window.removeEventListener("orientationchange", setVh);
+ };
+ }, []);
-// Helper component for technical specifications
-const SpecCard = ({ icon, title, description, list }) => {
- return (
- {icon}
+ {title}
+{description}
+ {list && ( +-
+ {list.map((item, i) => (
+
- {item} + ))} +
-
- );
-};
+ // 2) Smooth-scroll to anchors
+ useEffect(() => {
+ if (location.hash) {
+ setTimeout(() => {
+ const el = document.querySelector(location.hash);
+ if (el) el.scrollIntoView({ behavior: "smooth" });
+ }, 100);
+ }
+ }, [location.hash]);
-function AUVTechnology() {
- // Refs for DOM elements and Three.js objects
+ // Three.js refs
const canvasContainerRef = useRef(null);
const canvasRef = useRef(null);
const sceneRef = useRef(null);
@@ -56,101 +80,25 @@ function AUVTechnology() {
const rendererRef = useRef(null);
const controlsRef = useRef(null);
const modelRef = useRef(null);
- const animationFrameRef = useRef(null);
+ const frameRef = useRef(null);
- // State for UI and interactions
- const [activeSection, setActiveSection] = useState("overview");
+ // UI state
const [activeHotspot, setActiveHotspot] = useState(null);
const [isLoading, setIsLoading] = useState(true);
- const [viewMode, setViewMode] = useState("complete"); // complete or exploded
- const [infoVisible, setInfoVisible] = useState(true);
const [isModelLoaded, setIsModelLoaded] = useState(false);
+ const [viewMode, setViewMode] = useState("complete");
+ const [infoVisible, setInfoVisible] = useState(true);
- // Define hotspots to display on the model
+ // Hotspot definitions
const hotspots = [
- {
- id: "thrusters",
- title: "Thrusters",
- position: { x: 0.3, y: 0.1, z: 0.2 },
- },
- {
- id: "camera",
- title: "Vision System",
- position: { x: -0.2, y: 0.15, z: 0.3 },
- },
- { id: "mainHull", title: "Main Hull", position: { x: 0, y: 0, z: 0 } },
- {
- id: "torpedos",
- title: "Torpedo System",
- position: { x: 0.4, y: 0, z: -0.2 },
- },
- {
- id: "gripper",
- title: "Gripper",
- position: { x: -0.35, y: -0.1, z: 0.15 },
- },
+ { id: "thrusters", title: "Thrusters" },
+ { id: "camera", title: "Vision System" },
+ { id: "mainHull", title: "Main Hull" },
+ { id: "torpedos", title: "Torpedo System" },
+ { id: "gripper", title: "Gripper" },
];
- // Function to update hotspot positions - now inside the component
- const updateHotspotPositions = () => {
- if (
- !modelRef.current ||
- !cameraRef.current ||
- !sceneRef.current ||
- !canvasRef.current
- )
- return;
-
- // Get the canvas dimensions for calculations
- const canvas = canvasRef.current;
- const rect = canvas.getBoundingClientRect();
-
- // - Thrusters are now positioned at the rear (underside)
- // - Camera (vision system) is raised on the front
- // - Main Hull remains centered
- // - Torpedo system is placed on the front right
- // - Gripper is placed on the front left
- const attachmentPoints = {
- thrusters: new THREE.Vector3(0, -0.1, -0.3),
- camera: new THREE.Vector3(0, 0.05, 0.2),
- mainHull: new THREE.Vector3(0, 0, 0),
- torpedos: new THREE.Vector3(0.1, -0.01, 0.15),
- gripper: new THREE.Vector3(-0.5, 0.1, -0.35),
- };
-
- hotspots.forEach((hotspot) => {
- if (!attachmentPoints[hotspot.id]) return;
- const point = attachmentPoints[hotspot.id].clone();
-
- // Convert model space to world space
- if (modelRef.current) {
- const worldMatrix = modelRef.current.matrixWorld.clone();
- point.applyMatrix4(worldMatrix);
- }
-
- // Project 3D point to 2D screen coordinates
- point.project(cameraRef.current);
-
- // Convert to CSS coordinates
- const x = (point.x * 0.5 + 0.5) * rect.width;
- const y = (-point.y * 0.5 + 0.5) * rect.height;
-
- // Check if point is in front of the camera (z between -1 and 1 after projection)
- const visible = point.z > -1 && point.z < 1;
-
- // Update hotspot DOM element position
- const hotspotElement = document.querySelector(
- `.model-hotspot[data-id="${hotspot.id}"]`
- );
- if (hotspotElement) {
- hotspotElement.style.left = `${x}px`;
- hotspotElement.style.top = `${y}px`;
- hotspotElement.style.visibility = visible ? "visible" : "hidden";
- }
- });
- };
-
- // Technical specifications for each system
+ // Technical specifications data
const technicalSpecs = {
mechanical: {
icon: {icon}
- {title}
-{description}
- {list && ( --
- {list.map((item, index) => (
-
- {item} - ))} -
- {/* Hero Section with 3D Model */}
+ {/* ===== Hero ===== */}
-
-
-
-
- AUV Technology -
-- Exploring the innovation behind SubjuGator -
- - {/* 3D Model Canvas Container */} -
- {isLoading && (
-
-
+
-
-
-
- {/* Feature Highlight Section */}
-
-
-
- {/* Next Generation Section */}
-
-
- {/* Call to Action */}
+ {/* ===== Call to Action ===== */}
);
}
-
-export default AUVTechnology;
diff --git a/src/Pages/AboutUs.jsx b/src/Pages/AboutUs.jsx
index 07e2e53..163813e 100644
--- a/src/Pages/AboutUs.jsx
+++ b/src/Pages/AboutUs.jsx
@@ -198,7 +198,7 @@ function AboutUs() {
collaboration within the global AUV community.
@@ -513,7 +499,7 @@ function AboutUs() {
+
{/* Call to Action */}
-
-
- )}
-
-
-
- {isModelLoaded && (
- <>
- {/* Interactive Hotspots */}
- Loading 3D Model...
-
- {hotspots.map((hotspot) => (
- handleHotspotClick(hotspot.id)}
- />
- ))}
-
-
- {/* Model Controls */}
-
-
+
- {/* Technical Specifications Section */}
+ {/* ===== Technical Specifications ===== */}
+
+ AUV Technology +
++ Exploring the innovation behind SubjuGator +
+
+ {isLoading && (
+
-
-
+
+
+ )}
+
+ {isModelLoaded && (
+ <>
+ Loading 3D Model…
+
+ {hotspots.map((hs) => (
+
+ setActiveHotspot((p) => (p === hs.id ? null : hs.id))
}
- >
-
-
- )}
-
- {/* Component Information Panel */}
- {activeHotspot && infoVisible && (
-
-
- )}
- {hotspots.find((h) => h.id === activeHotspot)?.title}
-- {activeHotspot === "thrusters" && - "Eight-thruster configuration provides redundant six degrees of freedom control, maintaining full functionality even if one thruster fails."} - {activeHotspot === "camera" && - "Computer vision system using advanced neural networks for object detection and classification underwater."} - {activeHotspot === "mainHull" && - "Houses the main computer, power distribution, and electronic systems in a waterproof enclosure."} - {activeHotspot === "torpedos" && - "Dual servo-actuated torpedo launchers with rack and pinion mechanisms for competition tasks."} - {activeHotspot === "gripper" && - "Servo-actuated gripper with serrated aluminum jaws for manipulating underwater objects."} -
+ /> + ))}
-
+ - Click and drag to rotate • Scroll to zoom • Click on hotspots to - explore -
-
+
+
+
+ {activeHotspot && infoVisible && (
+
+
+ )}
+
+ )}
+ {hotspots.find((h) => h.id === activeHotspot)?.title} +
++ {/* Add your active-hotspot description here */} +
+Technical Specifications
- +Cutting-edge systems powering autonomous underwater exploration
-
-
-
-
-
-
- Key Innovations
- -- Pioneering advancements that set SubjuGator apart -
-
-
-
-
- {/* Background image will be set in CSS */}
-
-
-
+ - Adaptive{" "} - Control System -
-- Our state-of-the-art control system uses an unscented Kalman - filter operating on manifolds to efficiently handle attitude - singularities. The trajectory generator produces 3rd-order - continuous trajectories while accounting for vehicle - constraints. -
- - Read Research Paper - -
-
-
-
- {/* Background image will be set in CSS */}
-
-
-
- - Deep Learning{" "} - Vision -
-- SubjuGator combines traditional computer vision techniques with - advanced deep neural networks (YOLO architecture) to identify - competition elements and navigate dynamic underwater - environments. -
- - Explore Vision System - -
-
-
- {/* Background image will be set in CSS */}
-
-
-
- - Advanced{" "} - Electro-Mechanical{" "} - Design -
-- Our innovative electro-mechanical systems include custom PCB - designs, CAN bus communications, servo-actuated mechanisms, and - aluminum components manufactured using precision CNC and - water-jet cutting techniques. -
- - See Design Details - -
-
-
+
-
-
-
- SubjuGator 9
- -- The next generation of autonomous underwater excellence -
-
-
- {/* Resources Section */}
+ {/* ===== Resources ===== */}
- {/* This will be a background image set in CSS */}
-
-
-
+
Evolution of Innovation
-- Currently in development, SubjuGator 9 represents the - culmination of years of research and competition experience. - With a completely redesigned aluminum chassis and electronics - hull, this next-generation AUV will push the boundaries of - what's possible in autonomous underwater robotics. -
-
-
-
-
- Enhanced Chassis
-- Fully CNC-machined from 6061-T6 aluminum for optimal - strength and weight -
-
-
- Advanced Electronics
-- Redesigned electronics hull with improved thermal management - and expanded sensor capacity -
-
-
- Next-Gen Software
-- Enhanced autonomy algorithms and improved mission planning - capabilities -
-Technical Resources
- +In-depth documentation and research materials
-
-
-
- Mechanical Documentation
-Detailed specifications, CAD files, and assembly guides
- - - -
-
- Electrical Schematics
-PCB designs, wiring diagrams, and component datasheets
- - - +Software Repository
Open-source codebase, ROS packages, and development guides
- - + PDFTechnical Paper
-- Comprehensive overview of SubjuGator's design and implementation -
+Comprehensive overview of SubjuGator's design and implementation
Experience Innovation
-- Want to learn more about SubjuGator or get involved with our team? -
+Want to learn more about SubjuGator or get involved with our team?
-
+
RoboSub Competition
-
+
Meet The Team
@@ -957,5 +471,3 @@ function AUVTechnology() {
-
-
- 7x AUVSI RoboSub champions +
- 5x AUVSI RoboSub champions
- Consistent innovation award recipients
- International recognition for technical merit
Team Formation
@@ -255,10 +252,7 @@ function AboutUs() {First Competition Win
@@ -281,10 +275,7 @@ function AboutUs() {Technology Evolution
@@ -307,10 +298,8 @@ function AboutUs() {Advanced Autonomy
@@ -333,10 +322,7 @@ function AboutUs() {SubjuGator 9
@@ -424,7 +410,7 @@ function AboutUs() {
-
+
Meet Our Team Members
@@ -456,7 +442,7 @@ function AboutUs() {
Dr. Eric M. Schwartz
- Director, Machine Intelligence Laboratory + Director, SubjuGator AUV Project & Machine Intelligence Laboratory
Areas of Expertise:
@@ -467,8 +453,8 @@ function AboutUs() {- Provides overall guidance for the SubjuGator team and - coordinates resources across the university. + Provides overall guidance, invaluable insight and + coordinates resources across the university for the SubjuGator team.
7x RoboSub Champions
+5x RoboSub Champions
First place wins at the international AUVSI RoboSub Competition
@@ -548,7 +534,7 @@ function AboutUs() { underwater robotics!
+ {/* — 1 — */}
-
-
- {/* Update image will be background in CSS */}
-
+ {/* add bg via CSS */}
- February 28, 2025
+
SubjuGator 9 Development
- Progress on our next-generation AUV including aluminum chassis + Progress on our new AUV including aluminum chassis completion and electronics hull integration.
- - Read More - + Read More
-
- {/* Update image will be background in CSS */}
-
+ {/* — 2 — */}
+
+
-
-
- January 15, 2025
+
- RoboSub 2025 Preparation
- Team training and technology refinement for the upcoming + Team testing and technology refinement for the upcoming competition season.
- - Read More - -
-
+
- {/* Update image will be background in CSS */}
-
-
- December 10, 2024
-
- End-of-Year Achievements
-- Celebrating our accomplishments and recognizing team - contributions. -
- - Read More - + Read More
@@ -242,10 +265,19 @@ function Home() {
technology. Connect with our team or support our mission.
+ {hasImage && (
+
+ );
+};
+
+/* ---------- page component ---------- */
function OurTeam() {
+ const rawMembers = [
+ { name: "Adam McAleer", role: "Mechanical Lead" },
+ { name: "Joseph Goodman", role: "Electrical Lead" },
+ { name: "Cameron Brown", role: "Software Lead" },
+ { name: "Adrian Fernandez", role: "Electrical Lead" },
+ { name: "Lester Bonilla", role: "Electrical Lead" },
+ { name: "Adam Hamdan", role: "Mechanical Lead" },
+ { name: "Ryan Hoburg", role: "Mechanical Lead" },
+ { name: "Alex Johnson", role: "Software Lead" },
+ { name: "Carlos Chavez", role: "Software Lead" },
+ { name: "Eric(Jack) Rainville", role: "Electrical Lead" },
+ { name: "Ethan Mitchell", role: "Electrical Member" },
+ { name: "Keith Khadar", role: "Software Lead" },
+ { name: "Daniel Parra", role: "Software Lead" },
+ { name: "Lorant Domokos", role: "Mechanical Lead" },
+
+
+ ];
+
+ /* attach images */
+ const teamMembers = rawMembers.map((m) => ({
+ ...m,
+ img: resolveImage(toSlug(m.name)),
+ }));
+
+ const location = useLocation();
+
+ useEffect(() => {
+ const hash = location.hash;
+ if (hash) {
+ // Delay to ensure the target element is rendered
+ setTimeout(() => {
+ const element = document.querySelector(hash);
+ if (element) {
+ element.scrollIntoView({ behavior: "smooth" });
+ }
+ }, 100);
+ }
+ }, [location]);
+
+
+ /* devtools verification – run once */
+ useEffect(() => {
+ console.table(teamMembers.map((m) => ({ name: m.name, imgFound: !!m.img })));
+ }, []);
return (
-
+
+
+
+ {/* ----- grid section ----- */}
+
+
+
+
+
+
+
);
}
-export default OurTeam;
+export default OurTeam;
\ No newline at end of file
diff --git a/src/Pages/RoboSub.jsx b/src/Pages/RoboSub.jsx
index f1eef37..0084942 100644
--- a/src/Pages/RoboSub.jsx
+++ b/src/Pages/RoboSub.jsx
@@ -1,4 +1,5 @@
import React, { useState, useEffect, useRef } from "react";
+import { useLocation } from "react-router-dom";
import { Link } from "react-router-dom";
import {
FaRobot,
@@ -69,6 +70,21 @@ function RoboSub() {
const titleRef = useRef(null);
const subtitleRef = useRef(null);
+ const location = useLocation();
+
+ useEffect(() => {
+ const hash = location.hash;
+ if (hash) {
+ // Delay to ensure the target element is rendered
+ setTimeout(() => {
+ const element = document.querySelector(hash);
+ if (element) {
+ element.scrollIntoView({ behavior: "smooth" });
+ }
+ }, 100);
+ }
+ }, [location]);
+
useEffect(() => {
// Force immediate display of elements instead of relying on animations
const heroBackground = heroBackgroundRef.current;
@@ -90,7 +106,7 @@ function RoboSub() {
return (
@@ -315,12 +338,12 @@ function RoboSub() {
-
+
Meet Our Team
-
+ {
+ const el = document.querySelector("#top-sponsor");
+ if (el) {
+ el.scrollIntoView({ behavior: "smooth" });
+ }
+ }}
+ >
Become a Sponsor
diff --git a/src/Pages/OurTeam.jsx b/src/Pages/OurTeam.jsx
index 200276d..adeabb1 100644
--- a/src/Pages/OurTeam.jsx
+++ b/src/Pages/OurTeam.jsx
@@ -1,12 +1,141 @@
-import React from "react";
+import React, { useEffect } from "react";
+import { useLocation } from "react-router-dom";
+import { Link } from "react-router-dom";
+import "../styles/OurTeam.css";
+/* ---------- auto-import headshots from /assets/people ---------- */
+const peopleModules = import.meta.glob(
+ "../assets/people/*.{png,jpg,jpeg,webp,gif}",
+ { eager: true }
+);
+const memberImages = Object.fromEntries(
+ Object.entries(peopleModules).map(([path, mod]) => [
+ path.split("/").pop(),
+ mod.default,
+ ])
+);
+
+const toSlug = (name) =>
+ name.toLowerCase().replace(/[^a-z0-9\s]/g, "").trim().replace(/\s+/g, "_");
+
+const resolveImage = (slug) => {
+ for (const ext of ["png", "jpg", "jpeg", "webp", "gif"]) {
+ const key = `${slug}.${ext}`;
+ if (memberImages[key]) return memberImages[key];
+ }
+ return undefined; // fallback – no head‑shot found
+};
+
+/* ---------- card component ---------- */
+const TeamMemberCard = ({ member }) => {
+ const hasImage = Boolean(member.img);
+
+ return (
+
-
+ Our Team
-This is a placeholder for now.
-+ 2025 Team + Members +
+
+
+ + Meet the engineers shaping SubjuGator +
+ +
+ {teamMembers.map((member) => (
+
+
+
+ Passionate about underwater robotics?
+
+
+ Contact Us
+
+
+
-
+
-
@@ -224,12 +241,20 @@ function RoboSub() {
{/* Background image now set with inline style as fallback */}
@@ -106,9 +122,8 @@ function RoboSub() {
@@ -166,21 +181,25 @@ function RoboSub() {
Competition Vehicle
- Meet SubjuGator 8, our flagship autonomous underwater vehicle + Meet SubjuGator 9, our flagship autonomous underwater vehicle
- 
- ![SubjuGator 9]()
+
- SubjuGator 8 - University of Florida's AUV
+ Subjugator 9 - First Swim
-
SubjuGator 8
+SubjuGator 9
- SubjuGator 8 has served as the flagship autonomous submarine for the Machine Intelligence Laboratory (MIL) at the University of Florida for the past five years. It features a modular design that allows for rapid iteration and improvement of individual components. + SubjuGator 9 represents the + culmination of years of research and competition experience. + With a completely redesigned aluminum chassis and electronics + hull, this next-generation AUV pushes the boundaries of + what's possible in autonomous underwater robotics.
@@ -189,24 +208,22 @@ function RoboSub() {
Computing
- Intel i9-9900k + Nvidia RTX 2080
+ Nvidia Jetson Orion NX
Power
- 22.2V LiPo Batteries
+ 14.8V LiPo Batteries
Framework
- ROS Noetic
+ ROS 2 Jazzy
- Technical Design Report
-
+
Innovative Design
-- The mechanical design of SubjuGator 8 incorporates four independently operated electronic servo mechanisms: a gripper, two torpedo launchers, and a marker dropper. These mechanisms are used to complete mission-specific tasks, and they are controlled through the servo controller board housed in a separate, compact pressure vessel. -
+
+
+
+
+
Mechanisms
++ Three independently + operated electronic servo mechanisms: a gripper, + torpedo launcher, and a ball dropper. +
+
-
Space-Frame Chassis
+Durable Frame
Carbon fiber tubes and aluminum sheet sections provide protection for delicate components while enabling modularity.
@@ -237,17 +262,16 @@ function RoboSub() {
CNC milled and abrasive water-jetted aluminum components replaced many previously 3D printed parts for improved durability.
-
Redundant Thruster Configuration
+Thruster Configuration
Eight thrusters provide full six degrees of freedom control with built-in redundancy for mission reliability.
- 
+ ![SubjuGator 9 Mechanical System]()
@@ -268,18 +292,17 @@ function RoboSub() {
+
-
Servo Actuators
-Waterproof servo system ensures reliable actuation for all manipulation tasks
+SubjuGator 9 Frame
- 
+ ![SubjuGator 9 Electrical Architecture]()
+ Student-Designed PCBs
-Custom boards for thruster control, power management, and sensor integration
Robust Electrical Systems
- SubjuGator 8 consists of a robust set of embedded industry standards and student-designed electronic devices. Peripheral to the main computer is a suite of devices to aid in navigation, safety, power delivery, and communication. + SubjuGator 9 consists of a robust set of embedded industry standards and student-designed electronic devices. Peripheral to the main computer is a suite of devices to aid in navigation, safety, power delivery, and communication.
@@ -291,8 +314,8 @@ function RoboSub() {
Hall-effect-based manual shut-off feature allows immediate power cutoff to thrusters for safety during testing and competitions.
-
Water Cooling System
-Closed-loop water cooling ensures optimal thermal efficiency for the main computer and GPGPU.
+Open Architecture
+Subjuss computers and sesnors are connected via a gigabit Ethernet switch. Adding and removing systems is as simple as connecting or disconnecting network devices.
Advanced Autonomy
- SubjuGator 8's software stack is built on the Noetic version of the Robot Operating System (ROS). Our stack has grown to over 60+ ROS packages, all of which are open-source, allowing other teams to share the benefits of our work. + SubjuGator 9's software stack is built on the Jazzy version of the Robot Operating System 2 (ROS2). Our stack has grown to over 60+ ROS packages, all of which are open-source, allowing other teams to share the benefits of our work.
State Estimation
-An unscented Kalman filter operating on manifolds provides efficient handling of attitude singularities, fusing data from IMU, DVL, and other sensors.
+An Extended Kalman filter operating on manifolds provides efficient handling of attitude singularities, fusing data from IMU, DVL, and other sensors.
Computer Vision
@@ -333,7 +356,7 @@ function RoboSub() {
- 
+ 
+
Simulation Environment
@@ -358,7 +381,7 @@ function RoboSub() {
- 
+ 
+
diff --git a/src/Pages/ScrollToTop.jsx b/src/Pages/ScrollToTop.jsx
new file mode 100644
index 0000000..d965e32
--- /dev/null
+++ b/src/Pages/ScrollToTop.jsx
@@ -0,0 +1,10 @@
+import { useEffect } from "react";
+import { useLocation } from "react-router-dom";
+
+export default function ScrollToTop() {
+ const { pathname } = useLocation();
+ useEffect(() => {
+ window.scrollTo(0, 0);
+ }, [pathname]);
+ return null;
+}
diff --git a/src/Pages/Sponsors.jsx b/src/Pages/Sponsors.jsx
index 3b1aced..3c1697d 100644
--- a/src/Pages/Sponsors.jsx
+++ b/src/Pages/Sponsors.jsx
@@ -1,12 +1,144 @@
-import React from "react";
+// src/Pages/Sponsors.jsx
+import React, { useEffect } from "react";
+import { useLocation } from "react-router-dom";
+import "../styles/Sponsors.css";
-function Sponsors() {
- return (
-
-
+
+);
+
+/* ---------- Main page ---------- */
+const Sponsors = () => {
+ const diamondSponsors = [
+ {
+ name: "Sylphase",
+ url: "https://sylphase.com",
+ imgSrc: sylphaseLogo,
+ imgAlt: "Sylphase Logo",
+ },
+ {
+ name: "L3Harris Technologies",
+ url: "https://l3harris.com",
+ imgSrc:
+ "https://upload.wikimedia.org/wikipedia/en/thumb/2/23/L3Harris_Technologies_logo.svg/1280px-L3Harris_Technologies_logo.svg.png",
+ imgAlt: "L3Harris Logo",
+ },
+ {
+ name: "Erik de la Inglesia",
+ imgSrc: "https://mil.ufl.edu/sponsors/Erik.png",
+ imgAlt: "Erik de la Iglesia",
+ },
+ ];
+
+ const platinumSponsors = [
+ {
+ name: "JD Squared",
+ url: "https://jd2.com",
+ imgSrc: "http://mil.ufl.edu/sponsors/JD-squared-transparent.png",
+ imgAlt: "JD Squared Logo",
+ },
+ {
+ name: "Texas Instruments",
+ url: "https://ti.com",
+ imgSrc: "https://1000logos.net/wp-content/uploads/2020/04/Logo-Texas-Instruments.jpg",
+ imgAlt: "Texas Instruments Logo",
+ },
+ ];
+
+ const goldSponsors = [
+ { name: "Kevin Allen (MIL alumnus)", imgSrc: "http://mil.ufl.edu/sponsors/kevin.jpeg", imgAlt: "Kevin Allen" },
+ { name: "Anonymous (MIL alumnus)" },
+ ];
+
+ const silverSponsors = [
+ { name: "Matthew Langford (MIL alumnus)" },
+ { name: "IEEE", url: "https://www.ieee.org", imgSrc: "https://upload.wikimedia.org/wikipedia/commons/2/21/IEEE_logo.svg", imgAlt: "IEEE Logo" },
+ { name: "Anonymous (MIL alumnus)" },
+ { name: "Electrical and Computer Engineering, UF", url: "https://ece.ufl.edu", imgSrc: "https://www.ece.ufl.edu/wp-content/uploads/2024/10/ElectricalComputerEngineering-VECTOR-RGB.svg", imgAlt: "ECE Logo" },
+ { name: "Mechanical and Aerospace Engineering, UF", url: "https://mae.ufl.edu", imgSrc: "https://mil.ufl.edu/sponsors/MAE_logo.png", imgAlt: "MAE Logo" },
+ ];
+
+ const bronzeSponsors = [
+ { name: "Dr. Andrew Gray (MIL alumnus)" },
+ { name: "DigiKey", url: "https://www.digikey.com", imgSrc: "https://upload.wikimedia.org/wikipedia/commons/thumb/5/59/DigiKey_logo.svg/1280px-DigiKey_logo.svg.png", imgAlt: "DigiKey Logo" },
+ ];
+
+ const location = useLocation();
+
+ useEffect(() => {
+ const hash = location.hash;
+ if (hash) {
+ // Delay to ensure the target element is rendered
+ setTimeout(() => {
+ const element = document.querySelector(hash);
+ if (element) {
+ element.scrollIntoView({ behavior: "smooth" });
+ }
+ }, 100);
+ }
+ }, [location]);
+
+ return (
+
+ {/* ----- hero ----- */}
+
+
+
+ {/* ----- sponsor tiers ----- */}
+
);
-}
+};
export default Sponsors;
diff --git a/src/assets/Design_and_Development_of_SubjuGator_9.pdf b/src/assets/Design_and_Development_of_SubjuGator_9.pdf
new file mode 100644
index 0000000..d88cb7d
Binary files /dev/null and b/src/assets/Design_and_Development_of_SubjuGator_9.pdf differ
diff --git a/src/assets/PCB.png b/src/assets/PCB.png
new file mode 100644
index 0000000..2173dde
Binary files /dev/null and b/src/assets/PCB.png differ
diff --git a/src/assets/advanced-autonomy.png b/src/assets/advanced-autonomy.png
new file mode 100644
index 0000000..4fe69fe
Binary files /dev/null and b/src/assets/advanced-autonomy.png differ
diff --git a/src/assets/people/adam_hamdan.png b/src/assets/people/adam_hamdan.png
new file mode 100644
index 0000000..4a0c9af
Binary files /dev/null and b/src/assets/people/adam_hamdan.png differ
diff --git a/src/assets/people/adam_mcaleer.png b/src/assets/people/adam_mcaleer.png
new file mode 100644
index 0000000..76cf73e
Binary files /dev/null and b/src/assets/people/adam_mcaleer.png differ
diff --git a/src/assets/people/adrian_fernandez.png b/src/assets/people/adrian_fernandez.png
new file mode 100644
index 0000000..e6cfe3b
Binary files /dev/null and b/src/assets/people/adrian_fernandez.png differ
diff --git a/src/assets/people/alex_johnson.png b/src/assets/people/alex_johnson.png
new file mode 100644
index 0000000..f8e945b
Binary files /dev/null and b/src/assets/people/alex_johnson.png differ
diff --git a/src/assets/people/cameron_brown.jpeg b/src/assets/people/cameron_brown.jpeg
new file mode 100644
index 0000000..3965348
Binary files /dev/null and b/src/assets/people/cameron_brown.jpeg differ
diff --git a/src/assets/people/carlos_chavez.png b/src/assets/people/carlos_chavez.png
new file mode 100644
index 0000000..7e69bd8
Binary files /dev/null and b/src/assets/people/carlos_chavez.png differ
diff --git a/src/assets/people/daniel_parra.png b/src/assets/people/daniel_parra.png
new file mode 100644
index 0000000..73a933b
Binary files /dev/null and b/src/assets/people/daniel_parra.png differ
diff --git a/src/assets/people/ericjack_rainville.jpg b/src/assets/people/ericjack_rainville.jpg
new file mode 100644
index 0000000..fddcb2d
Binary files /dev/null and b/src/assets/people/ericjack_rainville.jpg differ
diff --git a/src/assets/people/ethan_mitchell.png b/src/assets/people/ethan_mitchell.png
new file mode 100644
index 0000000..303187d
Binary files /dev/null and b/src/assets/people/ethan_mitchell.png differ
diff --git a/src/assets/people/joseph_goodman.png b/src/assets/people/joseph_goodman.png
new file mode 100644
index 0000000..96f2416
Binary files /dev/null and b/src/assets/people/joseph_goodman.png differ
diff --git a/src/assets/people/keith_khadar.jpg b/src/assets/people/keith_khadar.jpg
new file mode 100644
index 0000000..b7b2c04
Binary files /dev/null and b/src/assets/people/keith_khadar.jpg differ
diff --git a/src/assets/people/lester_bonilla.jpg b/src/assets/people/lester_bonilla.jpg
new file mode 100644
index 0000000..0f8ec97
Binary files /dev/null and b/src/assets/people/lester_bonilla.jpg differ
diff --git a/src/assets/people/lorant_domokos.png b/src/assets/people/lorant_domokos.png
new file mode 100644
index 0000000..91425a6
Binary files /dev/null and b/src/assets/people/lorant_domokos.png differ
diff --git a/src/assets/people/ryan_hoburg.png b/src/assets/people/ryan_hoburg.png
new file mode 100644
index 0000000..afd4552
Binary files /dev/null and b/src/assets/people/ryan_hoburg.png differ
diff --git a/src/assets/robosub_logo.png b/src/assets/robosub_logo.png
new file mode 100644
index 0000000..5fd49c0
Binary files /dev/null and b/src/assets/robosub_logo.png differ
diff --git a/src/assets/robosub_preparation.png b/src/assets/robosub_preparation.png
new file mode 100644
index 0000000..1f94864
Binary files /dev/null and b/src/assets/robosub_preparation.png differ
diff --git a/src/assets/simulation_enviornment.png b/src/assets/simulation_enviornment.png
new file mode 100644
index 0000000..128a5f1
Binary files /dev/null and b/src/assets/simulation_enviornment.png differ
diff --git a/src/assets/sponsors/JD-squared-transparent.png b/src/assets/sponsors/JD-squared-transparent.png
new file mode 100644
index 0000000..40cb0d1
Binary files /dev/null and b/src/assets/sponsors/JD-squared-transparent.png differ
diff --git a/src/assets/sponsors/MAE_logo.png b/src/assets/sponsors/MAE_logo.png
new file mode 100644
index 0000000..13443fd
Binary files /dev/null and b/src/assets/sponsors/MAE_logo.png differ
diff --git a/src/assets/sponsors/Sylphase.png b/src/assets/sponsors/Sylphase.png
new file mode 100644
index 0000000..3b53cf7
Binary files /dev/null and b/src/assets/sponsors/Sylphase.png differ
diff --git a/src/assets/sponsorship_packet.pdf b/src/assets/sponsorship_packet.pdf
new file mode 100644
index 0000000..d06cc9a
Binary files /dev/null and b/src/assets/sponsorship_packet.pdf differ
diff --git a/src/assets/subjugator_logo.png b/src/assets/subjugator_logo.png
new file mode 100644
index 0000000..b3a3eaf
Binary files /dev/null and b/src/assets/subjugator_logo.png differ
diff --git a/src/assets/submarines/sub9_1.jpeg b/src/assets/submarines/sub9_1.jpeg
new file mode 100644
index 0000000..810df6b
Binary files /dev/null and b/src/assets/submarines/sub9_1.jpeg differ
diff --git a/src/assets/submarines/sub9_cherry_1.png b/src/assets/submarines/sub9_cherry_1.png
new file mode 100644
index 0000000..53b5b68
Binary files /dev/null and b/src/assets/submarines/sub9_cherry_1.png differ
diff --git a/src/assets/submarines/sub9_development.jpg b/src/assets/submarines/sub9_development.jpg
new file mode 100644
index 0000000..a9a89fb
Binary files /dev/null and b/src/assets/submarines/sub9_development.jpg differ
diff --git a/src/assets/submarines/sub9_frame.png b/src/assets/submarines/sub9_frame.png
new file mode 100644
index 0000000..810d8c9
Binary files /dev/null and b/src/assets/submarines/sub9_frame.png differ
diff --git a/src/assets/submarines/subjugator_1.png b/src/assets/submarines/subjugator_1.png
new file mode 100644
index 0000000..bf0c4eb
Binary files /dev/null and b/src/assets/submarines/subjugator_1.png differ
diff --git a/src/assets/submarines/subjugator_3.png b/src/assets/submarines/subjugator_3.png
new file mode 100644
index 0000000..66f3969
Binary files /dev/null and b/src/assets/submarines/subjugator_3.png differ
diff --git a/src/assets/submarines/subjugator_6.png b/src/assets/submarines/subjugator_6.png
new file mode 100644
index 0000000..ae5a0aa
Binary files /dev/null and b/src/assets/submarines/subjugator_6.png differ
diff --git a/src/assets/submarines/subjugator_8.png b/src/assets/submarines/subjugator_8.png
new file mode 100644
index 0000000..24ae1e3
Binary files /dev/null and b/src/assets/submarines/subjugator_8.png differ
diff --git a/src/assets/submarines/subjugator_9.1.png b/src/assets/submarines/subjugator_9.1.png
new file mode 100644
index 0000000..4189d8c
Binary files /dev/null and b/src/assets/submarines/subjugator_9.1.png differ
diff --git a/src/assets/submarines/subjugator_9.png b/src/assets/submarines/subjugator_9.png
new file mode 100644
index 0000000..a50f54a
Binary files /dev/null and b/src/assets/submarines/subjugator_9.png differ
diff --git a/src/index.css b/src/index.css
index 6119ad9..b5b3f12 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,18 +1,21 @@
:root {
- font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
- line-height: 1.5;
- font-weight: 400;
+ --navbar-height: 80px;
+ --max-width: 1280px;
+ --space-sm: 0.5rem;
+ --space-md: 1rem;
+ --space-lg: 2rem;
- color-scheme: light dark;
- color: rgba(255, 255, 255, 0.87);
- background-color: #242424;
+ --color-text-primary: #ffffff;
+ --color-text-secondary: #d1d5db;
+ --color-primary: #fa4616;
- font-synthesis: none;
- text-rendering: optimizeLegibility;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
+ --color-background: #000000;
+
+ --transition-fast: 0.2s ease;
+ --transition-medium: 0.4s ease;
}
+
a {
font-weight: 500;
color: #646cff;
@@ -28,6 +31,10 @@ body {
place-items: center;
min-width: 320px;
min-height: 100vh;
+ padding: 0;
+ color: white;
+ background-color: #000000;
+ overflow-x: hidden;
}
h1 {
diff --git a/src/main.jsx b/src/main.jsx
index 9191daf..d719969 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -2,11 +2,12 @@ import React from "react";
import ReactDOM from "react-dom/client";
import { BrowserRouter } from "react-router-dom";
import App from "./App";
-import "./styles/GlobalStyles.css";
import "./index.css";
ReactDOM.createRoot(document.getElementById("root")).render(
-
-
-);
\ No newline at end of file
+
+
+
+
+);
diff --git a/src/styles/AUVTechnology.css b/src/styles/AUVTechnology.css
index 7e62c94..84bb0e4 100644
--- a/src/styles/AUVTechnology.css
+++ b/src/styles/AUVTechnology.css
@@ -2,17 +2,28 @@
.auv-technology-page {
background-color: var(--color-background);
color: #ffffff;
+ font-family: 'Montserrat', sans-serif;
+
+}
+
+
+.tech-specs-section .tech-button-container {
+ margin-top: 6rem;
+
}
/* ========== Hero Section with 3D Model ========== */
.hero-section {
- height: 100vh;
+ height: calc(var(--vh) * 100 - var(--navbar-height, 0px));
position: relative;
- display: flex;
align-items: center;
+ overflow: visible;
justify-content: center;
- overflow: hidden;
- background-color: #000000;
+ position: relative;
+ display: flex;
+ height: 100svh;
+ height: 100dvh;
+ height: 100vh;
}
.hero-background {
@@ -263,7 +274,6 @@
gap: 10px;
z-index: 5;
}
-
.control-button {
background-color: rgba(0, 0, 0, 0.7);
border: 1px solid rgba(255, 255, 255, 0.2);
diff --git a/src/styles/AboutUs.css b/src/styles/AboutUs.css
index ab77d21..3a33abc 100644
--- a/src/styles/AboutUs.css
+++ b/src/styles/AboutUs.css
@@ -1,4 +1,8 @@
/* Hero Section with Team Photo Background - Improved */
+html, body {
+ font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
+}
+
.about-hero-section {
min-height: 70vh;
position: relative;
@@ -17,17 +21,27 @@
border-radius: 12px; /* Optional: rounded corners for container */
}
-
+.about-hero-section::before {
+ content: "";
+ position: absolute;
+ top: 0; left: 0;
+ width: 100%; height: 100%;
+ background: rgba(0, 0, 0, 0.5);
+ pointer-events: none;
+ z-index: 1;
+}
.about-hero-section .container {
- position: relative;
+ position: absolute;
+ top: 45%;
+ left: 50%;
+ transform: translate(-50%,-50%);
z-index: 1;
width: 100%;
max-width: var(--max-width);
padding: 0 20px;
margin-bottom: 20px;
}
-
.hero-title {
font-size: clamp(2rem, 5vw, 3.5rem);
margin-bottom: 10px;
@@ -360,6 +374,12 @@
gap: 8px;
}
+.image-sub1 { background-image: url("/src/assets/submarines/subjugator_1.png"); }
+.image-sub3 { background-image: url("/src/assets/submarines/subjugator_3.png"); }
+.image-sub6 { background-image: url("/src/assets/submarines/subjugator_6.png"); }
+.image-sub8 { background-image: url("/src/assets/submarines/subjugator_8.png"); }
+.image-sub9 { background-image: url("/src/assets/submarines/subjugator_9.png"); }
+
.tech-tag {
display: inline-block;
padding: 4px 10px;
diff --git a/src/styles/Contact.css b/src/styles/Contact.css
index ecd71ab..ba16a4b 100644
--- a/src/styles/Contact.css
+++ b/src/styles/Contact.css
@@ -63,6 +63,7 @@
.contact-hero-section .hero-content {
text-align: center;
max-width: 800px;
+ color: white;
}
.contact-hero-section .hero-title {
diff --git a/src/styles/Home.css b/src/styles/Home.css
index 0b76335..52fc9cb 100644
--- a/src/styles/Home.css
+++ b/src/styles/Home.css
@@ -16,7 +16,7 @@
width: 100%;
max-width: 1200px;
margin: 0 auto;
- padding: 0 20px;
+ padding: 0 0px;
z-index: 1;
}
@@ -26,7 +26,7 @@
left: 0;
width: 100%;
height: 100%;
- background-image: url("/src/assets/submarine-hero.jpg");
+ background-image: url("/src/assets/subjugator8-hero.png");
background-size: cover;
background-position: center;
z-index: -1;
@@ -75,16 +75,6 @@
color: #ffffff;
}
-.hero-subtitle {
- opacity: 0;
- font-size: clamp(1.5rem, 4vw, 2.5rem);
- font-weight: 300;
- color: #ffffff;
- margin-top: 0;
- margin-bottom: 2rem;
- text-align: center;
- width: 100%;
-}
.hero-cta {
display: flex;
@@ -184,10 +174,9 @@
}
.animate-fadeIn {
- opacity: 1 !important; /* Force opacity to 1 */
+ opacity: 1 !important;
}
-/* Add a new class for slide up animation */
.animate-slideUp {
animation: slideUp 1.5s ease forwards;
}
@@ -248,11 +237,13 @@
.subtitle {
font-size: 1.2rem;
- color: rgba(255, 255, 255, 0.85); /* Improved contrast */
+ color: rgba(255, 255, 255, 0.85);
max-width: 700px;
margin: 0 auto;
}
+
+
.stats-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
@@ -322,9 +313,8 @@
}
.highlight-content {
- width: 50%;
- margin-left: auto;
- padding: var(--space-xl) 0;
+ margin: 0 auto;
+ text-align: center;
}
.tech-features {
@@ -390,6 +380,12 @@
background-color: var(--color-background);
padding: 80px 0;
position: relative;
+ padding-bottom: 260px;
+}
+.updates-section::after {
+ content: ""; /* creates a real box */
+ display: block;
+ height: 12rem; /* tweak up/down to taste (≈ 96 px) */
}
.updates-section .section-header {
@@ -479,6 +475,55 @@
transform: translateX(4px);
}
+.countdown-card {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: #111;
+}
+
+.countdown-title {
+ text-align: center;
+ margin-bottom: var(--space-md);
+}
+
+.countdown-clock {
+ display: flex;
+ justify-content: center;
+ gap: 1rem;
+}
+.countdown-clock .time-box:nth-child(4) .time-value
+{
+ color: #fa4616;
+}
+
+.time-box {
+ background: #1a1a1a;
+ border: 1px solid #333;
+ padding: 0.6rem 0.8rem;
+ border-radius: 6px;
+ min-width: 60px;
+}
+
+.time-value {
+ font-size: 1.6rem;
+ font-weight: 600;
+ color: #4a9fff;
+ display: block;
+}
+
+.time-label {
+ font-size: 0.75rem;
+ color: #ccc;
+ text-transform: uppercase;
+ letter-spacing: 0.02em;
+}
+
+.image-sub9 { background-image: url("/src/assets/submarines/sub9_development.jpg"); }
+.image-robosub{ background-image: url("/src/assets/robosub_preparation.png"); }
+.update-image { background-size: cover; background-position: center; }
+
+
/* ========== CTA Section (Join the Journey) ========== */
.cta-section {
padding: 100px 0; /* Increase vertical padding */
@@ -488,6 +533,7 @@
background-position: center;
background-attachment: fixed;
text-align: center;
+
}
.cta-content {
@@ -582,73 +628,102 @@
}
}
-/* Responsive adjustments */
-@media screen and (max-width: 992px) {
- .tech-highlights-section .btn {
- margin-left: 0;
- margin-right: auto;
- align-self: flex-start;
+
+html, body { overflow-x: hidden; }
+
+
+@media (max-width: 680px) {
+ .stats-grid, .updates-grid {
+ grid-template-columns: 1fr;
+ padding-inline: 0.75rem;
+ gap: 20px;
}
+
+ .overview-section {
+ padding-bottom: 40px; /* down from 80px */
+ }
+
.highlight-image {
- width: 100%;
- height: 300px;
position: relative;
+ width: 100%;
+ height: 220px;
clip-path: none;
}
- .updates-grid {
- grid-template-columns: repeat(2, 1fr); /* 2 columns on medium screens */
+ .container{
+ width: 100%;
+ position: relative;
}
+ /* —— MOBILE FIX FOR TECH HIGHLIGHTS —— */
.tech-highlights-section {
- flex-direction: column;
+ display: flex; /* ensure it’s flex */
+ flex-direction: column; /* stack image + content */
+ align-items: center; /* center children horizontally */
}
- .highlight-content {
+ .tech-highlights-section .highlight-image {
+ position: relative; /* flow normally */
+ width: 100%; /* full-width banner */
+ height: 220px; /* adjust as needed */
+ clip-path: none; /* remove the desktop diagonal */
+ }
+
+ .tech-highlights-section .container {
+ display: block; /* override the flex container */
width: 100%;
- margin: 0;
- padding: var(--space-xl) var(--space-lg);
+ max-width: 1200px; /* keep your desktop cap if you like */
+ margin: 0 auto; /* center it */
+ padding: 0 20px;
+ box-sizing: border-box;
+ }
+
+ .highlight-content {
+ max-width: 700px; /* optional cap so it doesn’t stretch too far */
+ margin: 1rem auto; /* vertical spacing + horizontal centering */
+ text-align: center;
}
- .hero-cta {
+
+ .tech-features {
display: flex;
- gap: 20px;
- justify-content: center;
- margin-top: 2rem;
- width: 100%;
- opacity: 0;
+ flex-direction: column; /* stack the three feature blocks */
+ gap: 20px; /* space between them */
+ align-items: center; /* center each block */
}
- .hero-cta .btn {
- opacity: 0;
+
+ .feature {
width: 100%;
+ max-width: 320px;
}
- .cta-buttons {
- flex-direction: column;
- gap: var(--space-md);
+ .tech-highlights-section .btn {
+ display: block;
+ margin: 2rem auto 0;
+ width: 100%;
+ max-width: 320px;
+ padding-top: 10px;
+ min-height: auto;
+ text-align: center;
}
+
}
-@media screen and (max-width: 768px) {
- .stats-grid,
- .updates-grid {
- grid-template-columns: 1fr;
- }
- .hero-section {
- padding-top: var(--navbar-height);
- }
- .feature-text p {
- max-width: 100%;
- }
- .feature-icon {
- width: 50px;
- height: 50px;
- margin-right: var(--space-md);
+@media (max-width: 680px) {
+ .hero-cta .btn,
+ .cta-buttons .btn {
+ min-width: 0;
+ width: 100%;
}
+}
- .feature-text h3 {
- font-size: 1.5rem;
- }
+.hero-section,
+.tech-highlights-section,
+.updates-section,
+.overview-section {
+ overflow-x: hidden;
}
+
+
.overview-section .section-header,
.updates-section .section-header {
width: 100%;
diff --git a/src/styles/OurTeam.css b/src/styles/OurTeam.css
new file mode 100644
index 0000000..2adbec3
--- /dev/null
+++ b/src/styles/OurTeam.css
@@ -0,0 +1,113 @@
+:root {
+ --orange: #fa4616;
+ --page-bg: #000000;
+ --shade-bg: #141414;
+ --card-bg: #1f1f1f;
+ --text-primary: #ffffff;
+ --text-secondary: #cccccc;
+}
+
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');
+
+/* ---------- page shell ---------- */
+.our-team-page {
+ min-height: 100px;
+ background: var(--page-bg);
+ color: var(--text-primary);
+ display: flex;
+ flex-direction: column;
+}
+
+/* ---------- containers ---------- */
+.container-fluid { width: 100%; padding-inline: 1rem; }
+.container-xl { width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: 1rem; }
+
+.hero { padding-block: clamp(4rem, 10vw, 6rem) 0; }
+.hero-title { font-size: clamp(3rem, 8vw, 5.5rem); line-height: 1.1; margin: 0; opacity: 0; animation: slideUp 1.2s ease forwards; }
+.hero-title .highlight {
+ background: linear-gradient(90deg, #fa4616, #f7cbbe); /* ⬅️ your new gradient */
+ background-size: 200% auto;
+ -webkit-background-clip: text;
+ background-clip: text;
+ color: transparent;
+}
+
+.team-section {
+ background: var(--shade-bg);
+ width: 100%;
+ margin-top: clamp(5rem, 10vw, 6rem);
+ padding-block: clamp(2rem, 5vw, 3rem) clamp(3rem, 6vw, 5rem);
+ padding-inline: clamp(0.5rem, 3vw, 2rem);
+ border-radius: 0.75rem 0.75rem 0 0;
+}
+
+/* increase vertical gap so the grid sits lower */
+.team-section__inner {
+ display: flex;
+ flex-direction: column;
+ gap: clamp(2rem, 4vw, 2.75rem); /* ⬅️ was 1rem */
+}
+
+.grid-subtitle {
+ font-size: clamp(1.25rem, 2.2vw, 1.75rem); /* responsive subtitle size */
+ color: var(--text-secondary);
+ text-align: center;
+ opacity: 0;
+ animation: slideUp 1.1s ease 0.15s forwards;
+}
+
+.team-grid {
+ display: grid;
+ grid-template-columns: repeat(3, minmax(120px, 240px));
+ row-gap: clamp(8rem, 0.1vw, 9rem);
+ column-gap: clamp(0.75rem, 3vw, 1.5rem);
+ margin-top: clamp(5rem, 3vw, 2rem); /* ⬅️ pushes grid down */
+ opacity: 0;
+ animation: slideUp 1.2s ease 0.3s forwards;
+}
+
+
+/* card */
+.team-card { position:relative; background-color:var(--card-bg); border:1px solid transparent; border-top:4px solid var(--orange); border-radius:0.75rem; padding: 1.25rem 0.7rem 0.9rem; /* compact padding */ /* compact padding */ text-align:center; display:flex; flex-direction:column; align-items:center; min-height:170px; transition:transform 0.25s ease,border-color 0.25s ease,box-shadow 0.25s ease; }
+@media(hover:hover){ .team-card:hover,.team-card:focus-visible{ transform:translate3d(0,-6px,0); border-color:var(--orange); box-shadow:0 4px 10px rgba(0,0,0,.35); } }
+.team-card:focus-visible{ outline:2px solid var(--orange); outline-offset:4px; }
+
+/* image */
+.team-card__image-wrapper {
+ position: absolute;
+ top: -80px;
+ left: 50%;
+ translate: -50% 0;
+ width: 120px;
+ height: 120px;
+ border-radius: 0.5rem;
+ overflow: hidden;
+ box-shadow: none;
+ z-index: 1;
+ border: 1px solid var(--orange);
+}
+.team-card__image {
+ width:100%;
+ height:100%;
+ object-fit:cover;
+}
+
+/* ---------- typography inside card ---------- */
+.team-card__name { font-family:'Poppins',sans-serif; font-size:1.25rem; font-weight:600; margin:0.3rem 0 0.2rem; }
+.team-card__role { font-family:'Poppins',sans-serif; font-size:1.05rem; color:var(--text-secondary); }
+
+.team-card.no-photo{ padding-top:0.75rem; }
+.team-card.has-photo{ padding-top:3.5rem; }
+
+/* ---------- CTA section ---------- */
+.cta-section{ background:linear-gradient(180deg,#111 0%,#000 80%); padding-block:clamp(4rem,10vw,6rem); margin-top:auto; }
+.cta-wrapper{ text-align:center; max-width:720px; margin-inline:auto; }
+.cta-heading{ font-size:clamp(2rem,5vw,3rem); font-weight:700; margin-bottom:1.5rem; }
+.cta-buttons{ display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; }
+.btn{ padding:0.6rem 1.4rem; border-radius:9999px; font-weight:600; transition:background 0.2s ease; }
+.btn-primary{ background:var(--orange); color:var(--text-primary);} .btn-primary:hover,.btn-primary:focus-visible{ background:#ff651f; }
+.btn-secondary{ background:#ffffff10; color:var(--text-primary); border:1px solid #ffffff25;} .btn-secondary:hover,.btn-secondary:focus-visible{ background:#ffffff22; }
+
+/* ---------- animations ---------- */
+@keyframes slideUp{ from{ transform:translateY(30px); opacity:0;} to{ transform:translateY(0); opacity:1;} }
+@keyframes gradientShift{ 0%{ background-position:0% center;} 100%{ background-position:200% center;} }
\ No newline at end of file
diff --git a/src/styles/RoboSub.css b/src/styles/RoboSub.css
index 47a54d1..108a47f 100644
--- a/src/styles/RoboSub.css
+++ b/src/styles/RoboSub.css
@@ -3,18 +3,20 @@
/* Base styles for the page */
color: var(--color-text-primary);
background-color: var(--color-background);
- overflow-x: hidden;
+ height: calc(100vh - var(--navbar-height));
+ overflow-x: visible;
}
/* Hero Section with regular background (not underwater) */
.robosub-page .robosub-hero-section {
- height: 100vh;
- position: relative;
- display: flex;
- align-items: center;
- justify-content: center;
- overflow: hidden;
- background-color: #000000;
+ height: calc(100vh - var(--navbar-height));
+ position: relative;
+ align-items: center;
+ overflow: visible;
+ justify-content: center;
+ position: relative;
+ margin-top: 160px;
+ display: flex;
}
/* Background image styling similar to Home page */
@@ -80,7 +82,6 @@
.robosub-page .hero-title {
font-size: clamp(3.5rem, 10vw, 7rem);
- font-weight: 800;
color: #ffffff;
margin-bottom: 0;
text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
@@ -875,4 +876,11 @@
opacity: 1;
transform: translateY(0);
}
-
\ No newline at end of file
+
+.hero-bg { background-image: url("/src/assets/submarine-hero.jpg"); }
+.hero-auv { content: url("/src/assets/submarines/subjugator_9.1.png"); }
+.image-sub9-swim { content: url("/src/assets/submarines/sub9_cherry_1.png"); }
+.image-sub9-frame { content: url("/src/assets/submarines/sub9_1.jpeg"); }
+.image-electrical { content: url("/src/assets/PCB.png"); }
+.image-sim-env { content: url("/src/assets/simulation_enviornment.png"); }
+.image-robosub-logo { content: url("/src/assets/robosub_logo.png"); }
diff --git a/src/styles/Sponsors.css b/src/styles/Sponsors.css
new file mode 100644
index 0000000..6bf4aa3
--- /dev/null
+++ b/src/styles/Sponsors.css
@@ -0,0 +1,223 @@
+/* ---------- root palette ---------- */
+:root {
+ --orange: #fa4616;
+ --text-primary: #ffffff;
+ --text-secondary: #cccccc;
+ --shade-bg: #141414;
+}
+
+/* ---------- page shell ---------- */
+.sponsors-page {
+ background-color: #000;
+ color: var(--text-primary);
+ min-height: 100vh;
+}
+
+/* ---------- hero ---------- */
+.hero {
+ padding-block: clamp(4rem, 8vw, 6rem) 2rem;
+}
+
+.hero-title {
+ color: var(--text-primary); /* ensures white text */
+ font-size: clamp(2.5rem, 7vw, 5rem);
+ font-weight: 700;
+ margin: 0;
+}
+
+.hero-title .highlight {
+ background: linear-gradient(90deg, #fa4616, #ff8c69);
+ background-clip: text;
+ -webkit-background-clip: text;
+ color: transparent; /* gradient text */
+}
+
+.hero-subtitle {
+ margin-top: 1rem;
+ font-size: 1.2rem;
+ color: var(--text-secondary);
+}
+
+/* ---------- sponsor tiers ---------- */
+.sponsor-section {
+ padding-block: 5rem;
+}
+
+.sponsor-section__title {
+ text-align: center;
+ font-size: 1.75rem;
+ font-weight: 600;
+ color: var(--orange);
+ margin-bottom: 2.5rem;
+ position: relative;
+ padding-bottom: 0.5rem;
+}
+
+.sponsor-section__title::after {
+ content: "";
+ position: absolute;
+ left: 50%;
+ bottom: 0;
+ transform: translateX(-50%);
+ width: 80px;
+ height: 3px;
+ background: var(--orange);
+ border-radius: 4px;
+}
+
+.sponsor-grid {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ gap: 2rem;
+ row-gap: 3rem;
+}
+
+/* ---------- sponsor card ---------- */
+.sponsor-card {
+ background: var(--shade-bg); /* dark card body */
+ border-radius: 0.5rem;
+ padding: 1.5rem;
+ text-align: center;
+ max-width: 280px;
+ width: 100%;
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
+ transition: transform 0.2s ease;
+}
+
+.sponsor-card:hover {
+ transform: translateY(-4px);
+}
+
+/* ---------- logo image ---------- */
+.sponsor-card__logo {
+ max-width: 100%;
+ max-height: 120px; /* larger logos */
+ object-fit: contain;
+ margin-bottom: 1rem;
+}
+
+/* allow explicit up-sizing via .large helper */
+.sponsor-card__logo.large {
+ max-height: 120px; /* matches default – keep for clarity */
+}
+
+/* ---------- name & optional description ---------- */
+.sponsor-card__name {
+ font-weight: 600;
+ font-size: 1.1rem;
+ margin-bottom: 0.5rem;
+}
+
+.sponsor-card__description {
+ font-size: 0.95rem;
+ color: var(--text-secondary);
+}
+/* no background / box for each sponsor */
+.sponsor-card {
+ background: none;
+ box-shadow: none;
+ padding: 0;
+ transition: transform 0.2s ease;
+}
+
+/* enlarge logos a bit */
+.sponsor-card__logo {
+ max-height: 140px;
+ margin-bottom: 0.8rem;
+}
+
+/* remove underline & make company links white */
+.no-style-link {
+ text-decoration: none;
+ color: var(--text-primary);
+}
+
+/* company names (inside anchor) inherit white text */
+.company-name a { color: var(--text-primary); }
+
+/* people names stay blue */
+.person-name {
+ color: #3b82f6; /* tailwind blue-500 */
+}
+
+.hero-subtitle {
+ max-width: 720px;
+ margin: 1rem auto;
+ font-size: 1.05rem;
+ color: var(--text-secondary);
+ line-height: 1.45;
+}
+
+.sponsor-footer {
+ padding: 3rem 1rem 4rem;
+}
+
+.sponsor-pdf-link {
+ color: var(--orange);
+ font-weight: 600;
+ text-decoration: underline;
+}
+
+/* footer layout */
+.sponsor-footer {
+ padding: 4rem 1rem;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 1.5rem;
+}
+
+/* big white heading */
+.sponsor-call {
+ font-size: 4.5rem; /* larger */
+ color: var(--text-primary);
+ margin: 0;
+}
+
+/* blue gradient underline */
+.sponsor-underline {
+ display: block;
+ width: 140px;
+ height: 5px;
+ margin: 0.6rem auto 2rem;
+ border-radius: 9999px;
+ background: linear-gradient(90deg, #3b82f6 0%, #1e40af 100%);
+}
+
+/* orange pill-button */
+.sponsor-btn {
+ background: var(--orange); /* orange by default */
+ color: var(--text-primary);
+ padding: 1rem 2.4rem;
+ border-radius: 9999px;
+ font-weight: 600;
+ text-decoration: none;
+ transition: background 0.25s ease, transform 0.15s ease;
+}
+
+/* turn blue – subtle lift on hover / focus */
+.sponsor-btn:hover,
+.sponsor-btn:focus-visible {
+ background: #06369e; /* Tailwind blue-600 */
+ transform: translateY(-2px);
+}
+
+/* optional: shade darker while active / clicking */
+.sponsor-btn:active {
+ background: #1e40af; /* blue-800 */
+ transform: translateY(0);
+}
+
+/* keep button text white in every state */
+.sponsor-btn,
+.sponsor-btn:visited,
+.sponsor-btn:hover,
+.sponsor-btn:focus-visible,
+.sponsor-btn:active {
+ color: var(--text-primary) !important;
+}
+
+
+
+
diff --git a/vercel.json b/vercel.json
new file mode 100644
index 0000000..6a92648
--- /dev/null
+++ b/vercel.json
@@ -0,0 +1,5 @@
+{
+ "rewrites": [
+ { "source": "/(.*)", "destination": "/" }
+ ]
+}
Sponsors
-This is a placeholder for now.
+// local logo & pdf imports +import sylphaseLogo from "../assets/sponsors/Sylphase.png"; +import sponsorPacket from "../assets/sponsorship_packet.pdf"; + +/* ---------- Tier component ---------- */ +const SponsorSection = ({ title, sponsors }) => ( +{title}
+ +
+ {sponsors.map((s, i) => {
+ const isPerson = !s.url; // people / alumni have no URL
+ return (
+
+ );
+ })}
+ 2025 Sponsors
++ We have been very fortunate to have generous partners in industry and at the University of Florida to support the SubjuGator project. Listed below are active sponsors for the SubjuGator project at the University of Florida. For more information about becoming a sponsor, please see our sponsorship packet below. +
+
+
+
+ {/* ----- footer with call‑to‑action button ----- */}
+
+