3a472bd46c
Update static/css/styles.css and templates/base.html to refactor the navigation bar structure and styling, changing CSS selectors from 'nav' and 'nav-container' to '.navbar' and '.navbar-inner', and restructuring the HTML in base.html to accommodate the new class names and layout. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 5e584ab0-c340-4432-97ef-1972582b60e9 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 050566e5-f5ef-4500-9a02-b484207b4148 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/d0a1d46d-d203-4308-bc6a-312ac7c0243b/5e584ab0-c340-4432-97ef-1972582b60e9/vPN8Klq
70 lines
2.9 KiB
HTML
70 lines
2.9 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 class="navbar">
|
|
<div class="navbar-inner">
|
|
<a href="/" class="navbar-logo">
|
|
<img src="{{ url_for('static', filename='images/logo2.png') }}" alt="Logo">
|
|
</a>
|
|
<div class="navbar-links">
|
|
<a href="/">Home</a>
|
|
<a href="/contributors">Contributors</a>
|
|
<a href="/competitions">Competitions</a>
|
|
<a href="/sponsors">Sponsors</a>
|
|
<a href="/contact">Contact</a>
|
|
<a href="https://hcb.hackclub.com/donations/start/technicalturbulence" target="_blank">Donate</a>
|
|
</div>
|
|
</div>
|
|
</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> |