(feat): Apply Pro tile ratio

src/app/modules/pro/channel/channel.component.scss

@@ -5,6 +5,7 @@ m-pro--channel {
  --m-pro--plain-background-color: #ffffff;
  --m-pro--transparent-background-color: #ffffffa0;
  --m-pro--text-color: #000000;
+ --m-pro--tile-ratio: 56.25%;
 
  display: block;
  background: none no-repeat center fixed;

src/app/modules/pro/channel/tiles/media/tile.component.html

-<ng-container [ngSwitch]="getType(entity)">
+<div class="m-proChannelTile__container" [ngSwitch]="getType(entity)">
 
  <m-video
  *ngSwitchCase="'object:video'"
@@ -23,7 +23,7 @@
  #img
  >
 
-</ng-container>
+</div>
 
 <div class="m-proChannelTile__text" *ngIf="getTitle() || getText()">
  <h2 [title]="getTitle()">{{ getTitle() }}</h2>

src/app/modules/pro/channel/tiles/media/tile.component.scss

 m-pro--channel-tile {
  cursor: pointer;
  width: 100%;
- height: 320px;
 
  & > img {
  height: calc(100% - 5em);
@@ -9,6 +8,20 @@ m-pro--channel-tile {
  object-fit: cover;
  }
 
+ .m-proChannelTile__container {
+ position: relative;
+ height: 0;
+ overflow: hidden;
+ padding-top: var(--m-pro--tile-ratio);
+
+ > * {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ }
+ }
 
  .m-proChannelTile__text {
  height: 4em;