Skip to content

[TRAH] Arshad /TRAH-2618/ Dynamic leverage title component #12748

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jan 5, 2024
Merged

[TRAH] Arshad /TRAH-2618/ Dynamic leverage title component #12748

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
7c488a2
feat: Added DynamicLeverageTableColumnHeader Component to Trader's Hub
arshad-rao-deriv Jan 4, 2024
8c41b6f
feat: Added DynamicLeverageTitle Component to Trader's Hub
arshad-rao-deriv Jan 4, 2024
0e14529
refactor: removed unncessary types
arshad-rao-deriv Jan 5, 2024
2a0580a
Merge branch 'Arshad/TRAH-2617/DynamicLeverageTableColumnHeaderCompon…
arshad-rao-deriv Jan 5, 2024
ba3a130
fix: fixed styles and removed unnecessary types
arshad-rao-deriv Jan 5, 2024
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
16 changes: 16 additions & 0 deletions .../tradershub/src/features/cfd/screens/DynamicLeverage/DynamicLeverageTableColumnHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import React from 'react';
import { CaptionText, Text } from '@deriv/quill-design';

type TDynamicLeverageTableColumnHeader = {
subtitle: string;
title: string;
};

export const DynamicLeverageTableColumnHeader = ({ subtitle, title }: TDynamicLeverageTableColumnHeader) => (
<div className='flex flex-col'>
<Text align='center' bold size='sm'>
{title}
</Text>
<CaptionText align='center'>{subtitle}</CaptionText>
</div>
);
19 changes: 19 additions & 0 deletions packages/tradershub/src/features/cfd/screens/DynamicLeverage/DynamicLeverageTitle.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import React from 'react';
import { Text } from '@deriv/quill-design';
import { StandaloneArrowLeftBoldIcon } from '@deriv/quill-icons';
import { useDynamicLeverageModalState } from '../../components/DynamicLeverageContext';

export const DynamicLeverageTitle = () => {
const { toggleDynamicLeverage } = useDynamicLeverageModalState();

return (
<div className='flex items-center border-b py-50 pr-800 pl-1200 gap-800 h-14 border-system-light-secondary-background '>
<StandaloneArrowLeftBoldIcon className='flex items-center cursor-pointer' onClick={toggleDynamicLeverage} />
<Text bold size='md'>
Get more out of Deriv MT5 Financial
</Text>
</div>
);
};

export default DynamicLeverageTitle;