Kobe/docupulse
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

colour settings start

Browse Source
This commit is contained in:
Kobe
2025-05-25 21:15:28 +02:00
parent a8aeb2dbee
commit 3fe3037aed
14 changed files with 221 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
static/css/auth.css
View File

@@ -1,12 +1,8 @@
:root {
--primary-color: #16767b;
--secondary-color: #741b5f;
--primary-light: #1a8a90;
--secondary-light: #8a2170;
}
/* Import color variables */
@import 'colors.css';
body {
background-color: #f8f9fa;
background-color: var(--bg-color);
}
.auth-container {
@@ -17,12 +13,12 @@ body {
.auth-card {
border: none;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0 4px 6px var(--shadow-color);
}
.auth-header {
background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
color: white;
color: var(--white);
padding: 20px;
border-radius: 10px 10px 0 0;
}
@@ -39,7 +35,7 @@ body {
.form-control:focus {
border-color: var(--primary-color);
box-shadow: 0 0 0 0.2rem rgba(22, 118, 123, 0.25);
box-shadow: 0 0 0 0.2rem var(--shadow-color-light);
}
.alert {

22
static/css/base.css
View File

@@ -1,12 +1,8 @@
:root {
--primary-color: #16767b;
--secondary-color: #741b5f;
--primary-light: #1a8a90;
--secondary-light: #8a2170;
}
/* Import color variables */
@import 'colors.css';
body {
background-color: #f8f9fa;
background-color: var(--bg-color);
}
.navbar {
@@ -17,9 +13,9 @@ body {
}
.sidebar {
background-color: white;
background-color: var(--white);
min-height: calc(100vh - 56px);
box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
box-shadow: 2px 0 5px var(--shadow-color);
position: sticky;
top: 56px; /* Height of the navbar */
height: calc(100vh - 56px);
@@ -27,19 +23,19 @@ body {
}
.sidebar .nav-link {
color: #333;
color: var(--text-dark);
padding: 0.8rem 1rem;
border-radius: 0.25rem;
margin: 0.2rem 0;
}
.sidebar .nav-link:hover {
background-color: #f8f9fa;
background-color: var(--bg-color);
}
.sidebar .nav-link.active {
background-color: var(--primary-color);
color: white;
color: var(--white);
}
.sidebar .nav-link i {
@@ -53,7 +49,7 @@ body {
.card {
border: none;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 4px var(--shadow-color);
}
.btn-primary {

51
static/css/colors.css Normal file
View File

@@ -0,0 +1,51 @@
:root {
/* Primary Colors */
--primary-color: #16767b;
--primary-light: #1a8a90;
/* Secondary Colors */
--secondary-color: #741b5f;
--secondary-light: #8a2170;
/* Background Colors */
--bg-color: #f8f9fa;
--white: #ffffff;
--primary-bg-light: #e6f3f4;
/* Text Colors */
--text-dark: #333333;
--text-muted: #6c757d;
/* Status Colors */
--warning-color: #ffd700;
--danger-color: #dc3545;
/* Shadow Colors */
--shadow-color: rgba(0, 0, 0, 0.1);
--shadow-color-light: rgba(0, 0, 0, 0.25);
/* Border Colors */
--border-color: #dee2e6;
--border-light: #e9ecef;
/* Opacity Colors */
--primary-opacity-8: rgba(22, 118, 123, 0.08);
--primary-opacity-12: rgba(22, 118, 123, 0.12);
--primary-opacity-15: rgba(22, 118, 123, 0.15);
--primary-opacity-20: rgba(22, 118, 123, 0.2);
--warning-opacity-15: rgba(255, 215, 0, 0.15);
--danger-opacity-15: rgba(220, 53, 69, 0.15);
/* Chart Colors */
--chart-primary: #16767b;
--chart-secondary: #741b5f;
--chart-warning: #ffd700;
--chart-primary-light: #2c9da9;
--chart-primary-lighter: #43c4d3;
--chart-primary-lightest: #5ad9e8;
--chart-primary-pale: #71eefd;
--chart-secondary-light: #8a2b73;
--chart-secondary-lighter: #a03b87;
--chart-secondary-lightest: #b64b9b;
--chart-secondary-pale: #cc5baf;
}

34
static/css/dashboard.css
View File

@@ -1,11 +1,5 @@
:root {
--primary-color: #16767b;
--secondary-color: #741b5f;
--primary-light: #1a8a90;
--secondary-light: #8a2170;
--warning-color: #ffd700;
--danger-color: #dc3545;
}
/* Import color variables */
@import 'colors.css';
/* Masonry Layout */
.masonry {
@@ -31,7 +25,7 @@
.card {
border: none;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 4px var(--shadow-color);
}
.card-title {
@@ -77,24 +71,24 @@
/* Badge Styles */
.badge-starred {
background-color: rgba(255, 215, 0, 0.15) !important;
background-color: var(--warning-opacity-15) !important;
color: var(--warning-color) !important;
}
.badge-trash {
background-color: rgba(220, 53, 69, 0.15) !important;
background-color: var(--danger-opacity-15) !important;
color: var(--danger-color) !important;
}
/* Contact Link Styles */
.contact-link {
background-color: rgba(22, 118, 123, 0.08);
background-color: var(--primary-opacity-8);
color: var(--primary-color);
transition: all 0.2s;
}
.contact-link:hover {
background-color: rgba(22, 118, 123, 0.12);
background-color: var(--primary-opacity-12);
color: var(--primary-color);
}
@@ -106,8 +100,8 @@
/* Alert Styles */
.alert-info {
background-color: rgba(22, 118, 123, 0.08);
border-color: rgba(22, 118, 123, 0.2);
background-color: var(--primary-opacity-8);
border-color: var(--primary-opacity-20);
color: var(--primary-color);
}
@@ -118,7 +112,7 @@
}
.list-group-item:not(:last-child) {
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
border-bottom: 1px solid var(--shadow-color);
}
/* Download Button */
@@ -126,14 +120,14 @@
background-color: var(--primary-color);
border: none;
border-radius: 6px;
box-shadow: 0 1px 2px rgba(22, 118, 123, 0.08);
color: white;
box-shadow: 0 1px 2px var(--primary-opacity-8);
color: var(--white);
transition: all 0.2s;
}
.btn-download:hover {
background-color: var(--primary-light);
color: white;
color: var(--white);
transform: translateY(-1px);
box-shadow: 0 2px 4px rgba(22, 118, 123, 0.12);
box-shadow: 0 2px 4px var(--primary-opacity-12);
}

15
static/css/trash.css
View File

@@ -1,11 +1,14 @@
/* Import color variables */
@import 'colors.css';
.btn-group .btn.active {
background-color: #e6f3f4 !important;
border-color: #16767b !important;
color: #16767b !important;
background-color: var(--primary-bg-light) !important;
border-color: var(--primary-color) !important;
color: var(--primary-color) !important;
}
.btn-group .btn:not(.active) {
background-color: #fff !important;
border-color: #e9ecef !important;
color: #6c757d !important;
background-color: var(--white) !important;
border-color: var(--border-light) !important;
color: var(--text-muted) !important;
}