undo some changes from my swap page refresh
This commit is contained in:
parent
2c69636a8a
commit
f6304e2910
|
@ -195,7 +195,11 @@ const SwapForm = () => {
|
||||||
: tokenMax.lt(amountIn)
|
: tokenMax.lt(amountIn)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ContentBox hidePadding showBackground className="relative overflow-hidden">
|
<ContentBox
|
||||||
|
hidePadding
|
||||||
|
showBackground
|
||||||
|
className="relative overflow-hidden rounded md:rounded-none"
|
||||||
|
>
|
||||||
<div className="p-6">
|
<div className="p-6">
|
||||||
<Transition
|
<Transition
|
||||||
className="thin-scroll absolute top-0 left-0 z-20 h-full w-full overflow-auto bg-th-bkg-2 p-6 pb-0"
|
className="thin-scroll absolute top-0 left-0 z-20 h-full w-full overflow-auto bg-th-bkg-2 p-6 pb-0"
|
||||||
|
|
|
@ -228,7 +228,7 @@ const SwapTokenChart: FunctionComponent<SwapTokenChartProps> = ({
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ContentBox hideBorder className="h-full">
|
<ContentBox hideBorder hidePadding className="h-full p-0 md:p-6">
|
||||||
{loadChartData ? (
|
{loadChartData ? (
|
||||||
<>
|
<>
|
||||||
<SheenLoader className="w-[148px] rounded-md">
|
<SheenLoader className="w-[148px] rounded-md">
|
||||||
|
@ -317,13 +317,13 @@ const SwapTokenChart: FunctionComponent<SwapTokenChartProps> = ({
|
||||||
onChange={(v) => setDaysToShow(v)}
|
onChange={(v) => setDaysToShow(v)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="mt-4 h-full md:-mx-5">
|
<div className="h-full md:-mx-2 md:mt-4">
|
||||||
<ResponsiveContainer>
|
<ResponsiveContainer>
|
||||||
<AreaChart
|
<AreaChart
|
||||||
data={chartData}
|
data={chartData}
|
||||||
onMouseMove={handleMouseMove}
|
onMouseMove={handleMouseMove}
|
||||||
onMouseLeave={handleMouseLeave}
|
onMouseLeave={handleMouseLeave}
|
||||||
margin={{ top: 0, right: 0, bottom: 0, left: 0 }}
|
// margin={{ top: 0, right: 0, bottom: 0, left: 0 }}
|
||||||
>
|
>
|
||||||
<Tooltip
|
<Tooltip
|
||||||
cursor={{
|
cursor={{
|
||||||
|
|
|
@ -15,10 +15,10 @@ const TradeSimplePage = () => {
|
||||||
outputTokenId={outputTokenInfo?.extensions?.coingeckoId}
|
outputTokenId={outputTokenInfo?.extensions?.coingeckoId}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-12 space-y-6 border-th-bkg-3 md:col-span-6 md:border-b lg:col-span-4">
|
<div className="col-span-12 mt-2 space-y-6 border-th-bkg-3 md:col-span-6 md:mt-0 md:border-b lg:col-span-4">
|
||||||
<Swap />
|
<Swap />
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-12 p-6">
|
<div className="col-span-12 p-2 pt-8 md:p-6">
|
||||||
<AccountTabs />
|
<AccountTabs />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -100,7 +100,7 @@ export const ConnectWalletButton: React.FC = () => {
|
||||||
disabled={!group}
|
disabled={!group}
|
||||||
className={` text-white focus:outline-none disabled:cursor-wait disabled:opacity-25`}
|
className={` text-white focus:outline-none disabled:cursor-wait disabled:opacity-25`}
|
||||||
>
|
>
|
||||||
<div className="relative flex w-44 rounded bg-gradient-to-bl from-mango-theme-yellow to-mango-theme-red-dark py-2 before:absolute before:inset-0 before:bg-gradient-to-r before:from-transparent before:via-[rgba(255,255,255,0.25)] before:to-transparent before:opacity-0 hover:overflow-hidden hover:before:-translate-x-full hover:before:animate-[shimmer_0.75s_normal] hover:before:opacity-100">
|
<div className="relative flex h-16 w-44 bg-gradient-to-bl from-mango-theme-yellow to-mango-theme-red-dark py-2 before:absolute before:inset-0 before:bg-gradient-to-r before:from-transparent before:via-[rgba(255,255,255,0.25)] before:to-transparent before:opacity-0 hover:overflow-hidden hover:before:-translate-x-full hover:before:animate-[shimmer_0.75s_normal] hover:before:opacity-100">
|
||||||
<div className="default-transition flex h-full flex-row items-center justify-center space-x-3 px-4">
|
<div className="default-transition flex h-full flex-row items-center justify-center space-x-3 px-4">
|
||||||
<div
|
<div
|
||||||
className={`flex h-[28px] w-[28px] items-center justify-center rounded-full ${
|
className={`flex h-[28px] w-[28px] items-center justify-center rounded-full ${
|
||||||
|
@ -118,7 +118,7 @@ export const ConnectWalletButton: React.FC = () => {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-left">
|
<div className="text-left">
|
||||||
<div className="mb-0.5 flex justify-center text-base font-bold leading-none">
|
<div className="mb-1.5 flex justify-center text-base font-bold leading-none">
|
||||||
{connecting ? <Loading className="h-4 w-4" /> : t('connect')}
|
{connecting ? <Loading className="h-4 w-4" /> : t('connect')}
|
||||||
</div>
|
</div>
|
||||||
{wallet?.adapter?.name && (
|
{wallet?.adapter?.name && (
|
||||||
|
|
|
@ -12,7 +12,7 @@ export async function getStaticProps({ locale }: { locale: string }) {
|
||||||
|
|
||||||
const Trade: NextPage = () => {
|
const Trade: NextPage = () => {
|
||||||
return (
|
return (
|
||||||
<div className="p-8 pb-20 md:p-0">
|
<div className="p-6 pb-20 md:p-0">
|
||||||
<TradeSimplePage />
|
<TradeSimplePage />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
|
@ -47,8 +47,8 @@ module.exports = {
|
||||||
red: { DEFAULT: '#CC2929', dark: '#AA2222', muted: '#571e20' },
|
red: { DEFAULT: '#CC2929', dark: '#AA2222', muted: '#571e20' },
|
||||||
green: { DEFAULT: '#5EBF4D', dark: '#4BA53B', muted: '#365D31' },
|
green: { DEFAULT: '#5EBF4D', dark: '#4BA53B', muted: '#365D31' },
|
||||||
orange: { DEFAULT: '#FF9C24' },
|
orange: { DEFAULT: '#FF9C24' },
|
||||||
'bkg-1': '#131316',
|
'bkg-1': '#101012',
|
||||||
'bkg-2': '#1D1D20',
|
'bkg-2': '#1B1B1F',
|
||||||
'bkg-3': '#27272B',
|
'bkg-3': '#27272B',
|
||||||
'bkg-4': '#38383D',
|
'bkg-4': '#38383D',
|
||||||
'fgd-1': '#D1D1D1',
|
'fgd-1': '#D1D1D1',
|
||||||
|
|
Loading…
Reference in New Issue