separation of css again

This commit is contained in:
2025-05-25 20:56:09 +02:00
parent 45a0b198f0
commit a8aeb2dbee
2 changed files with 76 additions and 77 deletions

75
static/css/base.css Normal file
View File

@@ -0,0 +1,75 @@
:root {
--primary-color: #16767b;
--secondary-color: #741b5f;
--primary-light: #1a8a90;
--secondary-light: #8a2170;
}
body {
background-color: #f8f9fa;
}
.navbar {
background-color: var(--primary-color) !important;
position: sticky;
top: 0;
z-index: 1030;
}
.sidebar {
background-color: white;
min-height: calc(100vh - 56px);
box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
position: sticky;
top: 56px; /* Height of the navbar */
height: calc(100vh - 56px);
overflow-y: auto;
}
.sidebar .nav-link {
color: #333;
padding: 0.8rem 1rem;
border-radius: 0.25rem;
margin: 0.2rem 0;
}
.sidebar .nav-link:hover {
background-color: #f8f9fa;
}
.sidebar .nav-link.active {
background-color: var(--primary-color);
color: white;
}
.sidebar .nav-link i {
margin-right: 0.5rem;
}
.main-content {
padding: 2rem;
}
.card {
border: none;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.btn-primary {
background-color: var(--primary-color);
border-color: var(--primary-color);
}
.btn-primary:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
.document-card {
transition: transform 0.2s;
}
.document-card:hover {
transform: translateY(-5px);
}

View File

@@ -9,83 +9,7 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet"> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
<link href="{{ url_for('static', filename='css/file-grid.css') }}" rel="stylesheet"> <link href="{{ url_for('static', filename='css/file-grid.css') }}" rel="stylesheet">
<style> <link href="{{ url_for('static', filename='css/base.css') }}" rel="stylesheet">
:root {
--primary-color: #16767b;
--secondary-color: #741b5f;
--primary-light: #1a8a90;
--secondary-light: #8a2170;
}
body {
background-color: #f8f9fa;
}
.navbar {
background-color: var(--primary-color) !important;
position: sticky;
top: 0;
z-index: 1030;
}
.sidebar {
background-color: white;
min-height: calc(100vh - 56px);
box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
position: sticky;
top: 56px; /* Height of the navbar */
height: calc(100vh - 56px);
overflow-y: auto;
}
.sidebar .nav-link {
color: #333;
padding: 0.8rem 1rem;
border-radius: 0.25rem;
margin: 0.2rem 0;
}
.sidebar .nav-link:hover {
background-color: #f8f9fa;
}
.sidebar .nav-link.active {
background-color: var(--primary-color);
color: white;
}
.sidebar .nav-link i {
margin-right: 0.5rem;
}
.main-content {
padding: 2rem;
}
.card {
border: none;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.btn-primary {
background-color: var(--primary-color);
border-color: var(--primary-color);
}
.btn-primary:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
.document-card {
transition: transform 0.2s;
}
.document-card:hover {
transform: translateY(-5px);
}
</style>
{% block extra_css %}{% endblock %} {% block extra_css %}{% endblock %}
</head> </head>
<body> <body>