več pagov, search, flashing fix

This commit is contained in:
2026-04-21 16:11:26 +02:00
parent a00028dbfa
commit 474e07f6c5
7 changed files with 144 additions and 4 deletions

View File

@@ -1 +0,0 @@
Flashanje popravi za temo

View File

@@ -19,6 +19,7 @@
Zato se je ustvaril SSNJ, Slovar Slovenskega Novega Jezika. To je prosti direktorij neologizmov in frazemov v moderni slovenščini, h kateremu lahko prispeva vsak.
Lahko brskate po vnosih, dodajate nove vnose, ali pa ocenjujete obstoječe vnose, da pomagamo skupnosti razumeti, kateri vnosi so najbolj uporabni in relevantni.
</p>
<br>
<p class="page-paragraph">
<a class="page-link" href="/">Glavna stran</a>
</p>

22
contact.html Normal file
View File

@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="sl_SI">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kontakt</title>
<script src="./scripts/preload.js"></script>
<link rel="stylesheet" type="text/css" href="./styles/main.css">
</head>
<body>
<div class="page-header"></div>
<main>
<h3 class="page-title">Kontakt</h3>
<br>
</main>
<div class="page-footer"></div>
<script src="./scripts/main.js" defer></script>
</body>
</html>

22
extras.html Normal file
View File

@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="sl_SI">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dodatki</title>
<script src="./scripts/preload.js"></script>
<link rel="stylesheet" type="text/css" href="./styles/main.css">
</head>
<body>
<div class="page-header"></div>
<main>
<h3 class="page-title">Dodatki</h3>
<br>
</main>
<div class="page-footer"></div>
<script src="./scripts/main.js" defer></script>
</body>
</html>

View File

@@ -11,8 +11,14 @@
<div class="page-header"></div>
<main>
<h3 class="page-title">Zadnji vnosi</h3>
<!--TODO: Vnos za iskanje-->
<div class="page-title-container">
<h3 class="page-title" id="page-title">Zadnji vnosi</h3>
<div class="page-search-container">
<input id="search-input" class="page-input" type="text" placeholder="Išči...">
<button id="search-button" class="page-btn" onclick="search()">Išči</button>
</div>
</div>
<div id="entry-container" class="entry-container">
</div>
</main>

View File

@@ -35,4 +35,65 @@ function getLast() {
});
}
function search() {
const field = document.getElementById("search-input");
const val = field.value;
if (!val || val === "" || val === "*") { return; }
const url = `http://localhost:3000/vnosi`;
fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
query: `*${val}*`, // Potencialno mora biti tukaj en "*" wildcard
limit: -1
})
})
.then(response => response.json())
.then(data => {
if (!data.success) {
console.error('API Error:', data.message);
return;
}
console.log(data.data);
let len = data.data.length;
document.getElementById("page-title").innerText = `Rezultati iskanja (${len}):`;
document.getElementById("entry-container").innerHTML = "";
if (len <= 0) {
document.getElementById("entry-container").innerHTML = `
<p class="page-paragraph">Ni bilo najednih zadetkov za poizvedbo "${val}".</p>
`;
return;
}
for (let entry of data.data) {
let build = `
<div class="entry-card">
<h3 class="entry-title">${entry.kljuc}</h3>
<p class="entry-definition">${entry.tip}</p>
${entry.vsebina}
<p class="entry-example">${entry.primer}</p>
</div>
`;
document.getElementById("entry-container").innerHTML += build;
}
})
.catch((error) => {
console.error('Error:', error);
});
}
document.getElementById("search-input").addEventListener("keydown", (event) => {
if (event.key === "Enter") {
event.preventDefault();
search();
}
});
// DELAJ DELAJ
getLast();

View File

@@ -143,6 +143,34 @@ nav {
transition: background-color 0.25s ease, color 0.25s ease;
}
.page-title-container {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
width: 100%;
}
.page-search-container {
display: flex;
align-items: center;
gap: 8px;
margin-right: 23px;
}
.page-input {
padding: 8px 10px;
border: 1px solid var(--nav-btn-border);
border-radius: 4px;
background: var(--nav-btn-bg);
color: var(--text-color);
font-size: 0.92rem;
font-family: inherit;
/* Smooth Theme Transition */
transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
.nav-left,
.nav-right {
display: flex;
@@ -169,7 +197,7 @@ nav {
justify-content: flex-end;
}
.nav-btn {
.nav-btn, .page-btn {
display: inline-flex;
align-items: center;
justify-content: center;
@@ -183,6 +211,7 @@ nav {
font-size: 0.92rem;
font-weight: 500;
line-height: 1.1;
font-family: inherit;
/* Smooth Theme Transition */
transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;