mirror of
https://github.com/yzernik/squeaknode.git
synced 2026-08-13 12:33:25 +02:00
Create squeak address page and go to it from table (#107)
This commit is contained in:
parent
c8ee3537dc
commit
08af3e1679
3 changed files with 17 additions and 106 deletions
|
|
@ -46,6 +46,7 @@ function Layout(props) {
|
|||
<Switch>
|
||||
<Route path="/app/dashboard" component={Dashboard} />
|
||||
<Route path="/app/typography" component={Typography} />
|
||||
<Route path="/app/squeakaddress/:id" component={Typography} />
|
||||
<Route path="/app/tables" component={Tables} />
|
||||
<Route path="/app/notifications" component={Notifications} />
|
||||
<Route
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { Grid } from "@material-ui/core";
|
||||
import MUIDataTable from "mui-datatables";
|
||||
|
||||
|
|
@ -42,6 +43,8 @@ export default function Tables() {
|
|||
const [msg, setMsg] = useState("waiting for message...");
|
||||
const [squeaks, setSqueaks] = useState([]);
|
||||
const [signingProfiles, setSigningProfiles] = useState([]);
|
||||
const history = useHistory();
|
||||
|
||||
const getMsg = () => {
|
||||
console.log("called getMsg");
|
||||
|
||||
|
|
@ -119,6 +122,12 @@ export default function Tables() {
|
|||
print: false,
|
||||
viewColumns: false,
|
||||
selectableRows: "none",
|
||||
onRowClick: rowData => {
|
||||
console.log(rowData);
|
||||
var address = rowData[1];
|
||||
console.log(address);
|
||||
history.push("/app/squeakaddress/" + address);
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import React from "react";
|
||||
import { useParams } from 'react-router-dom';
|
||||
import { Grid } from "@material-ui/core";
|
||||
|
||||
// styles
|
||||
|
|
@ -9,117 +10,17 @@ import PageTitle from "../../components/PageTitle";
|
|||
import Widget from "../../components/Widget";
|
||||
import { Typography } from "../../components/Wrappers";
|
||||
|
||||
export default function TypographyPage() {
|
||||
export default function SqueakAddressPage() {
|
||||
var classes = useStyles();
|
||||
const { id } = useParams();
|
||||
|
||||
return (
|
||||
<>
|
||||
<PageTitle title="Typography" />
|
||||
<PageTitle title={'Squeak Address: ' + id} />
|
||||
<Grid container spacing={4}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Widget title="Headings" disableWidgetMenu>
|
||||
<div className={classes.dashedBorder}>
|
||||
<Typography variant="h1" className={classes.text}>
|
||||
h1. Heading
|
||||
</Typography>
|
||||
<Typography variant="h2" className={classes.text}>
|
||||
h2. Heading
|
||||
</Typography>
|
||||
<Typography variant="h3" className={classes.text}>
|
||||
h3. Heading
|
||||
</Typography>
|
||||
<Typography variant="h4" className={classes.text}>
|
||||
h4. Heading
|
||||
</Typography>
|
||||
<Typography variant="h5" className={classes.text}>
|
||||
h5. Heading
|
||||
</Typography>
|
||||
<Typography variant="h6">h6. Heading</Typography>
|
||||
</div>
|
||||
</Widget>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Widget title="Typography Colors" disableWidgetMenu>
|
||||
<div className={classes.dashedBorder}>
|
||||
<Typography variant="h1" color="primary" className={classes.text}>
|
||||
h1. Heading
|
||||
</Typography>
|
||||
<Typography variant="h2" color="success" className={classes.text}>
|
||||
h2. Heading
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="h3"
|
||||
color="secondary"
|
||||
className={classes.text}
|
||||
>
|
||||
h3. Heading
|
||||
</Typography>
|
||||
<Typography variant="h4" color="warning" className={classes.text}>
|
||||
h4. Heading
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="h5"
|
||||
color="primary"
|
||||
colorBrightness="light"
|
||||
className={classes.text}
|
||||
>
|
||||
h5. Heading
|
||||
</Typography>
|
||||
<Typography variant="h6" color="info">
|
||||
h6. Heading
|
||||
</Typography>
|
||||
</div>
|
||||
</Widget>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Widget title="Basic Text Settings" disableWidgetMenu>
|
||||
<div className={classes.dashedBorder}>
|
||||
<Typography className={classes.text}>Basic text</Typography>
|
||||
<Typography className={classes.text} weight="light">
|
||||
Basic light text
|
||||
</Typography>
|
||||
<Typography className={classes.text} weight="medium">
|
||||
Basic medium text
|
||||
</Typography>
|
||||
<Typography className={classes.text} weight="bold">
|
||||
Basic bold text
|
||||
</Typography>
|
||||
<Typography className={classes.text}>
|
||||
BASIC UPPERCASE TEXT
|
||||
</Typography>
|
||||
<Typography className={classes.text}>
|
||||
basic lowercase text
|
||||
</Typography>
|
||||
<Typography className={classes.text}>
|
||||
Basic Capitalized Text
|
||||
</Typography>
|
||||
<Typography>
|
||||
<i>Basic Cursive Text</i>
|
||||
</Typography>
|
||||
</div>
|
||||
</Widget>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Widget title="Text Size" disableWidgetMenu>
|
||||
<div className={classes.dashedBorder}>
|
||||
<Typography className={classes.text} size="sm">
|
||||
Heading Typography SM Font Size
|
||||
</Typography>
|
||||
<Typography className={classes.text}>
|
||||
Heading Typography Regular Font Size
|
||||
</Typography>
|
||||
<Typography className={classes.text} size="md">
|
||||
Heading Typography MD Font Size
|
||||
</Typography>
|
||||
<Typography className={classes.text} size="xl">
|
||||
Heading Typography XL Font Size
|
||||
</Typography>
|
||||
<Typography className={classes.text} size="xxl">
|
||||
Heading Typography XXL Font Size
|
||||
</Typography>
|
||||
</div>
|
||||
</Widget>
|
||||
</Grid>
|
||||
<div>
|
||||
Hello!
|
||||
</div>
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue