From 64d7cd9f56f3fb72282c529f2ce37094c0648630 Mon Sep 17 00:00:00 2001
From: Anojh <anojh@hotmail.com>
Date: Mon, 2 Apr 2018 00:21:07 -0700
Subject: [PATCH] Had to update some base styles since currently some styling
 does not look right...

---
 .../app/issues/issueDetails.component.html    | 109 +++++++++---------
 .../app/issues/issueDetails.component.scss    |   5 +-
 src/Ombi/ClientApp/styles/base.scss           |   4 +
 3 files changed, 62 insertions(+), 56 deletions(-)

diff --git a/src/Ombi/ClientApp/app/issues/issueDetails.component.html b/src/Ombi/ClientApp/app/issues/issueDetails.component.html
index bad4885e7..c1b03a3f3 100644
--- a/src/Ombi/ClientApp/app/issues/issueDetails.component.html
+++ b/src/Ombi/ClientApp/app/issues/issueDetails.component.html
@@ -1,79 +1,80 @@
 <div *ngIf="issue">
-    <div class="myBg backdrop" [style.background-image]="backgroundPath"></div>
-    <div class="tint" style="background-image: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 100%);"></div>
-    <h1>{{issue.title}} </h1>
-    <div class="col-md-6">
-        <img class="img-responsive poster" src="{{posterPath}}" alt="poster">
-        <span class="label label-info">{{IssueStatus[issue.status]}}</span>
-        <span class="label label-success">{{issue.issueCategory.value}}</span>
+    <div class="row">
+        <div class="myBg backdrop" [style.background-image]="backgroundPath"></div>
+        <div class="tint" style="background-image: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 100%);"></div>
+        <h1>{{issue.title}} </h1>
+        <div class="col-md-6">
+            <img class="img-responsive poster" src="{{posterPath}}" alt="poster">
+            <span class="label label-info">{{IssueStatus[issue.status]}}</span>
+            <span class="label label-success">{{issue.issueCategory.value}}</span>
 
-        <h3 *ngIf="issue.userReported?.alias">{{'Issues.ReportedBy' | translate}}: {{issue.userReported.alias}}</h3>
-        <h3 *ngIf="!issue.userReported?.alias">{{'Issues.ReportedBy' | translate}}: {{issue.userReported.userName}}</h3>
-        <h3 *ngIf="issue.subject">{{'Issues.Subject' | translate}}: {{issue.subject}}</h3>
-        <br>
-        <div class="form-group">
-            <label for="description" class="control-label" [translate]="'Issues.Description'"></label>
-            <div>
-                <textarea class="form-control-custom form-control" disabled="disabled" [(ngModel)]="issue.description" rows="5" type="text"></textarea>
+            <h3 *ngIf="issue.userReported?.alias">{{'Issues.ReportedBy' | translate}}: {{issue.userReported.alias}}</h3>
+            <h3 *ngIf="!issue.userReported?.alias">{{'Issues.ReportedBy' | translate}}: {{issue.userReported.userName}}</h3>
+            <h3 *ngIf="issue.subject">{{'Issues.Subject' | translate}}: {{issue.subject}}</h3>
+            <br>
+            <div class="form-group">
+                <label for="description" class="control-label" [translate]="'Issues.Description'"></label>
+                <div>
+                    <textarea class="form-control-custom form-control" disabled="disabled" [(ngModel)]="issue.description" rows="5" type="text"></textarea>
+                </div>
             </div>
-        </div>
 
 
 
-    </div>
+        </div>
 
 
-    <div class="row chat-window col-xs-7 col-md-5" id="chat_window_1" style="margin-left:10px;">
-        <div class="col-xs-12 col-md-12">
-            <div class="panel panel-default">
-                <div class="panel-heading top-bar">
-                    <div class="col-md-8 col-xs-8">
-                        <h3 class="panel-title">
-                            <span class="glyphicon glyphicon-comment"></span> {{'Issues.Comments' | translate}}
-                        </h3>
+        <div class="row chat-window col-xs-7 col-md-5" id="chat_window_1" style="margin-left:10px;">
+            <div class="col-xs-12 col-md-12">
+                <div class="panel panel-default">
+                    <div class="panel-heading top-bar">
+                        <div class="col-md-8 col-xs-8">
+                            <h3 class="panel-title">
+                                <span class="glyphicon glyphicon-comment"></span> {{'Issues.Comments' | translate}}
+                            </h3>
+                        </div>
                     </div>
-                </div>
 
