adding themes
This commit is contained in:
parent
b2f7e860d8
commit
d0564c7f58
@ -11,6 +11,50 @@
|
||||
--sidebar-width: 250px;
|
||||
}
|
||||
|
||||
body.theme-dark {
|
||||
--primary: #1e293b;
|
||||
--primary-light: #334155;
|
||||
--accent: #60a5fa;
|
||||
--bg: #0f172a;
|
||||
--surface: #1e293b;
|
||||
--text: #f1f5f9;
|
||||
--text-muted: #94a3b8;
|
||||
--border: #334155;
|
||||
}
|
||||
|
||||
body.theme-ocean {
|
||||
--primary: #083344;
|
||||
--primary-light: #164e63;
|
||||
--accent: #06b6d4;
|
||||
--bg: #ecfeff;
|
||||
--surface: #ffffff;
|
||||
--text: #164e63;
|
||||
--text-muted: #67e8f9;
|
||||
--border: #cffafe;
|
||||
}
|
||||
|
||||
body.theme-forest {
|
||||
--primary: #064e3b;
|
||||
--primary-light: #065f46;
|
||||
--accent: #10b981;
|
||||
--bg: #f0fdf4;
|
||||
--surface: #ffffff;
|
||||
--text: #064e3b;
|
||||
--text-muted: #34d399;
|
||||
--border: #dcfce7;
|
||||
}
|
||||
|
||||
body.theme-sunset {
|
||||
--primary: #451a03;
|
||||
--primary-light: #78350f;
|
||||
--accent: #f59e0b;
|
||||
--bg: #fffbeb;
|
||||
--surface: #ffffff;
|
||||
--text: #451a03;
|
||||
--text-muted: #fbbf24;
|
||||
--border: #fef3c7;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
background-color: var(--bg);
|
||||
|
||||
@ -43,6 +43,39 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Theme Switcher
|
||||
const themeLinks = document.querySelectorAll('.theme-select');
|
||||
themeLinks.forEach(link => {
|
||||
link.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
const theme = this.getAttribute('data-theme');
|
||||
|
||||
// Remove all existing theme classes
|
||||
const themes = ['theme-default', 'theme-dark', 'theme-ocean', 'theme-forest', 'theme-sunset'];
|
||||
document.body.classList.remove(...themes);
|
||||
|
||||
// Add new theme class
|
||||
document.body.classList.add(`theme-${theme}`);
|
||||
|
||||
// Save theme to database
|
||||
const formData = new FormData();
|
||||
formData.append('action', 'save_theme');
|
||||
formData.append('theme', theme);
|
||||
|
||||
fetch('index.php', {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (!data.success) {
|
||||
console.error('Failed to save theme:', data.error);
|
||||
}
|
||||
})
|
||||
.catch(err => console.error('Error:', err));
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function setLanguage(lang) {
|
||||
|
||||
39
index.php
39
index.php
@ -141,6 +141,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['login'])) {
|
||||
$_SESSION['user_role_name'] = $u['role_name'];
|
||||
$_SESSION['user_permissions'] = $u['permissions'];
|
||||
$_SESSION['profile_pic'] = $u['profile_pic'];
|
||||
$_SESSION['theme'] = $u['theme'] ?? 'default';
|
||||
header("Location: index.php");
|
||||
exit;
|
||||
} else {
|
||||
@ -271,6 +272,23 @@ if (isset($_GET['action']) || isset($_POST['action'])) {
|
||||
}
|
||||
exit;
|
||||
}
|
||||
|
||||
if ($action === 'save_theme') {
|
||||
header('Content-Type: application/json');
|
||||
if (!isset($_SESSION['user_id'])) {
|
||||
echo json_encode(['success' => false, 'error' => 'Not authenticated']);
|
||||
exit;
|
||||
}
|
||||
$theme = $_POST['theme'] ?? 'default';
|
||||
$allowed = ['default', 'dark', 'ocean', 'forest', 'sunset'];
|
||||
if (!in_array($theme, $allowed)) $theme = 'default';
|
||||
|
||||
$stmt = db()->prepare("UPDATE users SET theme = ? WHERE id = ?");
|
||||
$stmt->execute([$theme, $_SESSION['user_id']]);
|
||||
$_SESSION['theme'] = $theme;
|
||||
echo json_encode(['success' => true]);
|
||||
exit;
|
||||
}
|
||||
}
|
||||
|
||||
// Redirect to login if not authenticated
|
||||
@ -326,6 +344,13 @@ if (!isset($_SESSION['user_id'])) {
|
||||
// Handle POST Requests
|
||||
$message = '';
|
||||
|
||||
// Fetch theme if not in session but user is logged in
|
||||
if (isset($_SESSION['user_id']) && !isset($_SESSION['theme'])) {
|
||||
$stmt = db()->prepare("SELECT theme FROM users WHERE id = ?");
|
||||
$stmt->execute([$_SESSION['user_id']]);
|
||||
$_SESSION['theme'] = $stmt->fetchColumn() ?: 'default';
|
||||
}
|
||||
|
||||
function numberToWordsOMR($number) {
|
||||
$number = number_format((float)$number, 3, '.', '');
|
||||
list($rials, $baisas) = explode('.', $number);
|
||||
@ -1549,7 +1574,7 @@ $projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? 'Accounting System';
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<body class="theme-<?= htmlspecialchars($_SESSION['theme'] ?? 'default') ?>">
|
||||
|
||||
<div class="sidebar">
|
||||
<div class="sidebar-header" data-en="Accounting" data-ar="المحاسبة">Accounting</div>
|
||||
@ -1844,6 +1869,18 @@ $projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? 'Accounting System';
|
||||
</h4>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="dropdown me-3">
|
||||
<button class="btn btn-outline-secondary btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-palette"></i> <span data-en="Theme" data-ar="المظهر">Theme</span>
|
||||
</button>
|
||||
<ul class="dropdown-menu shadow-sm border-0">
|
||||
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="default"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#0f172a;"></span> Default</a></li>
|
||||
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="dark"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#1e293b;"></span> Midnight</a></li>
|
||||
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="ocean"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#083344;"></span> Ocean</a></li>
|
||||
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="forest"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#064e3b;"></span> Forest</a></li>
|
||||
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="sunset"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#451a03;"></span> Sunset</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<button id="langToggle" class="btn btn-outline-secondary btn-sm me-3">
|
||||
<i class="bi bi-translate"></i> <span data-en="العربية" data-ar="English">العربية</span>
|
||||
</button>
|
||||
|
||||
@ -1 +1 @@
|
||||
user_id|i:1;username|s:5:"admin";user_role_name|s:13:"Administrator";user_permissions|s:3:"all";profile_pic|s:32:"uploads/profile_1_1771401598.png";
|
||||
user_id|i:1;username|s:5:"admin";user_role_name|s:13:"Administrator";user_permissions|s:3:"all";profile_pic|s:32:"uploads/profile_1_1771401598.png";theme|s:7:"default";
|
||||
Loading…
x
Reference in New Issue
Block a user