bf0a3c22c0
- Added verbose names for Incident and ResidualRisk models for better clarity in admin interface. - Updated impact choices for ResidualRisk and Risk models to ensure consistency and clarity. - Implemented gettext_lazy for translatable strings in models and choices. - Enhanced the Risk, ResidualRisk, Control, AuditLog, and Incident models with Meta options for better admin representation. - Added login required decorators to views for improved security. - Introduced new CSS variables and classes for better visual representation of risk levels. - Created custom template tags for dynamic CSS class assignment based on risk likelihood and impact. - Improved dashboard and statistics views with user authentication checks. - Updated templates for risks, controls, incidents, and admin interface to include edit and delete options for staff users. - Added new login and logout templates for user authentication. - Enhanced list views for risks, controls, and incidents to include action buttons for staff users. - Improved overall UI/UX with Bulma CSS framework for a more modern look and feel.
144 lines
No EOL
7 KiB
CSS
144 lines
No EOL
7 KiB
CSS
/* Base palette */
|
|
:root{
|
|
--c-verylow:#22c55e; --c-verylow-100:#dcfce7; --c-verylow-300:#86efac; --c-verylow-inv:#fff;
|
|
--c-low:#84cc16; --c-low-100:#ecfccb; --c-low-300:#bef264; --c-low-inv:#111;
|
|
--c-mid:#eab308; --c-mid-100:#fef9c3; --c-mid-300:#fde047; --c-mid-inv:#111;
|
|
--c-high:#f97316; --c-high-100:#ffedd5; --c-high-300:#fbbf24; --c-high-inv:#111;
|
|
--c-veryhigh:#dc2626; --c-veryhigh-100:#fee2e2;--c-veryhigh-300:#fca5a5; --c-veryhigh-inv:#fff;
|
|
}
|
|
|
|
/* Helpers (wie Bulma) */
|
|
.has-text-control-verylow{color:var(--c-verylow)!important}
|
|
.has-text-control-low{color:var(--c-low)!important}
|
|
.has-text-control-mid{color:var(--c-mid)!important}
|
|
.has-text-control-high{color:var(--c-high)!important}
|
|
.has-text-control-veryhigh{color:var(--c-veryhigh)!important}
|
|
|
|
.has-background-control-verylow{background:var(--c-verylow)!important;color:var(--c-verylow-inv)!important}
|
|
.has-background-control-low{background:var(--c-low)!important;color:var(--c-low-inv)!important}
|
|
.has-background-control-mid{background:var(--c-mid)!important;color:var(--c-mid-inv)!important}
|
|
.has-background-control-high{background:var(--c-high)!important;color:var(--c-high-inv)!important}
|
|
.has-background-control-veryhigh{background:var(--c-veryhigh)!important;color:var(--c-veryhigh-inv)!important}
|
|
|
|
/* Buttons */
|
|
.button.is-control-verylow{background:var(--c-verylow);border-color:transparent;color:var(--c-verylow-inv)}
|
|
.button.is-control-low{background:var(--c-low);border-color:transparent;color:var(--c-low-inv)}
|
|
.button.is-control-mid{background:var(--c-mid);border-color:transparent;color:var(--c-mid-inv)}
|
|
.button.is-control-high{background:var(--c-high);border-color:transparent;color:var(--c-high-inv)}
|
|
.button.is-control-veryhigh{background:var(--c-veryhigh);border-color:transparent;color:var(--c-veryhigh-inv)}
|
|
.button.is-control-verylow:hover{filter:brightness(.92)}
|
|
.button.is-control-low:hover{filter:brightness(.92)}
|
|
.button.is-control-mid:hover{filter:brightness(.92)}
|
|
.button.is-control-high:hover{filter:brightness(.92)}
|
|
.button.is-control-veryhigh:hover{filter:brightness(.92)}
|
|
.button.is-control-verylow.is-light{background:var(--c-verylow-100);color:var(--c-verylow)}
|
|
.button.is-control-low.is-light{background:var(--c-low-100);color:var(--c-low)}
|
|
.button.is-control-mid.is-light{background:var(--c-mid-100);color:var(--c-mid)}
|
|
.button.is-control-high.is-light{background:var(--c-high-100);color:var(--c-high)}
|
|
.button.is-control-veryhigh.is-light{background:var(--c-veryhigh-100);color:var(--c-veryhigh)}
|
|
|
|
/* Tags */
|
|
.tag.is-control-verylow{background:var(--c-verylow);color:var(--c-verylow-inv)}
|
|
.tag.is-control-low{background:var(--c-low);color:var(--c-low-inv)}
|
|
.tag.is-control-mid{background:var(--c-mid);color:var(--c-mid-inv)}
|
|
.tag.is-control-high{background:var(--c-high);color:var(--c-high-inv)}
|
|
.tag.is-control-veryhigh{background:var(--c-veryhigh);color:var(--c-veryhigh-inv)}
|
|
.tag.is-control-verylow.is-light{background:var(--c-verylow-100);color:var(--c-verylow)}
|
|
.tag.is-control-low.is-light{background:var(--c-low-100);color:var(--c-low)}
|
|
.tag.is-control-mid.is-light{background:var(--c-mid-100);color:var(--c-mid)}
|
|
.tag.is-control-high.is-light{background:var(--c-high-100);color:var(--c-high)}
|
|
.tag.is-control-veryhigh.is-light{background:var(--c-veryhigh-100);color:var(--c-veryhigh)}
|
|
|
|
/* Notifications */
|
|
.notification.is-control-verylow{background:var(--c-verylow-100);border-left:4px solid var(--c-verylow);color:#111}
|
|
.notification.is-control-low{background:var(--c-low-100);border-left:4px solid var(--c-low);color:#111}
|
|
.notification.is-control-mid{background:var(--c-mid-100);border-left:4px solid var(--c-mid);color:#111}
|
|
.notification.is-control-high{background:var(--c-high-100);border-left:4px solid var(--c-high);color:#111}
|
|
.notification.is-control-veryhigh{background:var(--c-veryhigh-100);border-left:4px solid var(--c-veryhigh);color:#111}
|
|
|
|
/* Messages */
|
|
.message.is-control-verylow .message-header{background:var(--c-verylow);color:var(--c-verylow-inv)}
|
|
.message.is-control-low .message-header{background:var(--c-low);color:var(--c-low-inv)}
|
|
.message.is-control-mid .message-header{background:var(--c-mid);color:var(--c-mid-inv)}
|
|
.message.is-control-high .message-header{background:var(--c-high);color:var(--c-high-inv)}
|
|
.message.is-control-veryhigh .message-header{background:var(--c-veryhigh);color:var(--c-veryhigh-inv)}
|
|
.message.is-control-verylow .message-body{border-color:var(--c-verylow-300)}
|
|
.message.is-control-low .message-body{border-color:var(--c-low-300)}
|
|
.message.is-control-mid .message-body{border-color:var(--c-mid-300)}
|
|
.message.is-control-high .message-body{border-color:var(--c-high-300)}
|
|
.message.is-control-veryhigh .message-body{border-color:var(--c-veryhigh-300)}
|
|
|
|
/* Progress (optional) */
|
|
.progress.is-control-verylow::-webkit-progress-value{background:var(--c-verylow)}
|
|
.progress.is-control-low::-webkit-progress-value{background:var(--c-low)}
|
|
.progress.is-control-mid::-webkit-progress-value{background:var(--c-mid)}
|
|
.progress.is-control-high::-webkit-progress-value{background:var(--c-high)}
|
|
.progress.is-control-veryhigh::-webkit-progress-value{background:var(--c-veryhigh)}
|
|
.progress.is-control-verylow::-moz-progress-bar{background:var(--c-verylow)}
|
|
.progress.is-control-low::-moz-progress-bar{background:var(--c-low)}
|
|
.progress.is-control-mid::-moz-progress-bar{background:var(--c-mid)}
|
|
.progress.is-control-high::-moz-progress-bar{background:var(--c-high)}
|
|
.progress.is-control-veryhigh::-moz-progress-bar{background:var(--c-veryhigh)}
|
|
|
|
|
|
/* Topbar-Farbe erzwingen (Bulma überschreibt sonst mit weiß) */
|
|
.navbar.topbar-nav {
|
|
background-color: #d6801e !important; /* Orange wie im Screenshot */
|
|
box-shadow: none;
|
|
}
|
|
|
|
/* Textfarben in der Topbar */
|
|
.navbar.topbar-nav .navbar-item,
|
|
.navbar.topbar-nav .navbar-link {
|
|
color: #111;
|
|
}
|
|
.navbar.topbar-nav .navbar-item:hover,
|
|
.navbar.topbar-nav .navbar-link:hover {
|
|
background-color: rgba(0,0,0,.04);
|
|
color: #111;
|
|
}
|
|
|
|
/* Dropdown-Pfeil in lila */
|
|
.navbar.topbar-nav .navbar-link::after {
|
|
border-color: #6b2bbd; /* lila */
|
|
}
|
|
|
|
/* Lila Logo-Kachel links */
|
|
.logo {
|
|
background: #5a2a82 !important;
|
|
color: #fff;
|
|
|
|
}
|
|
.logo .logo-text {
|
|
color: #fff;
|
|
font-weight: 700;
|
|
}
|
|
|
|
/* Rechte Seite: Suche + Profil */
|
|
.actions { display: flex; align-items: center; gap: 10px; padding-right: 10px; }
|
|
.search { border: 1px solid #c7c7c7; border-radius: 4px; padding: 4px 8px; font-size: 14px; }
|
|
.profile { background: #3c7d74; color: #fff; width: 28px; height: 28px; border-radius: 9999px;
|
|
display: flex; align-items: center; justify-content: center; font-weight: 700; }
|
|
|
|
/* Inhalt darunter */
|
|
.content { background: #fafafa; min-height: calc(100vh - 3.25rem); }
|
|
.home-icon { font-size: 20px; display: inline-block; margin: 10px; }
|
|
|
|
/* Dropdown optisch näher am Screenshot */
|
|
.navbar-dropdown { border-top: none; box-shadow: 0 8px 16px rgba(0,0,0,.1); }
|
|
|
|
/* Breadcrumbs */
|
|
.top-breadcrumb { padding: 10px 0;}
|
|
|
|
.breadcrumb {
|
|
margin-bottom: 20px;
|
|
background-color: #f0ebeb;
|
|
}
|
|
|
|
.content li{
|
|
margin-top: 5px !important;
|
|
}
|
|
|
|
.content li+li {
|
|
margin: 0 !important;
|
|
} |