Skip to content

Commit

Permalink
Merge pull request #102 from UniverseXYZ/feature/update-texts
Browse files Browse the repository at this point in the history 
updated texts
  • Loading branch information
@vikinatora
vikinatora authored Mar 25, 2022
2 parents c4bf576 + 75e770b commit 843f7fd
Show file tree
Hide file tree
Showing 22 changed files with 349 additions and 115 deletions.
7 changes: 4 additions & 3 deletions src/components/custom/badge/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,15 +4,16 @@ import cn from 'classnames';
import s from './s.module.scss';

type Props = {
children?: number;
children?: number | string;
className?: string;
variant?: 'primary';
};

const Badge: React.FC<Props> = ({ children, className, ...rest }) => {
const Badge: React.FC<Props> = ({ children, className, variant, ...rest }) => {
if (!children) return null;

return (
<div className={cn(s.badge, className)} {...rest}>
<div className={cn(s.badge, className, !!variant ? s[variant] : '')} {...rest}>
{children}
</div>
);
Expand Down
9 changes: 9 additions & 0 deletions src/components/custom/badge/s.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,3 +15,12 @@
color: var(--theme-red-color);
}
}

.primary {
background: var(--gradient-green);
color: #000;
font-size: 11px;
height: auto;
padding: 2px 4px;
width: auto;
}
5 changes: 5 additions & 0 deletions src/components/custom/icon/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -148,6 +148,11 @@ export type IconNames =
| 'polymorphs'
| 'lobby-lobsters'
| 'core-drops'
| 'minting'
| 'forum'
| 'signal'
| 'support'
| 'rarity-chart'
| 'static/add-token';

