Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 20, 2025. It is now read-only.

Kevin/update ib contents #1199

Merged
merged 27 commits into from
Jan 20, 2021
Merged

Kevin/update ib contents #1199

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
d7c186c
feat: update ib contents and styling v1
Nov 11, 2020
35fa754
feat: fix all desktop styling except border radius for faqs, update a…
Nov 11, 2020
be48dbd
fix: header style for faq (radius)
Nov 11, 2020
aa7e35c
feat: mobile responsiveness #1
Nov 12, 2020
05f5cc1
fix: mobile responsiveness #2
Nov 13, 2020
7ebdc63
fix: responsiveness #3
Nov 16, 2020
257e2fe
fix: deriv-ib new style
Nov 16, 2020
44f25e3
fix: image
Nov 16, 2020
8cf23d1
fix: rebase and minor style
Nov 17, 2020
e7dc600
fix: qa comments #1
liemcorn Nov 19, 2020
e3a024b
fix: margin
liemcorn Nov 19, 2020
4e1d623
fix: qa comments
liemcorn Nov 20, 2020
56d2d62
fix:qa comments
liemcorn Nov 20, 2020
ae3a546
fix: ios button problem
liemcorn Nov 23, 2020
9f48410
fix: major QA issues
liemcorn Nov 23, 2020
52f8023
fix: qa issues
liemcorn Nov 23, 2020
2322d85
fix: nav responsiveness
liemcorn Nov 23, 2020
40f5b78
fix: padding on other browser
liemcorn Nov 23, 2020
f110dea
fix: qa issuess
liemcorn Nov 25, 2020
b46cd22
fix: qa comments
liemcorn Nov 25, 2020
7592fee
fix:symbol dot issue
liemcorn Nov 25, 2020
a7106ae
update: language switcher on top header, minor alignment
liemcorn Nov 27, 2020
e6ec9ff
fix: login
liemcorn Dec 1, 2020
56d664b
ib-content:redeploy
liemcorn Dec 1, 2020
1f34099
fix: rest of comments
liemcorn Dec 7, 2020
fbef097
fix merge issue
liemcorn Dec 7, 2020
d21fc7e
update: fix header issues
virtualpowwa Jan 7, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 44 additions & 12 deletions src/components/custom/_dnumbers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,50 +2,82 @@ import React from 'react'
import styled from 'styled-components'
import PropTypes from 'prop-types'
import device from 'themes/device'
import { Container, SectionContainer } from 'components/containers'
import { Flex } from 'components/containers'
import { Header, Text } from 'components/elements'

const NumberWrapper = styled.div`
display: flex;
flex-direction: column;
justify-content: center;
width: 32.8rem;
width: 28.2rem;

${Text} {
padding-top: 0.8rem;
}

@media ${device.laptop} {
margin: 1.2rem 0;
width: 22rem;
}
@media ${device.tabletL} {
margin: 1.2rem 0;
width: unset;

${Header} {
font-size: 24px;
}
${Text} {
font-size: 16px;
}
}
`
const StyledContainer = styled(Container)`
display: flex;
width: 100%;

const DnumberContainer = styled(Flex)`
margin-top: 2.4rem;
margin-bottom: 2.4rem;
flex-direction: row;

@media ${device.tabletL} {
margin-bottom: 0;
flex-direction: column;
}
`

const DNumbers = ({ items, justify }) => {
const DnumberContent = styled(Flex)`
justify-content: space-between;
@media ${device.tabletL} {
justify-content: space-around;
}
`

const DNumbers = ({ items }) => {
return (
<SectionContainer padding="4rem">
<StyledContainer justify={justify || 'space-between'}>
{items.map((item, index) => (
<DnumberContainer padding="4rem">
<DnumberContent>
{items.slice(0, 2).map((item, index) => (
<NumberWrapper key={index}>
<Header as="h2" type="page-title" align="center">
{item.title}
</Header>
<Text align="center">{item.subtitle}</Text>
</NumberWrapper>
))}
</DnumberContent>
<DnumberContent>
{items.slice(2, 4).map((item, index) => (
<NumberWrapper key={index}>
<Header as="h2" type="page-title" align="center">
{item.title}
</Header>
<Text align="center">{item.subtitle}</Text>
</NumberWrapper>
))}
</StyledContainer>
</SectionContainer>
</DnumberContent>
</DnumberContainer>
)
}

DNumbers.propTypes = {
items: PropTypes.array,
justify: PropTypes.string,
}
export default DNumbers
5 changes: 2 additions & 3 deletions src/components/layout/footer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import PropTypes from 'prop-types'
import { Container, CssGrid, Flex, Show } from '../containers'
import { StyledLink, Text, QueryImage } from '../elements'
import { LocationContext } from './location-context'
import { mga_link_url } from 'common/utility'
import { mga_link_url, community_url } from 'common/utility'
// TODO: (discussion) make footer pure component, and move usage of footer to custom
import device from 'themes/device'
import { localize, Localize, LocalizedLink } from 'components/localization'
Expand Down Expand Up @@ -477,9 +477,8 @@ const Footer = ({ type }) => {
</LinkWrapper>
<LinkWrapper>
<Link
to=""
is_community_link
external="true"
to={community_url}
target="_blank"
rel="noopener noreferrer"
>
Expand Down
100 changes: 76 additions & 24 deletions src/components/layout/nav.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -684,12 +684,8 @@ const StyledNavCenter = styled(NavCenter)`
white-space: nowrap;

