elpatron/medi-customers
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

feat: Füge dunkles Theme und Theme-Switcher hinzu

Browse Source
This commit is contained in:
elpatron
2025-03-24 08:29:56 +01:00
parent 10aeef2283
commit 679984766f
5 changed files with 134 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@@ -219,3 +219,9 @@ und dieses Projekt adhäriert zu [Semantic Versioning](https://semver.org/lang/d
## [1.2.18] - 2024-03-19
# ... existing code ...
## [v1.2.20] - 2024-03-19
### Hinzugefügt
- Dunkles Theme für bessere Lesbarkeit bei schlechten Lichtverhältnissen
- Theme-Switcher im Hamburger-Menü
- Automatische Speicherung der Theme-Präferenz

2
README.md
View File

@@ -19,7 +19,7 @@ Eine einfache und effiziente Kundensuche für medisoftware Kunden.
## Version
Aktuelle Version: 1.2.19
Aktuelle Version: 1.2.20
## Installation

4
app.py
View File

@@ -15,8 +15,8 @@ import markdown2
app = Flask(__name__, static_folder='static')
app.config['SECRET_KEY'] = os.environ.get('SECRET_KEY', 'dev')
app.config['ALLOWED_IP_RANGES'] = os.getenv('ALLOWED_IP_RANGES', '192.168.0.0/16,10.0.0.0/8').split(',')
app.config['VERSION'] = '1.2.19'
app.config['DATABASE'] = 'data/customers.db'
app.config['VERSION'] = '1.2.20'
app.config['DATABASE'] = os.path.join(app.instance_path, 'customers.db')
app.config['DATABASE_TIMEOUT'] = 20
app.config['DATABASE_POOL_SIZE'] = 5

87
static/css/style.css Normal file
View File

@@ -0,0 +1,87 @@
:root {
--primary-color: #007bff;
--secondary-color: #6c757d;
--background-color: #ffffff;
--text-color: #212529;
--card-bg: #ffffff;
--border-color: #dee2e6;
--hover-bg: #f8f9fa;
--shadow-color: rgba(0, 0, 0, 0.1);
}
[data-theme="dark"] {
--primary-color: #0d6efd;
--secondary-color: #adb5bd;
--background-color: #212529;
--text-color: #f8f9fa;
--card-bg: #343a40;
--border-color: #495057;
--hover-bg: #495057;
--shadow-color: rgba(0, 0, 0, 0.3);
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: var(--background-color);
color: var(--text-color);
transition: background-color 0.3s, color 0.3s;
}
.card {
background-color: var(--card-bg);
border: 1px solid var(--border-color);
box-shadow: 0 2px 4px var(--shadow-color);
}
.table {
color: var(--text-color);
}
.table thead th {
background-color: var(--card-bg);
border-bottom-color: var(--border-color);
color: var(--text-color);
}
.table td {
border-color: var(--border-color);
}
.table-hover tbody tr:hover {
background-color: var(--hover-bg);
}
.modal-content {
background-color: var(--card-bg);
color: var(--text-color);
border-color: var(--border-color);
}
.modal-header {
border-bottom-color: var(--border-color);
}
.modal-footer {
border-top-color: var(--border-color);
}
.form-control {
background-color: var(--card-bg);
border-color: var(--border-color);
color: var(--text-color);
}
.form-control:focus {
background-color: var(--card-bg);
color: var(--text-color);
}
.btn-outline-secondary {
color: var(--text-color);
border-color: var(--border-color);
}
.btn-outline-secondary:hover {
background-color: var(--hover-bg);
color: var(--text-color);
}

52
templates/index.html
View File

@@ -38,23 +38,22 @@
<button class="btn btn-link text-dark" type="button" id="menuButton" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list fs-4"></i>
</button>
<ul class="dropdown-menu" aria-labelledby="menuButton">
<div class="dropdown-menu">
<a class="dropdown-item" href="{{ url_for('index') }}">
<i class="bi bi-house"></i> Home
</a>
<a class="dropdown-item" href="{{ url_for('upload') }}">
<i class="bi bi-cloud-upload"></i> CSV-Dateien hochladen
</a>
<a class="dropdown-item" href="{{ url_for('readme') }}">
<i class="bi bi-book"></i> README
</a>
<li>
<a class="dropdown-item" href="{{ url_for('index') }}">
<i class="bi bi-house"></i> Home
</a>
<button class="dropdown-item theme-toggle" id="themeToggle">
<i class="bi bi-moon-stars"></i> Theme wechseln
</button>
</li>
<li>
<a class="dropdown-item" href="{{ url_for('upload') }}">
<i class="bi bi-cloud-upload"></i> CSV-Dateien hochladen
</a>
</li>
<li>
<a class="dropdown-item" href="{{ url_for('readme') }}">
<i class="bi bi-book"></i> README
</a>
</li>
</ul>
</div>
</div>
<div class="text-center">
<a href="https://medisoftware.de" target="_blank" rel="noopener noreferrer">
@@ -156,5 +155,28 @@
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Theme Switcher
const themeToggle = document.getElementById('themeToggle');
const icon = themeToggle.querySelector('i');
// Theme aus dem localStorage laden
const savedTheme = localStorage.getItem('theme') || 'light';
document.documentElement.setAttribute('data-theme', savedTheme);
updateThemeIcon(savedTheme);
themeToggle.addEventListener('click', () => {
const currentTheme = document.documentElement.getAttribute('data-theme');
const newTheme = currentTheme === 'light' ? 'dark' : 'light';
document.documentElement.setAttribute('data-theme', newTheme);
localStorage.setItem('theme', newTheme);
updateThemeIcon(newTheme);
});
function updateThemeIcon(theme) {
icon.className = theme === 'light' ? 'bi bi-moon-stars' : 'bi bi-sun';
}
</script>
</body>
</html>