feat(ott-1792): added facr tv description and title (#529)

* feat(ott-1792): added facr tv description and title * fix(ott-1792): pr fix
4 years ago · 96923a5ba9
parent 65c5ed7097
commit 96923a5ba9
19 changed files with 35 additions and 12 deletions
--- a/public/clients/facr/desc/index.js
+++ b/public/clients/facr/desc/index.js
@ -0,0 +1,2 @@
+const title = 'FACR.TV - The home of Czech football streaming'
+const desc = 'Live sports streaming platform. All matches playing under the auspices of Czech Republic FA. Access to full matches, various player playlists, and highlights. Free access in the Czech Republic. Available across all devices'
--- a/public/clients/facr/favicon/android-chrome-192x192.png
+++ b/public/clients/facr/favicon/android-chrome-192x192.png
--- a/public/clients/facr/favicon/android-chrome-512x512.png
+++ b/public/clients/facr/favicon/android-chrome-512x512.png
--- a/public/clients/facr/favicon/apple-touch-icon.png
+++ b/public/clients/facr/favicon/apple-touch-icon.png
--- a/public/clients/facr/favicon/favicon-16x16.png
+++ b/public/clients/facr/favicon/favicon-16x16.png
--- a/public/clients/facr/favicon/favicon-32x32.png
+++ b/public/clients/facr/favicon/favicon-32x32.png
--- a/public/clients/facr/favicon/favicon.ico
+++ b/public/clients/facr/favicon/favicon.ico
--- a/public/clients/facr/favicon/manifest.json
+++ b/public/clients/facr/favicon/manifest.json
--- a/public/clients/instat/desc/index.js
+++ b/public/clients/instat/desc/index.js
@ -0,0 +1,2 @@
+const title = 'InStat TV - The Home of Sports Streaming'
+const desc = 'Live sports streaming platform. Football, basketball, ice hockey and more. Access to various player playlists and game highlights. Multiple subscription options. Available across all devices.'
--- a/public/clients/instat/favicon/android-chrome-192x192.png
+++ b/public/clients/instat/favicon/android-chrome-192x192.png
--- a/public/clients/instat/favicon/android-chrome-512x512.png
+++ b/public/clients/instat/favicon/android-chrome-512x512.png
--- a/public/clients/instat/favicon/apple-touch-icon.png
+++ b/public/clients/instat/favicon/apple-touch-icon.png
--- a/public/clients/instat/favicon/favicon-16x16.png
+++ b/public/clients/instat/favicon/favicon-16x16.png
--- a/public/clients/instat/favicon/favicon-32x32.png
+++ b/public/clients/instat/favicon/favicon-32x32.png
--- a/public/clients/instat/favicon/favicon.ico
+++ b/public/clients/instat/favicon/favicon.ico
--- a/public/clients/instat/favicon/manifest.json
+++ b/public/clients/instat/favicon/manifest.json
--- a/public/index.html
+++ b/public/index.html
@ -2,26 +2,46 @@
 <html lang="en">
  <head>
    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/%REACT_APP_CLIENT%-favicon/favicon.ico" />
-    <link rel="apple-touch-icon" type="image/png" href="%PUBLIC_URL%/%REACT_APP_CLIENT%-favicon/apple-touch-icon.png" />
-    <link rel="icon" type="image/png" sizes="32x32" href="%PUBLIC_URL%/%REACT_APP_CLIENT%-favicon/favicon-32x32.png" />
-    <link rel="icon" type="image/png" sizes="16x16" href="%PUBLIC_URL%/%REACT_APP_CLIENT%-favicon/favicon-16x16.png" />
+    <link
+        rel="icon"
+        href="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/favicon/favicon.ico"
+    />
+    <link
+        rel="apple-touch-icon"
+        type="image/png"
+        href="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/favicon/apple-touch-icon.png"
+    />
+    <link
+        rel="icon"
+        type="image/png"
+        sizes="32x32"
+        href="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/favicon/favicon-32x32.png"
+    />
+    <link
+        rel="icon"
+        type="image/png"
+        sizes="16x16"
+        href="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/favicon/favicon-16x16.png"
+    />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1  user-scalable=0"
    />
    <meta name="theme-color" content="#000000" />
-    <meta name="description" content="Live sports streaming platform. Football, basketball, ice hockey and more.
-    Access to various player playlists and game highlights. Multiple subscription options. Available across all devices."
-    />
-    <link rel="manifest" href="%PUBLIC_URL%/%REACT_APP_CLIENT%-favicon/manifest.json" />
+    <link rel="manifest" href="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/favicon/manifest.json" />
    <link rel="preconnect" href="https://fonts.gstatic.com" />
    <link
      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap"
      rel="stylesheet"
    />
    <script src="https://js.stripe.com/v3" async></script>
-    <title>InStat TV - The Home of Sports Streaming</title>
+    <meta name="description" content=""/>
+    <title></title>
+    <script src="%PUBLIC_URL%/clients/%REACT_APP_CLIENT%/desc/index.js"></script>
+    <script type="text/javascript">
+      window.document.title = title
+      window.document.all.description.content = desc
+    </script>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
--- a/src/features/MatchPage/styled.tsx
+++ b/src/features/MatchPage/styled.tsx
@ -32,11 +32,11 @@ export const Wrapper = styled.div`
 `

 export const Container = styled.div`
+  width: calc(100% - 375px);
  max-width: 2090px;
  max-height: 896px;
  display: flex;
  flex-direction: column;
-  flex-grow: 1;

  @media ${devices.tablet} {
    flex-grow: 0;
--- a/src/features/StreamPlayer/styled.tsx
+++ b/src/features/StreamPlayer/styled.tsx
@ -89,9 +89,8 @@ export const ControlsGroup = styled.div`
 export const PlayerWrapper = styled.div<PlayStopProps>`
  position: relative;
  width: 100%;
-  height: 0px;
-  padding-top: 56.25%;
  background-color: #000;
+  aspect-ratio: calc(16 / 9);

  :fullscreen {
    padding-top: 0;