e175430156
- worlds.html: new page matching videos.html style, grid of world cards with illustrated preview thumbnails and Explore links - World card CSS added to style.css (.world-card, .world-card-preview, .world-enter) - Delph Woods card links to worlds/delphwoods.html with a woodland SVG preview, description, and location/3DGS chips - Worlds added to nav and footer Product column on all 5 existing pages - CTA band on worlds page promotes consultancy for commissioning Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
427 lines
21 KiB
HTML
427 lines
21 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Videos — Bournemouth Technology</title>
|
|
<meta name="description" content="Flight tests, industry deployments, and community builds from the Bournemouth Technology drone devkit ecosystem.">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="style.css">
|
|
<script>
|
|
(function(){var t=localStorage.getItem('theme'),d=window.matchMedia('(prefers-color-scheme: dark)').matches;if(t==='dark'||(t===null&&d))document.documentElement.classList.add('dark');})();
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- NAV -->
|
|
<nav class="nav">
|
|
<div class="nav-inner">
|
|
<a href="index.html" class="nav-logo">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true">
|
|
<rect x="6" y="6" width="12" height="12" rx="1.5"/>
|
|
<rect x="9.5" y="9.5" width="5" height="5" fill="currentColor" stroke="none"/>
|
|
<path d="M9 6V2.5M15 6V2.5M9 21.5V18M15 21.5V18M6 9H2.5M6 15H2.5M21.5 9H18M21.5 15H18"/>
|
|
</svg>
|
|
<span>Bournemouth Technology</span>
|
|
</a>
|
|
<div class="nav-right">
|
|
<nav class="nav-links" aria-label="Main">
|
|
<a href="devkits.html">Devkits</a>
|
|
<a href="opensource.html">Open Source</a>
|
|
<a href="consultancy.html">Consultancy</a>
|
|
<a href="videos.html" class="active">Videos</a>
|
|
<a href="worlds.html">Worlds</a>
|
|
</nav>
|
|
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle dark mode">
|
|
<svg class="icon-moon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"/></svg>
|
|
<svg class="icon-sun" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg>
|
|
</button>
|
|
<a href="devkits.html" class="btn btn-dark btn-sm">Buy a devkit</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- PAGE HERO -->
|
|
<section class="page-hero">
|
|
<div class="hero-bg" aria-hidden="true">
|
|
<div style="position:absolute;top:40px;left:-30px;width:210px;opacity:0.055;transform:rotate(14deg);">
|
|
<svg viewBox="0 0 100 100" fill="none" stroke="#0A0A0A" stroke-width="2.5" stroke-linecap="round">
|
|
<line x1="50" y1="50" x2="22" y2="22"/><line x1="50" y1="50" x2="78" y2="22"/>
|
|
<line x1="50" y1="50" x2="22" y2="78"/><line x1="50" y1="50" x2="78" y2="78"/>
|
|
<rect x="41" y="41" width="18" height="18" rx="4"/>
|
|
<circle cx="22" cy="22" r="8.5"/><circle cx="78" cy="22" r="8.5"/>
|
|
<circle cx="22" cy="78" r="8.5"/><circle cx="78" cy="78" r="8.5"/>
|
|
<ellipse cx="22" cy="22" rx="12" ry="2.6" transform="rotate(45 22 22)"/>
|
|
<ellipse cx="78" cy="22" rx="12" ry="2.6" transform="rotate(-45 78 22)"/>
|
|
<ellipse cx="22" cy="78" rx="12" ry="2.6" transform="rotate(-45 22 78)"/>
|
|
<ellipse cx="78" cy="78" rx="12" ry="2.6" transform="rotate(45 78 78)"/>
|
|
</svg>
|
|
</div>
|
|
<div style="position:absolute;top:30px;right:-40px;width:320px;opacity:0.045;transform:rotate(-9deg);">
|
|
<svg viewBox="0 0 100 100" fill="none" stroke="#0A0A0A" stroke-width="2.5" stroke-linecap="round">
|
|
<line x1="50" y1="50" x2="22" y2="22"/><line x1="50" y1="50" x2="78" y2="22"/>
|
|
<line x1="50" y1="50" x2="22" y2="78"/><line x1="50" y1="50" x2="78" y2="78"/>
|
|
<rect x="41" y="41" width="18" height="18" rx="4"/>
|
|
<circle cx="22" cy="22" r="8.5"/><circle cx="78" cy="22" r="8.5"/>
|
|
<circle cx="22" cy="78" r="8.5"/><circle cx="78" cy="78" r="8.5"/>
|
|
<ellipse cx="22" cy="22" rx="12" ry="2.6" transform="rotate(45 22 22)"/>
|
|
<ellipse cx="78" cy="22" rx="12" ry="2.6" transform="rotate(-45 78 22)"/>
|
|
<ellipse cx="22" cy="78" rx="12" ry="2.6" transform="rotate(-45 22 78)"/>
|
|
<ellipse cx="78" cy="78" rx="12" ry="2.6" transform="rotate(45 78 78)"/>
|
|
</svg>
|
|
</div>
|
|
<div style="position:absolute;top:30px;left:46%;width:120px;opacity:0.05;transform:rotate(26deg);">
|
|
<svg viewBox="0 0 100 100" fill="none" stroke="#0A0A0A" stroke-width="2.5" stroke-linecap="round">
|
|
<line x1="50" y1="50" x2="22" y2="22"/><line x1="50" y1="50" x2="78" y2="22"/>
|
|
<line x1="50" y1="50" x2="22" y2="78"/><line x1="50" y1="50" x2="78" y2="78"/>
|
|
<rect x="41" y="41" width="18" height="18" rx="4"/>
|
|
<circle cx="22" cy="22" r="8.5"/><circle cx="78" cy="22" r="8.5"/>
|
|
<circle cx="22" cy="78" r="8.5"/><circle cx="78" cy="78" r="8.5"/>
|
|
<ellipse cx="22" cy="22" rx="12" ry="2.6" transform="rotate(45 22 22)"/>
|
|
<ellipse cx="78" cy="22" rx="12" ry="2.6" transform="rotate(-45 78 22)"/>
|
|
<ellipse cx="22" cy="78" rx="12" ry="2.6" transform="rotate(-45 22 78)"/>
|
|
<ellipse cx="78" cy="78" rx="12" ry="2.6" transform="rotate(45 78 78)"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div class="eyebrow">Demos & Deployments</div>
|
|
<h1>Video Gallery.</h1>
|
|
<p>Flight tests, industry deployments, and community builds from the Bournemouth Technology ecosystem.</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FEATURED VIDEO -->
|
|
<section class="section" style="padding-bottom:0;">
|
|
<div class="container">
|
|
<div class="video-featured">
|
|
<video class="video-featured-thumb" controls preload="none" poster="videos/aerial-photography-bournemouth-poster.jpg">
|
|
<source src="bmth-80m.webm" type="video/webm">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-lg">
|
|
<svg width="28" height="28" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
<div class="video-caption">
|
|
<div>
|
|
<div class="video-caption-title">Aerial Photography — Bournemouth</div>
|
|
<div class="video-caption-desc">High altitude shots open opportunities for the unseen. Across mountain ranges or open air.</div>
|
|
</div>
|
|
<div class="video-tags">
|
|
<span class="vtag">1080p</span>
|
|
<span class="vtag">Active Deployment</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FLIGHT TESTS & DEMOS -->
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="section-sub-header">
|
|
<div>
|
|
<div class="eyebrow" style="margin-bottom:8px;">Category</div>
|
|
<div class="section-sub-title">Flight Tests & Demos</div>
|
|
</div>
|
|
</div>
|
|
<div class="grid-3-tight">
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/base-flight-kit-first-flight-poster.jpg">
|
|
<source src="videos/base-flight-kit-first-flight.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Base Flight Kit — First Flight</div>
|
|
<div class="video-card-desc">Maiden flight of the Base Flight Kit. PID tuning, stability tests, and GPS hold demonstration.</div>
|
|
<div class="chip-row"><span class="chip">Hardware</span></div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/drone-simulator-poster.jpg">
|
|
<source src="videos/drone-simulator.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Drone Simulator</div>
|
|
<div class="video-card-desc">Stress testing the simulator with a hexacopter. Flight time, stability, and emergency landing procedures.</div>
|
|
<div class="chip-row"><span class="chip">Software</span><span class="chip">Simulator</span></div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/autonomous-waypoint-navigation-poster.jpg">
|
|
<source src="videos/autonomous-waypoint-navigation.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Autonomous Waypoint Navigation</div>
|
|
<div class="video-card-desc">Fully autonomous mission with 12 waypoints. Ground control station view and onboard footage.</div>
|
|
<div class="chip-row"><span class="chip">Software</span><span class="chip">Hardware</span><span class="chip">Navigation</span></div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/edge-compute-object-detection-poster.jpg">
|
|
<source src="droneRun.webm" type="video/webm">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Edge Compute Kit — Real-Time Object Detection</div>
|
|
<div class="video-card-desc">Onboard YOLO inference running at 15fps. Live person and vehicle detection from aerial view.</div>
|
|
<div class="chip-row"><span class="chip">Software</span><span class="chip">AI/Vision</span></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- INDUSTRY DEPLOYMENTS -->
|
|
<section class="section section-off">
|
|
<div class="container">
|
|
<div class="section-sub-header">
|
|
<div>
|
|
<div class="eyebrow" style="margin-bottom:8px;">Category</div>
|
|
<div class="section-sub-title">Industry Deployments</div>
|
|
</div>
|
|
</div>
|
|
<div class="grid-3-tight">
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/movement-estimation-flying-dashcam-poster.jpg">
|
|
<source src="droneMoves.webm" type="video/webm">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Movement Estimation — Flying DashCam</div>
|
|
<div class="video-card-desc">Walk, run, ride or drive with follow mode and benefit from object detection and segmentation. Think flying body-cam / dash-cam powered with AI.</div>
|
|
<div class="chip-row"><span class="chip">Active Deployment</span></div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/bath-canal-inspection-poster.jpg">
|
|
<source src="bath.webm" type="video/webm">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Infrastructure — Bath Canal Inspection</div>
|
|
<div class="video-card-desc">Automated inspection of a bath canal for blockages and obstruction to the canal boats.</div>
|
|
<div class="chip-row"><span class="chip">Active Deployment</span></div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/jammers-last-line-of-defense-poster.jpg">
|
|
<source src="jamming-text.webm" type="video/webm">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Jammers — The Last Line of Defense</div>
|
|
<div class="video-card-desc">Pilot program for drone jamming in urban or rural areas. Autonomous navigation and precision tracking enable fast takedown.</div>
|
|
<div class="chip-row"><span class="chip">Pilot Program</span></div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/surveillance-perimeter-security-poster.jpg">
|
|
<source src="videos/surveillance-perimeter-security.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Surveillance — Perimeter Security</div>
|
|
<div class="video-card-desc">24/7 autonomous patrol system for a large industrial site. Thermal imaging and real-time alerts.</div>
|
|
<div class="chip-row"><span class="chip">Pilot Program</span></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- COMMUNITY BUILDS -->
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="section-sub-header">
|
|
<div>
|
|
<div class="eyebrow" style="margin-bottom:8px;">Category</div>
|
|
<div class="section-sub-title">Community Builds</div>
|
|
</div>
|
|
</div>
|
|
<div class="grid-3-tight">
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/custom-racing-quad-poster.jpg">
|
|
<source src="videos/custom-racing-quad.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Custom Racing Quad</div>
|
|
<div class="video-card-desc">Modified Base Flight Kit for FPV racing. 200mph+ capable.</div>
|
|
<div class="chip-row"><span class="chip">Hardware</span></div>
|
|
<div class="community-attr">by @droneracer_uk</div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/car-show-room-poster.jpg">
|
|
<source src="videos/car-show-room.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">Car Show Room</div>
|
|
<div class="video-card-desc">1-click showroom style circle video of vehicle.</div>
|
|
<div class="chip-row"><span class="chip">Software</span></div>
|
|
<div class="community-attr">by @realJonStarkey</div>
|
|
</div>
|
|
|
|
<div class="video-card">
|
|
<div class="video-card-thumb">
|
|
<video class="video-card-thumb-img" controls preload="none" poster="videos/university-research-project-poster.jpg">
|
|
<source src="videos/university-research-project.mp4" type="video/mp4">
|
|
</video>
|
|
<div class="video-play-overlay" aria-hidden="true">
|
|
<div class="play-sm">
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="#0A0A0A"><path d="M8 5v14l11-7z"/></svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="video-card-title">University Research Project</div>
|
|
<div class="video-card-desc">Student team using our kit for AI thesis project.</div>
|
|
<div class="chip-row"><span class="chip">AI/Vision</span><span class="chip">Research</span></div>
|
|
<div class="community-attr">by @exeter_robotics</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA -->
|
|
<section class="cta-band">
|
|
<div class="container">
|
|
<h2>Ready to build?</h2>
|
|
<p>Get a kit, fork the firmware, and start creating.</p>
|
|
<div class="cta-band-btns">
|
|
<a href="devkits.html" class="btn btn-dark btn-lg">Buy a devkit · from £1,999</a>
|
|
<a href="opensource.html" class="btn btn-outline btn-lg">Explore open source</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FOOTER -->
|
|
<footer>
|
|
<div class="container">
|
|
<div class="footer-grid">
|
|
<div class="footer-brand">
|
|
<div class="footer-logo">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true">
|
|
<rect x="6" y="6" width="12" height="12" rx="1.5"/>
|
|
<rect x="9.5" y="9.5" width="5" height="5" fill="currentColor" stroke="none"/>
|
|
<path d="M9 6V2.5M15 6V2.5M9 21.5V18M15 21.5V18M6 9H2.5M6 15H2.5M21.5 9H18M21.5 15H18"/>
|
|
</svg>
|
|
<span>Bournemouth Technology</span>
|
|
</div>
|
|
<p class="footer-tagline">Hardware, software, and consultancy for drone innovators.<br>Open source. Modular. Built by developers, for developers.</p>
|
|
</div>
|
|
<div>
|
|
<div class="footer-col-label">Product</div>
|
|
<div class="footer-col-links">
|
|
<a href="devkits.html">Devkits</a>
|
|
<a href="opensource.html">Open Source</a>
|
|
<a href="videos.html">Videos</a>
|
|
<a href="worlds.html">Worlds</a>
|
|
<a href="consultancy.html">Consultancy</a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="footer-col-label">Resources</div>
|
|
<div class="footer-col-links">
|
|
<a href="opensource.html">Documentation</a>
|
|
<a href="opensource.html">GitHub</a>
|
|
<a href="devkits.html">Bill of materials</a>
|
|
<a href="opensource.html">Community forum</a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="footer-col-label">Connect</div>
|
|
<div class="footer-col-links">
|
|
<a href="consultancy.html">Contact</a>
|
|
<a href="https://www.youtube.com/@JonStarkeyfilms">YouTube</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="footer-bottom">
|
|
<span>© 2025 Bournemouth Technology</span>
|
|
<span>MIT licensed software · Made in Bournemouth, UK</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
document.querySelectorAll('video').forEach(function(video) {
|
|
var overlay = video.parentElement.querySelector('.video-play-overlay');
|
|
if (!overlay) return;
|
|
overlay.style.pointerEvents = 'auto';
|
|
overlay.style.cursor = 'pointer';
|
|
overlay.addEventListener('click', function() { video.play(); });
|
|
video.addEventListener('play', function() { overlay.style.opacity = '0'; overlay.style.pointerEvents = 'none'; });
|
|
video.addEventListener('pause', function() { overlay.style.opacity = '1'; overlay.style.pointerEvents = 'auto'; });
|
|
video.addEventListener('ended', function() { overlay.style.opacity = '1'; overlay.style.pointerEvents = 'auto'; });
|
|
});
|
|
</script>
|
|
<script>
|
|
document.getElementById('theme-toggle').addEventListener('click', function() {
|
|
var dark = document.documentElement.classList.toggle('dark');
|
|
localStorage.setItem('theme', dark ? 'dark' : 'light');
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|