@media (max-width: 1300px) {
margin-left: 9.3rem;
font-size: 12px !important;
}
@media (max-width: 1080px) {
margin-left: 7.3rem;
}
`

const StyledNavRight = styled(NavRight)`
Expand Down Expand Up @@ -770,6 +766,19 @@ const NavLogoLink = styled(LogoLink)`
}
`

const LSContainer = styled(Container)`
text-align: right;
margin-right: 60px;
`

const DesktopLS = styled(Show.Desktop)`
z-index: 2;
`

const StyledContainer = styled(Container)`
margin: 0;
`

// Note: When using layout component for partners page, please add type='partners' and padding_top='10rem'
export const NavPartners = ({ no_login_signup }) => {
const nav_ref = useRef(null)
Expand All @@ -794,31 +803,61 @@ export const NavPartners = ({ no_login_signup }) => {
}
}, [])

const resources_ref = useRef(null)
const link_resources_ref = useRef(null)
const [is_resources_open, setIsResourcesOpen] = useState(false)
const [has_resources_animation, setHasResourcesAnimation] = useState(false)
const closeResources = () => setIsResourcesOpen(false)
useOutsideClick(resources_ref, closeResources, link_resources_ref)

const handleResourcesClick = () => {
setHasResourcesAnimation(true)
setIsResourcesOpen(!is_resources_open)
}

const [is_canvas_menu_open, openOffCanvasMenu, closeOffCanvasMenu] = moveOffCanvasMenu()
return (
<>
<NavWrapper ref={nav_ref}>
<CFDWarning />
<DerivHomeWrapper>
<HomeContainer justify="flex-start">
<HomeLink to="/">
<Text color="grey-19" size="var(--text-size-xxs)">
{localize('Deriv website')}
</Text>
</HomeLink>
<HomeLink to="/about">
<Text color="grey-19" size="var(--text-size-xxs)">
{localize('About us')}
</Text>
</HomeLink>
<HomeLink to="/contact-us">
<Text color="grey-19" size="var(--text-size-xxs)">
{localize('Contact us')}
</Text>
</HomeLink>
<HomeContainer justify="space-between">
<StyledContainer justify="flex-start">
<HomeLink to="/">
<Text color="grey-19" size="var(--text-size-xxs)">
{localize('Deriv website')}
</Text>
</HomeLink>
<HomeLink to="/about">
<Text color="grey-19" size="var(--text-size-xxs)">
{localize('About us')}
</Text>
</HomeLink>
<HomeLink to="/contact-us">
<Text color="grey-19" size="var(--text-size-xxs)">
{localize('Contact us')}
</Text>
</HomeLink>
</StyledContainer>
<DesktopLS>
<LSContainer>
<LanguageSwitcher short_name="true" />
</LSContainer>
</DesktopLS>
</HomeContainer>
</DerivHomeWrapper>
<StyledNav>
<PlatformsDropdown
forward_ref={resources_ref}
link_ref={link_resources_ref}
is_open={is_resources_open}
has_animation={has_resources_animation}
Content={() => <NavResources onClick={handleResourcesClick} />}
title={localize('Resources')}
description={localize(
'Help yourself to various resources that can help you get the best out of your trading experience.',
)}
/>
<StyledNavWrapper no_login_signup>
<NavLeft>
<NavLogoLink to="/partners/" aria-label={localize('Partners')}>
Expand All @@ -844,6 +883,15 @@ export const NavPartners = ({ no_login_signup }) => {
{localize('Payment agents')}
</StyledLink>
</NavLink>
<NavLink onClick={handleResourcesClick}>
<StyledButton
aria-label={localize('Resources')}
active={is_resources_open}
ref={link_resources_ref}
>
{localize('Resources')}
</StyledButton>
</NavLink>
</StyledNavCenter>
{!no_login_signup ? (
<StyledNavRight
Expand All @@ -852,14 +900,13 @@ export const NavPartners = ({ no_login_signup }) => {
mounted={mounted}
has_scrolled={has_scrolled}
>
<LanguageSwitcher short_name="true" is_high_nav />
<LinkButton
to={affiliate_signin_url}
external="true"
is_affiliate_sign_in_link
target="_blank"
primary
style={{ width: '14rem' }}
style={{ width: '16rem' }}
>
<span>{localize('Affiliate & IB log in')}</span>
</LinkButton>
Expand All @@ -870,7 +917,7 @@ export const NavPartners = ({ no_login_signup }) => {
target="_blank"
ref={button_ref}
secondary="true"
style={{ width: '14rem' }}
style={{ width: '18rem' }}
>
<span>{localize('Affiliate & IB sign up')}</span>
</LinkSignupButton>
Expand Down Expand Up @@ -918,7 +965,12 @@ export const NavPartners = ({ no_login_signup }) => {
target="_blank"
primary
>
<span>{localize('Affiliate & IB Log in')}</span>
<Show.Desktop>
<span>{localize('Affiliate & IB log in')}</span>
</Show.Desktop>
<Show.Mobile>
<span>{localize('Log in')}</span>
</Show.Mobile>
</LinkMobileLogin>
)}
</Flex>
Expand Down
Binary file modified src/images/common/marketing-material.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/images/common/partners-banner-mobile.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading