Update AppearanceComponent.js with MUI Box component

master
Tudor Stanciu 2024-03-25 02:41:20 +02:00
parent ea5e15bf45
commit cbca462893
1 changed files with 6 additions and 8 deletions

View File

@ -1,21 +1,19 @@
import React from "react"; import React from "react";
import { useApplicationTheme } from "../../../providers/ThemeProvider"; import { useApplicationTheme } from "../../../providers/ThemeProvider";
import { Grid, Paper, FormControlLabel, Switch } from "@mui/material"; import { Grid, Paper, FormControlLabel, Switch, Box } from "@mui/material";
import LanguageContainer from "./language/LanguageContainer"; import LanguageContainer from "./language/LanguageContainer";
import { PaperTitle } from "components/common"; import { PaperTitle } from "components/common";
import { makeStyles } from "@mui/material/styles";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
const useStyles = makeStyles(theme => ({ const styles = {
language: { language: {
paddingLeft: theme.spacing(1) paddingLeft: 1
} }
})); };
const AppearanceComponent = () => { const AppearanceComponent = () => {
const { isDark, onDarkModeChanged } = useApplicationTheme(); const { isDark, onDarkModeChanged } = useApplicationTheme();
const { t } = useTranslation(); const { t } = useTranslation();
const classes = useStyles();
const handleChange = event => { const handleChange = event => {
const { checked } = event.target; const { checked } = event.target;
@ -38,9 +36,9 @@ const AppearanceComponent = () => {
<FormControlLabel <FormControlLabel
value="start" value="start"
control={ control={
<div className={classes.language}> <Box sx={styles.language}>
<LanguageContainer /> <LanguageContainer />
</div> </Box>
} }
label="Language:" label="Language:"
labelPlacement="start" labelPlacement="start"