WFNEWS-2411 Remove object-fit css property to scale thumbnail image c…

…orrectly (#2103)

* WFNEWS-2411 Add highlights widget to dashboard

* Revert videos widget css changes

* Remove console logs

* WFBEWS-2411 Move highlights card to standalone component

* WFNEWS-2411 Only bind single post to highlight card

* Add CORS headers for calls to wordpress API

* Try with fetch API

* Add headers to fetch

* Try with CapacitorHttp

* WFNEWS-2411 Use CapacitorHttp on mobile to avoid CORS issues in highlights widget

* WFNEWS-2411 Use CapacitorHttp on mobile to avoid CORS issues in highlights widget

* Add comment

* Move CapacitorHttp get request to service class, Lint clean up

* Use HttpClient for getRequest when native platform is not in use, move to common utility service

* Remove unused imports in capacitor service

* WFNEWS-2411 Make highlights widget container wider on mobile

* WFNEWS-2411 Remove object-fit for highlights thumbnail

* WFNEWS-2450 CSS changes for highlights widget non-compliance

client/wfnews-war/src/main/angular/src/app/components/dashboard-component/widgets/cards/highlights-card/highlights-card.component.scss

@@ -1,7 +1,9 @@
 @import "../../../../../../styles/variables";
 @import "notosans-fontface/scss/notosans-fontface";
 
-:host { display: block; }
+:host {
+    display: block;
+}
 
 .highlight-card {
     border-radius: var(--8, 8px);
@@ -14,7 +16,7 @@
     flex-direction: column;
     align-items: flex-start;
     flex: 1 0 0;
-    min-height: 470px;
+    min-height: 400px;
     position: relative;
     cursor: pointer;
 }
@@ -26,10 +28,11 @@
         overflow: hidden;
         color: var(--Secondary-800, #181A2A);
         text-overflow: ellipsis;
-        font-size: 22px;
+        font-size: 20px;
         font-style: normal;
-        font-weight: 600;
+        font-weight: 400;
         line-height: 28px;
+        max-width: 245px;
     }
 }
 
@@ -42,7 +45,6 @@
     .thumbnail-image {
         width: 100%;
         height: 135px;
-        object-fit: cover;
         border-radius: var(--8, 8px);
     }
 }