aln/edu
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 2 Wiki Activity

all local
Deploy to FTP / deploy (push) Successful in 6s
Details

Browse Source
This commit is contained in:
Sebastian Molenda
2026-05-26 21:58:38 +02:00
parent 3cf616ad11
commit c26165bfb7
25 changed files with 1304 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/footer.html
+1
View File
@@ -0,0 +1 @@
<footer class="app-footer">Version: <span id="commit-sha">(loading)</span></footer>
components/header.html
+5
View File
@@ -0,0 +1,5 @@
<!-- Uniwersalny nagłówek aplikacji/substrony -->
<header class="subpage-header">
<h1 class="subpage-title">{TITLE}</h1>
<p class="subpage-subtitle">{SUBTITLE}</p>
</header>
components/progress-bar.html
+4
View File
@@ -0,0 +1,4 @@
<!-- Uniwersalny pasek postępu -->
<div class="progress-bar">
<div class="progress-bar-inner" id="{PROGRESS_ID}"></div>
</div>
css/fonts/inter.css
+27
View File
@@ -0,0 +1,27 @@
@font-face {
font-family: 'Inter';
src: url('../../fonts/Inter-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('../../fonts/Inter-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('../../fonts/Inter-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('../../fonts/Inter-ExtraBold.ttf') format('truetype');
font-weight: 800;
font-style: normal;
}
body, html {
font-family: 'Inter', Arial, sans-serif;
}
css/styles.css
+1152
View File
File diff suppressed because it is too large Load Diff
czytanie.html
+19 -10
View File
@@ -4,10 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Czytanie</title> <title>Czytanie</title>
<link rel="stylesheet" href="styles.css?v=20260524" /> <link rel="stylesheet" href="css/styles.css?v=202605261" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="css/fonts/inter.css?v=202605261">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
@@ -17,10 +15,7 @@
<a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a> <a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a>
</nav> </nav>
<main class="screen-content"> <main class="screen-content">
<header class="subpage-header"> <div id="header-placeholder"></div>
<h1 class="subpage-title">📖 Czytanie</h1>
<p class="subpage-subtitle">Wybierz tekst do przeczytania lub wklej własny.</p>
</header>
<section class="content-panel"> <section class="content-panel">
<h2 class="panel-title">Gotowe teksty</h2> <h2 class="panel-title">Gotowe teksty</h2>
@@ -56,7 +51,21 @@
</button> </button>
</div> </div>
<script src="nav.js?v=20260521"></script> <div id="footer-placeholder"></div>
<script src="czytanie.js?v=20260524"></script> <script src="js/nav.js?v=20260521"></script>
<script src="js/czytanie.js?v=20260524"></script>
<script src="js/components.js"></script>
<script>
// Ładowanie nagłówka i stopki
loadComponent('components/header.html', {
'{TITLE}': '📖 Czytanie',
'{SUBTITLE}': 'Wybierz tekst do przeczytania lub wklej własny.'
}).then(html => {
document.getElementById('header-placeholder').outerHTML = html;
});
loadComponent('components/footer.html').then(html => {
document.getElementById('footer-placeholder').outerHTML = html;
});
</script>
</body> </body>
</html> </html>
dyktando.html
+18 -10
View File
@@ -4,10 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Dyktando</title> <title>Dyktando</title>
<link rel="stylesheet" href="styles.css?v=20260524" /> <link rel="stylesheet" href="css/styles.css?v=20260524" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="css/fonts/inter.css">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
@@ -17,10 +15,7 @@
<a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a> <a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a>
</nav> </nav>
<main class="screen-content"> <main class="screen-content">
<header class="subpage-header"> <div id="header-placeholder"></div>
<h1 class="subpage-title">✏️ Dyktando</h1>
<p class="subpage-subtitle">Wybierz dyktando lub wklej własny tekst.</p>
</header>
<section class="content-panel"> <section class="content-panel">
<h2 class="panel-title">Gotowe dyktanda</h2> <h2 class="panel-title">Gotowe dyktanda</h2>
@@ -65,7 +60,20 @@
</div> </div>
</div> </div>
<script src="nav.js?v=20260521"></script> <div id="footer-placeholder"></div>
<script src="dyktando.js?v=20260524"></script> <script src="js/nav.js?v=20260521"></script>
<script src="js/dyktando.js?v=20260524"></script>
<script src="js/components.js"></script>
<script>
loadComponent('components/header.html', {
'{TITLE}': '✏️ Dyktando',
'{SUBTITLE}': 'Wybierz dyktando lub wklej własny tekst.'
}).then(html => {
document.getElementById('header-placeholder').outerHTML = html;
});
loadComponent('components/footer.html').then(html => {
document.getElementById('footer-placeholder').outerHTML = html;
});
</script>
</body> </body>
</html> </html>
dzielenie.html
+18 -11
View File
@@ -4,10 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Nauka Dzielenia</title> <title>Nauka Dzielenia</title>
<link rel="stylesheet" href="styles.css?v=20260524" /> <link rel="stylesheet" href="css/styles.css?v=20260524" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="css/fonts/inter.css">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div class="app-container"> <div class="app-container">
@@ -17,10 +15,7 @@
<a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a> <a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a>
</nav> </nav>
<div class="screen-content"> <div class="screen-content">
<header class="subpage-header"> <div id="header-placeholder"></div>
<h1 class="subpage-title">÷ Nauka Dzielenia</h1>
<p class="subpage-subtitle">Wybierz dzielnik, przez który chcesz dzielić.</p>
</header>
<section class="content-panel"> <section class="content-panel">
<h2 class="panel-title">Wybór dzielnika</h2> <h2 class="panel-title">Wybór dzielnika</h2>
<div class="table-grid" id="table-grid"> <div class="table-grid" id="table-grid">
@@ -101,8 +96,20 @@
</main> </main>
</div> </div>
<footer class="app-footer">Version: <span id="commit-sha">(loading)</span></footer> <div id="footer-placeholder"></div>
<script src="nav.js?v=20260521"></script> <script src="js/nav.js?v=20260521"></script>
<script src="dzielenie.js?v=20260524"></script> <script src="js/dzielenie.js?v=20260524"></script>
<script src="js/components.js"></script>
<script>
loadComponent('components/header.html', {
'{TITLE}': '÷ Nauka Dzielenia',
'{SUBTITLE}': 'Wybierz dzielnik, przez który chcesz dzielić.'
}).then(html => {
document.getElementById('header-placeholder').outerHTML = html;
});
loadComponent('components/footer.html').then(html => {
document.getElementById('footer-placeholder').outerHTML = html;
});
</script>
</body> </body>
</html> </html>
fonts/Inter-Bold.ttf
BIN
View File
Binary file not shown.
fonts/Inter-ExtraBold.ttf
BIN
View File
Binary file not shown.
fonts/Inter-Medium.ttf
BIN
View File
Binary file not shown.
fonts/Inter-Regular.ttf
BIN
View File
Binary file not shown.
index.html
+3 -5
View File
@@ -4,10 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Edu — Główne Menu</title> <title>Edu — Główne Menu</title>
<link rel="stylesheet" href="styles.css?v=20260524" /> <link rel="stylesheet" href="css/styles.css?v=20260524" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="css/fonts/inter.css">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div class="app-container"> <div class="app-container">
@@ -60,6 +58,6 @@
</div> </div>
<footer class="app-footer">Version: <span id="commit-sha">(loading)</span></footer> <footer class="app-footer">Version: <span id="commit-sha">(loading)</span></footer>
<script src="version.js?v=20260521" defer></script> <script src="js/version.js?v=20260521" defer></script>
</body> </body>
</html> </html>
app.js → js/app.js
View File
js/components.js
+14
View File
@@ -0,0 +1,14 @@
// Komponenty HTML loader
function loadComponent(path, replaceMap = {}) {
return fetch(path)
.then(r => r.text())
.then(html => {
Object.entries(replaceMap).forEach(([key, val]) => {
html = html.replaceAll(key, val);
});
return html;
});
}
// Przykład użycia:
// loadComponent('components/header.html', {'{TITLE}': 'Tytuł', '{SUBTITLE}': 'Podtytuł'}).then(html => ...)
czytanie.js → js/czytanie.js
+1 -1
View File
@@ -24,7 +24,7 @@
const progressBar = document.getElementById('read-progress-bar-inner') const progressBar = document.getElementById('read-progress-bar-inner')
// ── Load text list from dyktanda.json ──────────────────────────────────── // ── Load text list from dyktanda.json ────────────────────────────────────
fetch('dyktanda.json') fetch('json/dyktanda.json')
.then(r => r.json()) .then(r => r.json())
.then(data => { .then(data => {
data.forEach(item => { data.forEach(item => {
dyktando.js → js/dyktando.js
+1 -1
View File
@@ -38,7 +38,7 @@
const progressBar = document.getElementById('dyk-progress-bar-inner') const progressBar = document.getElementById('dyk-progress-bar-inner')
// ── Load texts ──────────────────────────────────────────────────────────── // ── Load texts ────────────────────────────────────────────────────────────
fetch('dyktanda.json') fetch('json/dyktanda.json')
.then(r => r.json()) .then(r => r.json())
.then(data => { .then(data => {
data.forEach(item => { data.forEach(item => {
dzielenie.js → js/dzielenie.js
View File
mnozenie.js → js/mnozenie.js
View File
nav.js → js/nav.js
View File
version.js → js/version.js
View File
dyktanda.json → json/dyktanda.json
View File
mnozenie.html
+18 -11
View File
@@ -4,10 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Nauka Mnożenia</title> <title>Nauka Mnożenia</title>
<link rel="stylesheet" href="styles.css?v=20260524" /> <link rel="stylesheet" href="css/styles.css?v=20260524" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="css/fonts/inter.css">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div class="app-container"> <div class="app-container">
@@ -17,10 +15,7 @@
<a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a> <a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a>
</nav> </nav>
<div class="screen-content"> <div class="screen-content">
<header class="subpage-header"> <div id="header-placeholder"></div>
<h1 class="subpage-title">× Nauka Mnożenia</h1>
<p class="subpage-subtitle">Wybierz tabliczkę, którą chcesz poćwiczyć.</p>
</header>
<section class="content-panel"> <section class="content-panel">
<h2 class="panel-title">Wybór tabliczki</h2> <h2 class="panel-title">Wybór tabliczki</h2>
<div class="table-grid" id="table-grid"> <div class="table-grid" id="table-grid">
@@ -101,8 +96,20 @@
</main> </main>
</div> </div>
<footer class="app-footer">Version: <span id="commit-sha">(loading)</span></footer> <div id="footer-placeholder"></div>
<script src="nav.js?v=20260521"></script> <script src="js/nav.js?v=20260521"></script>
<script src="mnozenie.js?v=20260524"></script> <script src="js/mnozenie.js?v=20260524"></script>
<script src="js/components.js"></script>
<script>
loadComponent('components/header.html', {
'{TITLE}': '× Nauka Mnożenia',
'{SUBTITLE}': 'Wybierz tabliczkę, którą chcesz poćwiczyć.'
}).then(html => {
document.getElementById('header-placeholder').outerHTML = html;
});
loadComponent('components/footer.html').then(html => {
document.getElementById('footer-placeholder').outerHTML = html;
});
</script>
</body> </body>
</html> </html>
styles.css
+4 -4
View File
@@ -2,28 +2,28 @@
font-family: 'Inter'; font-family: 'Inter';
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
src: url('fonts/Inter-Regular.ttf') format('truetype'); src: url('../fonts/Inter-Regular.ttf') format('truetype');
} }
@font-face { @font-face {
font-family: 'Inter'; font-family: 'Inter';
font-style: normal; font-style: normal;
font-weight: 500; font-weight: 500;
src: url('fonts/Inter-Medium.ttf') format('truetype'); src: url('../fonts/Inter-Medium.ttf') format('truetype');
} }
@font-face { @font-face {
font-family: 'Inter'; font-family: 'Inter';
font-style: normal; font-style: normal;
font-weight: 700; font-weight: 700;
src: url('fonts/Inter-Bold.ttf') format('truetype'); src: url('../fonts/Inter-Bold.ttf') format('truetype');
} }
@font-face { @font-face {
font-family: 'Inter'; font-family: 'Inter';
font-style: normal; font-style: normal;
font-weight: 800; font-weight: 800;
src: url('fonts/Inter-ExtraBold.ttf') format('truetype'); src: url('../fonts/Inter-ExtraBold.ttf') format('truetype');
} }
:root { :root {
testy.html
+19 -13
View File
@@ -4,10 +4,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" /> <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Testy Matematyczne</title> <title>Testy Matematyczne</title>
<link rel="stylesheet" href="styles.css?v=20260524" /> <link rel="stylesheet" href="css/styles.css?v=20260524" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="css/fonts/inter.css">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div class="app-container"> <div class="app-container">
@@ -17,10 +15,7 @@
<a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a> <a href="index.html" class="back-btn" id="back-to-hub">← Wróć do menu</a>
</nav> </nav>
<div class="screen-content"> <div class="screen-content">
<header class="subpage-header"> <div id="header-placeholder"></div>
<h1 class="subpage-title">📝 Testy Matematyczne</h1>
<p class="subpage-subtitle">Skonfiguruj swój test i sprawdź wiedzę.</p>
</header>
<div class="test-config-grid"> <div class="test-config-grid">
<!-- Operations --> <!-- Operations -->
@@ -154,10 +149,21 @@
</div> </div>
</div> </div>
<footer class="app-footer">Version: <span id="commit-sha">(loading)</span></footer> <div id="footer-placeholder"></div>
<script src="js/version.js?v=20260521" defer></script>
<script src="version.js?v=20260521" defer></script> <script src="js/nav.js?v=20260521"></script>
<script src="nav.js?v=20260521"></script> <script src="js/app.js?v=20260524"></script>
<script src="app.js?v=20260524"></script> <script src="js/components.js"></script>
<script>
loadComponent('components/header.html', {
'{TITLE}': '📝 Testy Matematyczne',
'{SUBTITLE}': 'Skonfiguruj swój test i sprawdź wiedzę.'
}).then(html => {
document.getElementById('header-placeholder').outerHTML = html;
});
loadComponent('components/footer.html').then(html => {
document.getElementById('footer-placeholder').outerHTML = html;
});
</script>
</body> </body>
</html> </html>