github/Ombi
1
0
Fork 0
mirror of https://github.com/Ombi-app/Ombi.git synced 2025-08-14 02:26:55 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improved the user profile section

Browse source
This commit is contained in:
Jamie Rees 2020-11-05 21:14:53 +00:00
commit 86220bb237
2 changed files with 34 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

43
src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
View file

@ -3,14 +3,17 @@
[attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'" [mode]="(isHandset$ | async) ? 'over' : 'side'"
[opened]="!(isHandset$ | async)">
<mat-toolbar>{{applicationName}}</mat-toolbar>
<div class="profile-img-container">
<div class="profile-img">
<img src="https://www.gravatar.com/avatar/{{emailHash}}?d=https://raw.githubusercontent.com/tidusjar/Ombi/gh-pages/img/android-chrome-512x512.png" />
</div>
<div class="profile-info">
<h3>{{username}}</h3>
<p>{{welcomeText | translate}}</p>
</div>
<div class="outer-profile">
<div class="profile-img-container">
<div class="profile-img">
<img
src="https://www.gravatar.com/avatar/{{emailHash}}?d=https://raw.githubusercontent.com/tidusjar/Ombi/gh-pages/img/android-chrome-512x512.png" />
</div>
<div class="profile-info">
<h3>{{username}}</h3>
<p>{{welcomeText | translate}}</p>
</div>
</div>
</div>
<mat-nav-list>
<span *ngFor="let nav of navItems">
@ -67,13 +70,23 @@
</span>
</div>
<div class="col-2">
<button mat-icon-button [matMenuTriggerFor]="filterMenu"><mat-icon>filter_alt</mat-icon></button>
<mat-menu #filterMenu="matMenu" yPosition="below" class="smaller-panel">
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.movies" (click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.Movie)">{{ 'NavigationBar.Filter.Movies' | translate}}</mat-slide-toggle>
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.tvShows" (click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.TvShow)">{{ 'NavigationBar.Filter.TvShows' | translate}}</mat-slide-toggle>
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.music" (click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.Music)">{{ 'NavigationBar.Filter.Music' | translate}}</mat-slide-toggle>
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.people" (click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.People)">{{ 'NavigationBar.Filter.People' | translate}}</mat-slide-toggle>
</mat-menu>
<button mat-icon-button [matMenuTriggerFor]="filterMenu">
<mat-icon>filter_alt</mat-icon>
</button>
<mat-menu #filterMenu="matMenu" yPosition="below" class="smaller-panel">
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.movies"
(click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.Movie)">
{{ 'NavigationBar.Filter.Movies' | translate}}</mat-slide-toggle>
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.tvShows"
(click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.TvShow)">
{{ 'NavigationBar.Filter.TvShows' | translate}}</mat-slide-toggle>
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.music"
(click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.Music)">
{{ 'NavigationBar.Filter.Music' | translate}}</mat-slide-toggle>
<mat-slide-toggle class="mat-menu-item slide-menu" [checked]="searchFilter.people"
(click)="$event.stopPropagation()" (change)="changeFilter($event,SearchFilterType.People)">
{{ 'NavigationBar.Filter.People' | translate}}</mat-slide-toggle>
</mat-menu>
</div>
</mat-toolbar>

6
src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss
View file

@ -120,4 +120,10 @@
border-radius: 6px;
box-shadow: 4px 3px 6px 0 rgba(0,0,0,.2);
width: 45px;
}
.outer-profile {
background-color: #303030;
box-shadow: inset 0 0 3px #000000;
padding: 1px;
}