diff --git a/src/App-styles.tsx b/src/App-styles.tsx index 68b87ab..81cd6f6 100644 --- a/src/App-styles.tsx +++ b/src/App-styles.tsx @@ -7,7 +7,10 @@ export const AppContainer = styled(Box)(({ theme }) => ({ flexDirection: "column", alignItems: "flex-start", padding: "20px 30px 0 30px", - backgroundColor: "#323336" + backgroundColor: "#323336", + [`@media (max-width: 500px)`]: { + padding: "10px 5px 0 5px", + } })); export const MainContainer = styled(Box)` diff --git a/src/components/Grids/TradeOffers.tsx b/src/components/Grids/TradeOffers.tsx index 626de40..b353bb7 100644 --- a/src/components/Grids/TradeOffers.tsx +++ b/src/components/Grids/TradeOffers.tsx @@ -795,7 +795,7 @@ export const TradeOffers: React.FC = ({ foreignCoinBalance }: any) => { width: "450px", height: "450px", maxHeight: "calc(90vh - 55px)", - maxWidth: "90vw", + maxWidth: "90%", background: "rgb(39, 40, 44)", overflow: "auto", }} diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx index db738ca..2a6230c 100644 --- a/src/components/header/Header.tsx +++ b/src/components/header/Header.tsx @@ -29,6 +29,7 @@ import ErrorIcon from "@mui/icons-material/Error"; import { CopyToClipboard } from "react-copy-to-clipboard"; import Copy from "../../assets/SVG/Copy.svg"; import {AddressQRCode} from './AddressQRCode' +import {FallingLines} from 'react-loader-spinner' import { Alert, AppBar, @@ -426,7 +427,14 @@ export const Header = ({ qortBalance, foreignCoinBalance }: any) => { width: "auto", }} /> - {foreignCoinBalance === null ? "N/A" : foreignCoinBalance}{" "} + {foreignCoinBalance === null ? ( + + ) : foreignCoinBalance}{" "} {getCoinLabel()}