first commit

public/admin/css/theme.css

@@ -0,0 +1,146 @@
+/* Admin Panel Theme CSS */
+
+:root {
+    --sidebar-width: 250px;
+    --header-height: 60px;
+    --transition-speed: 0.3s;
+}
+
+[data-bs-theme="light"] {
+    --bg-body: #f8f9fa;
+    --bg-sidebar: #ffffff;
+    --text-sidebar: #333333;
+    --border-color: #e9ecef;
+    --accent-color: #0d6efd;
+    --accent-color-rgb: 13,110,253;
+}
+
+[data-bs-theme="dark"] {
+    --bg-body: #212529;
+    --bg-sidebar: #1a1d20;
+    --text-sidebar: #e9ecef;
+    --border-color: #343a40;
+    --accent-color: #ffc107; /* Şeftali tonu veya sarımsı */
+    --accent-color-rgb: 255,193,7;
+}
+
+body {
+    background-color: var(--bg-body);
+    transition: background-color var(--transition-speed);
+}
+
+/* Sidebar Styles */
+#sidebar {
+    width: var(--sidebar-width);
+    height: 100vh;
+    position: fixed;
+    top: 0;
+    left: 0;
+    background-color: var(--bg-sidebar);
+    color: var(--text-sidebar);
+    border-right: 1px solid var(--border-color);
+    transition: transform var(--transition-speed);
+    z-index: 1040;
+    overflow-y: auto;
+}
+
+.sidebar-header {
+    height: var(--header-height);
+    display: flex;
+    align-items: center;
+    padding: 0 1.5rem;
+    border-bottom: 1px solid var(--border-color);
+}
+
+.sidebar-nav .nav-link {
+    color: var(--text-sidebar);
+    padding: 0.75rem 1.5rem;
+    border-left: 3px solid transparent;
+}
+
+.sidebar-nav .nav-link:hover,
+.sidebar-nav .nav-link.active {
+    background-color: rgba(var(--accent-color-rgb), 0.1);
+    border-left-color: var(--accent-color);
+    color: var(--accent-color);
+}
+
+/* Header Styles */
+#main-header {
+    height: var(--header-height);
+    position: fixed;
+    top: 0;
+    left: var(--sidebar-width);
+    right: 0;
+    background-color: var(--bg-sidebar);
+    border-bottom: 1px solid var(--border-color);
+    z-index: 1030;
+    transition: left var(--transition-speed);
+    display: flex;
+    align-items: center;
+    padding: 0 1.5rem;
+}
+
+/* Main Content Area */
+#main-content-wrapper {
+    margin-left: var(--sidebar-width);
+    padding-top: var(--header-height);
+    transition: margin-left var(--transition-speed);
+    min-height: 100vh;
+}
+
+/* Mobile Sidebar Behavior */
+@media (max-width: 991.98px) {
+    #sidebar {
+        transform: translateX(-100%);
+    }
+
+    #sidebar.show {
+        transform: translateX(0);
+    }
+
+    #main-header {
+        left: 0;
+    }
+
+    #main-content-wrapper {
+        margin-left: 0;
+    }
+}
+
+/* Utilities */
+.fade-in {
+    animation: fadeIn 0.3s ease-in-out;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; }
+    to { opacity: 1; }
+}
+
+/* Turnstile Widget Placeholder Style */
+.cf-turnstile {
+    margin: 1rem 0;
+    min-height: 65px;
+}
+
+/* Logo preview helpers: force preview backgrounds for white/black logos */
+.logo-preview {
+    display: inline-block;
+    padding: 0.5rem;
+    border-radius: 0.25rem;
+}
+
+.logo-preview-dark {
+    /* stronger, always-visible dark preview (for white logos) */
+    background-color: rgba(0, 0, 0, 0.6) !important;
+    border: 1px solid rgba(255, 255, 255, 0.06);
+    box-shadow: 0 1px 2px rgba(0,0,0,0.5);
+}
+
+.logo-preview-light {
+    /* white preview for dark/black logos */
+    background-color: #ffffff !important;
+    border: 1px solid rgba(0,0,0,0.08);
+    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
+}

public/admin/js/main.js

@@ -0,0 +1,63 @@
+document.addEventListener('alpine:init', () => {
+    Alpine.store('theme', {
+        mode: localStorage.getItem('theme') || 'light',
+        
+        toggle() {
+            this.mode = this.mode === 'light' ? 'dark' : 'light';
+            localStorage.setItem('theme', this.mode);
+            this.apply();
+        },
+
+        apply() {
+            document.documentElement.setAttribute('data-bs-theme', this.mode);
+        }
+    });
+
+    // Apply theme on init
+    Alpine.store('theme').apply();
+
+    Alpine.store('sidebar', {
+        open: false,
+
+        toggle() {
+            this.open = !this.open;
+            const sidebar = document.getElementById('sidebar');
+            if (this.open) {
+                sidebar.classList.add('show');
+            } else {
+                sidebar.classList.remove('show');
+            }
+        },
+        
+        close() {
+            this.open = false;
+            document.getElementById('sidebar').classList.remove('show');
+        }
+    });
+});
+
+// HTMX Configuration
+document.addEventListener('htmx:configRequest', (event) => {
+    // Add CSRF token if available (implementation dependent)
+    // event.detail.headers['X-CSRF-Token'] = getCsrfToken(); 
+});
+
+document.addEventListener('htmx:beforeSwap', (event) => {
+    // Handle 401 Unauthorized by redirecting to login
+    if (event.detail.xhr.status === 401) {
+        window.location.href = '/login';
+    }
+});
+
+// Mobile helper: Close sidebar on outside click (simple implementation)
+document.addEventListener('click', (e) => {
+    const sidebar = document.getElementById('sidebar');
+    const toggleBtn = document.querySelector('[data-bs-target="#sidebar"]'); // Adjust selector as needed
+    
+    // Only on mobile
+    if (window.innerWidth < 992 && Alpine.store('sidebar').open) {
+        if (!sidebar.contains(e.target) && !toggleBtn.contains(e.target)) {
+            Alpine.store('sidebar').close();
+        }
+    }
+});