diff --git a/dapp-oeth/pages/_document.js b/dapp-oeth/pages/_document.js index 7e5dc2133e..87231d22c2 100644 --- a/dapp-oeth/pages/_document.js +++ b/dapp-oeth/pages/_document.js @@ -36,10 +36,10 @@ class MyDocument extends Document { - + - - - - - - - - diff --git a/dapp-oeth/public/images/share-facebook.png b/dapp-oeth/public/images/share-facebook.png index cb91bb4b80..5876c76346 100644 Binary files a/dapp-oeth/public/images/share-facebook.png and b/dapp-oeth/public/images/share-facebook.png differ diff --git a/dapp-oeth/public/images/share-twitter.png b/dapp-oeth/public/images/share-twitter.png index bb73e46fa0..5876c76346 100644 Binary files a/dapp-oeth/public/images/share-twitter.png and b/dapp-oeth/public/images/share-twitter.png differ diff --git a/dapp-oeth/public/images/weth.png b/dapp-oeth/public/images/weth.png new file mode 100644 index 0000000000..82102bf6b4 Binary files /dev/null and b/dapp-oeth/public/images/weth.png differ diff --git a/dapp-oeth/public/images/weth.svg b/dapp-oeth/public/images/weth.svg deleted file mode 100644 index 54781a0fc6..0000000000 --- a/dapp-oeth/public/images/weth.svg +++ /dev/null @@ -1,19 +0,0 @@ - - - - - - - - - - - - - - - - - - - diff --git a/dapp-oeth/src/components/IPFSDappLink.js b/dapp-oeth/src/components/IPFSDappLink.js index e0f31084f7..4c6f977424 100644 --- a/dapp-oeth/src/components/IPFSDappLink.js +++ b/dapp-oeth/src/components/IPFSDappLink.js @@ -54,10 +54,12 @@ export default function IPFSDappLink({ css }) { background-color: #1e1f25; color: #fafbfb; padding: 0; + height: 36px; } .ipfs-link span { padding: 8px 16px; + font-size: 12px; } .ipfs-image { diff --git a/dapp-oeth/src/components/MissionControl.js b/dapp-oeth/src/components/MissionControl.js index d7c5d72186..408f44ca12 100644 --- a/dapp-oeth/src/components/MissionControl.js +++ b/dapp-oeth/src/components/MissionControl.js @@ -16,7 +16,7 @@ const MissionControl = ({}) => { @media (max-width: 767px) { .swap-contain { - padding: 0 8px; + padding: 0 12px; } } `} diff --git a/dapp-oeth/src/components/Nav.js b/dapp-oeth/src/components/Nav.js index 35b0b230ac..7b05abbb4c 100644 --- a/dapp-oeth/src/components/Nav.js +++ b/dapp-oeth/src/components/Nav.js @@ -66,7 +66,6 @@ const DappLinks = ({ page }) => { .link-contain { font-size: 16px; border-radius: 56px; - margin-right: 8px; } .link-contain.last { @@ -888,7 +887,7 @@ const Nav = ({ isMobile, locale, onLocale, page }) => { @media (max-width: 799px) { .navbar .nav-container { - padding: 0 8px; + padding: 0 12px; } } `} diff --git a/dapp-oeth/src/components/buySell/BalanceHeader.js b/dapp-oeth/src/components/buySell/BalanceHeader.js index e7d5eb089a..8450eda505 100644 --- a/dapp-oeth/src/components/buySell/BalanceHeader.js +++ b/dapp-oeth/src/components/buySell/BalanceHeader.js @@ -130,7 +130,7 @@ const BalanceHeader = ({ src={assetRootPath(`/images/oeth.svg`)} /> )} -

{value}

+

{value}

{!small && ( diff --git a/dapp-oeth/src/components/buySell/SettingsDropdown.js b/dapp-oeth/src/components/buySell/SettingsDropdown.js index 947b0c5ed5..26b6602046 100644 --- a/dapp-oeth/src/components/buySell/SettingsDropdown.js +++ b/dapp-oeth/src/components/buySell/SettingsDropdown.js @@ -125,8 +125,8 @@ const SettingsDropdown = ({ setPriceToleranceValue, priceToleranceValue }) => { } .settings-icon { - width: 22px; - height: 22px; + width: 16px; + height: 16px; cursor: pointer; } @@ -161,6 +161,18 @@ const SettingsDropdown = ({ setPriceToleranceValue, priceToleranceValue }) => { padding: 0 12px; } + /* Chrome, Safari, Edge, Opera */ + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + + /* Firefox */ + input[type='number'] { + -moz-appearance: textfield; + } + .warning { font-size: 14px; color: #ffdc86; diff --git a/dapp-oeth/src/components/buySell/SwapCurrencyPill.js b/dapp-oeth/src/components/buySell/SwapCurrencyPill.js index ec5ebb5641..359b2900f7 100644 --- a/dapp-oeth/src/components/buySell/SwapCurrencyPill.js +++ b/dapp-oeth/src/components/buySell/SwapCurrencyPill.js @@ -16,12 +16,22 @@ import { event } from '../../../lib/gtm' const CoinImage = ({ small, coin }) => { const className = `coin-image` + + const coinExt = { + reth: 'png', + weth: 'png', + } + return (
{coin !== 'mix' && ( )} {coin === 'mix' && ( @@ -32,7 +42,7 @@ const CoinImage = ({ small, coin }) => { /> { @media (max-width: 799px) { .coin-image { + width: 24px; + height: 24px; margin-right: 8px; } } @@ -353,9 +365,10 @@ const CoinSelect = ({ @media (max-width: 799px) { .coin-select { + font-size: 16px; width: fit-content; min-height: 32px; - padding: 4px; + padding: 6px 4px; margin-top: 16px; } } @@ -399,7 +412,7 @@ const CoinSelect = ({ .coin-select { padding: 4px; border-radius: 30px; - border: solid 1px #141519; + border: solid 0px; color: #fafbfb; background-color: rgba(255, 255, 255, 0.1); cursor: pointer; @@ -436,15 +449,17 @@ const CoinSelect = ({ @media (max-width: 799px) { .coin-select { + font-size: 16px; width: fit-content; min-height: 32px; - padding: 4px; + padding: 6px 4px; margin-top: 16px; } .coin { color: #fafbfb; margin-right: 8px; + font-size: 16px; } } `} @@ -645,7 +660,7 @@ const SwapCurrencyPill = ({ )} {bottomItem && ( -
+
{swapsLoading ? ( {fbt('Loading...', 'Swaps Loading...')} @@ -741,6 +756,10 @@ const SwapCurrencyPill = ({ )}
) diff --git a/dapp-oeth/src/components/layout.js b/dapp-oeth/src/components/layout.js index edb0bbdba5..d94020dda6 100644 --- a/dapp-oeth/src/components/layout.js +++ b/dapp-oeth/src/components/layout.js @@ -60,12 +60,12 @@ const Layout = ({ diff --git a/dapp-oeth/src/components/wrap/BalanceHeaderWrapped.js b/dapp-oeth/src/components/wrap/BalanceHeaderWrapped.js index fef060c173..1625d96796 100644 --- a/dapp-oeth/src/components/wrap/BalanceHeaderWrapped.js +++ b/dapp-oeth/src/components/wrap/BalanceHeaderWrapped.js @@ -71,7 +71,7 @@ const BalanceHeaderWrapped = ({ src={assetRootPath(`/images/currency/woeth-icon-small.svg`)} /> )} -

{value}

+

{value}

{!small && (