blockworks-foundation
/
mango-ui-v3
mirror of https://github.com/blockworks-foundation/mango-ui-v3.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

add padding to global notification component

This commit is contained in:
Tyler Shipe 2022-01-08 19:36:24 -05:00
parent 02eb70bbaf
commit 24d93d0d89
6 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/DayHighLow.tsx
View File

@ -18,7 +18,7 @@ const DayHighLow = ({ high, low, latest }) => {
{t('daily-range')}
</div>
<div className="flex items-center font-semibold">
<div className="pr-2 text-th-fgd-1 md:text-xs">
<div className="pr-2 text-th-fgd-2 md:text-xs">
{low ? formatUsdValue(low) : <MarketDataLoader />}
</div>
<div className="h-1.5 flex rounded bg-th-bkg-3 w-16 sm:w-20">
@ -29,7 +29,7 @@ const DayHighLow = ({ high, low, latest }) => {
className="flex rounded bg-th-primary"
></div>
</div>
<div className="pl-2 text-th-fgd-1 md:text-xs">
<div className="pl-2 text-th-fgd-2 md:text-xs">
{high ? formatUsdValue(high) : <MarketDataLoader />}
</div>
</div>

4
components/GlobalNotification.tsx
View File

@ -11,10 +11,10 @@ const GlobalNotification = () => {
if (show) {
return (
<div className="flex items-center bg-th-bkg-4 text-th-fgd-1">
<div className="w-full text-center py-1">
<div className="w-full text-center p-2.5">
<span>
The Solana network is currently experiencing degraded performance
resulting in some transactions timing out
resulting in some transactions timing out.
</span>
<a
href="https://status.solana.com"

2
components/Input.tsx
View File

@ -41,7 +41,7 @@ const Input = ({
onChange={onChange}
className={`${className} bg-th-bkg-1 pb-px px-2 flex-1 rounded-md h-10 text-th-fgd-1 w-full
border ${
error ? 'border-th-red' : 'border-th-fgd-4'
error ? 'border-th-red' : 'border-th-bkg-4'
} default-transition hover:border-th-primary
focus:border-th-primary focus:outline-none
${

10
components/MarketDetails.tsx
View File

@ -178,7 +178,7 @@ const MarketDetails = () => {
<div className="text-th-fgd-3 tiny-text pb-0.5">
{t('oracle-price')}
</div>
<div className="font-semibold text-th-fgd-1 md:text-xs">
<div className="font-semibold text-th-fgd-2 md:text-xs">
{oraclePrice && selectedMarket
? oraclePrice.toFixed(getDecimalCount(selectedMarket.tickSize))
: '--'}
@ -195,7 +195,7 @@ const MarketDetails = () => {
? `text-th-green`
: change < 0
? `text-th-red`
: `text-th-fgd-1`
: `text-th-fgd-2`
}`}
>
{change.toFixed(2) + '%'}
@ -209,7 +209,7 @@ const MarketDetails = () => {
<div className="text-th-fgd-3 tiny-text pb-0.5">
{t('daily-volume')}
</div>
<div className="font-semibold text-th-fgd-1 md:text-xs">
<div className="font-semibold text-th-fgd-2 md:text-xs">
{perpVolume ? (
usdFormatter(perpVolume, 0)
) : (
@ -224,7 +224,7 @@ const MarketDetails = () => {
<div className="text-th-fgd-3 tiny-text pb-0.5">
{t('average-funding')}
</div>
<div className="font-semibold text-th-fgd-1 md:text-xs">
<div className="font-semibold text-th-fgd-2 md:text-xs">
{selectedMarket ? (
`${funding1hStr}% (${fundingAprStr}% APR)`
) : (
@ -236,7 +236,7 @@ const MarketDetails = () => {
<div className="text-th-fgd-3 tiny-text pb-0.5">
{t('open-interest')}
</div>
<div className="font-semibold text-th-fgd-1 md:text-xs">
<div className="font-semibold text-th-fgd-2 md:text-xs">
{selectedMarket ? (
`${parseOpenInterest(
selectedMarket as PerpMarket

2
components/trade_form/TradeType.jsx
View File

@ -24,7 +24,7 @@ const TradeType = ({
{({ open }) => (
<>
<Listbox.Button
className={`font-normal w-full bg-th-bkg-1 border border-th-fgd-4 px-2 h-10 hover:border-th-primary rounded-md focus:outline-none focus:border-th-primary`}
className={`font-normal w-full bg-th-bkg-1 border border-th-bkg-4 px-2 h-10 hover:border-th-primary rounded-md focus:outline-none focus:border-th-primary`}
>
<div className={`flex items-center justify-between space-x-4`}>
<span>{t(value.toLowerCase().replaceAll(' ', '-'))}</span>

8
tailwind.config.js
View File

@ -51,9 +51,9 @@ module.exports = {
'bkg-2': '#1B1B1F',
'bkg-3': '#27272B',
'bkg-4': '#38383D',
'fgd-1': '#F7F7F7',
'fgd-2': '#E7E7E7',
'fgd-3': '#DADADA',
'fgd-1': '#E1E1E1',
'fgd-2': '#D1D1D1',
'fgd-3': '#B3B3B3',
'fgd-4': '#878787',
},
'mango-theme': {
@ -68,7 +68,7 @@ module.exports = {
'bkg-2': '#1D1832',
'bkg-3': '#2A2440',
'bkg-4': '#37324D',
'fgd-1': '#F0EDFF',
'fgd-1': '#E5E3EC',
'fgd-2': '#E5E3EC',
'fgd-3': '#C1BED3',
'fgd-4': '#706C81',