|
After Width: | Height: | Size: 7.4 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 6.5 KiB |
@ -0,0 +1,12 @@ |
||||
<?xml version="1.0" encoding="utf-8"?> |
||||
<browserconfig> |
||||
<msapplication> |
||||
<tile> |
||||
<square70x70logo src="/mstile-70x70.png"/> |
||||
<square144x144logo src="/mstile-144x144.png"/> |
||||
<square150x150logo src="/mstile-150x150.png"/> |
||||
<square310x310logo src="/mstile-310x310.png"/> |
||||
<TileColor>#da532c</TileColor> |
||||
</tile> |
||||
</msapplication> |
||||
</browserconfig> |
||||
|
After Width: | Height: | Size: 477 B |
|
After Width: | Height: | Size: 982 B |
|
After Width: | Height: | Size: 15 KiB |
@ -0,0 +1,19 @@ |
||||
{ |
||||
"name": "", |
||||
"short_name": "", |
||||
"icons": [ |
||||
{ |
||||
"src": "/android-chrome-192x192.png", |
||||
"sizes": "192x192", |
||||
"type": "image/png" |
||||
}, |
||||
{ |
||||
"src": "/android-chrome-512x512.png", |
||||
"sizes": "512x512", |
||||
"type": "image/png" |
||||
} |
||||
], |
||||
"theme_color": "#ffffff", |
||||
"background_color": "#ffffff", |
||||
"display": "standalone" |
||||
} |
||||
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 5.6 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 6.7 KiB |
|
After Width: | Height: | Size: 1.4 MiB |
@ -1,57 +0,0 @@ |
||||
import { css } from 'styled-components/macro' |
||||
|
||||
import { |
||||
ClientConfig, |
||||
ClientIds, |
||||
ClientNames, |
||||
} from './types' |
||||
|
||||
const randomHash = () => ( |
||||
(Math.random() ** Math.random()) * 9999999999999999 |
||||
) |
||||
|
||||
export const tunis: ClientConfig = { |
||||
auth: { |
||||
clientId: ClientIds.Tunis, |
||||
metaDataUrlParams: `?hash=${randomHash()}`, |
||||
}, |
||||
defaultLanguage: 'fr', |
||||
description: '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', |
||||
disabledPreferences: false, |
||||
name: ClientNames.Tunis, |
||||
privacyLink: '/privacy-policy-and-statement', |
||||
showSearch: false, |
||||
styles: { |
||||
background: '', |
||||
homePageHeader: css` |
||||
background: radial-gradient( |
||||
160.34% 257.27% at -7.45% 162.22%, |
||||
#2AB7AA 3.27%, |
||||
#02505C 43.69%, #0B2E4D 100%); |
||||
`,
|
||||
logo: 'tunis-logo.svg', |
||||
logoHeight: 6.3, |
||||
logoLeft: 1.1, |
||||
logoTop: 1.74, |
||||
logoWidth: 8.25, |
||||
matchLogoHeight: 3.4, |
||||
matchLogoTopMargin: 0.9, |
||||
matchLogoWidth: 4.5, |
||||
matchPageMobileHeaderLogo: css` |
||||
width: 35px; |
||||
height: 25px; |
||||
top: 2px; |
||||
`,
|
||||
mobileHeaderLogo: css` |
||||
width: 48px; |
||||
height: 37px; |
||||
`,
|
||||
userAccountLogo: css` |
||||
width: 4.56rem; |
||||
height: 3.488rem; |
||||
`,
|
||||
}, |
||||
termsLink: '/terms-and-conditions?client_id=facr-ott-web', |
||||
title: 'FACR.TV - The home of Czech football streaming', |
||||
userAccountLinksDisabled: true, |
||||
} |
||||
@ -0,0 +1,58 @@ |
||||
import { css } from 'styled-components/macro' |
||||
|
||||
import { |
||||
ClientConfig, |
||||
ClientIds, |
||||
ClientNames, |
||||
} from './types' |
||||
|
||||
const randomHash = () => ( |
||||
(Math.random() ** Math.random()) * 9999999999999999 |
||||
) |
||||
|
||||
export const tunisia: ClientConfig = { |
||||
auth: { |
||||
clientId: ClientIds.Tunisia, |
||||
metaDataUrlParams: `?hash=${randomHash()}`, |
||||
}, |
||||
defaultLanguage: 'fr', |
||||
description: '', |
||||
disabledFilters: true, |
||||
disabledHighlights: true, |
||||
disabledPreferences: true, |
||||
name: ClientNames.Tunisia, |
||||
privacyLink: '/privacy-policy-and-statement?client_id=insports-ott-web', |
||||
showSearch: true, |
||||
styles: { |
||||
background: '', |
||||
homePageHeader: css` |
||||
background: radial-gradient( |
||||
160.34% 257.27% at -7.45% 162.22%, |
||||
#2AB7AA 3.27%, |
||||
#02505C 43.69%, #0B2E4D 100%); |
||||
`,
|
||||
logo: 'tunis-logo.svg', |
||||
logoHeight: 1.922, |
||||
logoLeft: 1.1, |
||||
logoTop: 1.74, |
||||
logoWidth: 9, |
||||
matchLogoHeight: 1.922, |
||||
matchLogoTopMargin: 1, |
||||
matchLogoWidth: 9, |
||||
matchPageMobileHeaderLogo: css` |
||||
width: 100px; |
||||
height: 21px; |
||||
top: 5px; |
||||
`,
|
||||
mobileHeaderLogo: css` |
||||
width: 100px; |
||||
height: 21px; |
||||
`,
|
||||
userAccountLogo: css` |
||||
width: 9rem; |
||||
height: 1.922rem; |
||||
`,
|
||||
}, |
||||
termsLink: '/terms-and-conditions?client_id=insports-ott-web', |
||||
title: 'Diwan Sport - The home of Tunisian Ligue Professionnelle 1', |
||||
} |
||||
@ -0,0 +1,22 @@ |
||||
import { ClientNames } from './clients/types' |
||||
|
||||
export enum PaymentSystem { |
||||
PagBrazil = 'pag_brasil', |
||||
Paymee = 'paymee', |
||||
Paytm = 'paytm', |
||||
Stripe = 'stripe' |
||||
} |
||||
|
||||
type PaymentsType = { |
||||
[key in ClientNames]: PaymentSystem |
||||
} |
||||
|
||||
export const payments: PaymentsType = { |
||||
[ClientNames.Tunisia]: PaymentSystem.Paymee, |
||||
brasil: PaymentSystem.PagBrazil, |
||||
[ClientNames.India]: PaymentSystem.Paytm, |
||||
[ClientNames.Insports]: PaymentSystem.Stripe, |
||||
[ClientNames.Instat]: PaymentSystem.Stripe, |
||||
[ClientNames.Facr]: PaymentSystem.Stripe, |
||||
[ClientNames.Lff]: PaymentSystem.Stripe, |
||||
} |
||||
@ -1,101 +0,0 @@ |
||||
import { |
||||
useEffect, |
||||
useState, |
||||
MouseEvent, |
||||
} from 'react' |
||||
|
||||
import { useHistory } from 'react-router-dom' |
||||
|
||||
import { ProfileTypes } from 'config' |
||||
|
||||
import isNumber from 'lodash/isNumber' |
||||
|
||||
import { useLexicsStore } from 'features/LexicsStore' |
||||
import { useBuyMatchPopupStore } from 'features/BuyMatchPopup/store' |
||||
import { getProfileUrl } from 'features/ProfileLink/helpers' |
||||
|
||||
import { getMatchInfo } from 'requests/getMatchInfo' |
||||
import { getBrazilPaymentUrl } from 'requests/getBrazilPaymentUrl' |
||||
|
||||
import type { Props } from './index' |
||||
|
||||
type ResponsePayment = { |
||||
url: string, |
||||
} |
||||
|
||||
type ResponsePaymentArray = ResponsePayment | null |
||||
|
||||
export const useBrazilPayment = ({ |
||||
match, |
||||
open, |
||||
selectedPackage, |
||||
setIsOpenBrasilian, |
||||
}: Props) => { |
||||
const history = useHistory() |
||||
const { close } = useBuyMatchPopupStore() |
||||
|
||||
const [src, setSrc] = useState('') |
||||
const [error, setError] = useState('') |
||||
const { translate } = useLexicsStore() |
||||
|
||||
const { id, sportType } = match |
||||
|
||||
const { |
||||
name, |
||||
nameLexic, |
||||
originalObject, |
||||
pass, |
||||
} = selectedPackage |
||||
|
||||
const teams = isNumber(nameLexic) ? translate(String(nameLexic)) : name |
||||
const pack = translate(String(pass)) |
||||
|
||||
const matchLink = getProfileUrl({ |
||||
id, |
||||
profileType: ProfileTypes.MATCHES, |
||||
sportType, |
||||
}) |
||||
|
||||
const closePopup = async (e?: MouseEvent) => { |
||||
e?.stopPropagation() |
||||
setIsOpenBrasilian(false) |
||||
setError('') |
||||
|
||||
const accessMatch = await getMatchInfo(sportType, id) |
||||
if (accessMatch?.access) { |
||||
close() |
||||
history.push(matchLink) |
||||
} |
||||
} |
||||
|
||||
// eslint-disable-next-line
|
||||
window.onmessage = function (event) { |
||||
if (event.data === 'close') { |
||||
closePopup() |
||||
} |
||||
} |
||||
useEffect(() => { |
||||
if (open) { |
||||
(async () => { |
||||
try { |
||||
const json: ResponsePaymentArray = await getBrazilPaymentUrl({ |
||||
action: pass === 'pass_match_access' ? 'one_payment' : 'create_subscription', |
||||
item: originalObject, |
||||
product_name: `${pack} ${teams}`, |
||||
}) |
||||
setSrc(json?.url || '') |
||||
} catch (err) { |
||||
setError('error_payment_unsuccessful') |
||||
} |
||||
})() |
||||
} |
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [selectedPackage, open]) |
||||
|
||||
return { |
||||
closePopup, |
||||
error, |
||||
matchLink, |
||||
src, |
||||
} |
||||
} |
||||
@ -0,0 +1,173 @@ |
||||
import { |
||||
MouseEvent, |
||||
useCallback, |
||||
useEffect, |
||||
useState, |
||||
} from 'react' |
||||
|
||||
import { PAGES, ProfileTypes } from 'config' |
||||
import { ClientNames } from 'config/clients/types' |
||||
import { payments, PaymentSystem } from 'config/payments' |
||||
|
||||
import isNumber from 'lodash/isNumber' |
||||
|
||||
import { useLexicsStore } from 'features/LexicsStore' |
||||
import { useBuyMatchPopupStore } from 'features/BuyMatchPopup/store' |
||||
import { getProfileUrl } from 'features/ProfileLink/helpers' |
||||
|
||||
import { getMatchInfo } from 'requests/getMatchInfo' |
||||
import { getPaymentUrl } from 'requests/getPaymentUrl' |
||||
|
||||
import { redirectToUrl } from 'helpers' |
||||
|
||||
import type { Props } from './index' |
||||
|
||||
type ResponsePayment = { |
||||
url: string, |
||||
} |
||||
|
||||
type ResponsePaymentArray = ResponsePayment | null |
||||
|
||||
export const useIframePayment = ({ |
||||
match, |
||||
open, |
||||
paymentSystem, |
||||
selectedPackage, |
||||
setIsOpenIframe, |
||||
}: Props) => { |
||||
const { close } = useBuyMatchPopupStore() |
||||
|
||||
const [src, setSrc] = useState('') |
||||
const [error, setError] = useState('') |
||||
const [isPaymentProcessing, setIsPaymentProcessing] = useState(false) |
||||
const { translate } = useLexicsStore() |
||||
|
||||
const { id, sportType } = match |
||||
|
||||
const { |
||||
name, |
||||
nameLexic, |
||||
originalObject, |
||||
pass, |
||||
} = selectedPackage |
||||
|
||||
const teams = isNumber(nameLexic) ? translate(String(nameLexic)) : name |
||||
const pack = translate(String(pass)) |
||||
|
||||
const matchLink = getProfileUrl({ |
||||
id, |
||||
profileType: ProfileTypes.MATCHES, |
||||
sportType, |
||||
}) |
||||
|
||||
const closePopup = useCallback(async (e?: MouseEvent) => { |
||||
e?.stopPropagation() |
||||
|
||||
if (error) { |
||||
setIsOpenIframe(false) |
||||
setError('') |
||||
} |
||||
|
||||
const accessMatch = await getMatchInfo(sportType, id) |
||||
if (accessMatch?.access) { |
||||
setIsPaymentProcessing(false) |
||||
setIsOpenIframe(false) |
||||
setError('') |
||||
close() |
||||
redirectToUrl(matchLink) |
||||
} |
||||
}, [close, error, id, matchLink, setIsOpenIframe, sportType]) |
||||
|
||||
const paymentRequest = async () => { |
||||
let url_cancel |
||||
let url_return |
||||
let action: Parameters<typeof getPaymentUrl>[0]['action'] |
||||
|
||||
switch (paymentSystem) { |
||||
case PaymentSystem.Paymee: |
||||
url_cancel = `${window.origin}/failed-paymee` |
||||
url_return = null |
||||
// paymee не умеет работать с подписками
|
||||
action = 'one_payment' |
||||
break |
||||
default: |
||||
url_return = `${window.location.origin}${PAGES.thanksForSubscribe}` |
||||
action = pass === 'pass_match_access' ? 'one_payment' : 'create_subscription' |
||||
break |
||||
} |
||||
|
||||
const payment: ResponsePaymentArray = await getPaymentUrl({ |
||||
action, |
||||
item: originalObject, |
||||
product_name: `${pack} ${teams}`, |
||||
service: paymentSystem, |
||||
url_cancel, |
||||
url_return, |
||||
}) |
||||
setSrc(payment?.url || '') |
||||
} |
||||
|
||||
if (paymentSystem === payments[ClientNames.Brasil]) { |
||||
// eslint-disable-next-line
|
||||
window.onmessage = function (event) { |
||||
if (event.data === 'close') { |
||||
closePopup() |
||||
} |
||||
} |
||||
} |
||||
|
||||
useEffect(() => { |
||||
let interval: ReturnType<typeof setInterval> |
||||
let timeout: ReturnType<typeof setTimeout> |
||||
|
||||
const paymentCallback = (event: MessageEvent<{ event_id: string }>) => { |
||||
if (event.data.event_id === 'paymee.complete') { |
||||
setIsPaymentProcessing(true) |
||||
interval = setInterval(() => closePopup(), 2000) |
||||
timeout = setTimeout(() => { |
||||
clearInterval(interval) |
||||
setIsPaymentProcessing(false) |
||||
setError('failed_paymee') |
||||
setSrc('') |
||||
}, 60000) |
||||
} |
||||
} |
||||
if (paymentSystem === payments[ClientNames.Tunisia]) { |
||||
window.addEventListener( |
||||
'message', |
||||
paymentCallback, |
||||
false, |
||||
) |
||||
} |
||||
return () => { |
||||
window.removeEventListener( |
||||
'message', |
||||
paymentCallback, |
||||
false, |
||||
) |
||||
clearInterval(interval) |
||||
clearTimeout(timeout) |
||||
} |
||||
}, [closePopup, paymentSystem]) |
||||
|
||||
useEffect(() => { |
||||
if (open) { |
||||
(async () => { |
||||
try { |
||||
await paymentRequest() |
||||
} catch (err) { |
||||
setError('error_payment_unsuccessful') |
||||
} |
||||
})() |
||||
} |
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [selectedPackage, open]) |
||||
|
||||
return { |
||||
closePopup, |
||||
error, |
||||
isPaymentProcessing, |
||||
matchLink, |
||||
src, |
||||
} |
||||
} |
||||
@ -0,0 +1,3 @@ |
||||
import format from 'date-fns/format' |
||||
|
||||
export const getCurrentYear = () => format(new Date(), 'Y') |
||||
@ -0,0 +1,33 @@ |
||||
import type { Match } from 'features/BuyMatchPopup/types' |
||||
|
||||
import { checkUrlParams, getAllUrlParams } from '../parseUrlParams/parseUrlParams' |
||||
import { getMatchInfo, MatchInfo } from '../../requests' |
||||
import { prepareMatchProfile } from '../../features/MatchPage/helpers/prepareMatchProfile' |
||||
|
||||
type openSubscribePopupType = { |
||||
matchConfig: { |
||||
matchId: number, |
||||
sportId: number, |
||||
}, |
||||
openBuyMatchPopup: (matchProfile: Match) => void, |
||||
} |
||||
|
||||
// TODO переделать потом на открытие без запроса матча
|
||||
export const openSubscribePopup = ({ |
||||
matchConfig, |
||||
openBuyMatchPopup, |
||||
}: openSubscribePopupType) => { |
||||
if (isSubscribePopup()) { |
||||
getMatchInfo(matchConfig.sportId, matchConfig.matchId) |
||||
.then((match: MatchInfo) => { |
||||
const matchProfile = match && prepareMatchProfile({ |
||||
matchId: matchConfig.matchId, |
||||
profile: match, |
||||
sportType: matchConfig.sportId, |
||||
}) |
||||
matchProfile && openBuyMatchPopup(matchProfile) |
||||
}) |
||||
} |
||||
} |
||||
|
||||
export const isSubscribePopup = () => checkUrlParams('subscribe') && getAllUrlParams('id').length |
||||
@ -0,0 +1,78 @@ |
||||
import { Fragment } from 'react' |
||||
|
||||
import { isMobileDevice } from 'config' |
||||
import { joinMatchLexics } from 'config/lexics/joinMatch' |
||||
|
||||
import { T9n } from 'features/T9n' |
||||
import { useLexicsConfig } from 'features/LexicsStore' |
||||
|
||||
import { useAuthStore } from 'features/AuthStore' |
||||
|
||||
import { getCurrentYear } from 'helpers' |
||||
|
||||
import { |
||||
Wrapper, |
||||
TunisiaLogo, |
||||
HeaderWrapper, |
||||
Footer, |
||||
BlockWrapper, |
||||
MatchInfo, |
||||
LigueImgWrapper, |
||||
Season, |
||||
MainInfoTitle, |
||||
MainInfoButton, |
||||
MainInfoContainer, |
||||
MainInfoText, |
||||
FooterRights, |
||||
ClubsLogo, |
||||
InsportsLogo, |
||||
ScGradient, |
||||
LigueImg, |
||||
} from './styled' |
||||
|
||||
export const DiwanInsportsTv = () => { |
||||
useLexicsConfig(joinMatchLexics) |
||||
const { login } = useAuthStore() |
||||
|
||||
const currentYear = getCurrentYear() |
||||
|
||||
return ( |
||||
<Wrapper> |
||||
<HeaderWrapper> |
||||
<InsportsLogo /> |
||||
{isMobileDevice && <TunisiaLogo />} |
||||
</HeaderWrapper> |
||||
<MainInfoContainer> |
||||
<BlockWrapper> |
||||
<LigueImgWrapper> |
||||
<ScGradient /> |
||||
<LigueImg /> |
||||
</LigueImgWrapper> |
||||
<MatchInfo> |
||||
<Season> |
||||
<T9n t='diwan_season' /> |
||||
</Season> |
||||
<MainInfoTitle> |
||||
<T9n t='diwan_title' /> |
||||
</MainInfoTitle> |
||||
<MainInfoText> |
||||
<T9n t='diwan_desc' /> |
||||
</MainInfoText> |
||||
<MainInfoButton onClick={login}> |
||||
<T9n t='diwan_join' /> |
||||
</MainInfoButton> |
||||
{!isMobileDevice && ( |
||||
<Fragment> |
||||
<TunisiaLogo /> |
||||
<ClubsLogo /> |
||||
</Fragment> |
||||
)} |
||||
</MatchInfo> |
||||
</BlockWrapper> |
||||
</MainInfoContainer> |
||||
<Footer> |
||||
<FooterRights>©inSports.tv {currentYear}</FooterRights> |
||||
</Footer> |
||||
</Wrapper> |
||||
) |
||||
} |
||||
@ -0,0 +1,301 @@ |
||||
import styled, { css } from 'styled-components/macro' |
||||
|
||||
import { devices, isMobileDevice } from 'config' |
||||
|
||||
import { ButtonSolid } from 'features/Common' |
||||
|
||||
export const Wrapper = styled.div` |
||||
width: 100vw; |
||||
height: 100vh; |
||||
color: white; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
${isMobileDevice |
||||
? css` |
||||
height: 100%; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const HeaderWrapper = styled.div` |
||||
padding: 20px 0; |
||||
padding-left: 20%; |
||||
width: 100%; |
||||
background: rgba(19, 21, 27, 0.7); |
||||
backdrop-filter: blur(20px); |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
@media ${devices.laptop} { |
||||
padding-left: 5%; |
||||
} |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
background: #000000; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const TunisiaLogo = styled.div` |
||||
background-image: url(/images/tunis-logo.svg); |
||||
background-size: contain; |
||||
background-repeat: no-repeat; |
||||
width: 229px; |
||||
height: 49px; |
||||
margin-bottom: 50px; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
width: 66px; |
||||
height: 14px; |
||||
margin-bottom: 0; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const InsportsLogo = styled.div` |
||||
background-image: url(/images/insports-logo.svg); |
||||
background-size: contain; |
||||
background-repeat: no-repeat; |
||||
width: 80px; |
||||
height: 25px; |
||||
margin-right: 25px; |
||||
position: relative; |
||||
|
||||
|
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
width: 57px; |
||||
height: 18px; |
||||
|
||||
::after { |
||||
content: ''; |
||||
position: absolute; |
||||
width: 0.5px; |
||||
height: 25px; |
||||
background: #FFFFFF; |
||||
right: -13px; |
||||
top: -3px; |
||||
opacity: 0.6; |
||||
} |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const ClubsLogo = styled.div` |
||||
background-image: url(/images/tunis_clubs.svg); |
||||
background-size: contain; |
||||
background-repeat: no-repeat; |
||||
width: 408px; |
||||
height: 86px; |
||||
` |
||||
|
||||
export const MainInfoContainer = styled.div` |
||||
${isMobileDevice |
||||
? css` |
||||
margin-top: 50px; |
||||
height: 100%; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const BlockWrapper = styled.div` |
||||
height: 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
padding-left: 20%; |
||||
width: 100%; |
||||
position: relative; |
||||
|
||||
@media ${devices.laptop} { |
||||
padding-left: 5%; |
||||
} |
||||
@media ${devices.mobile} { |
||||
padding-left: 5.4rem; |
||||
} |
||||
${isMobileDevice |
||||
? css` |
||||
flex-direction: column; |
||||
padding: 5.4rem; |
||||
@media screen and (orientation: landscape){ |
||||
padding-top: 20px; |
||||
height: auto; |
||||
} |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const ScGradient = styled.div` |
||||
content: ''; |
||||
position: absolute; |
||||
width: 620px; |
||||
height: 310px; |
||||
border-radius: 50%; |
||||
background: rgba(29, 185, 171, 0.4); |
||||
opacity: 0.7; |
||||
filter: blur(104.135px); |
||||
top: 30%; |
||||
left: 25px; |
||||
z-index: 1; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
filter: blur(50.135px); |
||||
border-radius: 40%; |
||||
width: 349px; |
||||
height: 210px; |
||||
left: -35px; |
||||
top: -71px; |
||||
` |
||||
: ''}; |
||||
|
||||
` |
||||
|
||||
export const LigueImg = styled.div` |
||||
background-image: url(/images/landing_${() => ( |
||||
isMobileDevice |
||||
? 'mobile_ligue_1.png' |
||||
: 'ligue_1.png' |
||||
)}); |
||||
background-repeat: no-repeat; |
||||
background-position: center; |
||||
background-size: contain; |
||||
width: 670px; |
||||
height: 156px; |
||||
z-index: 2; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
width: 288px; |
||||
height: 66px; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const LigueImgWrapper = styled.div` |
||||
display: flex; |
||||
align-items: center; |
||||
height: 80%; |
||||
margin-right: 5%; |
||||
position: relative; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
margin-right: 0; |
||||
margin-bottom: 83px; |
||||
@media screen and (orientation: landscape){ |
||||
display: block; |
||||
height: 100%; |
||||
width: 70%; |
||||
} |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const MatchInfo = styled.div` |
||||
margin-bottom: 60px; |
||||
max-width: 670px; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
width: 100%; |
||||
height: 100%; |
||||
@media screen and (orientation: landscape){ |
||||
padding-top: 0; |
||||
} |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const Season = styled.div` |
||||
text-transform: uppercase; |
||||
background-color: rgba(0,0,0,0.4); |
||||
padding: 8px 25px; |
||||
color: #B9B9B9; |
||||
border-radius: 5px; |
||||
font-size: 13px; |
||||
font-weight: 600; |
||||
display: inline-flex; |
||||
margin-bottom: 50px; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
margin-bottom: 15px; |
||||
padding: 0.7em 2.5rem; |
||||
font-size: 10px; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const MainInfoTitle = styled.div` |
||||
font-weight: 600; |
||||
font-size: 2rem; |
||||
${isMobileDevice |
||||
? css` |
||||
font-size: 24px; |
||||
margin-bottom: 25px; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const MainInfoButton = styled(ButtonSolid)` |
||||
width: auto; |
||||
height: 70px; |
||||
font-size: 24px; |
||||
font-weight: 600; |
||||
border-radius: 5px; |
||||
margin-bottom: 50px; |
||||
|
||||
${isMobileDevice |
||||
? css` |
||||
width: 100%; |
||||
font-size: 17px; |
||||
margin-bottom: 30px; |
||||
height: 40px; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const MainInfoText = styled.div` |
||||
margin: 40px 0; |
||||
font-size: 17px; |
||||
line-height: 150%; |
||||
${isMobileDevice |
||||
? css` |
||||
font-size: 12px; |
||||
margin: 0 0 25px; |
||||
letter-spacing: 0.1px; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const Footer = styled.div` |
||||
font-size: 14px; |
||||
background-color: black; |
||||
padding: 16px 0; |
||||
padding-left: 20%; |
||||
width: 100%; |
||||
@media ${devices.laptop} { |
||||
padding-left: 5%; |
||||
} |
||||
@media ${devices.mobile} { |
||||
padding-left: 35px; |
||||
} |
||||
${isMobileDevice |
||||
? css` |
||||
display: none; |
||||
` |
||||
: ''}; |
||||
` |
||||
|
||||
export const FooterRights = styled.div` |
||||
opacity: .5; |
||||
${isMobileDevice |
||||
? css` |
||||
font-size: 12px; |
||||
` |
||||
: ''}; |
||||
` |
||||
@ -0,0 +1,17 @@ |
||||
import { T9n } from 'features/T9n' |
||||
|
||||
import { FailedPaymeeWrapper } from './styled' |
||||
|
||||
// эта страница рассчитана на открытие во фрейме
|
||||
// при неудачной оплате paymee
|
||||
const FailedPaymeePage = () => { |
||||
const iframeZendesk = document.querySelector('#launcher') as HTMLElement |
||||
if (iframeZendesk) iframeZendesk.style.display = 'none' |
||||
|
||||
return ( |
||||
<FailedPaymeeWrapper> |
||||
<T9n t='failed_paymee' /> |
||||
</FailedPaymeeWrapper> |
||||
) |
||||
} |
||||
export default FailedPaymeePage |
||||
@ -0,0 +1,11 @@ |
||||
import styled from 'styled-components/macro' |
||||
|
||||
export const FailedPaymeeWrapper = styled.div` |
||||
color: #FFFFFF; |
||||
width: 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
font-size: 22px; |
||||
text-align: center; |
||||
` |
||||
Loading…
Reference in new issue