@times-components/ts-components 1.145.1-82bc6796129e892c1eb22c6257c5e3809c159767.3 → 1.145.1-9176eda9ce171a0f5596bdc9d385a1fc60b23ea1.12

package/src/components/opta/football/opta-match-stats/matchday-live/styles/NavigationWrapper.tsx

@@ -1,81 +0,0 @@
-import styled from 'styled-components';
-import {
-  backgroundColor,
-  darkBackgroundColor,
-  darkTextColor,
-  textColor
-} from '../../shared/styles';
-
-export const NavigationWrapper = styled.div<{
-  homeTeamColor: { light: string; dark: string };
-  awayTeamColor: { light: string; dark: string };
-  activeTeam: 'home' | 'away';
-  isApp: boolean;
-}>`
-  background-color: ${backgroundColor};
-  ${props =>
-    props.isApp &&
-    `
-      @media (prefers-color-scheme: dark) {
-        background-color: ${darkBackgroundColor};
-      }
-    `} .navigation-buttons {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    button {
-      -webkit-tap-highlight-color: transparent;
-      background: none;
-      border: none;
-      font-family: Roboto, sans-serif;
-      font-size: 16px;
-      font-weight: 500;
-      line-height: 150%;
-      padding: 16px 8px;
-      cursor: pointer;
-      border-bottom: 2px solid ${backgroundColor};
-      color: ${textColor};
-
-      &.active {
-        &.home {
-          border-bottom: 2px solid ${props => props.homeTeamColor.light};
-          color: ${props => props.homeTeamColor.light};
-        }
-        &.away {
-          border-bottom: 2px solid ${props => props.awayTeamColor.light};
-          color: ${props => props.awayTeamColor.light};
-        }
-      }
-
-      ${props =>
-        props.isApp &&
-        `
-          @media (prefers-color-scheme: dark) {
-            border-bottom: 2px solid ${darkBackgroundColor};
-            color: ${darkTextColor};
-            &.active {
-              &.home {
-                border-bottom: 2px solid ${props.homeTeamColor.dark};
-                color: ${props.homeTeamColor.dark};
-              }
-              &.away {
-                border-bottom: 2px solid ${props.awayTeamColor.dark};
-                color: ${props.awayTeamColor.dark};
-              }
-            }
-          }
-        `};
-    }
-  }
-
-  .home-widget-container {
-    visibility: ${props =>
-      props.activeTeam === 'home' ? 'visible' : 'hidden'};
-    height: ${props => (props.activeTeam === 'home' ? 'auto' : '0')};
-  }
-
-  .away-widget-container {
-    visibility: ${props =>
-      props.activeTeam === 'away' ? 'visible' : 'hidden'};
-    height: ${props => (props.activeTeam === 'away' ? 'auto' : '0')};
-  }
-`;