mirror of
https://github.com/paperless-ngx/paperless-ngx.git
synced 2025-04-02 13:45:10 -05:00
Nicer slim sidebar transitioning, dark mode fixes, fix tests by making settings taller
This commit is contained in:
parent
aa55162e2e
commit
e0f93c26d6
@ -46,7 +46,7 @@ describe('settings', () => {
|
||||
})
|
||||
})
|
||||
|
||||
cy.viewport(1024, 1024)
|
||||
cy.viewport(1024, 1600)
|
||||
cy.visit('/settings')
|
||||
cy.wait('@savedViews')
|
||||
})
|
||||
|
@ -237,7 +237,7 @@
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main role="main" class="ms-sm-auto px-md-4" [ngClass]="slimSidebarEnabled ? 'col slim' : 'col-md-9 col-lg-10'">
|
||||
<main role="main" class="ms-sm-auto px-md-4" [ngClass]="slimSidebarEnabled ? 'col-slim' : 'col-md-9 col-lg-10'">
|
||||
<router-outlet></router-outlet>
|
||||
</main>
|
||||
</div>
|
||||
|
@ -1,3 +1,6 @@
|
||||
@import "node_modules/bootstrap/scss/functions";
|
||||
@import "node_modules/bootstrap/scss/variables";
|
||||
|
||||
/*
|
||||
* Sidebar
|
||||
*/
|
||||
@ -15,7 +18,6 @@
|
||||
height: 0.8em;
|
||||
}
|
||||
|
||||
|
||||
// These come from the col-md-3 col-lg-2 classes for regular sidebar, needed for animation
|
||||
@media (min-width: 768px) {
|
||||
max-width: 25%;
|
||||
@ -25,7 +27,7 @@
|
||||
max-width: 16.66666667%;
|
||||
}
|
||||
|
||||
transition: all .3s ease;
|
||||
transition: all .2s ease;
|
||||
}
|
||||
@media (max-width: 767.98px) {
|
||||
.sidebar {
|
||||
@ -33,6 +35,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
transition: all .2s ease;
|
||||
}
|
||||
|
||||
.sidebar-slim-toggler {
|
||||
display: none; // hide on mobile
|
||||
}
|
||||
@ -45,8 +51,8 @@
|
||||
}
|
||||
}
|
||||
|
||||
.col.slim {
|
||||
margin-left: 50px !important;
|
||||
.col-slim {
|
||||
padding-left: calc(50px + $grid-gutter-width) !important;
|
||||
}
|
||||
|
||||
.sidebar-slim-toggler {
|
||||
|
@ -22,7 +22,7 @@ $paperless-card-breakpoints: (
|
||||
);
|
||||
|
||||
.row-cols-paperless-cards {
|
||||
// xs, we dont want in .col.slim block
|
||||
// xs, we dont want in .col-slim block
|
||||
> * {
|
||||
flex: 0 0 auto;
|
||||
width: calc(100% / 2);
|
||||
@ -38,12 +38,12 @@ $paperless-card-breakpoints: (
|
||||
}
|
||||
}
|
||||
|
||||
::ng-deep .col.slim .row-cols-paperless-cards {
|
||||
::ng-deep .col-slim .row-cols-paperless-cards {
|
||||
@each $width, $n_cols in $paperless-card-breakpoints {
|
||||
@media(min-width: $width) {
|
||||
> * {
|
||||
flex: 0 0 auto;
|
||||
width: calc(100% / ($n-cols + 1));
|
||||
width: calc(100% / ($n-cols + 1)) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,9 +1,9 @@
|
||||
// bs options
|
||||
$enable-negative-margins: true;
|
||||
|
||||
@import "theme";
|
||||
@import "node_modules/bootstrap/scss/bootstrap";
|
||||
@import "~@ng-select/ng-select/themes/default.theme.css";
|
||||
@import "theme";
|
||||
@import "print";
|
||||
|
||||
// Paperless-ngx styles
|
||||
@ -84,6 +84,15 @@ svg.logo {
|
||||
}
|
||||
}
|
||||
|
||||
.btn-dark {
|
||||
--bs-btn-color: var(--bs-gray-600);
|
||||
--bs-btn-bg: var(--bs-gray-200);
|
||||
--bs-btn-border-color: var(--bs-gray-200);
|
||||
--bs-btn-hover-bg: var(--bs-gray-400);
|
||||
--bs-btn-hover-border-color: var(--bs-gray-500);
|
||||
--bs-btn-active-bg: var(--bs-gray-200);
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: var(--bs-primary) !important;
|
||||
}
|
||||
|
@ -79,6 +79,15 @@ $form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,<svg xmlns='htt
|
||||
}
|
||||
}
|
||||
|
||||
.btn-dark {
|
||||
--bs-btn-color: $text-color-dark-bg;
|
||||
--bs-btn-bg: var(--pngx-bg-alt);
|
||||
--bs-btn-border-color: var(--pngx-bg-alt);
|
||||
--bs-btn-hover-bg: var(--bs-light);
|
||||
--bs-btn-hover-border-color: var(--pngx-bg-darker);
|
||||
--bs-btn-active-bg: var(--pngx-bg-alt);
|
||||
}
|
||||
|
||||
.btn-outline-primary {
|
||||
&:hover, &:focus, &.active, &:active {
|
||||
color: var(--bs-light) !important;
|
||||
|
Loading…
x
Reference in New Issue
Block a user