extern/zrok
1
1
Fork 0
mirror of https://github.com/openziti/zrok.git synced 2024-12-23 07:09:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

more mui (#221)

Browse Source
This commit is contained in:
Michael Quigley 2024-10-21 12:30:00 -04:00
parent aa5810a98f
commit 28e8896b87
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
4 changed files with 8 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
agent/agentUi/src/AccessCard.jsx
View File

@ -1,5 +1,6 @@
import LanIcon from "@mui/icons-material/Lan"; import LanIcon from "@mui/icons-material/Lan";
import DeleteIcon from "@mui/icons-material/Delete"; import DeleteIcon from "@mui/icons-material/Delete";
import {Card} from "@mui/material";
const AccessCard = (props) => { const AccessCard = (props) => {
const releaseClicked = () => { const releaseClicked = () => {
@ -7,13 +8,13 @@ const AccessCard = (props) => {
} }
return ( return (
<div className={"card"}> <Card sx={{ mt: 2, p: 2 }}>
<h2>{props.access.frontendToken} [<LanIcon/>]</h2> <h2>{props.access.frontendToken} [<LanIcon/>]</h2>
<p> <p>
{props.access.token} &rarr; {props.access.bindAddress} {props.access.token} &rarr; {props.access.bindAddress}
</p> </p>
<p><DeleteIcon onClick={releaseClicked}/></p> <p><DeleteIcon onClick={releaseClicked}/></p>
</div> </Card>
); );
} }

5
agent/agentUi/src/Overview.jsx
View File

@ -3,6 +3,7 @@ import ShareCard from "./ShareCard.jsx";
import AccessCard from "./AccessCard.jsx"; import AccessCard from "./AccessCard.jsx";
import LanIcon from "@mui/icons-material/Lan"; import LanIcon from "@mui/icons-material/Lan";
import ShareIcon from "@mui/icons-material/Share"; import ShareIcon from "@mui/icons-material/Share";
import {Card} from "@mui/material";
const Overview = (props) => { const Overview = (props) => {
let cards = []; let cards = [];
@ -19,9 +20,7 @@ const Overview = (props) => {
} }
}); });
} else { } else {
cards.push(<div key="help" className={"card"}> cards.push(<Card sx={{ mt: 2, p: 2}}><h5>zrok Agent is empty! Add a <a href="#" onClick={props.shareClick}>share <ShareIcon /></a> or <a href={"#"} onClick={props.accessClick}>access <LanIcon /></a> share to get started.</h5></Card>);
<h5>Your zrok Agent is empty! Add a <a href="#" onClick={props.shareClick}>share <ShareIcon /></a> or <a href={"#"} onClick={props.accessClick}>access <LanIcon /></a> share to get started.</h5>
</div>);
} }
return <>{cards}</>; return <>{cards}</>;

5
agent/agentUi/src/ShareCard.jsx
View File

@ -1,5 +1,6 @@
import ShareIcon from "@mui/icons-material/Share"; import ShareIcon from "@mui/icons-material/Share";
import DeleteIcon from "@mui/icons-material/Delete"; import DeleteIcon from "@mui/icons-material/Delete";
import {Card} from "@mui/material";
const ShareCard = (props) => { const ShareCard = (props) => {
let frontends = []; let frontends = [];
@ -12,14 +13,14 @@ const ShareCard = (props) => {
} }
return ( return (
<div className={"card"}> <Card sx={{ mt: 2, p: 2 }}>
<h2>{props.share.token} [<ShareIcon />]</h2> <h2>{props.share.token} [<ShareIcon />]</h2>
<p>({props.share.shareMode}, {props.share.backendMode})</p> <p>({props.share.shareMode}, {props.share.backendMode})</p>
<p> <p>
{props.share.backendEndpoint} &rarr; {frontends} {props.share.backendEndpoint} &rarr; {frontends}
</p> </p>
<p><DeleteIcon onClick={releaseClicked}/></p> <p><DeleteIcon onClick={releaseClicked}/></p>
</div> </Card>
); );
} }

10
agent/agentUi/src/index.css
View File

@ -1,6 +1,5 @@
body { body {
margin: 0; margin: 0;
font-family: 'Poppins', sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
padding-bottom: 15px; padding-bottom: 15px;
@ -51,12 +50,3 @@ button:focus-visible {
padding: 2rem; padding: 2rem;
} }
.info {
margin-top: 5em;
}
.card {
margin-top: 2em;
padding: 1em;
border: 0;
}