Removed the Request on behalf from the details menu as it's no longer needed there and tidied up some of the icons

src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html

@@ -20,11 +20,9 @@
             [embyUrl]="movie.embyUrl"
             [jellyfinUrl]="movie.jellyfinUrl"
             [isAdmin]="isAdmin"
-            [canRequestOnBehalf]="!hasRequest && !movie.available"
             [canShowAdvanced]="showAdvanced && movieRequest"
             [type]="requestType"
             (openTrailer)="openDialog()"
-            (onRequestBehalf)="openRequestOnBehalf()"
             (onAdvancedOptions)="openAdvancedOptions()"
             >
         </social-icons>

src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.ts

@@ -190,15 +190,6 @@ export class MovieDetailsComponent {
         });
     }
 
-    public async openRequestOnBehalf() {
-        const dialog = this.dialog.open(RequestBehalfComponent, { width: "700px", panelClass: 'modal-panel' })
-        await dialog.afterClosed().subscribe(async result => {
-            if (result) {
-                await this.request(result.id);
-            }
-        });
-    }
-
     private loadBanner() {
         this.imageService.getMovieBanner(this.theMovidDbId.toString()).subscribe(x => {
             if (!this.movie.backdropPath) {

src/Ombi/ClientApp/src/app/media-details/components/shared/request-behalf/request-behalf.component.html

@@ -16,8 +16,10 @@
     </mat-form-field>
   </form>
 </div>
-<div mat-dialog-actions>
-  <button mat-raised-button (click)="onNoClick()">{{'Common.Cancel' | translate}}</button>
-  <button mat-raised-button (click)="request()" color="accent" [mat-dialog-close]="userId" cdkFocusInitial>{{'Common.Request' | translate}}</button>
+
+
+<div mat-dialog-actions class="right-buttons">
+  <button mat-raised-button (click)="onNoClick()" color="warn"><i class="fas fa-times"></i> {{'Common.Cancel' | translate}}</button>
+  <button mat-raised-button (click)="request()" color="accent" [mat-dialog-close]="userId" cdkFocusInitial><i class="fas fa-plus"></i> {{'Common.Request' | translate}}</button>
 </div>
 

src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.html

@@ -30,10 +30,6 @@
         <i class="fas fa-cog fa-2x "></i>
     </button>
     <mat-menu #menu="matMenu">
-        <button mat-menu-item (click)="openRequestOnBehalf()" [disabled]="!canRequestOnBehalf">
-            <i class="fas fa-user-friends icon-spacing"></i>
-            <span> {{'MediaDetails.RequestOnBehalf' | translate}}</span>
-        </button>
         <button mat-menu-item [disabled]="!canShowAdvanced" (click)="openAdvancedOptions()">
             <i class="fas fa-ticket-alt icon-spacing"></i>
             <span *ngIf="type === RequestType.movie"> {{ 'MediaDetails.RadarrConfiguration' | translate}}</span>

src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.ts

@@ -22,11 +22,9 @@ export class SocialIconsComponent {
     @Input() type: RequestType;
 
     @Input() isAdmin: boolean;
-    @Input() canRequestOnBehalf: boolean;
     @Input() canShowAdvanced: boolean;
 
     @Output() openTrailer: EventEmitter<any> = new EventEmitter();
-    @Output() onRequestBehalf: EventEmitter<any> = new EventEmitter();
     @Output() onAdvancedOptions: EventEmitter<any> = new EventEmitter();
 
     public RequestType = RequestType;
@@ -36,10 +34,6 @@ export class SocialIconsComponent {
         this.openTrailer.emit();
     }
 
-    public openRequestOnBehalf() {
-        this.onRequestBehalf.emit();
-    }
-
     public openAdvancedOptions() {
         this.onAdvancedOptions.emit();
     }

src/Ombi/ClientApp/src/app/media-details/components/tv/tv-details.component.html

@@ -31,10 +31,8 @@
                     [embyUrl]="tv.embyUrl"
                     [jellyfinUrl]="tv.jellyfinUrl"
                     [isAdmin]="isAdmin"
-                    [canRequestOnBehalf]="!showRequest"
                     [canShowAdvanced]="showAdvanced && showRequest"
                     [type]="requestType"
-                    (onRequestBehalf)="openRequestOnBehalf()"
                     (onAdvancedOptions)="openAdvancedOptions()"
                     >
                 </social-icons>

src/Ombi/ClientApp/src/app/media-details/components/tv/tv-details.component.ts

@@ -108,15 +108,6 @@ export class TvDetailsComponent implements OnInit {
         });
     }
 
-    public async openRequestOnBehalf() {
-        const dialog = this.dialog.open(RequestBehalfComponent, { width: "700px", panelClass: 'modal-panel' })
-        await dialog.afterClosed().subscribe(async result => {
-            if (result) {
-                await this.request(result.id);
-            }
-        });
-    }
-
     public setAdvancedOptions(data: IAdvancedData) {
         this.advancedOptions = data;
         console.log(this.advancedOptions);

src/Ombi/ClientApp/src/app/settings/settingsmenu.component.html

@@ -1,14 +1,14 @@
 
 <button mat-button [matMenuTriggerFor]="configurationmenu"><i class="fas fa-wrench" aria-hidden="true"></i> Configuration</button>
 <mat-menu #configurationmenu="matMenu">
-    <button mat-menu-item [routerLink]="['/Settings/Ombi']">General</button>
-    <button mat-menu-item [routerLink]="['/Settings/Customization']">Customization</button>
-    <button mat-menu-item [routerLink]="['/Settings/LandingPage']">Landing Page</button>
-    <button mat-menu-item [routerLink]="['/Settings/Issues']">Issues</button>
-    <button mat-menu-item [routerLink]="['/Settings/UserManagement']">User Management</button>
-    <button mat-menu-item [routerLink]="['/Settings/Authentication']">Authentication</button>
+    <button mat-menu-item [routerLink]="['/Settings/Ombi']"><i class="far fa-grin-stars icon-spacing"></i> General</button>
+    <button mat-menu-item [routerLink]="['/Settings/Customization']"><i class="fas fa-paint-brush icon-spacing"></i> Customization</button>
+    <button mat-menu-item [routerLink]="['/Settings/LandingPage']"><i class="far fa-file icon-spacing"></i> Landing Page</button>
+    <button mat-menu-item [routerLink]="['/Settings/Issues']"><i class="fas fa-exclamation-triangle icon-spacing"></i> Issues</button>
+    <button mat-menu-item [routerLink]="['/Settings/UserManagement']"><i class="fas fa-users-cog icon-spacing"></i> User Management</button>
+    <button mat-menu-item [routerLink]="['/Settings/Authentication']"><i class="fas fa-sign-in-alt icon-spacing"></i> Authentication</button>
     <!-- <button mat-menu-item [routerLink]="['/Settings/Vote']">Vote</button> -->
-    <button mat-menu-item [routerLink]="['/Settings/TheMovieDb']">The Movie Database</button>
+    <button mat-menu-item [routerLink]="['/Settings/TheMovieDb']"><i class="fas fa-film icon-spacing"></i> The Movie Database</button>
 </mat-menu>
 
 <button mat-button [matMenuTriggerFor]="mediaservermenu"><i class="fas fa-server" aria-hidden="true"></i> Media Server</button>
@@ -39,27 +39,27 @@
 
 <button mat-button [matMenuTriggerFor]="notificationMenu"><i class="fas fa-bell" aria-hidden="true"></i> Notifications</button>
 <mat-menu #notificationMenu="matMenu">
-    <button mat-menu-item [routerLink]="['/Settings/CloudMobile']">Mobile</button>
-    <button mat-menu-item [routerLink]="['/Settings/Mobile']">Legacy Mobile</button>
-    <button mat-menu-item [routerLink]="['/Settings/Email']">Email</button>
-    <button mat-menu-item [routerLink]="['/Settings/MassEmail']">MassEmail</button>
-    <button mat-menu-item [routerLink]="['/Settings/Newsletter']">Newsletter</button>
-    <button mat-menu-item [routerLink]="['/Settings/Discord']">Discord</button>
-    <button mat-menu-item [routerLink]="['/Settings/Slack']">Slack</button>
-    <button mat-menu-item [routerLink]="['/Settings/Pushbullet']">Pushbullet</button>
-    <button mat-menu-item [routerLink]="['/Settings/Pushover']">Pushover</button>
-    <button mat-menu-item [routerLink]="['/Settings/Mattermost']">Mattermost</button>
-    <button mat-menu-item [routerLink]="['/Settings/Telegram']">Telegram</button>
-    <button mat-menu-item [routerLink]="['/Settings/Gotify']">Gotify</button>
-    <button mat-menu-item [routerLink]="['/Settings/Twilio']">Twilio</button>
-    <button mat-menu-item [routerLink]="['/Settings/Webhook']">Webhook</button>
+    <button mat-menu-item [routerLink]="['/Settings/CloudMobile']"><i class="fas fa-mobile-alt icon-spacing"></i> Mobile</button>
+    <button mat-menu-item [routerLink]="['/Settings/Mobile']"><i class="fas fa-mobile icon-spacing"></i> Legacy Mobile</button>
+    <button mat-menu-item [routerLink]="['/Settings/Email']"> <i class="far fa-envelope icon-spacing"></i> Email</button>
+    <button mat-menu-item [routerLink]="['/Settings/MassEmail']"><i class="fas fa-mail-bulk icon-spacing"></i> MassEmail</button>
+    <button mat-menu-item [routerLink]="['/Settings/Newsletter']"><i class="fas fa-inbox icon-spacing"></i> Newsletter</button>
+    <button mat-menu-item [routerLink]="['/Settings/Discord']"><i class="fab fa-discord icon-spacing"></i> Discord</button>
+    <button mat-menu-item [routerLink]="['/Settings/Slack']"><i class="fab fa-slack icon-spacing"></i> Slack</button>
+    <button mat-menu-item [routerLink]="['/Settings/Pushbullet']"><i class="far fa-comments icon-spacing"></i> Pushbullet</button>
+    <button mat-menu-item [routerLink]="['/Settings/Pushover']"><i class="fas fa-comments icon-spacing"></i> Pushover</button>
+    <button mat-menu-item [routerLink]="['/Settings/Mattermost']"><i class="far fa-comments icon-spacing"></i> Mattermost</button>
+    <button mat-menu-item [routerLink]="['/Settings/Telegram']"><i class="fab fa-telegram icon-spacing"></i> Telegram</button>
+    <button mat-menu-item [routerLink]="['/Settings/Gotify']"><i class="fas fa-comments icon-spacing"></i> Gotify</button>
+    <button mat-menu-item [routerLink]="['/Settings/Twilio']"><i class="fas fa-sms icon-spacing"></i> Twilio</button>
+    <button mat-menu-item [routerLink]="['/Settings/Webhook']"><i class="fas fa-sync icon-spacing"></i> Webhook</button>
 </mat-menu>
 
 <button mat-button [matMenuTriggerFor]="systemMenu"><i class="fas fa-sliders-h" aria-hidden="true"></i> System</button>
 <mat-menu #systemMenu="matMenu">
-    <button mat-menu-item [routerLink]="['/Settings/About']">About</button>
-    <button mat-menu-item [routerLink]="['/Settings/FailedRequests']">Failed Requests</button>
+    <button mat-menu-item [routerLink]="['/Settings/About']"><i class="fas fa-question icon-spacing"></i> About</button>
+    <button mat-menu-item [routerLink]="['/Settings/FailedRequests']"><i class="fas fa-times icon-spacing"></i> Failed Requests</button>
     <!-- <button mat-menu-item [routerLink]="['/Settings/Update']">Update</button> -->
-    <button mat-menu-item [routerLink]="['/Settings/Jobs']">Scheduled Tasks</button>
-    <button mat-menu-item [routerLink]="['/Settings/Logs']">Logs</button>
+    <button mat-menu-item [routerLink]="['/Settings/Jobs']"><i class="fas fa-clock icon-spacing"></i> Scheduled Tasks</button>
+    <button mat-menu-item [routerLink]="['/Settings/Logs']"><i class="fas fa-stream icon-spacing"></i> Logs</button>
 </mat-menu>

src/Ombi/ClientApp/src/app/settings/settingsmenu.component.scss

@@ -0,0 +1,3 @@
+.icon-spacing {
+    padding-right: 5%;
+}

src/Ombi/ClientApp/src/app/settings/settingsmenu.component.ts

@@ -2,6 +2,7 @@
 @Component({
     selector: "settings-menu",
     templateUrl: "./settingsmenu.component.html",
+    styleUrls: ["./settingsmenu.component.scss"]
 })
 export class SettingsMenuComponent {
     public ignore(event: any): void {

src/Ombi/ClientApp/src/app/shared/admin-request-dialog/admin-request-dialog.component.html

@@ -1,8 +1,10 @@
 
 
 <form [formGroup]="form" *ngIf="form">
-  <h1 id="advancedOptionsTitle">{{'MediaDetails.AdvancedOptions' | translate }}</h1>
+  <h1 id="advancedOptionsTitle"><i class="fas fa-sliders-h"></i> {{'MediaDetails.AdvancedOptions' | translate }}</h1>
+  <hr />
   <div class="alert alert-info" role="alert">
+    <i class="fas fa-x7 fa-exclamation-triangle glyphicon"></i>
     <span *ngIf="data.type === RequestType.movie">{{'MediaDetails.AutoApproveOptions' | translate }}</span>
     <span *ngIf="data.type === RequestType.tvShow">{{'MediaDetails.AutoApproveOptionsTv' | translate }}</span>
   </div>
@@ -12,7 +14,7 @@
   </div>
 
 <!-- User area -->
-<h3>{{'MediaDetails.RequestOnBehalf' | translate }}</h3>
+<h3><i class="fas fa-user-friends"></i> {{'MediaDetails.RequestOnBehalf' | translate }}</h3>
 <mat-form-field class="example-full-width" appearance="outline" floatLabel=auto>
   <mat-label>{{ 'MediaDetails.PleaseSelectUser' | translate}}</mat-label>
   <input id="requestOnBehalfUserInput"
@@ -29,10 +31,10 @@
 <!-- End User area -->
 
 
-<hr />
+
 
   <!-- Sonarr -->
-  <div *ngIf="data.type === RequestType.tvShow && sonarrEnabled">
+  <div *ngIf="data.type === RequestType.tvShow && sonarrEnabled"><hr />
   <div>
     <h3>Sonarr Overrides</h3>
     <mat-form-field appearance="outline" floatLabel=auto>
@@ -54,7 +56,7 @@
   <!-- End Sonarr-->
 
   <!-- Radarr -->
-  <div *ngIf="data.type === RequestType.movie && radarrEnabled">
+  <div *ngIf="data.type === RequestType.movie && radarrEnabled"><hr />
   <div>
     <h3>Radarr Overrides</h3>
       <mat-form-field appearance="outline" floatLabel=auto>
@@ -76,9 +78,9 @@
   <!-- End Radarr-->
 
 
-<div mat-dialog-actions>
-  <button mat-raised-button id="cancelButton" [mat-dialog-close]="" color="warn">{{ 'Common.Cancel' | translate }}</button>
-  <button mat-raised-button id="requestButton" (click)="submitRequest()" color="accent">{{ 'Common.Request' | translate }}</button>
+<div mat-dialog-actions class="right-buttons">
+  <button mat-raised-button id="cancelButton" [mat-dialog-close]="" color="warn"><i class="fas fa-times"></i> {{ 'Common.Cancel' | translate }}</button>
+  <button mat-raised-button id="requestButton" (click)="submitRequest()" color="accent"><i class="fas fa-plus"></i> {{ 'Common.Request' | translate }}</button>
 </div>
 </form>
 

src/Ombi/ClientApp/src/styles/Styles.scss

@@ -157,3 +157,20 @@
         color:#FFF;
         border: 1px solid $ombi-active;
     }
+
+
+    .alert .glyphicon{
+        display: table-cell;
+        vertical-align: middle;
+        padding-right: 1%;
+      }
+
+      .alert div,
+      .alert span{
+        padding-left: 1%;
+        display:table-cell;
+      }
+
+      .right-buttons {
+          float:right;
+      }