-                <div *ngIf="comments" class="panel-body msg_container_base">
-                    <div *ngIf="comments.length <= 0" class="row msg_container base_receive">
-                        <div class="col-md-10 col-xs-10">
-                            <div class="messages msg_sent">
-                                <p [translate]="'Issues.NoComments'"></p>
+                    <div *ngIf="comments" class="panel-body msg_container_base">
+                        <div *ngIf="comments.length <= 0" class="row msg_container base_receive">
+                            <div class="col-md-10 col-xs-10">
+                                <div class="messages msg_sent">
+                                    <p [translate]="'Issues.NoComments'"></p>
+                                </div>
                             </div>
                         </div>
-                    </div>
 
-                    <div *ngFor="let comment of comments" class="row msg_container" [ngClass]="{'base_sent': comment.adminComment, 'base_receive': !comment.adminComment}">
-                        <div class="col-md-10 col-xs-10">
-                            <div class="messages msg_sent">
-                                <p>{{comment.comment}}</p>
-                                <time>{{comment.username}} • {{comment.date | date:'short'}}</time>
+                        <div *ngFor="let comment of comments" class="row msg_container" [ngClass]="{'base_sent': comment.adminComment, 'base_receive': !comment.adminComment}">
+                            <div class="col-md-10 col-xs-10">
+                                <div class="messages msg_sent">
+                                    <p>{{comment.comment}}</p>
+                                    <time>{{comment.username}} • {{comment.date | date:'short'}}</time>
+                                </div>
                             </div>
                         </div>
-                    </div>
 
-                </div>
-                <div class="panel-footer">
-                    <div class="input-group">
-                        <input id="btn-input" type="text" class="form-control input-sm chat_input" [(ngModel)]="newComment.comment" [attr.placeholder]="'Issues.WriteMessagePlaceholder' | translate" />
-                        <span class="input-group-btn">
-                            <button class="btn btn-primary btn-sm" id="btn-chat" (click)="addComment()" [translate]="'Issues.SendMessageButton'"></button>
-                        </span>
+                    </div>
+                    <div class="panel-footer">
+                        <div class="input-group">
+                            <input id="btn-input" type="text" class="form-control input-sm chat_input" [(ngModel)]="newComment.comment" [attr.placeholder]="'Issues.WriteMessagePlaceholder' | translate" />
+                            <span class="input-group-btn">
+                                <button class="btn btn-primary btn-sm" id="btn-chat" (click)="addComment()" [translate]="'Issues.SendMessageButton'"></button>
+                            </span>
+                        </div>
                     </div>
                 </div>
             </div>
         </div>
-    </div>
 
-    <div class="col-md-12">
-        <div *ngIf="isAdmin && settings">
-            <div *ngIf="issue.status === IssueStatus.Pending && settings.enableInProgress">
-                <button class="btn btn-primary btn-sm" (click)="inProgress()" [translate]="'Issues.MarkInProgress'"></button>
-            </div>
-            <div *ngIf="issue.status === IssueStatus.Pending && !settings.enableInProgress || issue.status == IssueStatus.InProgress">
-                <button class="btn btn-primary btn-sm" (click)="resolve()" [translate]="'Issues.MarkResolved'"></button>
+        <div class="col-md-12">
+            <div *ngIf="isAdmin && settings">
+                <div *ngIf="issue.status === IssueStatus.Pending && settings.enableInProgress">
+                    <button class="btn btn-primary btn-sm" (click)="inProgress()" [translate]="'Issues.MarkInProgress'"></button>
+                </div>
+                <div *ngIf="issue.status === IssueStatus.Pending && !settings.enableInProgress || issue.status == IssueStatus.InProgress">
+                    <button class="btn btn-primary btn-sm" (click)="resolve()" [translate]="'Issues.MarkResolved'"></button>
+                </div>
             </div>
         </div>
     </div>
-
 </div>
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/app/issues/issueDetails.component.scss b/src/Ombi/ClientApp/app/issues/issueDetails.component.scss
index 639b9318c..51b3d7d36 100644
--- a/src/Ombi/ClientApp/app/issues/issueDetails.component.scss
+++ b/src/Ombi/ClientApp/app/issues/issueDetails.component.scss
@@ -70,8 +70,9 @@ body{
 .tint {
     z-index: -1;
 }
-img-responsive poster {
-    display:block;
+.img-responsive.poster {
+    margin-bottom: 21px;
+    width: 60%;
 }
 img {
     display: block;
diff --git a/src/Ombi/ClientApp/styles/base.scss b/src/Ombi/ClientApp/styles/base.scss
index 3e47df13c..313e32e4b 100644
--- a/src/Ombi/ClientApp/styles/base.scss
+++ b/src/Ombi/ClientApp/styles/base.scss
@@ -131,6 +131,10 @@ h1 {
     font-size: 1.9rem $i;
 }
 
+a.active {
+    background-color: $primary-colour;
+}
+
 p {
     font-size: 1.1rem $i;
 }