Fixed poster text not clickable and fixed image height

src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.html

@@ -9,21 +9,24 @@
             <span>{{getAvailbilityStatus()}}</span>
         </div>
     </div>
-    <a>
+    
         <img [routerLink]="generateDetailsLink()" id="cardImage" src="{{result.posterPath}}" class="image"
             alt="{{result.title}}">
             
         <div class="middle">
+            <a class="poster-overlay" [routerLink]="generateDetailsLink()">
+                <div class="summary">
                     <div class="title">{{result.title}}</div>
                     <div class="small-text ellipsis">{{result.overview}}</div>
+                </div>
+            </a>
             <div class="row" *ngIf="!result.available && !result.approved">
                 <div class="col-12">
-                    <button mat-raised-button class="btn-green full-width" (click)="request($event)">
+                    <button mat-raised-button class="btn-green full-width poster-request-btn" (click)="request($event)">
                         <mat-icon *ngIf="!loading">cloud_download</mat-icon>
                         <i *ngIf="loading" class="fa fa-spinner fa-pulse fa-2x fa-fw" aria-hidden="true"></i>
                     </button>
                 </div>
             </div>
         </div>
-    </a>
 </div>

src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss

@@ -63,14 +63,11 @@ small {
 .ombi-card{
   height:100%;
 }
-
-@media (min-width: 2000px) {
  #cardImage {
   height: 100%;
   object-fit: cover;
   display: block;
  }
-}
 
 
 
@@ -208,3 +205,11 @@ small {
   display: inline-block;
   background-color: #ffd740;
 }
+
+::ng-deep a.poster-overlay{
+  color:#fff;
+}
+
+a.poster-overlay:hover{
+  text-decoration: none;
+}