bfb0d777a7
Integrates Lenis and GSAP for advanced scrolling animations, parallax effects, and dynamic UI elements. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 5e584ab0-c340-4432-97ef-1972582b60e9 Replit-Commit-Checkpoint-Type: intermediate_checkpoint Replit-Commit-Event-Id: 298b9878-6940-427f-99ca-03452da5b40f Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/d0a1d46d-d203-4308-bc6a-312ac7c0243b/5e584ab0-c340-4432-97ef-1972582b60e9/MFdA8rN
81 lines
3.1 KiB
HTML
81 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}FTC Robotics{% endblock %}</title>
|
|
<!--Shared Files-->
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
|
|
<script src="https://cdn.jsdelivr.net/npm/@studio-freight/lenis@1.0.42/dist/lenis.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/ScrollTrigger.min.js"></script>
|
|
<script src="{{ url_for('static', filename='js/scripts.js') }}" defer></script>
|
|
<link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='images/favicon.png') }}">
|
|
</head>
|
|
|
|
<body>
|
|
<nav>
|
|
<ul class="nav-container">
|
|
<li class="nav-item-left">
|
|
<a href="/"><img id="logo" src="{{ url_for('static', filename='images/logo2.png') }}"></a>
|
|
</li>
|
|
|
|
<li class="nav-item-center">
|
|
<a href="/">Home</a>
|
|
</li>
|
|
<li class="nav-item-center">
|
|
<a href="/contributors">Contributors</a>
|
|
</li>
|
|
<li class="nav-item-center">
|
|
<a href="/competitions">Competitions</a>
|
|
</li>
|
|
<li class="nav-item-center">
|
|
<a href="/sponsors">Sponsors</a>
|
|
</li>
|
|
<li class="nav-item-center">
|
|
<a href="/contact">Contact</a>
|
|
</li>
|
|
<li class="nav-item-center">
|
|
<a href="https://hcb.hackclub.com/donations/start/technicalturbulence" target="_blank">Donate</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<button class="menu-button">☰</button>
|
|
<div class="nav-side">
|
|
<ul>
|
|
<li><a href="/">Home</a></li>
|
|
<li><a href="/contributors">Contributors</a></li>
|
|
<li><a href="/competitions">Competitions</a></li>
|
|
<li><a href="/sponsors">Sponsors</a></li>
|
|
<li><a href="/contact">Contact</a></li>
|
|
<li><a href="https://hcb.hackclub.com/donations/start/technicalturbulence" target="_blank">Donate</a></li>
|
|
</ul>
|
|
</div>
|
|
<script>
|
|
const menuButton = document.querySelector('.menu-button');
|
|
const navSide = document.querySelector('.nav-side');
|
|
const navLinks = document.querySelectorAll('.nav-side a'); // Select all links inside nav-side
|
|
|
|
menuButton.addEventListener('click', () => {
|
|
if (navSide.style.display === 'none' || navSide.style.display === '') {
|
|
navSide.style.display = 'flex'; // Show the nav-side with flex
|
|
} else {
|
|
navSide.style.display = 'none'; // Hide the nav-side
|
|
}
|
|
});
|
|
|
|
// Add event listeners to each link
|
|
navLinks.forEach(link => {
|
|
link.addEventListener('click', () => {
|
|
navSide.style.display = 'none'; // Hide the nav-side
|
|
});
|
|
});
|
|
</script>
|
|
<!-- This is where child templates will insert their content -->
|
|
{% block content %}
|
|
{% endblock %}
|
|
|
|
</body>
|
|
|
|
</html> |