From c4e2fb3713669365d17c6ac866b922ec4ad16d9b Mon Sep 17 00:00:00 2001
From: Vinicius Gabriel Machado <vgm18@inf.ufpr.br>
Date: Wed, 29 Sep 2021 19:40:22 -0300
Subject: [PATCH] implementing contrast in admin
---
.../Components/Components/AlertDialog.js | 49 ++++++++++++-------
.../Pages/SubPages/CommunityQuestions.js | 9 ++--
.../Pages/SubPages/EducationalObjects.js | 10 ++--
.../Pages/Pages/SubPages/NoteVariables.js | 2 +-
src/Admin/Pages/Pages/SubPages/Rating.js | 10 ++--
src/Admin/Pages/Pages/SubPages/Users.js | 4 +-
6 files changed, 49 insertions(+), 35 deletions(-)
diff --git a/src/Admin/Components/Components/AlertDialog.js b/src/Admin/Components/Components/AlertDialog.js
index 14861d97..d2a252ad 100644
--- a/src/Admin/Components/Components/AlertDialog.js
+++ b/src/Admin/Components/Components/AlertDialog.js
@@ -15,15 +15,20 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React from 'react';
-import Button from '@material-ui/core/Button';
+import React, { useContext } from 'react';
import Dialog from '@material-ui/core/Dialog';
import DialogActions from '@material-ui/core/DialogActions';
import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
import DialogTitle from '@material-ui/core/DialogTitle';
+import styled from 'styled-components';
+import { Store } from 'Store'
+import StyledButton from './Button';
const AlertDialog = ( props ) => {
+
+ const { state } = useContext(Store)
+
return (
<div>
<Dialog
@@ -32,25 +37,33 @@ const AlertDialog = ( props ) => {
aria-labelledby="alert-dialog-title"
aria-describedby="alert-dialog-description"
>
- <DialogTitle id="alert-dialog-title">
- Deseja deletar o dado de id: {props.deleteItem.id}
- </DialogTitle>
- <DialogContent>
- <DialogContentText id="alert-dialog-description">
- Se você deletar essa dado, todas as informações desse dado serão deletas para sempre
- </DialogContentText>
- </DialogContent>
- <DialogActions>
- <Button onClick={props.HandleClose} color="primary">
- Não deletar
- </Button>
- <Button onClick={props.OnDelete} color="secondary" autoFocus>
- Deletar
- </Button>
- </DialogActions>
+ <StyledDiv contrast={state.contrast}>
+ <DialogTitle id="alert-dialog-title">
+ Deseja deletar o dado de id: {props.deleteItem.id}
+ </DialogTitle>
+ <DialogContent>
+ <DialogContentText id="alert-dialog-description">
+ Se você deletar essa dado, todas as informações desse dado serão deletas para sempre
+ </DialogContentText>
+ </DialogContent>
+ <DialogActions>
+ <StyledButton onClick={props.HandleClose} color="primary" text="Não deletar"/>
+ <StyledButton onClick={props.OnDelete} color="secondary" autoFocus text="Deletar"/>
+ </DialogActions>
+ </StyledDiv>
</Dialog>
</div>
);
}
+const StyledDiv = styled.div`
+ background-color: ${props => props.contrast === "" ? "white" : "black"};
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ border: 1px solid ${props => props.contrast === "" ? "#666" : "white"};
+
+ #alert-dialog-description {
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ }
+`
+
export default AlertDialog;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js b/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js
index ec78c01f..b6bd621a 100644
--- a/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js
+++ b/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js
@@ -331,14 +331,13 @@ const CommunityQuestion = () => {
subtitle:
row.email ?
<Link to={`/admin/sendEmail?email=${row.email}`} style={{ textDecoration: 'none' }}>
- <Button
+ <StyledButton
variant='text'
color="primary"
style={state.contrast === "" ? {} : {color: "yellow", textDecoration: "underline yellow"}}
- startIcon={<EmailRoundedIcon style={state.contrast === "" ? {color: "#666"} : {color: "white"}}/>}
- >
- {row.email}
- </Button>
+ icon={<EmailRoundedIcon style={state.contrast === "" ? {color: "#666"} : {color: "white"}}/>}
+ text={row.email}
+ />
</Link> : null
},
diff --git a/src/Admin/Pages/Pages/SubPages/EducationalObjects.js b/src/Admin/Pages/Pages/SubPages/EducationalObjects.js
index f13b791f..3d720067 100644
--- a/src/Admin/Pages/Pages/SubPages/EducationalObjects.js
+++ b/src/Admin/Pages/Pages/SubPages/EducationalObjects.js
@@ -29,6 +29,7 @@ import PageHeader, { StyledFilter } from "../../../Components/Components/PageHea
import FormInput from "Components/FormInput.js"
import { Store } from 'Store'
import { StyledLoadMoreButton, StyledDivButton, useStylesCell, useStylesRow } from './Collections';
+import StyledButton from '../../../Components/Components/Button';
// Imports about icon
import FilterListRoundedIcon from "@material-ui/icons/FilterListRounded";
import AddRoundedIcon from "@material-ui/icons/AddRounded";
@@ -409,17 +410,16 @@ const EducationalObjects = () => {
{
title: "Deletar",
subtitle:
- <Button
+ <StyledButton
variant="contained"
color="secondary"
onClick={() => {
HandleStateAlertDialog(index);
HandleStateCircularProgress(index);
}}
- startIcon={<DeleteIcon />}
- >
- Deletar
- </Button>
+ icon={<DeleteIcon />}
+ text="Deletar"
+ />
}
]
}
diff --git a/src/Admin/Pages/Pages/SubPages/NoteVariables.js b/src/Admin/Pages/Pages/SubPages/NoteVariables.js
index beca23ce..520f826e 100644
--- a/src/Admin/Pages/Pages/SubPages/NoteVariables.js
+++ b/src/Admin/Pages/Pages/SubPages/NoteVariables.js
@@ -211,7 +211,7 @@ const NoteVariables = () => {
},
{
title: "Ativo",
- subtitle: row.active ? <CheckRoundedIcon style={{ fill: '#3CB371' }} /> : <BlockRoundedIcon style={{ fill: '#FA8072' }} />
+ subtitle: row.active ? <CheckRoundedIcon style={{ fill: state.contrast === "" ? "#3CB371" : "white" }} /> : <BlockRoundedIcon style={{ fill: state.contrast === "" ? "#FA8072" : "white" }} />
},
]
}
diff --git a/src/Admin/Pages/Pages/SubPages/Rating.js b/src/Admin/Pages/Pages/SubPages/Rating.js
index 5c2d6189..00a667d9 100644
--- a/src/Admin/Pages/Pages/SubPages/Rating.js
+++ b/src/Admin/Pages/Pages/SubPages/Rating.js
@@ -37,6 +37,7 @@ import MobilePageHeader from "../../../Components/Components/MobileComponents/Mo
import PageHeader from "../../../Components/Components/PageHeader"
import { StyledLoadMoreButton, StyledDivButton, useStylesCell, useStylesRow } from './Collections';
import { Store } from 'Store'
+import StyledButton from '../../../Components/Components/Button';
//Services
import AlertDialog from "../../../Components/Components/AlertDialog";
import { Url } from '../../../Filters';
@@ -277,17 +278,16 @@ const Ratings = () => {
{
title: "Deletar",
subtitle:
- <Button
+ <StyledButton
variant="contained"
color="secondary"
onClick={() => {
HandleStateAlertDialog(index);
HandleStateCircularProgress(index);
}}
- startIcon={<DeleteRoundedIcon />}
- >
- Deletar
- </Button>
+ icon={<DeleteRoundedIcon />}
+ text="Deletar"
+ />
}
]
}
diff --git a/src/Admin/Pages/Pages/SubPages/Users.js b/src/Admin/Pages/Pages/SubPages/Users.js
index 25fae4cb..d426d97c 100644
--- a/src/Admin/Pages/Pages/SubPages/Users.js
+++ b/src/Admin/Pages/Pages/SubPages/Users.js
@@ -381,7 +381,9 @@ const Users = () => {
title: "Permissão",
subtitle: row.roles.map((chip) => (
<ChipDiv>
- <Chip label={chip.name} key={chip.id} />
+ <Chip label={chip.name} key={chip.id}
+ style={state.contrast === "" ? {backgroundColor: "#ddd", color: "black"} : {backgroundColor: "black", color: "white", border: "1px solid white"}}
+ />
</ChipDiv>
))
},
--
GitLab