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

View File

@ -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>