lgcosta/paperless-ngx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use flexbox to fix tab order but retain visual order

Browse Source
This commit is contained in:
shamoon
2023-12-16 09:44:16 -08:00
parent 68663d419d
commit 34dd2c1ffe
2 changed files with 18 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src-ui/src/app/components/document-detail/document-detail.component.html
View File

@@ -240,12 +240,12 @@
<ng-template #saveButtons> <ng-template #saveButtons>
<div class="btn-group ms-auto"> <div class="btn-group ms-auto">
<button type="button" class="btn btn-sm btn-outline-secondary" (click)="discard()" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Discard</button>
<ng-container *pngxIfPermissions="{ action: PermissionAction.Change, type: PermissionType.Document }"> <ng-container *pngxIfPermissions="{ action: PermissionAction.Change, type: PermissionType.Document }">
<button *ngIf="hasNext()" type="button" class="btn btn-sm btn-outline-primary" (click)="saveEditNext()" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Save &amp; next</button> <button type="submit" class="order-3 btn btn-sm btn-primary" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Save</button>
<button *ngIf="!hasNext()" type="button" class="btn btn-sm btn-outline-primary" (click)="save(true)" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Save &amp; close</button> <button *ngIf="hasNext()" type="button" class="order-1 btn btn-sm btn-outline-primary" (click)="saveEditNext()" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Save &amp; next</button>
<button type="submit" class="btn btn-sm btn-primary" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Save</button> <button *ngIf="!hasNext()" type="button" class="order-2 btn btn-sm btn-outline-primary" (click)="save(true)" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Save &amp; close</button>
</ng-container> </ng-container>
<button type="button" class="order-0 btn btn-sm btn-outline-secondary" (click)="discard()" i18n [disabled]="!userCanEdit || networkActive || (isDirty$ | async) !== true">Discard</button>
</div> </div>
</ng-template> </ng-template>

14
src-ui/src/app/components/document-detail/document-detail.component.scss
View File

@@ -44,3 +44,17 @@ textarea.rtl {
.input-group .btn-outline-secondary { .input-group .btn-outline-secondary {
border-color: var(--bs-border-color); border-color: var(--bs-border-color);
} }
.btn-group .btn.order-0 {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-top-left-radius: var(--bs-border-radius-sm);
border-bottom-left-radius: var(--bs-border-radius-sm);
}
.btn-group .btn.order-3 {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-top-right-radius: var(--bs-border-radius-sm);
border-bottom-right-radius: var(--bs-border-radius-sm);
}