AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Side Nav UX Changes (#3345)

Browse source 
Co-authored-by: Christopher <39032787+MrRobotjs@users.noreply.github.com>
Co-authored-by: Robbie Davis <robbie@therobbiedavis.com>
This commit is contained in:
Joe Milazzo 2024-11-07 17:21:14 -06:00 • committed by GitHub
parent aa939edf6d
commit 3a0c796c08
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
45 changed files with 1193 additions and 664 deletions
Download patch file Download diff file Expand all files Collapse all files

4
UI/Web/src/app/cards/bulk-operations/bulk-operations.component.html
View file

@ -1,8 +1,8 @@
<ng-container *transloco="let t; read: 'bulk-operations'">
@if (bulkSelectionService.selections$ | async; as selectionCount) {
@if (selectionCount > 0) {
<div class="bulk-select-container">
<div class="bulk-select mb-3 {{modalMode ? '' : 'fixed-top'}}" [ngStyle]="{'margin-top': topOffset + 'px'}">
<div class="bulk-select-container" [ngStyle]="{'margin-left': marginLeft + 'px', 'margin-right': marginRight + 'px'}">
<div class="bulk-select">
<div class="d-flex justify-content-around align-items-center">
<span class="highlight">

5
UI/Web/src/app/cards/bulk-operations/bulk-operations.component.scss
View file

@ -1,6 +1,7 @@
.bulk-select-container {
position: absolute;
width: 100%;
z-index: 1;
top: 0;
position: sticky;
.bulk-select {
background-color: var(--bulk-selection-bg-color);

9
UI/Web/src/app/cards/bulk-operations/bulk-operations.component.ts
View file

@ -37,7 +37,14 @@ export class BulkOperationsComponent implements OnInit {
* Modal mode means don't fix to the top
*/
@Input() modalMode = false;
@Input() topOffset: number = 75;
/**
* On Series Detail this should be 12
*/
@Input() marginLeft: number = 0;
/**
* On Series Detail this should be 12
*/
@Input() marginRight: number = 8;
hasMarkAsRead: boolean = false;
hasMarkAsUnread: boolean = false;
actions: Array<ActionItem<any>> = [];