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.

Commit 70f068f

Browse files
konstantinosG-derivKonstantinos-Gk
konstantinosG-deriv
and
Konstantinos-Gk
authored
fix: subtasks (#4255)
Co-authored-by: Konstantinos-Gk <[email protected]>
1 parent 51eb5d7 commit 70f068f

File tree

6 files changed

+18
-11
lines changed

6 files changed

+18
-11
lines changed

‎src/components/containers/box.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const mediaqueries = Object.keys(size)
1818
export const generateResponsiveStyles = (stylesGenerator) => (props) => {
1919
return Object.keys(mediaqueries).reduce((rules, mq) => {
2020
if (!props[mq]) return rules
21-
const styles = mediaqueries[mq]`
21+
const styles = mediaqueries[mq]`
2222
${stylesGenerator(props[mq])}
2323
`
2424
return [...rules, styles]
@@ -95,6 +95,7 @@ export type BoxType = {
9595
background?: string
9696
bg?: string
9797
direction?: string
98+
gap?: string
9899
} & ResponseDeviceProps &
99100
BaseStyleType
100101

@@ -104,6 +105,7 @@ const Box = styled.div<BoxType & BaseStyleType>`
104105
min-height: ${(props) => (props.min_height ? props.min_height : '')};
105106
max-width: ${(props) => (props.max_width ? props.max_width : '')};
106107
position: ${(props) => (props.position ? props.position : '')};
108+
gap: ${(props) => (props.gap ? props.gap : '')};
107109
background: ${(props) => (props.background || props.bg ? props.background || props.bg : '')};
108110
${baseStyles}
109111
${responsiveStyles}

‎src/components/elements/full-width-multicolumn.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ type FullWidthMultiColumnProps = {
1515
button_title?: ReactElement
1616
button_text?: TString | ReactElement
1717
multiple_row?: boolean
18+
gap?: string
1819
}
1920

2021
const Item = styled(Flex)`
@@ -42,7 +43,7 @@ const ItemContainer = styled(Box)`
4243
flex-direction: row;
4344
max-width: 140.4rem;
4445
justify-content: center;
45-
gap: 50px;
46+
gap: ${(props) => props.gap || '40px'};
4647
4748
@media ${device.tabletL} {
4849
flex-direction: column;
@@ -144,6 +145,7 @@ export const FullWidthMultiColumn = ({
144145
multiple_row,
145146
button_title,
146147
button_text,
148+
gap,
147149
}: FullWidthMultiColumnProps) => {
148150
const handleSignup = useHandleSignup()
149151
const first_three_items = children.slice(0, 3)
@@ -166,7 +168,7 @@ export const FullWidthMultiColumn = ({
166168
{sub_header}
167169
</StyledSubHeader>
168170
{items.map((group, i) => (
169-
<ItemContainer max-width="48.6rem" width="100%" key={i}>
171+
<ItemContainer max-width="48.6rem" width="100%" key={i} gap={gap}>
170172
{group.map((child, idx) => {
171173
const { text, icon, item_title, link_text, link } = child.props
172174
return (

‎src/components/localization/localized-link.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ export const SharedLinkStyle = css<SharedLinkStyleProps>`
8989
export const SharedLinkStyleMarket = css<SharedLinkStyleProps>`
9090
color: var(--color-black-9);
9191
text-decoration: none;
92+
font-family: Ubuntu, sans-serif;
9293
padding: 0.5rem 1rem;
9394
transition: text-shadow 0.25s;
9495
position: relative;

‎src/pages/markets/components/markets/_forex.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,10 @@ const Forex = ({ simple_step_content }: ForexProps) => {
4343
// name="Forex"
4444
display_title={<Localize translate_text="Forex trades available on Deriv" />}
4545
/>
46-
<FullWidthMultiColumn header={<Localize translate_text="Why trade forex on Deriv" />}>
46+
<FullWidthMultiColumn
47+
gap="0"
48+
header={<Localize translate_text="Why trade forex on Deriv" />}
49+
>
4750
{(is_eu ? forex_content_eu : forex_content).map((content, index) => (
4851
<StyledBox
4952
key={index}

‎src/pages/markets/components/sections/_other-markets.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ type LearnMoreProps = {
4040
}
4141
const markets_type: MarketsType = {
4242
forex: {
43-
icon: () => <img src={Forex} alt="Forex" width="64" height="64" />,
43+
icon: () => <img src={Forex} alt="Forex" width="44" height="44" />,
4444
title: <Localize translate_text="Forex" />,
4545
content: (
4646
<Localize translate_text="Forex trading gives you the chance to profit from changes in the relative values of currencies on the forex market." />
@@ -52,7 +52,7 @@ const markets_type: MarketsType = {
5252
id: 'marketforexothermarkets',
5353
},
5454
derived: {
55-
icon: () => <img src={DerivedFX} alt="Synthetic indices" width="64" height="64" />,
55+
icon: () => <img src={DerivedFX} alt="Synthetic indices" width="44" height="44" />,
5656
title: <Localize translate_text="Derived" />,
5757
content: (
5858
<Localize translate_text="Derived trading gives you a chance to make a profit from correctly predicting the price movement of instruments that mimic characteristics of financial markets or are derived from them." />
@@ -64,7 +64,7 @@ const markets_type: MarketsType = {
6464
id: 'marketderivedothermarkets',
6565
},
6666
stock_indices: {
67-
icon: () => <img src={StockIndices} alt="Stocks & indices" width="64" height="64" />,
67+
icon: () => <img src={StockIndices} alt="Stocks & indices" width="44" height="44" />,
6868
title: <Localize translate_text="Stocks & indices" />,
6969
content: (
7070
<Localize translate_text="Stocks & indices trading allows you to profit from the price movements in a market without buying the underlying assets." />
@@ -77,7 +77,7 @@ const markets_type: MarketsType = {
7777
},
7878

7979
commodities: {
80-
icon: () => <img src={Commodities} alt="Commodities" width="64" height="64" />,
80+
icon: () => <img src={Commodities} alt="Commodities" width="44" height="44" />,
8181
title: <Localize translate_text="Commodities" />,
8282
content: (
8383
<Localize translate_text="Commodities trading on Deriv lets you profit from correctly predicting the market movement on precious metals and crude oil." />
@@ -90,7 +90,7 @@ const markets_type: MarketsType = {
9090
},
9191

9292
cryptocurrencies: {
93-
icon: () => <img src={Cryptocurrencies} alt="Cryptocurrencies" width="64" height="64" />,
93+
icon: () => <img src={Cryptocurrencies} alt="Cryptocurrencies" width="44" height="44" />,
9494
title: <Localize translate_text="Cryptocurrencies" />,
9595
content: (
9696
<Localize translate_text="Crypto trading gives you an opportunity to benefit from correctly predicting the price movements of cryptocurrencies without buying them." />
@@ -195,7 +195,7 @@ const Card = ({ market }: CardProps) => {
195195
onMouseLeave={() => setButtonVisibility('false')}
196196
>
197197
<div>
198-
<Icon dynamic_id={markets_type[market].id} width="64px" height="64px" />
198+
<Icon dynamic_id={markets_type[market].id} width="44px" height="44px" />
199199
</div>
200200

201201
<Text size="16px" weight="bold" mt="1.6rem">

‎src/pages/markets/static/style/_markets-style.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,6 @@ export const CrashText = styled(Text)`
7979
export const Descriptions = styled.div<DescriptionsProps>`
8080
margin-top: ${({ margin_top }) => margin_top ?? '0'};
8181
padding-bottom: 40px;
82-
border-bottom: 1px solid var(--color-grey-21);
8382
`
8483

8584
export const DetailsContainer = styled(Flex)`

0 commit comments

Comments
 (0)