Kavita/UI/Web/src/app/registration/_components/splash-container/splash-container.component.html
Robbie Davis 28c968ac4d Adding masonry cover images to login page
- Added new public api: /api/Image/random-series-cover
- Updated login bg color to black
- If no cover images, use the default library background (for new installs)
- Added a cover masonry component
- updated the splash container
2025-04-15 13:11:47 -04:00

37 lines
No EOL
1.5 KiB
HTML

<div class="mx-auto login text-center"
[ngStyle]="{'height': (navService.navbarVisible$ | async) ? 'calc(var(--vh, 1vh) * 100 - var(--nav-offset))' : 'calc(var(--vh, 1vh) * 100)'}"
[class.no-images]="hasValidCoverImages">
<app-cover-masonry (hasValidImages)="onCoverImagesValid($event)"></app-cover-masonry>
<div class="row align-items-center row-cols-1 logo-container mb-3 justify-content-center">
<div class="col col-md-4 col-sm-12 col-xs-12 align-self-center p-0">
<div class="row align-items-center row-cols-1 justify-content-center">
<div class="col col-lg-8 col-md-10 col-sm-10 col-xs-10 p-0 position-relative">
<div class="justify-content-center">
<div class="logo" aria-hidden="true"></div>
<h2>Kavita</h2>
</div>
</div>
</div>
</div>
</div>
<div class="row align-items-center row-cols-1 login-container justify-content-center">
<div class="col col-xl-2 col-lg-3 col-md-3 col-sm-10 col-xs-10 align-self-center card p-3">
<span>
<div class="logo-container">
<div class="card-title text-center">
<ng-content select="[title]"></ng-content>
</div>
</div>
</span>
<div class="card-text">
<ng-content select="[body]"></ng-content>
</div>
</div>
</div>
</div>