paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-10-30 03:56:23 -05:00
Code Issues Packages Projects Releases Wiki Activity

Many small fixes to theme & inline logo

Browse Source
This commit is contained in:
Michael Shamoon
2020-12-28 16:46:08 -08:00
parent 33ab988970
commit ca104f905e
3 changed files with 87 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src-ui/src/app/components/dashboard/dashboard.component.html
View File

File diff suppressed because one or more lines are too long

96
src-ui/src/assets/logo-dark.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 8.8 KiB

95
src-ui/src/theme_dark.scss
View File

@@ -18,34 +18,65 @@ $border-color-dark-mode: #47494f;
color: $text-color-dark-mode; color: $text-color-dark-mode;
} }
svg.logo {
.leaf {
color: $primary-dark-mode !important;
}
.text {
fill: $text-color-dark-mode !important;
}
}
.bg-light { .bg-light {
background-color: $bg-light-dark-mode !important; background-color: $bg-light-dark-mode !important;
a, a,
div { div {
color: $text-color-dark-mode !important; color: $text-color-dark-mode;
} }
} }
.border, .border {
.border-bottom,
.border-left,
.border-right {
border-color: $border-color-dark-mode !important; border-color: $border-color-dark-mode !important;
} }
.nav-link.active { .border-right {
background-color: $bg-dark-mode; border-right: 1px solid $border-color-dark-mode !important;
color: $text-color-dark-mode;
border-color: $border-color-dark-mode $border-color-dark-mode $bg-dark-mode;
} }
.nav-link:hover { .border-left {
border-color: $border-color-dark-mode $border-color-dark-mode $bg-dark-mode; border-left: 1px solid $border-color-dark-mode !important;
}
.border-bottom {
border-bottom: 1px solid $border-color-dark-mode !important;
}
.nav-link {
color: $text-color-dark-mode !important;
&.active {
background-color: $bg-dark-mode;
color: $text-color-dark-mode;
border-color: $border-color-dark-mode $border-color-dark-mode $bg-dark-mode;
}
&:hover {
color: $text-color-dark-mode-accent !important;
border-color: $border-color-dark-mode $border-color-dark-mode $bg-dark-mode;
}
} }
.nav-tabs { .nav-tabs {
border-color: $border-color-dark-mode; border-color: $border-color-dark-mode;
.nav-link {
color: $primary-dark-mode !important;
&.active {
color: $text-color-dark-mode !important;
}
}
} }
.dropdown-menu { .dropdown-menu {
@@ -77,6 +108,10 @@ $border-color-dark-mode: #47494f;
} }
} }
.text-dark {
color: $text-color-dark-mode !important;
}
.modal-content, .modal-header, .modal-body, .modal-footer { .modal-content, .modal-header, .modal-body, .modal-footer {
background-color: $bg-light-dark-mode; background-color: $bg-light-dark-mode;
border-color: $border-color-dark-mode; border-color: $border-color-dark-mode;
@@ -93,15 +128,20 @@ $border-color-dark-mode: #47494f;
.doc-img-container { .doc-img-container {
border: none !important; border: none !important;
border-radius: .25rem; border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
overflow: hidden; overflow: hidden;
} }
.doc-img { .doc-img {
mix-blend-mode: normal; mix-blend-mode: normal;
filter: invert(95%) hue-rotate(180deg); filter: invert(95%) hue-rotate(180deg);
border-color: $border-color-dark-mode;
border-radius: 0; border-radius: 0;
border-color: $bg-dark-mode;
&.border-right {
border-right: none !important;
}
} }
.card-selected .doc-img { .card-selected .doc-img {
@@ -116,14 +156,23 @@ $border-color-dark-mode: #47494f;
background-color: opacify($bg-dark-mode, .85); background-color: opacify($bg-dark-mode, .85);
} }
a:hover { a {
color: lighten($primary, 10%); color: $primary-dark-mode;
&:hover {
color: lighten($primary, 10%);
}
} }
table { table {
background-color: $bg-dark-mode; background-color: $bg-light-dark-mode;
color: $text-color-dark-mode; color: $text-color-dark-mode;
border-color: $border-color-dark-mode; border-color: $border-color-dark-mode;
tr:hover {
background-color: $bg-light-dark-mode;
color: $text-color-dark-mode-accent;
}
} }
.table td, .table td,
@@ -136,6 +185,7 @@ $border-color-dark-mode: #47494f;
} }
.close { .close {
color: $text-color-dark-mode;
text-shadow: 0 1px 0 #666; text-shadow: 0 1px 0 #666;
} }
@@ -168,6 +218,15 @@ $border-color-dark-mode: #47494f;
} }
} }
.btn-outline-dark {
border-color: $border-color-dark-mode;
color: $text-color-dark-mode;
&:hover {
color: $text-color-dark-mode-accent;
}
}
.btn-link:not(:disabled):not(.disabled) { .btn-link:not(:disabled):not(.disabled) {
color: $primary-dark-mode; color: $primary-dark-mode;
} }
@@ -254,6 +313,10 @@ $border-color-dark-mode: #47494f;
border-color: $border-color-dark-mode; border-color: $border-color-dark-mode;
color: $text-color-dark-mode-accent; color: $text-color-dark-mode-accent;
} }
.progress {
background-color: $border-color-dark-mode;
}
} }
body.dark-mode { body.dark-mode {