bridge_ui: nft stats style fixes pt 2

Change-Id: Ie2552764f4d4b0dff3a50909a635d957b0c4d6a3
This commit is contained in:
Evan Gray 2021-10-26 20:35:56 -04:00
parent ad33cac284
commit 4f2f6922cd
4 changed files with 21 additions and 33 deletions

View File

@ -61,7 +61,7 @@ const useStyles = makeStyles((theme) => ({
},
tableBox: {
display: "flex",
justifyContent: "flex-start",
justifyContent: "center",
"& > *": {
margin: theme.spacing(1),
},

View File

@ -43,7 +43,6 @@ const useStyles = makeStyles((theme) => ({
margin: ".5rem",
},
marginBottom: theme.spacing(2),
overflow: "auto",
},
flexBox: {
display: "flex",

View File

@ -1,4 +1,4 @@
import { IconButton, TableFooter } from "@material-ui/core";
import { IconButton } from "@material-ui/core";
import MaUTable from "@material-ui/core/Table";
import TableBody from "@material-ui/core/TableBody";
import TableCell from "@material-ui/core/TableCell";
@ -151,31 +151,22 @@ const EnhancedTable = ({ columns, data, skipPageReset, initialState = {} }) => {
);
})}
</TableBody>
<TableFooter>
<TableRow>
<TablePagination
rowsPerPageOptions={[
5,
10,
25,
{ label: "All", value: rows.length },
]}
colSpan={columns.length}
count={rows.length}
rowsPerPage={pageSize}
page={pageIndex}
SelectProps={{
inputProps: { "aria-label": "rows per page" },
native: true,
}}
onPageChange={handlePageChange}
onRowsPerPageChange={handleRowsPerPageChange}
ActionsComponent={TablePaginationActions}
/>
</TableRow>
</TableFooter>
</MaUTable>
</TableContainer>
<TablePagination
component="div"
rowsPerPageOptions={[5, 10, 25, { label: "All", value: rows.length }]}
count={rows.length}
rowsPerPage={pageSize}
page={pageIndex}
SelectProps={{
inputProps: { "aria-label": "rows per page" },
native: true,
}}
onPageChange={handlePageChange}
onRowsPerPageChange={handleRowsPerPageChange}
ActionsComponent={TablePaginationActions}
/>
</>
);
};

View File

@ -44,6 +44,7 @@ const LogoIcon = ({ chainId }: { chainId: ChainId }) =>
height: "1em",
width: "1em",
marginLeft: "4px",
padding: "4px",
}}
src={solanaIcon}
alt="Solana"
@ -183,6 +184,9 @@ const useStyles = makeStyles((theme) => ({
display: "none",
},
skeleton: {
height: "500px",
width: "400px",
maxWidth: "100%",
borderRadius: 9,
display: "grid",
placeItems: "center",
@ -216,13 +220,7 @@ const ViewerLoader = () => {
return (
<div className={classes.wormholePositioner}>
<Skeleton
width="400px"
height="500px"
variant="rect"
animation="wave"
className={classes.skeleton}
/>
<Skeleton variant="rect" animation="wave" className={classes.skeleton} />
<img src={Wormhole} alt="Wormhole" className={classes.wormholeIcon} />
</div>
);