iontalp/frontend-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mükellef yaşı 12 olarak düzeltildi, masaüstüne ilerleme barı eklendi.

Browse Source
This commit is contained in:
iontalp
2026-07-29 04:41:55 +02:00
parent 9b62e4b312
commit db33fdd963
4 changed files with 139 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main.js
+23 -30
View File
@@ -54,41 +54,45 @@ async function render() {
selectedCity = city;
localStorage.setItem("selected_city", city);
render();
},
}
);
} else if (activeTab === "kaza") {
currentPage = renderKaza(pb);
} else {
currentPage = renderDesktop(selectedCity);
currentPage = renderDesktop(selectedCity, pb);
}
app.innerHTML = `
<div class="relative w-full h-screen overflow-hidden bg-slate-950 text-slate-100 flex">
<div class="absolute inset-0 z-0 bg-center bg-no-repeat transition-all duration-700"
style="background-image: url('${currentBg}'); background-size: cover;">
<!-- Kristal Netliğinde Arka Plan (Blur Kaldırıldı) -->
<div class="absolute inset-0 z-0 bg-center bg-cover bg-no-repeat transition-all duration-700"
style="background-image: url('${currentBg}');">
</div>
<div class="absolute inset-0 z-10 bg-slate-950/60 backdrop-blur-[2px]"></div>
<!-- İnce Netlik Katmanı -->
<div class="absolute inset-0 z-10 bg-black/25"></div>
<button id="globalSidebarToggle" class="fixed top-4 left-4 z-50 bg-white/10 hover:bg-white/20 text-white p-2.5 rounded-xl backdrop-blur-md transition-all border border-white/10">
<!-- Sol Menü (Sidebar) -->
<button id="globalSidebarToggle" class="fixed top-4 left-4 z-50 bg-slate-900/80 hover:bg-slate-800 text-white p-2.5 rounded-xl transition-all border border-white/10 shadow-lg">
${sidebarOpen ? "◀" : "▶"}
</button>
${sidebarOpen ? `<div id="sidebarOverlay" class="fixed inset-0 bg-black/50 z-30 md:hidden"></div>` : ""}
<aside id="sidebar" class="fixed md:relative z-40 md:z-30 inset-y-0 left-0 ${sidebarOpen ? "w-72 translate-x-0 p-6" : "w-72 -translate-x-full md:w-20 md:translate-x-0 md:p-3"} h-screen bg-slate-900/80 backdrop-blur-xl border-r border-white/10 flex flex-col justify-between transition-all duration-300 overflow-hidden">
<aside id="sidebar" class="fixed md:relative z-40 md:z-30 inset-y-0 left-0 ${sidebarOpen ? "w-72 translate-x-0 p-6" : "w-72 -translate-x-full md:w-20 md:translate-x-0 md:p-3"} h-screen bg-slate-900/85 border-r border-white/10 flex flex-col justify-between transition-all duration-300 overflow-hidden shadow-2xl">
<div>
<div class="flex items-center justify-between mb-8 mt-2">
<h1 class="font-bold text-white text-xl ${sidebarOpen ? "block" : "hidden md:hidden"}">Dashboard OS</h1>
</div>
<nav class="space-y-2 w-full">
<button id="navDesktop" class="w-full flex items-center ${sidebarOpen ? "" : "md:justify-center"} gap-3 px-4 py-3 rounded-xl font-medium ${activeTab === "desktop" ? "bg-indigo-600/30 text-indigo-300 border border-indigo-500/30" : "text-slate-400 hover:text-white hover:bg-white/5"}">
<button id="navDesktop" class="w-full flex items-center ${sidebarOpen ? "" : "md:justify-center"} gap-3 px-4 py-3 rounded-xl font-medium ${activeTab === "desktop" ? "bg-indigo-600/40 text-indigo-300 border border-indigo-500/40" : "text-slate-400 hover:text-white hover:bg-white/5"}">
<span>🏠</span> <span class="${sidebarOpen ? "block" : "hidden md:hidden"}">Masaüstü</span>
</button>
<button id="navKaza" class="w-full flex items-center ${sidebarOpen ? "" : "md:justify-center"} gap-3 px-4 py-3 rounded-xl font-medium ${activeTab === "kaza" ? "bg-indigo-600/30 text-indigo-300 border border-indigo-500/30" : "text-slate-400 hover:text-white hover:bg-white/5"}">
<button id="navKaza" class="w-full flex items-center ${sidebarOpen ? "" : "md:justify-center"} gap-3 px-4 py-3 rounded-xl font-medium ${activeTab === "kaza" ? "bg-indigo-600/40 text-indigo-300 border border-indigo-500/40" : "text-slate-400 hover:text-white hover:bg-white/5"}">
<span>📿</span> <span class="${sidebarOpen ? "block" : "hidden md:hidden"}">Kaza Namazı</span>
</button>
<button id="navSettings" class="w-full flex items-center ${sidebarOpen ? "" : "md:justify-center"} gap-3 px-4 py-3 rounded-xl font-medium ${activeTab === "settings" ? "bg-indigo-600/30 text-indigo-300 border border-indigo-500/30" : "text-slate-400 hover:text-white hover:bg-white/5"}">
<button id="navSettings" class="w-full flex items-center ${sidebarOpen ? "" : "md:justify-center"} gap-3 px-4 py-3 rounded-xl font-medium ${activeTab === "settings" ? "bg-indigo-600/40 text-indigo-300 border border-indigo-500/40" : "text-slate-400 hover:text-white hover:bg-white/5"}">
<span>⚙️</span> <span class="${sidebarOpen ? "block" : "hidden md:hidden"}">Ayarlar</span>
</button>
</nav>
@@ -122,30 +126,19 @@ async function render() {
const mainContent = document.getElementById("mainContent");
currentPage.initEvents(mainContent);
document.getElementById("navDesktop")?.addEventListener("click", () => {
activeTab = "desktop";
render();
});
document.getElementById("navKaza")?.addEventListener("click", () => {
activeTab = "kaza";
render();
});
document.getElementById("navSettings")?.addEventListener("click", () => {
activeTab = "settings";
render();
});
document.getElementById("navDesktop")?.addEventListener("click", () => { activeTab = "desktop"; render(); });
document.getElementById("navKaza")?.addEventListener("click", () => { activeTab = "kaza"; render(); });
document.getElementById("navSettings")?.addEventListener("click", () => { activeTab = "settings"; render(); });
document.getElementById("logoutBtn")?.addEventListener("click", () => {
pb.authStore.clear();
render();
});
document
.getElementById("globalSidebarToggle")
?.addEventListener("click", () => {
sidebarOpen = !sidebarOpen;
render();
});
document.getElementById("globalSidebarToggle")?.addEventListener("click", () => {
sidebarOpen = !sidebarOpen;
render();
});
document.getElementById("sidebarOverlay")?.addEventListener("click", () => {
sidebarOpen = false;
@@ -178,7 +171,7 @@ function renderLogin() {
.collection("users")
.authWithPassword(
document.getElementById("identity").value,
document.getElementById("password").value,
document.getElementById("password").value
);
render();
} catch {
@@ -187,4 +180,4 @@ function renderLogin() {
});
}
render();
render();