You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.5 KiB
47 lines
1.5 KiB
import React from 'react'
|
|
import { text, number } from '@storybook/addon-knobs/react'
|
|
import ExchangeRateDisplay from './exchange-rate-display'
|
|
|
|
export default {
|
|
title: 'ExchangeRateDisplay',
|
|
}
|
|
|
|
export const Default = () => {
|
|
return (
|
|
<ExchangeRateDisplay
|
|
primaryTokenValue={text('primaryTokenValue', '2000000000000000000')}
|
|
primaryTokenDecimals={number('primaryTokenDecimals', 18)}
|
|
primaryTokenSymbol={text('primaryTokenSymbol', 'ETH')}
|
|
secondaryTokenValue={text('secondaryTokenValue', '200000000000000000')}
|
|
secondaryTokenDecimals={number('secondaryTokenDecimals', 18)}
|
|
secondaryTokenSymbol={text('secondaryTokenSymbol', 'ABC')}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export const WhiteOnBlue = () => {
|
|
return (
|
|
<div
|
|
style={{
|
|
width: '150px',
|
|
height: '30px',
|
|
borderRadius: '4px',
|
|
display: 'flex',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
background: 'linear-gradient(90deg, #037DD6 0%, #1098FC 101.32%)',
|
|
}}
|
|
>
|
|
<ExchangeRateDisplay
|
|
primaryTokenValue={text('primaryTokenValue', '2000000000000000000')}
|
|
primaryTokenDecimals={number('primaryTokenDecimals', 18)}
|
|
primaryTokenSymbol={text('primaryTokenSymbol', 'ETH')}
|
|
secondaryTokenValue={text('secondaryTokenValue', '200000000000000000')}
|
|
secondaryTokenDecimals={number('secondaryTokenDecimals', 18)}
|
|
secondaryTokenSymbol={text('secondaryTokenSymbol', 'ABC')}
|
|
className="exchange-rate-display--white"
|
|
arrowColor="white"
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|