Responsive navigation menu

This commit is contained in:
2025-06-01 00:06:10 +02:00
parent ca961320e7
commit 504702700c
3 changed files with 193 additions and 53 deletions

View File

@@ -14,11 +14,16 @@
<meta property="og:image:width" content = "100">
</head>
<body>
<nav>
<a href="/">🏠 Strona główna</a> |
<a href="/mecze">📅 Mecze</a> |
<a href="/statystyki">📊 Statystyki</a> |
<button id="theme-toggle" onclick="toggleTheme()">🌙 / 🌞</button>
<nav class="navbar">
<div class="logo">Robert Lewandowski</div>
<ul class="nav-links">
<li><a href="/">🏠 Strona główna</a></li>
<li><a href="/mecze">📅 Mecze</a></li>
<li><a href="/statystyki">📊 Statystyki</a></li>
<li><a href="/statystyki">📊 Statystyki</a></li>
<!--<li><button id="theme-toggle" onclick="toggleTheme()">🌙 / 🌞</button></li>-->
</ul>
<div class="hamburger"></div>
</nav>
<header>
@@ -31,7 +36,12 @@
<main>
{% block content %}{% endblock %}
</main>
<script>
const hamburger = document.querySelector('.hamburger');
const navLinks = document.querySelector('.nav-links');
hamburger.addEventListener('click', () => {
navLinks.classList.toggle('show');});
</script>
<script>
function toggleTheme() {
const currentMode = document.body.classList.contains('dark-mode') ? 'dark' : 'light';

View File

@@ -3,10 +3,38 @@
{% block title %}Statystyki{% endblock %}
{% block content %}
<h2>Statystyki Roberta Lewandowskiego</h2>
<ul>
<li>Gole: {{ stats.goals }}</li>
<li>Asysty: {{ stats.assists }}</li>
<li>Mecze: {{ stats.matches }}</li>
</ul>
<section class="section-stats">
<h2>All time stats</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ stats.goals }}</h3>
<p>Goals</p>
</div>
<div class="stat-box">
<h3>{{ stats.assists }}</h3>
<p>Assists</p>
</div>
<div class="stat-box">
<h3>{{ stats.matches }}</h3>
<p>Apps</p>
</div>
</div>
</section>
<section class="section-stats">
<h2>All time stats</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ stats.goals }}</h3>
<p>Goals</p>
</div>
<div class="stat-box">
<h3>{{ stats.assists }}</h3>
<p>Assists</p>
</div>
<div class="stat-box">
<h3>{{ stats.matches }}</h3>
<p>Apps</p>
</div>
</div>
</section>
{% endblock %}