chore(trading): referrals with sidebar (#5117)
This commit is contained in:
parent
f7a82d33ba
commit
546087fb9f
@ -8,22 +8,17 @@ export const LandingBanner = () => {
|
|||||||
<div className="">
|
<div className="">
|
||||||
<div
|
<div
|
||||||
aria-hidden
|
aria-hidden
|
||||||
className="absolute top-64 right-[220px] md:right-[340px] max-sm:hidden"
|
className="absolute top-20 right-[120px] md:right-[240px] max-sm:hidden"
|
||||||
>
|
>
|
||||||
<AnimatedDudeWithWire />
|
<AnimatedDudeWithWire />
|
||||||
</div>
|
</div>
|
||||||
<div className="pt-32 sm:w-[50%]">
|
<div className="pt-20 sm:w-[50%]">
|
||||||
<h1 className="text-6xl font-alpha calt mb-10">
|
<h1 className="text-6xl font-alpha calt mb-10">
|
||||||
{t('Earn commission & stake rewards')}
|
{t('Earn commission & stake rewards')}
|
||||||
</h1>
|
</h1>
|
||||||
<p className="text-lg mb-10">
|
<p className="text-lg mb-10">
|
||||||
{t(
|
{t(
|
||||||
'Invite friends and earn commission in the form of Vega rewards from the trading fees they pay. Stake those rewards to earn multipliers on future rewards.'
|
'Invite friends and earn rewards from the trading fees they pay. Stake those rewards to earn multipliers on future rewards.'
|
||||||
)}
|
|
||||||
</p>
|
|
||||||
<p className="text-lg">
|
|
||||||
{t(
|
|
||||||
'Any friends that join using the code will receive discounts off trading fees.'
|
|
||||||
)}
|
)}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
@ -2,6 +2,7 @@ import classNames from 'classnames';
|
|||||||
import type { HTMLAttributes } from 'react';
|
import type { HTMLAttributes } from 'react';
|
||||||
import { SKY_BACKGROUND } from './constants';
|
import { SKY_BACKGROUND } from './constants';
|
||||||
import { Outlet } from 'react-router-dom';
|
import { Outlet } from 'react-router-dom';
|
||||||
|
import { TinyScroll } from '@vegaprotocol/ui-toolkit';
|
||||||
|
|
||||||
export const Layout = ({
|
export const Layout = ({
|
||||||
className,
|
className,
|
||||||
@ -28,8 +29,10 @@ export const LayoutWithSky = ({
|
|||||||
...props
|
...props
|
||||||
}: HTMLAttributes<HTMLDivElement>) => {
|
}: HTMLAttributes<HTMLDivElement>) => {
|
||||||
return (
|
return (
|
||||||
<div className={classNames('h-full overflow-auto', SKY_BACKGROUND)}>
|
<TinyScroll
|
||||||
|
className={classNames('max-h-full overflow-auto', SKY_BACKGROUND)}
|
||||||
|
>
|
||||||
<Layout className={className} {...props} />
|
<Layout className={className} {...props} />
|
||||||
</div>
|
</TinyScroll>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -27,7 +27,7 @@ export const LayoutWithSidebar = ({
|
|||||||
<div className={gridClasses}>
|
<div className={gridClasses}>
|
||||||
<div className="col-span-full">{header}</div>
|
<div className="col-span-full">{header}</div>
|
||||||
<main
|
<main
|
||||||
className={classNames('col-start-1 col-end-1', {
|
className={classNames('col-start-1 col-end-1 overflow-hidden', {
|
||||||
'lg:col-end-3': !sidebarOpen,
|
'lg:col-end-3': !sidebarOpen,
|
||||||
'hidden lg:block lg:col-end-2': sidebarOpen,
|
'hidden lg:block lg:col-end-2': sidebarOpen,
|
||||||
})}
|
})}
|
||||||
|
@ -55,10 +55,14 @@ export const routerConfig: RouteObject[] = compact([
|
|||||||
FLAGS.REFERRALS
|
FLAGS.REFERRALS
|
||||||
? {
|
? {
|
||||||
path: AppRoutes.REFERRALS,
|
path: AppRoutes.REFERRALS,
|
||||||
element: <LayoutWithSky />,
|
element: <LayoutWithSidebar sidebar={<PortfolioSidebar />} />,
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
element: <Referrals />,
|
element: (
|
||||||
|
<LayoutWithSky>
|
||||||
|
<Referrals />
|
||||||
|
</LayoutWithSky>
|
||||||
|
),
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
index: true,
|
index: true,
|
||||||
|
Binary file not shown.
Before Width: | Height: | Size: 947 KiB After Width: | Height: | Size: 419 KiB |
Binary file not shown.
Before Width: | Height: | Size: 947 KiB After Width: | Height: | Size: 419 KiB |
Loading…
Reference in New Issue
Block a user