/* your styles go here */ /* NOTE: @Gevorg dit zou in moeten komen */ @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"); :root { --warning-rgba: rgba(255, 193, 7, 0.3); --danger-hex: #dc3545; --bs-black: #1c1c1c; } .bg-codeColor { --bs-bg-opacity: 1; background-color: rgba(var(-bs-code-color), var(--bs-bg-opacity)) !important; } .bg-orange { --bs-bg-opacity: 1; background-color: #635408; } .bg-paleBlue { --bs-bg-opacity: 1; background-color: rgba(var(--bs-paleBlue-rgb), var(--bs-bg-opacity)) !important; } .bg-violet { --bs-bg-opacity: 1; background-color: #493da9; } .bg-darkBlue { --bs-bg-opacity: 1; background-color: rgba(var(--bs-darkBlue-rgb), var(--bs-bg-opacity)) !important; } .bg-red { --bs-bg-opacity: 1; background-color: rgba(var(--bs-red-rgb), var(--bs-bg-opacity)) !important; } #persistentNotification { position: fixed; top: 7em; z-index: 50000; } #persistentNotification span.bi { margin-right: 0.375em; } #persistentNotification a { text-decoration: underline; font-weight: 300; font-size: 0.8em; color: var(--bs-alert-link-color); } footer { background: var(--bs-black); } span.sidebar-item-spacing { text-transform: capitalize; margin-left: 0.325em; } li.breadcrumb-item.active a { color: var(--bs-navbar-color); } form label.form-label { font-size: 0.6em; margin-bottom: 0; } form input[type=number].form-control#offleftInput { background-color: var(--warning-rgba); } menu.nav li.nav-item a.nav-link:first-letter { text-transform: capitalize; } .hide-sub-item { display: none; } .sidebar-sub-item li a { padding-left: 2.725rem; } .sidebar-sub-item.active > .sidebar-sub-link { color: var(--bs-white); background: var(--bs-primary); } .sidebar-sub-item.active > .sidebar-sub-link:hover { background: var(--bs-primary); } .sidebar-sub-item li.active > a.sidebar-sub-link { color: var(--bs-white); background: var(--bs-faintGreen); } .sidebar-sub-item .collapse, .sidebar-sub-item .collapsing { border-left: 2px solid var(--bs-primary); background: transparent; } .sidebar-sub-item .collapse li:not(.active) .sidebar-sub-link:hover, .sidebar-sub-item .collapse li:not(.active) .sidebar-sub-link:focus, .sidebar-sub-item .collapsing li:not(.active) .sidebar-sub-link:hover, .sidebar-sub-item .collapsing li:not(.active) .sidebar-sub-link:focus { background: transparent; } .sidebar-sub-link { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; overflow: hidden; padding: 10px 15px; text-decoration: none; text-overflow: ellipsis; color: inherit; font-size: 0.725rem; font-weight: 300; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .sidebar-sub-link:hover { color: var(--bs-white); background: var(--bs-primary); } .sidebar-sub-link[aria-expanded=true], .sidebar-link[aria-expanded=aria-expanded] { background: var(--bs-primary); } .sidebar-sub-link[aria-expanded=true]::before, .sidebar-link[aria-expanded=aria-expanded]::before { -webkit-transform: translateY(-50%) rotate(90deg); transform: translateY(-50%) rotate(90deg); } .sidebar-sub-link[aria-expanded=true]:hover, .sidebar-link[aria-expanded=aria-expanded]:hover { color: var(--bs-white); background: var(--bs-primary); } .section-header { font-size: 1.5rem; font-weight: 300; } form label.form-label { font-size: 0.6em; margin-bottom: 0; } form input[type=number].form-control#offleftInput { background-color: var(--warning-rgba); } table.active-project-table th { padding: 0; } table.active-project-table tr td button.project-remove { margin-left: 0.625em; padding: 0em 0.5em; } table.project-table tr td i.fa-trash { font-size: 0.8em; padding-bottom: 0.525em; } menu.nav li.nav-item a.nav-link:first-letter { text-transform: capitalize; } .section-header { font-size: 1.5rem; font-weight: 300; } form label.form-label { font-size: 0.6em; margin-bottom: 0; } form input[type=number].form-control#offleftInput { background-color: #DFB42F; } span.rounded-pill a { text-decoration: none; color: white; } table.active-project-table th { padding: 0; } table.active-project-table tr td button.project-remove { margin-left: 0.625em; padding: 0em 0.5em; } button[type =submit] i.bi-plus{ font-size: 30px; font-weight: 800; } span.week-alert-text { margin-left: 0.325em; /* text-transform: lowercase; */ } /* span.week-alert-text::first-letter { text-transform: capitalize; } */ section.week-admin-panel div.card { background: var(--bs-gray-700); } section.week-user-panel div.card { background: var(--bs-card-bg); } section.week-admin-panel button.admin-approve-btn { background: var(--bs-success); } section.week-admin-panel button.admin-approve-btn:hover { background: var(--bs-btn-hover-bg); } section.week-admin-panel button, section.week-user-panel button { color: var(--bs-white); } section.week-user-panel button.user-save-btn { color: var(--bs-gray-800); } h4.accordion-title { font-size: 1.5rem; font-weight: 300; } span.badge.rounded-pill { font-size: 1em; font-weight: 600; margin-bottom: 0.375em; } #accordionPersonProject .accordion-item { border-bottom: none; } table.project-progress-table { padding: 0 auto; margin: 0 auto; } table.project-progress-table td { background: transparent; } table.project-progress-table .progress { height: 2em; margin-right: 1em; font-size: 1em; font-weight: 600; } a.active-project-link, a.active-profile-link { color: var(--bs-primary); } a.inactive-project-link, a.inactive-profile-link { color: var(--bs-red); } a.person-project-link { color: #0a0a0a; } button.project-remove { line-height: 1em; border-radius: 0.475em; } .project-primary td { color: var(--bs-primary); } .project-secondary td, .project-secondary td a { color: #0F0F10; } .project-active td { font-weight: 600; } div.project-info-banner, div.login-banner { min-height: 2em; } h3.project-info-title, h1.login-banner-title { font-size: 2em; color: #00852C; text-shadow: -1px -1px 0 var(--bs-gray-400), 1px -1px 0 var(--bs-gray-400), -1px 1px 0 var(--bs-gray-400), 1px 1px 0 var(--bs-gray-400); padding-left: 1em; } td.employee-active-project { color: var(--bs-primary); font-weight: 600; } td.employee-inactive-project { color: var(--bs-red); } div.container.center-login-panel { height: 100vh; } button span.login-btn-text { margin-left: 0.375em; font-style: normal; } /* expliciet de achtergrond kleur zetten in de form table "weekOverviewTable" i.v.m. in en uitklappen van het weekend anders komt er een groen vlak tevoorschijn maar kunnen niet vinden waar die achtergrondkleur precedence heeft (waarschijnlijk --bs-faintGreen of #bde5b8) */ #weekOverviewTable { background-color: rgb(255, 255, 255) !important; } .formulier_weekend_button:hover { background-color: rgb(255, 255, 255) !important; }