mirror of
https://github.com/Kareadita/Kavita.git
synced 2025-07-09 03:04:19 -04:00
Fixed column layout on multiple components for the user settings (#1602)
#Fixed - Fixed: Fixed an issue where the controls would extend outside of the container on the user account preferences page.
This commit is contained in:
parent
5f0df03e1d
commit
d2e86eaa24
@ -1,20 +1,22 @@
|
||||
<div class="card mt-2">
|
||||
<div class="card-body">
|
||||
<div class="card-title">
|
||||
<div class="row mb-2">
|
||||
<div class="col-11"><h4 id="age-restriction">Age Restriction</h4></div>
|
||||
<div class="col-1">
|
||||
<div class="container-fluid row mb-2">
|
||||
<div class="col-10 col-sm-11"><h4 id="age-restriction">Age Restriction</h4></div>
|
||||
<div class="col-1 text-end">
|
||||
<button class="btn btn-primary btn-sm" (click)="toggleViewMode()" *ngIf="(hasChangeAgeRestrictionAbility | async)">{{isViewMode ? 'Edit' : 'Cancel'}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="isViewMode">
|
||||
<span>{{user?.ageRestriction?.ageRating| ageRating | async}}
|
||||
<ng-container *ngIf="user?.ageRestriction?.ageRating !== AgeRating.NotApplicable && user?.ageRestriction?.includeUnknowns">
|
||||
<span class="ms-1 me-1">+</span> Unknowns
|
||||
</ng-container>
|
||||
</span>
|
||||
<div class="container-fluid row">
|
||||
<span class="col-12">{{user?.ageRestriction?.ageRating| ageRating | async}}
|
||||
<ng-container *ngIf="user?.ageRestriction?.ageRating !== AgeRating.NotApplicable && user?.ageRestriction?.includeUnknowns">
|
||||
<span class="ms-1 me-1">+</span> Unknowns
|
||||
</ng-container>
|
||||
</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<div #collapse="ngbCollapse" [(ngbCollapse)]="isViewMode">
|
||||
|
@ -1,8 +1,8 @@
|
||||
<div class="card mt-2">
|
||||
<div class="card-body">
|
||||
<div class="card-title">
|
||||
<div class="row mb-2">
|
||||
<div class="col-11">
|
||||
<div class="container-fluid row mb-2">
|
||||
<div class="col-10 col-sm-11">
|
||||
<h4 id="email-card">Email
|
||||
<ng-container *ngIf="!emailConfirmed">
|
||||
<i class="fa-solid fa-circle ms-1 confirm-icon" aria-hidden="true" ngbTooltip="This email is not confirmed"></i>
|
||||
@ -10,14 +10,16 @@
|
||||
</ng-container>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-1">
|
||||
<div class="col-1 text-end">
|
||||
<button class="btn btn-primary btn-sm" (click)="toggleViewMode()">{{isViewMode ? 'Edit' : 'Cancel'}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="isViewMode">
|
||||
<span>{{user?.email}}</span>
|
||||
<div class="container-fluid row">
|
||||
<span class="col-12">{{user?.email}}</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<div #collapse="ngbCollapse" [(ngbCollapse)]="isViewMode">
|
||||
|
@ -1,16 +1,18 @@
|
||||
<div class="card mt-2">
|
||||
<div class="card-body">
|
||||
<div class="card-title">
|
||||
<div class="row mb-2">
|
||||
<div class="col-11"><h4>Password</h4></div>
|
||||
<div class="col-1">
|
||||
<div class="container-fluid row mb-2">
|
||||
<div class="col-10 col-sm-11"><h4>Password</h4></div>
|
||||
<div class="col-1 text-end">
|
||||
<button class="btn btn-primary btn-sm" (click)="toggleViewMode()" *ngIf="(hasChangePasswordAbility | async)">{{isViewMode ? 'Edit' : 'Cancel'}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="isViewMode">
|
||||
<span>***************</span>
|
||||
<div class="container-fluid row">
|
||||
<span class="col-12">***************</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<div #collapse="ngbCollapse" [(ngbCollapse)]="isViewMode">
|
||||
|
Loading…
x
Reference in New Issue
Block a user