Refactor AboutSystemComponent styles
parent
a9b528d1f5
commit
968fd2e785
|
@ -1,6 +1,5 @@
|
|||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import { makeStyles } from "@mui/material/styles";
|
||||
import Card from "@mui/material/Card";
|
||||
import CardActions from "@mui/material/CardActions";
|
||||
import CardContent from "@mui/material/CardContent";
|
||||
|
@ -9,16 +8,16 @@ import Typography from "@mui/material/Typography";
|
|||
import { useTranslation } from "react-i18next";
|
||||
import OpenInNewIcon from "@mui/icons-material/OpenInNew";
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
const styles = {
|
||||
bullet: {
|
||||
display: "inline-block",
|
||||
margin: "0 4px",
|
||||
transform: "scale(1.5)"
|
||||
},
|
||||
service: {
|
||||
marginTop: theme.spacing(1)
|
||||
marginTop: 1
|
||||
}
|
||||
}));
|
||||
};
|
||||
|
||||
const buttons = [
|
||||
{
|
||||
|
@ -40,10 +39,9 @@ const buttons = [
|
|||
];
|
||||
|
||||
const AboutSystemComponent = ({ handleOpenInNewTab }) => {
|
||||
const classes = useStyles();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const bullet = <span className={classes.bullet}>•</span>;
|
||||
const bullet = <span style={styles.bullet}>•</span>;
|
||||
|
||||
return (
|
||||
<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.SecondPhrase")}</Typography>
|
||||
|
||||
<Typography className={classes.service} color="textSecondary">
|
||||
<Typography sx={styles.service} color="textSecondary">
|
||||
{bullet}
|
||||
{t("About.System.Description.Frontend")}
|
||||
</Typography>
|
||||
<Typography className={classes.service} color="textSecondary">
|
||||
<Typography sx={styles.service} color="textSecondary">
|
||||
{bullet}
|
||||
{t("About.System.Description.Api")}
|
||||
</Typography>
|
||||
<Typography className={classes.service} color="textSecondary">
|
||||
<Typography sx={styles.service} color="textSecondary">
|
||||
{bullet}
|
||||
{t("About.System.Description.Server")}
|
||||
</Typography>
|
||||
<Typography className={classes.service} color="textSecondary">
|
||||
<Typography sx={styles.service} color="textSecondary">
|
||||
{bullet}
|
||||
{t("About.System.Description.Agent")}
|
||||
</Typography>
|
||||
<Typography className={classes.service} color="textSecondary">
|
||||
<Typography sx={styles.service} color="textSecondary">
|
||||
{bullet}
|
||||
{t("About.System.Description.Tuitio")}
|
||||
</Typography>
|
||||
|
|
Loading…
Reference in New Issue