export type IconProps = {
Expand Down
2 changes: 1 addition & 1 deletion src/components/custom/typography/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import s from './s.module.scss';

export type TextProps = {
tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'p' | 'div' | 'span' | 'small' | 'strong';
type: 'h1' | 'h2' | 'h3' | 'p1' | 'p2' | 'lb1' | 'lb2' | 'small';
type: 'h1' | 'h2' | 'h3' | 'p1' | 'p2' | 'p3' | 'lb1' | 'lb2' | 'small';
weight?: '500' | 'semibold' | 'bold';
color?: 'primary' | 'secondary' | 'red' | 'green' | 'blue' | 'purple' | 'white' | string;
textGradient?: string;
Expand Down
5 changes: 5 additions & 0 deletions src/components/custom/typography/s.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,11 @@
line-height: calc(var(--font-size-p2) + 10px);
}

&.p3 {
font-size: var(--font-size-p3);
line-height: calc(var(--font-size-p3) + 10px);
}

&.lb1 {
font-size: var(--font-size-lb1);
letter-spacing: 0.04em;
Expand Down
95 changes: 70 additions & 25 deletions src/layout/components/layout-footer/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import AntdSpin from 'antd/lib/spin';
import cn from 'classnames';

import Tooltip from 'components/antd/tooltip';
import Badge from 'components/custom/badge';
import ExternalLink from 'components/custom/externalLink';
import Icon from 'components/custom/icon';
import { Text } from 'components/custom/typography';
Expand Down Expand Up @@ -40,9 +41,19 @@ const LayoutFooter: React.FC = () => {
<footer className={s.footer}>
<div className="container-limit">
<div className={s.row}>
<div className={s.logoWrap}>
<Link to="/" className={s.logoLink}>
<Icon name="png/universe" width="auto" height="auto" className={s.logo} />
<Icon name="universe-text" width="94" height="15" className={s.logoText} />
</Link>
<Text className={s.logoSubText} type="p3">
Launch your own community-driven NFT universe baked with social tools, media services, and distribution -
underpinned by the native $XYZ token.
</Text>
</div>
<div className={s.subscribeBlock}>
<Text type="p1" weight="bold" color="white" font="secondary">
Stay up to date with our newsletter
Stay Up to Date With Our Newsletter
</Text>
<form className={s.subscribeWrap} onSubmit={handlerSubscribe}>
<input
Expand All @@ -63,7 +74,7 @@ const LayoutFooter: React.FC = () => {
</div>
<div className={s.sBlock}>
<Text type="p1" weight="bold" color="white" font="secondary">
Join the community
Join the Community
</Text>
<div className={s.sLinksWrap}>
<ExternalLink href="https://twitter.com/universe_xyz" className={s.sLink}>
Expand All @@ -87,29 +98,21 @@ const LayoutFooter: React.FC = () => {
</div>
</div>
<div className={cn(s.row, s.navWrap)}>
<div className={s.logoWrap}>
<Link to="/" className={s.logoLink}>
<Icon name="png/universe" width="auto" height="auto" className={s.logo} />
<Icon name="universe-text" width="94" height="15" className={s.logoText} />
</Link>
<Text type="p1" color="white">
Launch your own community-driven NFT universe baked with social tools, media services, and distribution -
underpinned by the native $XYZ token.
</Text>
</div>
<div className={s.navBlocksWrap}>
<nav className={s.navBlock}>
<Text type="p1" color="white" font="secondary" className={s.navTitle}>
<Text type="p3" color="white" font="secondary" weight="bold" className={s.navTitle}>
Products
</Text>
<ExternalLink href="https://universe.xyz/marketplace" className={s.link}>
<span className="mr-4">NFT marketplace</span>
<Badge variant="primary">BETA</Badge>
</ExternalLink>
<ExternalLink href="https://universe.xyz/minting" className={s.link}>
Minting
</ExternalLink>
<span className={s.link} aria-disabled="true">
<Tooltip title="Coming soon" placement="top" hint>
Auction house
</Tooltip>
</span>
<span className={s.link} aria-disabled="true">
<Tooltip title="Coming soon" placement="top" hint>
NFT marketplace
Auction House
</Tooltip>
</span>
<span className={s.link} aria-disabled="true">
Expand All @@ -119,7 +122,7 @@ const LayoutFooter: React.FC = () => {
</span>
</nav>
<nav className={s.navBlock}>
<Text type="p1" color="white" font="secondary" className={s.navTitle}>
<Text type="p3" color="white" font="secondary" weight="bold" className={s.navTitle}>
NFT Drops
</Text>
<ExternalLink href="https://universe.xyz/polymorphs" className={s.link}>
Expand All @@ -135,7 +138,18 @@ const LayoutFooter: React.FC = () => {
</span>
</nav>
<nav className={s.navBlock}>
<Text type="p1" color="white" font="secondary" className={s.navTitle}>
<Text type="p3" color="white" font="secondary" weight="bold" className={s.navTitle}>
Rarity charts
</Text>
<ExternalLink href="https://universe.xyz/polymorph-rarity" className={s.link}>
Polymorphs
</ExternalLink>
<ExternalLink href="https://rarity.tools/lobby-lobsters" className={s.link}>
Lobby Lobsters
</ExternalLink>
</nav>
<nav className={s.navBlock}>
<Text type="p3" color="white" font="secondary" weight="bold" className={s.navTitle}>
Info
</Text>
<ExternalLink href="https://universe.xyz/about" className={s.link}>
Expand All @@ -150,30 +164,61 @@ const LayoutFooter: React.FC = () => {
<ExternalLink href="https://docs.universe.xyz/" className={s.link}>
Docs
</ExternalLink>
<ExternalLink href="https://universe.freshdesk.com/support/home" className={s.link}>
Support
</ExternalLink>
</nav>
<nav className={s.navBlock}>
<Text type="p1" color="white" font="secondary" className={s.navTitle}>
<Text type="p3" color="white" font="secondary" weight="bold" className={s.navTitle}>
DAO
</Text>
<Link to="/governance" className={s.link}>
Governance
</Link>
<Link to="/yield-farming" className={s.link}>
Yield farming
Yield Farming
</Link>
<ExternalLink href="https://forum.universe.xyz/" className={s.link}>
Forum
</ExternalLink>
<ExternalLink href="https://signal.universe.xyz/" className={s.link}>
Signal
</ExternalLink>
</nav>
</div>
</div>
<div className={cn(s.row, s.copyrightsBlock)}>
<div className={s.copyrightLink}>Universe.xyz © {new Date().getFullYear()}. Open-sourced.</div>
<div className={s.copyrightLinks}>
<ExternalLink href={XYZ_MARKET_LINK} className={s.copyrightLink}>
SushiSwap USDC/XYZ market
SushiSwap USDC/XYZ Market
</ExternalLink>
<ExternalLink href={XYZ_MARKET_LIQUIDITY_LINK} className={s.copyrightLink}>
Add liquidity to SushiSwap USDC/XYZ pool
Add Liquidity to SushiSwap USDC/XYZ Pool
</ExternalLink>
</div>

<div className={s.sBlock}>
<div className={s.sLinksWrap}>
<ExternalLink href="https://twitter.com/universe_xyz" className={s.sLink}>
<Icon name="twitter" width="20" height="20" />
</ExternalLink>
<ExternalLink href="https://discord.com/invite/vau77wXCD3" className={s.sLink}>
<Icon name="discord" width="20" height="20" />
</ExternalLink>
<ExternalLink href="https://www.coingecko.com/en/coins/universe-xyz" className={s.sLink}>
<Icon name="coingecko" width="20" height="20" />
</ExternalLink>
<ExternalLink
href="https://www.youtube.com/channel/UCWt00md9T2b4iTsHWp_Fapw?sub_confirmation=1"
className={s.sLink}>
<Icon name="youtube" width="20" height="20" />
</ExternalLink>
<ExternalLink href="https://medium.com/universe-xyz" className={s.sLink}>
<Icon name="medium" width="20" height="20" />
</ExternalLink>
</div>
</div>
</div>
</div>
</footer>
Expand Down
Loading

0 comments on commit 843f7fd

Please sign in to comment.