tudor.stanciu
/
network-resurrector
mirror of https://dev.azure.com/tstanciu94/NetworkResurrector/_git/NetworkResurrector
1
0
Fork 0
Code Issues 1 Packages Projects Releases Wiki Activity

Refactor AboutSystemComponent styles

master
Tudor Stanciu 2024-03-25 02:49:18 +02:00
parent a9b528d1f5
commit 968fd2e785
1 changed files with 9 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/features/about/system/AboutSystemComponent.js
View File

@ -1,6 +1,5 @@
import React from "react"; import React from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import { makeStyles } from "@mui/material/styles";
import Card from "@mui/material/Card"; import Card from "@mui/material/Card";
import CardActions from "@mui/material/CardActions"; import CardActions from "@mui/material/CardActions";
import CardContent from "@mui/material/CardContent"; import CardContent from "@mui/material/CardContent";
@ -9,16 +8,16 @@ import Typography from "@mui/material/Typography";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import OpenInNewIcon from "@mui/icons-material/OpenInNew"; import OpenInNewIcon from "@mui/icons-material/OpenInNew";
const useStyles = makeStyles(theme => ({ const styles = {
bullet: { bullet: {
display: "inline-block", display: "inline-block",
margin: "0 4px", margin: "0 4px",
transform: "scale(1.5)" transform: "scale(1.5)"
}, },
service: { service: {
marginTop: theme.spacing(1) marginTop: 1
} }
})); };
const buttons = [ const buttons = [
{ {
@ -40,10 +39,9 @@ const buttons = [
]; ];
const AboutSystemComponent = ({ handleOpenInNewTab }) => { const AboutSystemComponent = ({ handleOpenInNewTab }) => {
const classes = useStyles();
const { t } = useTranslation(); const { t } = useTranslation();
const bullet = <span className={classes.bullet}>•</span>; const bullet = <span style={styles.bullet}>•</span>;
return ( return (
<Card variant="outlined"> <Card variant="outlined">
@ -54,23 +52,23 @@ const AboutSystemComponent = ({ handleOpenInNewTab }) => {
<Typography color="textSecondary">{t("About.System.Description.FirstPhrase")}</Typography> <Typography color="textSecondary">{t("About.System.Description.FirstPhrase")}</Typography>
<Typography color="textSecondary">{t("About.System.Description.SecondPhrase")}</Typography> <Typography color="textSecondary">{t("About.System.Description.SecondPhrase")}</Typography>
<Typography className={classes.service} color="textSecondary"> <Typography sx={styles.service} color="textSecondary">
{bullet} {bullet}
{t("About.System.Description.Frontend")} {t("About.System.Description.Frontend")}
</Typography> </Typography>
<Typography className={classes.service} color="textSecondary"> <Typography sx={styles.service} color="textSecondary">
{bullet} {bullet}
{t("About.System.Description.Api")} {t("About.System.Description.Api")}
</Typography> </Typography>
<Typography className={classes.service} color="textSecondary"> <Typography sx={styles.service} color="textSecondary">
{bullet} {bullet}
{t("About.System.Description.Server")} {t("About.System.Description.Server")}
</Typography> </Typography>
<Typography className={classes.service} color="textSecondary"> <Typography sx={styles.service} color="textSecondary">
{bullet} {bullet}
{t("About.System.Description.Agent")} {t("About.System.Description.Agent")}
</Typography> </Typography>
<Typography className={classes.service} color="textSecondary"> <Typography sx={styles.service} color="textSecondary">
{bullet} {bullet}
{t("About.System.Description.Tuitio")} {t("About.System.Description.Tuitio")}
</Typography> </Typography>