jens/TimeTrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Align styling across different views.

Browse Source
This commit is contained in:
Jens Luedicke
2025-07-04 15:29:36 +02:00
committed by Jens Luedicke
parent 6f02affa26
commit 2888e66f49
18 changed files with 189 additions and 448 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
static/css/style.css
View File

@@ -313,6 +313,7 @@ body:has(.sidebar.collapsed) .main-content {
border-radius: 4px;
}
/* Button Base Styles */
button {
background-color: #4CAF50;
color: white;
@@ -320,53 +321,150 @@ button {
padding: 8px 16px;
cursor: pointer;
border-radius: 4px;
transition: all 0.2s ease;
}
.btn {
padding: 5px 10px;
padding: 0.5rem 1rem;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 1rem;
text-align: center;
text-decoration: none;
display: inline-block;
transition: all 0.2s ease;
line-height: 1.5;
font-weight: 500;
}
.btn-primary {
background-color: #45a049;
color: white;
margin-bottom: 1rem;
margin-right: 1rem;
margin-left: 1rem;
display: inline-block;
font-size: medium;
/* Button Sizes */
.btn-xs {
padding: 0.25rem 0.5rem;
font-size: 0.8rem;
min-width: 50px;
}
.btn-sm {
padding: 5px 10px;
border-radius: 4px;
font-size: small;
padding: 0.375rem 0.75rem;
font-size: 0.875rem;
}
.btn-md {
padding: 0.75rem 1.5rem;
font-size: 1rem;
border-radius: 8px;
}
.btn-small {
padding: 0.375rem 0.75rem;
font-size: 0.875rem;
margin-right: 0.5rem;
}
/* Button Colors */
.btn-primary {
background-color: #007bff;
color: white;
border: 1px solid #007bff;
}
.btn-primary:hover {
background-color: #0056b3;
border-color: #0056b3;
}
.btn-secondary {
background-color: #f44336;
background-color: #6c757d;
color: white;
border: 1px solid #6c757d;
}
.btn-secondary:hover {
background-color: #545b62;
border-color: #545b62;
}
.btn-success {
background-color: #4CAF50;
background-color: #28a745;
color: white;
border: 1px solid #28a745;
}
.btn:hover {
background-color: #45a049;
.btn-success:hover {
background-color: #218838;
border-color: #218838;
}
.btn-danger {
background-color: #f44336;
background-color: #dc3545;
color: white;
border: 1px solid #dc3545;
}
.btn-danger:hover {
background-color: #d32f2f;
background-color: #c82333;
border-color: #c82333;
}
.btn-warning {
background-color: #ffc107;
color: #212529;
border: 1px solid #ffc107;
}
.btn-warning:hover {
background-color: #e0a800;
border-color: #e0a800;
}
.btn-info {
background-color: #17a2b8;
color: white;
border: 1px solid #17a2b8;
}
.btn-info:hover {
background-color: #138496;
border-color: #138496;
}
/* Button Outline Variants */
.btn-outline {
border: 1px solid #007bff;
color: #007bff;
background: transparent;
}
.btn-outline:hover {
background-color: #007bff;
color: white;
}
/* Special Button Styles */
.btn-filter {
padding: 0.5rem 1rem;
border: 1px solid #dee2e6;
background: white;
color: #495057;
border-radius: 4px;
}
.btn-filter:hover {
background-color: #f8f9fa;
border-color: #adb5bd;
}
.btn-filter.active {
background-color: #007bff;
color: white;
border-color: #007bff;
}
/* Generic Button Hover */
.btn:hover {
transform: translateY(-1px);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
footer {
@@ -390,8 +488,12 @@ body:has(.sidebar.collapsed) footer {
/* Time tracking specific styles */
.timetrack-container {
max-width: 800px;
max-width: 1200px;
margin: 0 auto 3rem auto;
padding: 1.5rem;
background-color: white;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.timer-section {
@@ -437,17 +539,25 @@ body:has(.sidebar.collapsed) footer {
width: 100%;
border-collapse: collapse;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
margin-top: 1rem;
}
.time-history th, .time-history td {
padding: 0.8rem;
text-align: left;
border-bottom: 1px solid #ddd;
min-height: 2.5rem;
vertical-align: middle;
}
.time-history th {
background-color: #f2f2f2;
font-weight: bold;
height: 2.5rem;
}
.time-history tr {
height: 2.5rem;
}
.time-history tr:hover {
@@ -519,12 +629,12 @@ body:has(.sidebar.collapsed) footer {
}
.config-container {
max-width: 800px;
max-width: 1200px;
margin: 0 auto 3rem auto;
padding: 1rem;
background-color: #f9f9f9;
padding: 1.5rem;
background-color: white;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.form-section {
@@ -668,11 +778,12 @@ input[type="time"]::-webkit-datetime-edit {
/* Admin Dashboard Styles */
.admin-container {
max-width: 1200px;
margin: 0 auto 2rem auto;
padding: 1.5rem;
background-color: white;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
margin-bottom: 2rem;
}
.admin-header {
@@ -811,17 +922,25 @@ input[type="time"]::-webkit-datetime-edit {
width: 100%;
border-collapse: collapse;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
margin-top: 1rem;
}
.data-table th, .data-table td {
padding: 0.8rem;
text-align: left;
border-bottom: 1px solid #ddd;
min-height: 2.5rem;
vertical-align: middle;
}
.data-table th {
background-color: #f2f2f2;
font-weight: bold;
height: 2.5rem;
}
.data-table tr {
height: 2.5rem;
}
.data-table tr:hover {
@@ -1086,8 +1205,14 @@ input[type="time"]::-webkit-datetime-edit {
max-width: 300px;
}
.timetrack-container {
padding: 0;
.timetrack-container,
.admin-container,
.config-container,
.table-container,
.team-summary-container {
padding: 1rem;
margin: 0 1rem 2rem 1rem;
max-width: none;
}
.admin-panel {
@@ -1289,9 +1414,12 @@ input[type="time"]::-webkit-datetime-edit {
}
.table-container {
max-width: 1200px;
margin: 0 auto 2rem auto;
padding: 1.5rem;
background: white;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
overflow: hidden;
}
@@ -1356,9 +1484,12 @@ input[type="time"]::-webkit-datetime-edit {
}
.team-summary-container {
max-width: 1200px;
margin: 0 auto 2rem auto;
padding: 1.5rem;
background: white;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
overflow: hidden;
}

23
templates/admin_projects.html
View File

@@ -66,6 +66,13 @@
</div>
<style>
/* Override container width for admin projects page */
.admin-projects-container {
max-width: 1200px !important;
width: auto !important;
padding: 1.5rem !important;
margin: 0 auto 2rem auto !important;
}
.projects-table {
overflow-x: auto;
@@ -96,21 +103,7 @@
white-space: nowrap;
}
.btn-small {
padding: 0.375rem 0.75rem;
font-size: 0.875rem;
margin-right: 0.5rem;
}
.btn-danger {
background-color: #dc3545;
border-color: #dc3545;
}
.btn-danger:hover {
background-color: #c82333;
border-color: #bd2130;
}
/* Button definitions now in main style.css */
.no-data {
text-align: center;

6
templates/admin_teams.html
View File

@@ -1,7 +1,7 @@
{% extends 'layout.html' %}
{% block content %}
<div class="container">
<div class="admin-container">
<div class="admin-header">
<h1>Team Management</h1>
<a href="{{ url_for('create_team') }}" class="btn btn-success">Create New Team</a>
@@ -25,8 +25,8 @@
<td>{{ team.description }}</td>
<td>{{ team.users|length }}</td>
<td>{{ team.created_at.strftime('%Y-%m-%d') }}</td>
<td>
<a href="{{ url_for('manage_team', team_id=team.id) }}" class="button btn btn-sm btn-info">Manage</a>
<td class="actions">
<a href="{{ url_for('manage_team', team_id=team.id) }}" class="button btn btn-sm btn-primary">Manage</a>
<form method="POST" action="{{ url_for('delete_team', team_id=team.id) }}" class="d-inline" onsubmit="return confirm('Are you sure you want to delete this team?');">
<button type="submit" class="btn btn-sm btn-danger">Delete</button>
</form>

31
templates/admin_work_policies.html
View File

@@ -283,36 +283,7 @@
color: #495057;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 6px;
font-size: 1rem;
text-decoration: none;
cursor: pointer;
margin-right: 1rem;
margin-bottom: 0.5rem;
transition: background-color 0.2s ease;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
/* Button styles now centralized in main style.css */
/* Make preset cards clickable */
.preset-card {

10
templates/create_project.html
View File

@@ -112,15 +112,7 @@
margin-top: 2rem;
}
.btn-secondary {
background-color: #6c757d;
border-color: #6c757d;
}
.btn-secondary:hover {
background-color: #5a6268;
border-color: #545b62;
}
/* Button styles now centralized in main style.css */
#code {
text-transform: uppercase;

10
templates/edit_project.html
View File

@@ -174,15 +174,7 @@
margin-top: 2rem;
}
.btn-secondary {
background-color: #6c757d;
border-color: #6c757d;
}
.btn-secondary:hover {
background-color: #5a6268;
border-color: #545b62;
}
/* Button styles now centralized in main style.css */
#code {
text-transform: uppercase;

36
templates/profile.html
View File

@@ -166,41 +166,7 @@
transition: background-color 0.2s;
}
.btn-success {
background: #28a745;
color: white;
}
.btn-success:hover {
background: #218838;
}
.btn-danger {
background: #dc3545;
color: white;
}
.btn-danger:hover {
background: #c82333;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-warning {
background: #ffc107;
color: #212529;
}
.btn-warning:hover {
background: #e0a800;
}
/* Button styles now centralized in main style.css */
.form-group {
margin-bottom: 1.5rem;

29
templates/setup_2fa.html
View File

@@ -175,34 +175,7 @@
margin-top: 1.5rem;
}
.btn {
padding: 0.75rem 1.5rem;
border: none;
border-radius: 0.25rem;
text-decoration: none;
display: inline-block;
cursor: pointer;
font-size: 1rem;
transition: background-color 0.2s;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
/* Button styles now centralized in main style.css */
.security-notice {
background: #fff3cd;

30
templates/system_admin_announcement_form.html
View File

@@ -326,35 +326,7 @@ document.addEventListener('DOMContentLoaded', function() {
border-top: 1px solid #e9ecef;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
text-align: center;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
/* Button styles now centralized in main style.css */
@media (max-width: 768px) {
.form-row {

34
templates/system_admin_companies.html
View File

@@ -221,39 +221,7 @@
gap: 0.5rem;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
}
/* Button styles now centralized in main style.css */
.pagination-section {
margin: 2rem 0;

25
templates/system_admin_company_detail.html
View File

@@ -536,30 +536,7 @@
color: #6a1b99;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
}
/* Button styles now centralized in main style.css */
.btn-outline {
background: transparent;

25
templates/system_admin_dashboard.html
View File

@@ -327,30 +327,7 @@
flex-wrap: wrap;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
}
/* Button styles now centralized in main style.css */
.subtitle {
color: #6c757d;

38
templates/system_admin_edit_user.html
View File

@@ -308,43 +308,7 @@
flex-wrap: wrap;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
.btn-danger {
background: #dc3545;
color: white;
}
.btn-danger:hover {
background: #c82333;
}
/* Button styles now centralized in main style.css */
.danger-zone {
margin-left: auto;

22
templates/system_admin_health.html
View File

@@ -506,27 +506,7 @@
white-space: pre-wrap;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
text-decoration: none;
color: white;
}
/* Button styles now centralized in main style.css */
@media (max-width: 768px) {
.health-cards {

47
templates/system_admin_settings.html
View File

@@ -500,52 +500,7 @@
font-size: 0.875rem;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
.btn-danger {
background: #dc3545;
color: white;
}
.btn-danger:hover {
background: #c82333;
}
.btn-warning {
background: #ffc107;
color: #212529;
}
.btn-warning:hover {
background: #e0a800;
}
/* Button styles now centralized in main style.css */
@media (max-width: 768px) {
.setting-group {

25
templates/system_admin_time_entries.html
View File

@@ -390,30 +390,7 @@
margin: 0;
}
.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
}
/* Button styles now centralized in main style.css */
.btn-outline {
background: transparent;

32
templates/system_admin_users.html
View File

@@ -328,37 +328,7 @@
transition: background-color 0.2s;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #545b62;
}
.btn-danger {
background: #dc3545;
color: white;
}
.btn-danger:hover {
background: #c82333;
}
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
}
/* Button styles now centralized in main style.css */
.pagination-section {
margin-top: 2rem;

19
templates/verify_2fa.html
View File

@@ -102,24 +102,7 @@
margin-bottom: 1.5rem;
}
.btn {
padding: 0.75rem 2rem;
border: none;
border-radius: 0.25rem;
cursor: pointer;
font-size: 1rem;
transition: background-color 0.2s;
width: 100%;
}
.btn-primary {
background: #007bff;
color: white;
}
.btn-primary:hover {
background: #0056b3;
}
/* Button styles now centralized in main style.css */
.help-section {
text-align: center;