diff --git a/src/Components/Acessibility/ContrastBar.js b/src/Components/Acessibility/ContrastBar.js
index 572279452c970f4179557d1809f7ed6950d12407..985bc8126d1dce42a5d0c68222606aafd2b7cbe6 100644
--- a/src/Components/Acessibility/ContrastBar.js
+++ b/src/Components/Acessibility/ContrastBar.js
@@ -90,10 +90,20 @@ function ContrastBar() {
</a>
</div>
<div onClick={toggleContrast}>
- <a className={`${state.contrast}text`} title="Ativar modo de alto contraste">
- <img className='Constrasticon' src={state.contrast === '' ? ContrastImageOff : ContrastImageOn} style={{ marginRight: 5 }} alt="ContrastIcon" />
- Contraste
- </a>
+ {
+ state.contrast === "" ?
+ (
+ <a className={`${state.contrast}text`} title="Ativar modo de alto contraste">
+ <img className='Constrasticon' src={ContrastImageOff} style={{ marginRight: 5 }} alt="Ãcone de contraste" />
+ </a>
+ )
+ :
+ (
+ <a className={`${state.contrast}text`} title="Desativar modo de alto contraste">
+ <img className='Constrasticon' src={ContrastImageOn} style={{ marginRight: 5 }} alt="Ãcone de contraste" />
+ </a>
+ )
+ }
</div>
</div>
</div>
diff --git a/src/Components/Dropdown.js b/src/Components/Dropdown.js
index 19f58a73a16e1312be12cc6432abdca6bdfa2549..ea1a161b44693fb58f1ac6e9e46062ad81224b41 100644
--- a/src/Components/Dropdown.js
+++ b/src/Components/Dropdown.js
@@ -28,72 +28,72 @@ import { Store } from '../Store';
import { HashLink as Link } from 'react-router-hash-link';
const useStyles = makeStyles((theme) => ({
- typography: {
- padding: theme.spacing(2),
- },
+ typography: {
+ padding: theme.spacing(2),
+ },
}));
export default function PositionedPopper(props) {
- const [anchorEl, setAnchorEl] = React.useState(null);
- const [open, setOpen] = React.useState(false);
- const [placement, setPlacement] = React.useState();
- const classes = useStyles();
- const { state, dispatch } = React.useContext(Store)
- const innerDropdown = React.useRef(null)
+ const [anchorEl, setAnchorEl] = React.useState(null);
+ const [open, setOpen] = React.useState(false);
+ //const [placement, setPlacement] = React.useState();
+ const classes = useStyles();
+ const { state, dispatch } = React.useContext(Store)
+ const innerDropdown = React.useRef(null)
- const handleClick = (newPlacement) => (event) => {
- if (state.searchOpen)
- dispatch({
- type: 'HANDLE_SEARCH_BAR',
- opened: false
- })
- setAnchorEl(event.currentTarget);
- setOpen((prev) => placement !== newPlacement || !prev);
- setPlacement(newPlacement);
- };
+ const handleClick = (newPlacement) => (event) => {
+ if (state.searchOpen)
+ dispatch({
+ type: 'HANDLE_SEARCH_BAR',
+ opened: false
+ })
+ setAnchorEl(event.currentTarget);
+ setOpen(!open);
+ //setPlacement(newPlacement);
+ };
- const handleItemClicked = () => {
- setOpen(false)
- }
-
- useEffect(() => {
- const handleClickOutside = (event) => {
- innerDropdown.current && !innerDropdown.current.contains(event.target) && setOpen(false)
+ const handleItemClicked = () => {
+ setOpen(false)
}
- document.addEventListener('mousedown', handleClickOutside)
+ useEffect(() => {
+ const handleClickOutside = (event) => {
+ innerDropdown.current && !innerDropdown.current.contains(event.target) && setOpen(false)
+ }
+
+ document.addEventListener('mousedown', handleClickOutside)
- return () => document.removeEventListener('mousedown', handleClickOutside)
+ return () => document.removeEventListener('mousedown', handleClickOutside)
- }, [])
+ }, [])
- return (
- <div className={classes.root}>
- <Popper open={open} anchorEl={anchorEl} placement="bottom" transition ref={innerDropdown}>
- {({ TransitionProps }) => (
- <Fade {...TransitionProps} timeout={350}>
- <Paper>
- <MenuList className={`${state.contrast}BackColor`}>
- {
- props.items.map((item) =>
- <Link onClick={handleItemClicked} className={`${state.contrast}LinkColor`} style={{ textDecoration: "none", color: "black" }} key={`${item.name}_${new Date().toString()}`} to={item.href} ><MenuItem>{item.name}</MenuItem></Link>
- )
- }
- </MenuList>
- </Paper>
- </Fade>
- )}
- </Popper>
- <Button
- className={`${state.contrast}LinkColor`}
- style={{ textTransform: "none" }}
- aria-controls="menu-list-grow"
- aria-haspopup="true"
- onClick={handleClick('bottom')}
- >
- {props.name}
- <ExpandMoreIcon className={`${state.contrast}IconColor`}/>
- </Button>
- </div>
- );
+ return (
+ <div className={classes.root}>
+ <Popper open={open} anchorEl={anchorEl} placement="bottom" transition ref={innerDropdown}>
+ {({ TransitionProps }) => (
+ <Fade {...TransitionProps} timeout={350}>
+ <Paper>
+ <MenuList className={`${state.contrast}BackColor`}>
+ {
+ props.items.map((item) =>
+ <Link onClick={handleItemClicked} className={`${state.contrast}LinkColor`} style={{ textDecoration: "none", color: "black" }} key={`${item.name}_${new Date().toString()}`} to={item.href} ><MenuItem>{item.name}</MenuItem></Link>
+ )
+ }
+ </MenuList>
+ </Paper>
+ </Fade>
+ )}
+ </Popper>
+ <Button
+ className={`${state.contrast}LinkColor`}
+ style={{ textTransform: "none" }}
+ aria-controls="menu-list-grow"
+ aria-haspopup="true"
+ onClick={handleClick('bottom')}
+ >
+ {props.name}
+ <ExpandMoreIcon className={`${state.contrast}IconColor`}/>
+ </Button>
+ </div>
+ );
}
\ No newline at end of file
diff --git a/src/Components/GuardarModal.js b/src/Components/GuardarModal.js
index 2b78de8689d1b71221aa29f6353b51e74a86c280..f08774eedc3638ad04a4d1b9ae87c6095a6a241a 100644
--- a/src/Components/GuardarModal.js
+++ b/src/Components/GuardarModal.js
@@ -148,7 +148,7 @@ export default function GuardarModal(props) {
{
loading ?
(
- <LoadingSpinner text="Carregando coleções" />
+ <LoadingSpinner contrast={props.contrast} text="Carregando coleções" />
)
:
(
diff --git a/src/Components/HelpCenter/TabsManageAc/Forget.js b/src/Components/HelpCenter/TabsManageAc/Forget.js
index 4726ef8af2e2893152d3ca15d9f0644e2ff1df8f..ad0a69ad35b0aca8a138daf29786ed7e9ea90836 100644
--- a/src/Components/HelpCenter/TabsManageAc/Forget.js
+++ b/src/Components/HelpCenter/TabsManageAc/Forget.js
@@ -24,74 +24,68 @@ import { LoginImg } from "ImportImages.js";
import { RecuperarSenhaImg } from "ImportImages.js";
export default function Forget(props) {
- return(
- <Card>
- <link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/>
- <div style={{marginBottom: "9px"}}>
- <span>{props.title}</span>
- </div>
- <p>Para redefinir a senha da sua conta, siga essas instruções:</p>
-
- <ol>
- <li>
- Acesse a <a href="/" target="_blank">Página Inicial</a> e clique em
- “Entrar†no canto superior direito da página.
- </li>
- <li>Clique em “Esqueceu a senha? Clique Aqui!â€.</li>
- <img className="primeira" src={LoginImg} alt="primeira imagem"/>
- <li>Preencha com o seu endereço de e-mail e clique em “Buscarâ€.</li>
- <img className="segunda" src={RecuperarSenhaImg} alt="segunda imagem"/>
- <li>Você receberá um e-mail no endereço informado, contendo as instruções para redefinir sua senha.</li>
- </ol>
-
- </Card>
- );
+ return(
+ <Card contrast={props.contrast}>
+ <link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/>
+ <div style={{marginBottom: "9px"}}>
+ <span>{props.title}</span>
+ </div>
+ <p>Para redefinir a senha da sua conta, siga essas instruções:</p>
+ <ol>
+ <li>
+ Acesse a <a href="/" target="_blank">Página Inicial</a> e clique em
+ “Entrar†no canto superior direito da página.
+ </li>
+ <li>Clique em “Esqueceu a senha? Clique Aqui!â€.</li>
+ <img className="primeira" src={LoginImg} alt="primeira imagem"/>
+ <li>Preencha com o seu endereço de e-mail e clique em “Buscarâ€.</li>
+ <img className="segunda" src={RecuperarSenhaImg} alt="segunda imagem"/>
+ <li>Você receberá um e-mail no endereço informado, contendo as instruções para redefinir sua senha.</li>
+ </ol>
+ </Card>
+ );
}
const Card = styled.div`
- margin-bottom: 5px;
- background-color: ${props => props.contrast === "" ? "#fff" : "black"};
- box-shadow: ${props => props.contrast === "" ? "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)" : "0 1px 3px rgba(254,254,254,.48),0 1px 2px rgba(254,254,254,.48)"};
- padding: 30px;
- color: ${props => props.contrast === "" ? "#666" : "white"};
- span {
- font-size: 14px;
- font-weight: bold;
- }
-
- a {
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- :hover {
- text-decoration: underline;
- }
-
- ol {
- margin-top: 0;
- margin-bottom: 10px;
- line-height: 1.42857143;
- .primeira {
-
- height: 300px;
- margin-right: 40px;
- vertical-align: middle;
+ margin-bottom: 5px;
+ background-color: ${props => props.contrast === "" ? "#fff" : "black"};
+ box-shadow: ${props => props.contrast === "" ? "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)" : "0 1px 3px rgba(254,254,254,.48),0 1px 2px rgba(254,254,254,.48)"};
+ padding: 30px;
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ span {
+ font-size: 14px;
+ font-weight: bold;
}
- .segunda {
- height: 150px;
- margin-right: 40px;
- vertical-align: middle;
+ a {
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ :hover {
+ text-decoration: underline;
+ }
}
- }
- li {
- font-size: 14px;
- }
-
-
- p {
- margin: 0 0 10px;
- font-size: 15px;
- }
+ ol {
+ margin-top: 0;
+ margin-bottom: 10px;
+ line-height: 1.42857143;
+ .primeira {
+ height: 300px;
+ margin-right: 40px;
+ vertical-align: middle;
+ }
+ .segunda {
+ height: 150px;
+ margin-right: 40px;
+ vertical-align: middle;
+ }
+ }
+ li {
+ font-size: 14px;
+ }
+ p {
+ margin: 0 0 10px;
+ font-size: 15px;
+ }
`
\ No newline at end of file
diff --git a/src/Components/LoadingSpinner.js b/src/Components/LoadingSpinner.js
index 81089ad97a61e48e55765d0006fee99267f32029..e25599746e6ffcf88f3f7746a13724d303e7df4b 100644
--- a/src/Components/LoadingSpinner.js
+++ b/src/Components/LoadingSpinner.js
@@ -2,10 +2,10 @@ import React from 'react';
import LoadingGif from '../img/loading_busca.gif'
const LoadingSpinner = (props) => (
- <div style={{ display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center" }}>
- <img alt="" src={LoadingGif} />
- <span style={props.contrast === "" ? { textTransform: "uppercase" } : { textTransform: "uppercase", color: "white" }}>{props.text}</span>
- </div>
+ <div style={{ display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center" }}>
+ <img alt="" src={LoadingGif} />
+ <span style={props.contrast === "" ? { textTransform: "uppercase" } : { textTransform: "uppercase", color: "white" }}>{props.text}</span>
+ </div>
);
export default LoadingSpinner;
diff --git a/src/Components/MobileDrawerMenu.js b/src/Components/MobileDrawerMenu.js
index a626a7434b870de9670e8de8ea63ac790bf6c722..66db915e93ab7cb829389e601ef3dc6d435bd8d3 100644
--- a/src/Components/MobileDrawerMenu.js
+++ b/src/Components/MobileDrawerMenu.js
@@ -47,7 +47,6 @@ export default function MobileDrawerMenu(props) {
{ name: "Favoritos", href: "/perfil", value: '2' },
{ name: "Coleções", href: "/perfil", value: '3' },
{ name: "Rede", href: "/perfil", value: '4' },
- { name: "Configurações", href: "/editarperfil", value: '5' },
]
if (state.currentUser.roles) {
diff --git a/src/Components/ModalExcluirColecao.js b/src/Components/ModalExcluirColecao.js
index 40e0561db6988ce60a28dc955fd6a9bc083d18f8..cb55a931f2784e8662820ff494ca932c5fb8bed4 100644
--- a/src/Components/ModalExcluirColecao.js
+++ b/src/Components/ModalExcluirColecao.js
@@ -60,7 +60,7 @@ export default function ModalExcluirColecao (props) {
<Container contrast={props.contrast}>
<Header>
<h2>Tem certeza que deseja excluir esta Coleção?</h2>
- <CloseModalButton handleClose={props.handleClose} id={props.id}/>
+ <CloseModalButton contrast={props.contrast} handleClose={props.handleClose} id={props.id}/>
</Header>
<Content>
diff --git a/src/Components/ModalLearningObjectPublished.js b/src/Components/ModalLearningObjectPublished.js
index 190e31f7d657cc6d30363e80272398c0ad60a70e..8421e0d885b9edd5baf7fc29138c43c15b5bc482 100644
--- a/src/Components/ModalLearningObjectPublished.js
+++ b/src/Components/ModalLearningObjectPublished.js
@@ -57,7 +57,7 @@ export default function ModalLearningObjectPublished (props) {
<Header>
<span style={{width:"32px"}}/>
<h2>O seu recurso foi para a curadoria!</h2>
- <CloseModalButton handleClose={props.handleClose}/>
+ <CloseModalButton contrast={props.contrast} handleClose={props.handleClose}/>
</Header>
<Content >
diff --git a/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js b/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js
index c6585ef1a5275d26dd2fbdbec3e907bd810b48de..422c3e86b3d48d46cd3f8ed11bde5c3d9926323b 100644
--- a/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js
+++ b/src/Components/TabPanels/PanelComponents/TemplateCuradoria.js
@@ -79,7 +79,7 @@ export default function Template(props) {
</StyledGrid>
{
props.loadingMore ?
- <LoadingSpinner text="Carregando recurso..." />
+ <LoadingSpinner contrast={props.contrast} text="Carregando recurso..." />
:
<ButtonsAreaRecurso
contrast={props.contrast}
diff --git a/src/Components/TabPanels/PanelComponents/TemplateRecurso.js b/src/Components/TabPanels/PanelComponents/TemplateRecurso.js
index 7667fb6f690497e19fe133d254da4086ce4e91d2..1243c015b440b54a02bbe59b003ee95e2a7f820e 100644
--- a/src/Components/TabPanels/PanelComponents/TemplateRecurso.js
+++ b/src/Components/TabPanels/PanelComponents/TemplateRecurso.js
@@ -84,7 +84,7 @@ export default function Template(props) {
</StyledGrid>
{
props.loadingMore ?
- <LoadingSpinner text={'Carregando Recursos...'} />
+ <LoadingSpinner contrast={props.contrast} text={'Carregando Recursos...'} />
:
<ButtonsAreaRecurso
contrast={props.contrast}
diff --git a/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js b/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js
index 4f82ce7edac857cb6a6246a899140ad868180ebb..99fb7c2d3976ed102f8c1699267823ab3b623e0d 100644
--- a/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js
+++ b/src/Components/TabPanels/UserPageTabs/PanelMeusRecursos.js
@@ -148,7 +148,7 @@ export default function TabPanelAtividades(props) {
setLoadingMoreCurating(true);
const limit = limite;
setcurrLimitCurating(currLimitCurating + limit)
- const url = `/users/${props.id}/submissions?offset=${currLimitCurating}&limit=${limit}&status=submitted`;
+ const url = `/users/${props.id}/submissions?offset=${currLimitCurating}&limit=${limit}&state=submitted`;
getRequest(url,
(data) => {
if (data.errors) {
diff --git a/src/Components/TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js b/src/Components/TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js
index daef1b4dbe54114aedf0ce9690df937c557c07aa..d13847cb1c08c16d822fa88e7eb024b9bb600172 100644
--- a/src/Components/TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js
+++ b/src/Components/TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js
@@ -22,6 +22,9 @@ import styled from 'styled-components'
import Button from '@material-ui/core/Button';
import { Link } from 'react-router-dom';
+//Image Import
+import { Publicar } from "ImportImages.js";
+
//3 casos
//Professor nao cadastrado (nao pediu OU submitter_request = rejected)
//Professor em análise (submitter_request = requested)
@@ -129,7 +132,7 @@ const StyledH2 = styled.h2`
`
const ImageDiv = styled.div`
- background-image : url(https://plataformaintegrada.mec.gov.br/img/Publicar.png);
+ background-image : url(${Publicar});
display : block;
height : 114px;
background-size : contain;
diff --git a/src/Components/UploadPageComponents/Forms/SobreORecurso.js b/src/Components/UploadPageComponents/Forms/SobreORecurso.js
index aed295a3fa6dbf205e0a7f8e8f9e73ead515fa49..f0c43d9e6e007a3ac3681e5410c73f5eba8df2a4 100644
--- a/src/Components/UploadPageComponents/Forms/SobreORecurso.js
+++ b/src/Components/UploadPageComponents/Forms/SobreORecurso.js
@@ -46,8 +46,8 @@ function SobreORecurso (props) {
return (
<FormControl style={{width : "100%"}}>
- <StyledFormLabel contrast ={props.contrast} component="legend" style={{fontSize : "14px", marginBottom : "10px"}}>
- <b>Descrição geral do Recurso</b> (Opcional)
+ <StyledFormLabel contrast={props.contrast} component="legend" style={{fontSize : "14px", marginBottom : "10px"}}>
+ <span><b>Descrição geral do Recurso</b> (Opcional)</span>
</StyledFormLabel>
<StyledTextField
InputProps={props.contrast === "" ? { className: classes.lightTextField } : { className: classes.darkTextField }}
diff --git a/src/Components/UploadPageComponents/ModalCancelar.js b/src/Components/UploadPageComponents/ModalCancelar.js
index 998a87a7de5ec27a58f4db9baa3f4476bdc48ba6..ce980740a0089e6ffa368fa6494bace05cb36fe6 100644
--- a/src/Components/UploadPageComponents/ModalCancelar.js
+++ b/src/Components/UploadPageComponents/ModalCancelar.js
@@ -136,9 +136,6 @@ const StyledButton = styled(Button)`
color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"} !important;
text-decoration: ${props => props.contrast === "" ? "none" : "yellow underline"} !important;
- &:hover {
- background-color : ${props => props.contrast === "" ? "rgba(158,158,158,0.2)" : "yellow"} !important;
- }
max-height : 36px !important;
background-color : transparent !important;
diff --git a/src/Components/UploadPageComponents/PartOne.js b/src/Components/UploadPageComponents/PartOne.js
index a97248e2bc55c72ffc4d07fb71149c0487c070b9..66c18a516774994d570b3124d0b6fcde319ab77e 100644
--- a/src/Components/UploadPageComponents/PartOne.js
+++ b/src/Components/UploadPageComponents/PartOne.js
@@ -213,7 +213,7 @@ export default function PartOne(props) {
)
:
(
- <LoadingSpinner text={"CARREGANDO"} />
+ <LoadingSpinner contrast={props.contrast} text={"CARREGANDO"} />
)
}
</React.Fragment >
diff --git a/src/Components/UploadPageComponents/PartThree.js b/src/Components/UploadPageComponents/PartThree.js
index f5634972a31d295aa28e982f92c28a814357c93e..076569fe9c5ebe7d20f97a07f05eef028a89bf1d 100644
--- a/src/Components/UploadPageComponents/PartThree.js
+++ b/src/Components/UploadPageComponents/PartThree.js
@@ -128,7 +128,7 @@ export default function PartThree(props) {
{
draft.tags &&
<div className="tags-objeto">
- Palavras chave:
+ Palavras chave: <br/>
{draft.tags.map((tag) => {
return (
<div className="tag" key={tag.name}>{tag.name}</div>
@@ -248,7 +248,7 @@ export default function PartThree(props) {
)
:
(
- <LoadingSpinner text="CARREGANDO" />
+ <LoadingSpinner contrast={props.contrast} text="CARREGANDO" />
)
}
</React.Fragment>
@@ -311,6 +311,7 @@ const CaixaContainer = styled.div`
margin-top: 0;
margin-bottom: 10px;
color: ${props => props.contrast === "" ? "#666" : "white"};
+ overflow: auto;
.img-objeto {
background: ${props => props.contrast === "" ? "#e5e5e5" : "black"};
@@ -392,6 +393,7 @@ const CaixaContainer = styled.div`
min-height : 275px;
display : flex;
background: ${props => props.contrast === "" ? "#fff" : "black"};
+ border: ${props => props.contrast === "" ? "0" : "1px solid white"};
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
padding: 0;
position: relative;
diff --git a/src/Components/UploadPageComponents/PartTwo.js b/src/Components/UploadPageComponents/PartTwo.js
index 39f6c697ffe577bcdb6fc9a94f3f89587bd58414..802642796e3df7acbea725f0d2cc6fdfbdd4b221 100644
--- a/src/Components/UploadPageComponents/PartTwo.js
+++ b/src/Components/UploadPageComponents/PartTwo.js
@@ -257,7 +257,7 @@ export default function PartTwo(props) {
<Grid item xs={12} style={{ paddingBottom: "40px" }}>
<StyledFormControl required contrast={props.contrast}>
<StyledFormLabel contrast={props.contrast} component="legend" style={{ fontSize: "14px", marginBottom: "10px" }} >
- <b>Confirme se você concorda com os <strong onClick={() => window.open("/termos/", "_blank")} style={props.contrast === "" ? { color: "#ff7f00" } : { color: "yellow", textDecoration: "underline", cursor: "pointer" }}>termos de uso e de propriedade intelectual</strong></b>
+ <b>Confirme se você concorda com os <strong onClick={() => window.open("/termos/", "_blank")} style={props.contrast === "" ? { color: "#ff7f00", cursor: "pointer" } : { color: "yellow", textDecoration: "underline", cursor: "pointer" }}>termos de uso e de propriedade intelectual</strong></b>
</StyledFormLabel>
<FormControlLabel label={<span className="label">Li e concordo com os termos de uso e de propriedade intelectual.</span>} control={props.contrast === "" ? <BlueCheckBox checked={termsCheckbox} onChange={toggleCheckbox} /> : <ContrastCheckBox checked={termsCheckbox} onChange={toggleCheckbox} />}
/>
diff --git a/src/Components/UploadPageComponents/Stepper.js b/src/Components/UploadPageComponents/Stepper.js
index 3034d10028f2d36c21dbdb8f1ddbf3ef5da39b57..4175e17f10d43636e90f912f49f8866e6ee1501b 100644
--- a/src/Components/UploadPageComponents/Stepper.js
+++ b/src/Components/UploadPageComponents/Stepper.js
@@ -22,55 +22,54 @@ import Check from '@material-ui/icons/Check';
import Grid from '@material-ui/core/Grid';
export default function CustomizedSteppers(props) {
- console.log(props);
+ console.log(props);
- return (
- <MainGrid contrast={props.contrast} container direction='row' justify='space-between' alignItems='center'>
- {
- [0, 1, 2].map((index) => {
- return (
- <Grid item key={new Date().toISOString() + index}>
- <div className={props.activeStep === index ? "currStep" : "step"}>
- {
- index < props.activeStep ?
- <Check style={props.contrast === "" ? { color: "#00bcd4" } : { color: "white" }} /> : index
- }
- </div>
- </Grid>
- )
- })
- }
- </MainGrid >
- );
+ return (
+ <MainGrid contrast={props.contrast} container direction='row' justify='space-between' alignItems='center'>
+ {
+ [0, 1, 2].map((index) => {
+ return (
+ <Grid item key={new Date().toISOString() + index}>
+ <div className={props.activeStep === index ? "currStep" : "step"}>
+ {
+ index < props.activeStep ?
+ <Check style={props.contrast === "" ? { color: "#666" } : { color: "white" }} /> : `${index + 1}`
+ }
+ </div>
+ </Grid>
+ )
+ })
+ }
+ </MainGrid >
+ );
}
const MainGrid = styled(Grid)`
- padding: 1em;
- border-radius: 50px;
- width: 90%;
- margin: 0 auto;
- border: ${props => props.contrast === "" ? "2px solid #d4d4d4" : "2px solid white"};
+ padding: 1em;
+ border-radius: 50px;
+ width: 90%;
+ margin: 0 auto;
+ border: ${props => props.contrast === "" ? "2px solid #d4d4d4" : "2px solid white"};
+ color: ${props => props.contrast === "" ? "#666" : "white"};
- .currStep{
- height: 30px;
- width: 30px;
- display: flex;
- justify-content: center;
- align-items: center;
- border: 2px solid rgba(255, 255, 255, 0.6);
- color: white;
- background-color: ${props => props.contrast === "" ? "#00bcd4" : "black"};
- border-radius: 50%;
- }
+ .currStep{
+ height: 30px;
+ width: 30px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border: 2px solid rgba(255, 255, 255, 0.6);
+ border-radius: 50%;
+ }
- .step{
- height: 30px;
- width: 30px;
- display: flex;
- justify-content: center;
- align-items: center;
- border: ${props => props.contrast === "" ? "2px solid #00bcd4" : "2px solid white"};
- border-radius: 50%;
- }
+ .step{
+ height: 30px;
+ width: 30px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border: ${props => props.contrast === "" ? "2px solid #00bcd4" : "2px solid white"};
+ border-radius: 50%;
+ }
`
diff --git a/src/Components/UploadPageComponents/StyledComponents.js b/src/Components/UploadPageComponents/StyledComponents.js
index a4a9dba87c903249c3ab8fa3b87f7f6578515e3a..755942670cd73307035f3de0bc9fdcb641deb6d7 100644
--- a/src/Components/UploadPageComponents/StyledComponents.js
+++ b/src/Components/UploadPageComponents/StyledComponents.js
@@ -76,10 +76,11 @@ export const BlueButton = styled(Button)`
export const GrayButton = styled(Button)`
&:hover {
- background-color: ${props => props.contrast === "" ? "rgba(158,158,158,0.2) !important" : "rgba(255,255,0,0.24) !important"};
+ background-color: ${props => props.contrast === "" ? "rgba(158,158,158,0.2) !important" : "rgba(255,255,0,0.24) !important"};
}
- color : ${props => props.contrast === "" ? "#666 !important" : "yellow !important"};
- text-decoration: ${props => props.contrast === "" ? "none !important" : "underline !important"};
+ color: ${props => props.contrast === "" ? "#666" : "yellow"} !important;
+ text-decoration: ${props => props.contrast === "" ? "none" : "yellow underline" } !important;
+
background-color : ${props => props.contrast === "" ? "transparent !important" : "black !important"};
border : ${props => props.contrast === "" ? "none !important" : "1px solid white !important"};
font-weight : 600 !important;
@@ -113,6 +114,9 @@ export const GrayButton = styled(Button)`
font-style : inherit;
font-variant : inherit;
}
+
+ margin-left : 8px !important;
+ margin-right : 8px !important;
`
export const WrapperBox = styled.div`
@@ -437,55 +441,55 @@ export function StyledRadio(props) {
}
export const StyledDiv = styled.div`
- display : flex;
- margin-top : 30px;
- justify-content : space-evenly;
+ display : flex;
+ margin-top : 30px;
+ justify-content : space-evenly;
`
export const OrangeButton = styled(Button)`
max-height : 36px !important;
- box-shadow : 0 2px 5px 0 rgba(0,0,0,.26) !important;
- font-weight : 600 !important;
- background: ${props => props.contrast === "" ? " #ff7f00 !important" : "black !important"};
- color: ${props => props.contrast === "" ? "rgba(255,255,255,0.87) !important" : "yellow !important"};
- border: ${props => props.contrast === "" ? "" : "1px solid white !important"};
- text-decoration: ${props => props.contrast === "" ? "none !important" : "underline !important"};
- margin-left : 8px !important;
- margin-right : 8px !important;
- &:hover {
+ box-shadow : 0 2px 5px 0 rgba(0,0,0,.26) !important;
+ font-weight : 600 !important;
+ background: ${props => props.contrast === "" ? " #ff7f00 !important" : "black !important"};
+ color: ${props => props.contrast === "" ? "rgba(255,255,255,0.87) !important" : "yellow !important"};
+ border: ${props => props.contrast === "" ? "" : "1px solid white !important"};
+ text-decoration: ${props => props.contrast === "" ? "none !important" : "underline !important"};
+ margin-left : 8px !important;
+ margin-right : 8px !important;
+ &:hover {
background: ${props => props.contrast === "" ? "" : "rgba(255,255,0,0.24) !important"};
- }
+ }
`
export const GreyButton = styled(Button)`
-
-
- background: ${props => props.contrast === "" ? "transparent !important" : "black !important"};
- color: ${props => props.contrast === "" ? "#666 !important" : "yellow !important"};
- border: ${props => props.contrast === "" ? "" : "1px solid white !important"};
- text-decoration: ${props => props.contrast === "" ? "none !important" : "underline !important"};
- outline : none !important;
- text-align : center !important;
-
- .button-text {
- cursor : pointer;
- text-align : center;
- color : currentColor;
- white-space : nowrap;
- text-transform : uppercase;
- font-weight : 600 !important;
- font-style : inherit;
- font-variant : inherit;
- }
+ background: ${props => props.contrast === "" ? "transparent !important" : "black !important"};
+ color: ${props => props.contrast === "" ? "#666 !important" : "yellow !important"};
+ border: ${props => props.contrast === "" ? "" : "1px solid white !important"};
+ text-decoration: ${props => props.contrast === "" ? "none !important" : "underline !important"};
+ outline : none !important;
+ text-align : center !important;
+
+ margin-left : 8px !important;
+ margin-right : 8px !important;
+
+ .button-text {
+ cursor : pointer;
+ text-align : center;
+ color : currentColor;
+ white-space : nowrap;
+ text-transform : uppercase;
+ font-weight : 600 !important;
+ font-style : inherit;
+ font-variant : inherit;
+ }
`
export const Background = styled.div`
- padding-top : 40px;
- background: ${props => props.contrast === "" ? "#f4f4f4" : "black"};
- color: ${props => props.contrast === "" ? "#666" : "white"};
+ padding-top : 40px;
+ background: ${props => props.contrast === "" ? "#f4f4f4" : "black"};
+ color: ${props => props.contrast === "" ? "#666" : "white"};
-
- .container {
+ .container {
padding : 0;
margin-right : auto;
margin-left : auto;
@@ -494,13 +498,13 @@ export const Background = styled.div`
@media screen and (min-width: 768px) {
- width : 750px;
+ width : 750px;
}
@media screen and (min-width: 992px) {
width : 970px;
- }
+ }
@media screen and (min-width: 1200px) {
- width : 1170px;
+ width : 1170px;
}
}
`
diff --git a/src/Pages/EditLearningObjectPage.js b/src/Pages/EditLearningObjectPage.js
index c785bf3564d672834c0ed00f964fcc139040a8c5..2f1a37f19a8a86d6b3733a2040f9ae595365dd62 100644
--- a/src/Pages/EditLearningObjectPage.js
+++ b/src/Pages/EditLearningObjectPage.js
@@ -227,13 +227,13 @@ export default function EditLearningObjectPage (props) {
const chooseRenderStageThumbnail = () => {
switch(thumbnailStage) {
case 'uploading':
- return (<LoadingDiv/>)
+ return (<LoadingDiv contrast={state.contrast}/>)
case 'done':
- return (<DisplayThumbnail acceptFile={acceptFile} thumbnail={`${apiDomain}` + thumbnail} onEditPage={true} handleDelete={handleDeleteThumbnail}/>)
+ return (<DisplayThumbnail contrast={state.contrast} acceptFile={acceptFile} thumbnail={`${apiDomain}` + thumbnail} onEditPage={true} handleDelete={handleDeleteThumbnail}/>)
case 'editing':
- return (<EditThumbnail finalizeThumb={finalizeThumb} tempImgURL={tempUrl} updateThumb={updateThumb}/>)
+ return (<EditThumbnail contrast={state.contrast} finalizeThumb={finalizeThumb} tempImgURL={tempUrl} updateThumb={updateThumb}/>)
default :
- return (<DragAndDropThumbnail acceptFile={acceptFile} onEditPage={true}/>)
+ return (<DragAndDropThumbnail contrast={state.contrast} acceptFile={acceptFile} onEditPage={true}/>)
}
}
@@ -258,14 +258,14 @@ export default function EditLearningObjectPage (props) {
{
!loading ?
(
- <Background>
+ <Background contrast={state.contrast}>
<div className="container">
<Grid container spacing={2}>
<Grid item md={4} xs={12}>
- <UploadFileWrapper draftID={recursoId} prevFile={learningObject.attachments ? learningObject.attachments[0] : null}/>
+ <UploadFileWrapper contrast={state.contrast} draftID={recursoId} prevFile={learningObject.attachments ? learningObject.attachments[0] : null}/>
</Grid>
<Grid item md={8} xs={12}>
- <InfoBox>
+ <InfoBox contrast={state.contrast}>
<form>
<div className="cabecalho">
<h2>Editar Recurso</h2>
@@ -277,22 +277,22 @@ export default function EditLearningObjectPage (props) {
<Grid container style={{paddingLeft : "15px", paddingRight : "15px"}}>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <NewTitle draftID={learningObject.id} initialValue={learningObject.name}
+ <NewTitle contrast={state.contrast} draftID={learningObject.id} initialValue={learningObject.name}
onBlurCallback={onBlurCallback}
/>
</Grid>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <SobreORecurso draftID={learningObject.id} initialValue={learningObject.description} onBlurCallback={onBlurCallback}/>
+ <SobreORecurso contrast={state.contrast} draftID={learningObject.id} initialValue={learningObject.description} onBlurCallback={onBlurCallback}/>
</Grid>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <Keywords draftID={learningObject.id} initialValue={learningObject.tags !== undefined ? learningObject.tags.map((tag) => tag.name) : null}
+ <Keywords contrast={state.contrast} draftID={learningObject.id} initialValue={learningObject.tags !== undefined ? learningObject.tags.map((tag) => tag.name) : null}
onBlurCallback={onBlurCallback}/>
</Grid>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <Autor draftID={learningObject.id}
+ <Autor contrast={state.contrast} draftID={learningObject.id}
initialValue={
learningObject.author === state.currentUser.name ?
0 : 1
@@ -306,44 +306,44 @@ export default function EditLearningObjectPage (props) {
</Grid>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <TipoDeRecurso objTypes={objTypes} draftID={learningObject.id}
+ <TipoDeRecurso contrast={state.contrast} objTypes={objTypes} draftID={learningObject.id}
initialValue={learningObject.object_type !== undefined && learningObject.object_type !== null ? objTypes.filter((type) => type.name === learningObject.object_type)[0].id : null} onBlurCallback={onBlurCallback} />
</Grid>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <Idioma languages={languages} draftID={learningObject.id}
+ <Idioma contrast={state.contrast} languages={languages} draftID={learningObject.id}
initialValue={learningObject.language !== undefined ? learningObject.language.map((language) => language.name) : null} initialIDValues={learningObject.language !== undefined ? learningObject.language.map((language) => language.id) : null}
onBlurCallback={onBlurCallback} />
</Grid>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <EducationalStage draftID={learningObject.id} eduStages={eduStages} initialValue={learningObject.educational_stages !== null ? learningObject.educational_stages.map((stage) => String(stage.id)) : null} onBlurCallback={onBlurCallback}
+ <EducationalStage contrast={state.contrast} draftID={learningObject.id} eduStages={eduStages} initialValue={learningObject.educational_stages !== null ? learningObject.educational_stages.map((stage) => String(stage.id)) : null} onBlurCallback={onBlurCallback}
/>
</Grid>
- <SubjectsAndThemes draftId={learningObject.id} subjects={subjects} initialValue={learningObject.subjects !== null ? learningObject.subjects.map(subject => String(subject.id)) : null} onBlurCallback={onBlurCallback}/>
+ <SubjectsAndThemes contrast={state.contrast} draftId={learningObject.id} subjects={subjects} initialValue={learningObject.subjects !== null ? learningObject.subjects.map(subject => String(subject.id)) : null} onBlurCallback={onBlurCallback}/>
<Grid item xs={12} style={{paddingBottom : "40px"}}>
- <Licenca draftID={learningObject.id} initialValue={learningObject.license ? learningObject.license.id : null} onBlurCallback={onBlurCallback}/>
+ <Licenca contrast={state.contrast} draftID={learningObject.id} initialValue={learningObject.license ? learningObject.license.id : null} onBlurCallback={onBlurCallback}/>
</Grid>
<Grid item xs={12}>
<div style={{display : "flex", justifyContent : "center"}}>
- <GreyButton onClick={handleDelete}>
- <span className="button-text">
+ <GreyButton contrast={state.contrast} onClick={handleDelete}>
+ <span className="button-text">
EXCLUIR
- </span>
- </GreyButton>
+ </span>
+ </GreyButton>
- <GreyButton onClick={props.history.goBack}>
- <span className="button-text">
+ <GreyButton contrast={state.contrast} onClick={props.history.goBack}>
+ <span className="button-text">
CANCELAR
- </span>
- </GreyButton>
+ </span>
+ </GreyButton>
- <OrangeButton onClick={() => {handleUpdateInfo()}}>
+ <OrangeButton contrast={state.contrast} onClick={() => {handleUpdateInfo()}}>
SALVAR ALTERAÇÕES
- </OrangeButton>
+ </OrangeButton>
{/*
learningObject.state === "draft" &&
@@ -354,11 +354,11 @@ export default function EditLearningObjectPage (props) {
{
checkAccessLevel("partner") ?
(
- <OrangeButton onClick={() => {handleUpdateInfo(); handlePost()}}>PUBLICAR RECURSO</OrangeButton>
+ <OrangeButton contrast={state.contrast} onClick={() => {handleUpdateInfo(); handlePost()}}>PUBLICAR RECURSO</OrangeButton>
)
:
(
- <OrangeButton onClick={() => {handleUpdateInfo(); handleSubmit()}}>SUBMETER RECURSO</OrangeButton>
+ <OrangeButton contrast={state.contrast} onClick={() => {handleUpdateInfo(); handleSubmit()}}>SUBMETER RECURSO</OrangeButton>
)
}
@@ -381,7 +381,7 @@ export default function EditLearningObjectPage (props) {
)
:
(
- <LoadingSpinner text={"CARREGANDO"}/>
+ <LoadingSpinner contrast={state.contrast} text={"CARREGANDO"}/>
)
}
</React.Fragment>
diff --git a/src/Pages/PublicationPermissionsPage.js b/src/Pages/PublicationPermissionsPage.js
index 1b26c710296fdb788afdf8ce268c80f1b955c6d8..986e371e22795ae7a8b70bd33a1d5407ac16a0a8 100644
--- a/src/Pages/PublicationPermissionsPage.js
+++ b/src/Pages/PublicationPermissionsPage.js
@@ -208,7 +208,7 @@ export default function PermissionsContainer(props) {
handleChange={handleChecked}
/>
<div
- style={{ justifyContent: "center", display: "flex" }}
+ style={{ justifyContent: "left", display: "flex", marginTop: "15px" }}
>
<StyledContinuar
disabled={unavailableButton || unavailableCheckbox}
@@ -236,7 +236,7 @@ export default function PermissionsContainer(props) {
)
:
(
- <LoadingSpinner text="Carregando..." />
+ <LoadingSpinner contrast={state.contrast} text="Carregando..." />
)
}
</>
diff --git a/src/Pages/TabsHelp/TabManageAc.js b/src/Pages/TabsHelp/TabManageAc.js
index d9eb10cd989199f0caf25687b4e58c643d466ee0..dd9f12bcbc05dc219b1dde137c811b2b8d0f1318 100644
--- a/src/Pages/TabsHelp/TabManageAc.js
+++ b/src/Pages/TabsHelp/TabManageAc.js
@@ -37,253 +37,236 @@ import { Store } from '../../Store';
import { GerenciandoConta } from "ImportImages.js";
export default function TabManageAc(props) {
- const { state } = useContext(Store);
- const tabs = [
- "Por que me cadastrar?",
- "Como fazer meu cadastro?",
- "Como alterar minha senha?",
- "Como acessar a conta?",
- "Esqueci minha senha. O que fazer?",
- "Gerenciando a Conta"
- ];
-
- const [tabValue, setTabValue] = useState(props.location.state === "undefined" ? 0 : props.location.state);
-
- const handleChangeTab = (e, newValue) => {
- setTabValue(newValue);
- };
-
- useEffect(() => { window.scrollTo(0, 0) }, [])
-
- return (
- <div style={state.contrast === "" ? { backgroundColor: "#f4f4f4" } : { backgroundColor: "black" }}>
- <link
- href="https://fonts.googleapis.com/css?family=Pompiere|Roboto:500,400&display=swap"
- rel="stylesheet"
- />
-
- <Secao>
- <BreadCrumbsDiv>
- <StyledBreadCrumbs contrast={state.contrast}>
- <Link to="/">Página Inicial</Link>
- <Link to="ajuda">Ajuda</Link>
-
- <span>{tabs[5]}</span>
- </StyledBreadCrumbs>
- </BreadCrumbsDiv>
- <Grid container justify="center">
- <Grid item xs={12} md={10} >
- <Principal contrast={state.contrast}>
- <Menu contrast={state.contrast}>
- <div className="fixo">
- <img src={GerenciandoConta} alt="Gerenciando a conta" />
- <span>{tabs[5]}</span>
- </div>
- <TabsStyled contrast={state.contrast} orientation="vertical"
- variant="scrollable"
- value={tabValue}
- onChange={handleChangeTab}
- TabIndicatorProps={{ style: { display: "none" } }}
- >
- <TabStyled contrast={state.contrast} label={tabs[0]}></TabStyled>
- <TabStyled contrast={state.contrast} label={tabs[1]}></TabStyled>
- <TabStyled contrast={state.contrast} label={tabs[2]}></TabStyled>
- <TabStyled contrast={state.contrast} label={tabs[3]}></TabStyled>
- <TabStyled contrast={state.contrast} label={tabs[4]}></TabStyled>
- </TabsStyled>
- <br />
- <div className="voltarInicio">
- <a href="ajuda">VOLTAR AO ÃNICIO</a>
- </div>
- </Menu>
-
- {tabValue === 0 && <Why contrast={state.contrast} title={tabs[0]} />}
- {tabValue === 1 && <HowToDo contrast={state.contrast} title={tabs[1]} />}
- {tabValue === 2 && <HowToChange contrast={state.contrast} title={tabs[2]} />}
- {tabValue === 3 && <HowToAccess contrast={state.contrast} title={tabs[3]} />}
- {tabValue === 4 && <Forget contrast={state.contrast} title={tabs[4]} />}
- <div className="resultadosProcura">
- <span>Não era bem o que você procurava?</span>
- <div className="subtitulo">
- <span>Você pode navegar pelos tópicos de ajuda ou entrar em <a href="contato">Contato</a>.</span>
- </div>
- </div>
-
- </Principal>
- </Grid>
- </Grid>
-
-
- <Grid style={{ paddingBottom: "50px" }} container justify={"center"}>
- <Grid item xs={12} md={3} style={{ margin: 5 }}>
- <CardPublicando contrast={state.contrast} />
- </Grid>
- <Grid item xs={12} md={3} style={{ margin: 5 }}>
- <CardEncontrando contrast={state.contrast} />
- </Grid>
- <Grid item xs={12} md={3} style={{ margin: 5 }}>
- <CardParticipando contrast={state.contrast} />
- </Grid>
- </Grid>
- </Secao>
- </div>
- );
+ const { state } = useContext(Store);
+ const tabs = [
+ "Por que me cadastrar?",
+ "Como fazer meu cadastro?",
+ "Como alterar minha senha?",
+ "Como acessar a conta?",
+ "Esqueci minha senha. O que fazer?",
+ "Gerenciando a Conta"
+ ];
+
+ const [tabValue, setTabValue] = useState(props.location.state === "undefined" ? 0 : props.location.state);
+
+ const handleChangeTab = (e, newValue) => {
+ setTabValue(newValue);
+ };
+
+ useEffect(() => { window.scrollTo(0, 0) }, [])
+
+ return (
+ <div style={state.contrast === "" ? { backgroundColor: "#f4f4f4" } : { backgroundColor: "black" }}>
+ <link
+ href="https://fonts.googleapis.com/css?family=Pompiere|Roboto:500,400&display=swap"
+ rel="stylesheet"
+ />
+ <Secao>
+ <BreadCrumbsDiv>
+ <StyledBreadCrumbs contrast={state.contrast}>
+ <Link to="/">Página Inicial</Link>
+ <Link to="ajuda">Ajuda</Link>
+ <span>{tabs[5]}</span>
+ </StyledBreadCrumbs>
+ </BreadCrumbsDiv>
+ <Grid container justify="center">
+ <Grid item xs={12} md={10} >
+ <Principal contrast={state.contrast}>
+ <Menu contrast={state.contrast}>
+ <div className="fixo">
+ <img src={GerenciandoConta} alt="Gerenciando a conta" />
+ <span>{tabs[5]}</span>
+ </div>
+ <TabsStyled contrast={state.contrast} orientation="vertical"
+ variant="scrollable"
+ value={tabValue}
+ onChange={handleChangeTab}
+ TabIndicatorProps={{ style: { display: "none" } }}
+ >
+ <TabStyled contrast={state.contrast} label={tabs[0]}></TabStyled>
+ <TabStyled contrast={state.contrast} label={tabs[1]}></TabStyled>
+ <TabStyled contrast={state.contrast} label={tabs[2]}></TabStyled>
+ <TabStyled contrast={state.contrast} label={tabs[3]}></TabStyled>
+ <TabStyled contrast={state.contrast} label={tabs[4]}></TabStyled>
+ </TabsStyled>
+ <br/>
+ <div className="voltarInicio">
+ <a href="ajuda">VOLTAR AO ÃNICIO</a>
+ </div>
+ </Menu>
+ {tabValue === 0 && <Why contrast={state.contrast} title={tabs[0]} />}
+ {tabValue === 1 && <HowToDo contrast={state.contrast} title={tabs[1]} />}
+ {tabValue === 2 && <HowToChange contrast={state.contrast} title={tabs[2]} />}
+ {tabValue === 3 && <HowToAccess contrast={state.contrast} title={tabs[3]} />}
+ {tabValue === 4 && <Forget contrast={state.contrast} title={tabs[4]} />}
+ <div className="resultadosProcura">
+ <span>Não era bem o que você procurava?</span>
+ <div className="subtitulo">
+ <span>Você pode navegar pelos tópicos de ajuda ou entrar em <a href="contato">Contato</a>.</span>
+ </div>
+ </div>
+ </Principal>
+ </Grid>
+ </Grid>
+ <Grid style={{ paddingBottom: "50px" }} container justify={"center"}>
+ <Grid item xs={12} md={3} style={{ margin: 5 }}>
+ <CardPublicando contrast={state.contrast} />
+ </Grid>
+ <Grid item xs={12} md={3} style={{ margin: 5 }}>
+ <CardEncontrando contrast={state.contrast} />
+ </Grid>
+ <Grid item xs={12} md={3} style={{ margin: 5 }}>
+ <CardParticipando contrast={state.contrast} />
+ </Grid>
+ </Grid>
+ </Secao>
+ </div>
+ );
}
const StyledBreadCrumbs = styled(Breadcrumbs)`
- display : flex;
- justify-content : flex-start;
- span {
- color: ${props => props.contrast === "" ? "#a5a5a5" : "white"};
- }
- a {
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- }
+ display : flex;
+ justify-content : flex-start;
+ span {
+ color: ${props => props.contrast === "" ? "#a5a5a5" : "white"};
+ }
+ a {
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ }
`
const BreadCrumbsDiv = styled.div`
-
- padding : 10px;
- display : flex;
+ padding : 10px;
+ display : flex;
`
const Principal = styled.div`
- .fixo {
- background-color: ${props => props.contrast === "" ? "#fff" : "black"};
- height: 40px;
- text-align: center;
- padding: 30px;
- margin-bottom: 30px;
-
- img {
- height: 50px;
- width: 50px;
- margin-right: 40px;
- vertical-align: middle;
-
+ .fixo {
+ background-color: ${props => props.contrast === "" ? "#fff" : "black"};
+ height: 40px;
+ text-align: center;
+ padding: 30px;
+ margin-bottom: 30px;
+
+ img {
+ height: 50px;
+ width: 50px;
+ margin-right: 40px;
+ vertical-align: middle;
+ }
+
+ span {
+ font-size: 20px;
+ color: ${props => props.contrast === "" ? "" : "white"};
+ }
}
- span {
- font-size: 20px;
- color: ${props => props.contrast === "" ? "" : "white"};
+ .resultadosProcura {
+ text-align: center;
+ margin-block: 30px;
+ padding-inline: 15px;
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ span {
+ font-size: 24px;
+ }
+ .subtitulo {
+ margin-top: 10px;
+
+ span {
+ font-size: 15px
+ }
+
+ a {
+ font-size: 15px;
+ padding: 0;
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ }
+ }
}
-
-
-
- }
- .resultadosProcura {
- text-align: center;
- margin-block: 30px;
- padding-inline: 15px;
- color: ${props => props.contrast === "" ? "#666" : "white"};
- span {
- font-size: 24px;
- }
- .subtitulo {
- margin-top: 10px;
-
- span {
- font-size: 15px
- }
-
- a {
- font-size: 15px;
- padding: 0;
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- }
-
- }
- }
-
`
const TabsStyled = styled(Tabs)`
- color: ${props => props.contrast === "" ? "" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- .Mui-selected {
- background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
- }
-
- .MuiTab-root{
- text-transform: none !important;
- max-width:100%
- }
- text-align: center;
- width:100%
+ color: ${props => props.contrast === "" ? "" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ .Mui-selected {
+ background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
+ }
+ .MuiTab-root{
+ text-transform: none !important;
+ max-width:100%
+ }
+ text-align: center;
+ width:100%;
`
const TabStyled = styled(Tab)`
- color: ${props => props.contrast === "" ? "" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- padding: 4px 15px !important;
- font-weight: 500;
- font-size: 14px !important;
- border-radius: 4px !important;
- text-align: center;
-
- &:hover {
- background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
- }
+ color: ${props => props.contrast === "" ? "" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ padding: 4px 15px !important;
+ font-weight: 500;
+ font-size: 14px !important;
+ border-radius: 4px !important;
+ text-align: center;
+
+ &:hover {
+ background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
+ }
`
const Menu = styled.div`
- width: auto;
- background-color: ${props => props.contrast === "" ? "#fff" : "black"};
- color: ${props => props.contrast === "" ? "#666" : "white"};
- padding-block: 10px;
- box-shadow: ${props => props.contrast === "" ? "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)" : "0 1px 3px rgba(254,254,254,.48),0 1px 2px rgba(254,254,254,.48)"};
- margin-bottom:30px
-
-
- h4 {
- padding-inline: 15px;
- font-size: 18px;
- margin-block: 10px;
- font-weight: 500;
- line-height: 1.1;
- }
-
- .voltarInicio {
- padding: 4px 15px;
- font-size: 15px;
- text-align: center;
- a {
- font-size: 15px;
- padding: 0;
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ width: auto;
+ background-color: ${props => props.contrast === "" ? "#fff" : "black"};
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ padding-block: 10px;
+ box-shadow: ${props => props.contrast === "" ? "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)" : "0 1px 3px rgba(254,254,254,.48),0 1px 2px rgba(254,254,254,.48)"};
+ margin-bottom:30px
+
+ h4 {
+ padding-inline: 15px;
+ font-size: 18px;
+ margin-block: 10px;
+ font-weight: 500;
+ line-height: 1.1;
}
- }
-
- hr {
- border: 0;
- border-top: 1px solid #ccc;
- margin-top: 20px;
- margin-bottom: 20px;
- }
-
- .procurava {
- padding: 4px 15px;
- font-size: 15px;
- text-align: center;
- a {
- font-size: 15px;
- padding: 0;
- color:#00bcd4;
- text-decoration: none;
+ .voltarInicio {
+ padding: 4px 15px;
+ font-size: 15px;
+ text-align: center;
+ a {
+ font-size: 15px;
+ padding: 0;
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ }
}
- }
+ hr {
+ border: 0;
+ border-top: 1px solid #ccc;
+ margin-top: 20px;
+ margin-bottom: 20px;
+ }
+ .procurava {
+ padding: 4px 15px;
+ font-size: 15px;
+ text-align: center;
+
+ a {
+ font-size: 15px;
+ padding: 0;
+ color:#00bcd4;
+ text-decoration: none;
+ }
+ }
`
const Secao = styled.div`
- margin-inline: auto;
-
+ margin-inline: auto;
`
diff --git a/src/Pages/TabsHelp/TabResourseFind.js b/src/Pages/TabsHelp/TabResourseFind.js
index bb6395cc15781d758bd02802106e8670f9e22cac..905650f8f3f0d5f37f393365dea4f56024798934 100644
--- a/src/Pages/TabsHelp/TabResourseFind.js
+++ b/src/Pages/TabsHelp/TabResourseFind.js
@@ -35,254 +35,238 @@ import { Store } from '../../Store';
import { EncontrandoRecurso } from "ImportImages.js";
export default function TabResourseFind(props) {
- const { state } = useContext(Store)
- const tabs = [
- 'Como fazer uma busca?',
- 'Como filtrar os resultados?',
- 'Como os recursos são ranqueados?',
- 'Encontrando Recursos'
- ]
-
- const [tabValue, setTabValue] = useState(props.location.state === "undefined" ? 0 : props.location.state);
-
- const handleChangeTab = (e, newValue) => {
- setTabValue(newValue)
- }
-
- useEffect(() => { window.scrollTo(0, 0) }, [])
-
- return (
- <div style={state.contrast === "" ? { backgroundColor: "#f4f4f4" } : { backgroundColor: "black" }}>
- <link href="https://fonts.googleapis.com/css?family=Pompiere|Roboto:500,400&display=swap" rel="stylesheet" />
- <Secao>
- <BreadCrumbsDiv contrast={state.contrast}>
- <StyledBreadCrumbs>
- <Link to="/" >
- Página Inicial
- </Link>
- <Link to="ajuda" >
- Ajuda
- </Link>
-
- <span>
- {tabs[3]}
- </span>
-
- </StyledBreadCrumbs>
-
- </BreadCrumbsDiv>
- <Grid container justify="center">
- <Grid item xs={12} md={10} >
- <Principal contrast={state.contrast}>
- <Menu contrast={state.contrast}>
- <div className="fixo">
- <img src={EncontrandoRecurso} alt="Encontrando Recursos" />
- <span>{tabs[3]}</span>
- </div>
- <TabsStyled
- contrast={state.contrast}
- orientation="vertical"
- variant="scrollable"
- value={tabValue}
- onChange={handleChangeTab}
- TabIndicatorProps={{ style: { display: "none" } }}
- >
- <TabStyled contrast={state.contrast} label={tabs[0]}></TabStyled>
- <TabStyled contrast={state.contrast} label={tabs[1]}></TabStyled>
- <TabStyled contrast={state.contrast} label={tabs[2]}></TabStyled>
- </TabsStyled>
- <br />
- <div className="voltarInicio">
- <a href="ajuda">VOLTAR AO ÃNICIO</a>
- </div>
- </Menu>
-
- {tabValue === 0 && <HowToDo contrast={state.contrast} title={tabs[0]} />}
- {tabValue === 1 && <HowToFilter contrast={state.contrast} title={tabs[1]} />}
- {tabValue === 2 && <HowToRank contrast={state.contrast} title={tabs[2]} />}
- <div className="resultadosProcura">
- <span>Não era bem o que você procurava?</span>
- <div className="subtitulo">
- <span>Você pode navegar pelos tópicos de ajuda ou entrar em <a href="contato">Contato</a>.</span>
- </div>
- </div>
-
-
- </Principal>
- </Grid>
- </Grid>
- <Grid style={{ paddingBottom: "50px" }} container justify={"center"}>
- <Grid item xs={12} md={3} style={{ margin: 5 }}>
- <CardPublicando contrast={state.contrast} />
- </Grid>
- <Grid item xs={12} md={3} style={{ margin: 5 }}>
- <CardParticipando contrast={state.contrast} />
- </Grid>
- <Grid item xs={12} md={3} style={{ margin: 5 }}>
- <CardGerenciando contrast={state.contrast} />
- </Grid>
- </Grid>
-
-
- </Secao>
- </div>
- );
+ const { state } = useContext(Store)
+ const tabs = [
+ 'Como fazer uma busca?',
+ 'Como filtrar os resultados?',
+ 'Como os recursos são ranqueados?',
+ 'Encontrando Recursos'
+ ]
+
+ const [tabValue, setTabValue] = useState(props.location.state === "undefined" ? 0 : props.location.state);
+
+ const handleChangeTab = (e, newValue) => {
+ setTabValue(newValue)
+ }
+
+ useEffect(() => { window.scrollTo(0, 0) }, [])
+
+ return (
+ <div style={state.contrast === "" ? { backgroundColor: "#f4f4f4" } : { backgroundColor: "black" }}>
+ <link href="https://fonts.googleapis.com/css?family=Pompiere|Roboto:500,400&display=swap" rel="stylesheet" />
+ <Secao>
+ <BreadCrumbsDiv>
+ <StyledBreadCrumbs contrast={state.contrast}>
+ <Link to="/" >
+ Página Inicial
+ </Link>
+ <Link to="ajuda" >
+ Ajuda
+ </Link>
+ <span>
+ {tabs[3]}
+ </span>
+ </StyledBreadCrumbs>
+ </BreadCrumbsDiv>
+ <Grid container justify="center">
+ <Grid item xs={12} md={10} >
+ <Principal contrast={state.contrast}>
+ <Menu contrast={state.contrast}>
+ <div className="fixo">
+ <img src={EncontrandoRecurso} alt="Encontrando Recursos" />
+ <span>{tabs[3]}</span>
+ </div>
+ <TabsStyled
+ contrast={state.contrast}
+ orientation="vertical"
+ variant="scrollable"
+ value={tabValue}
+ onChange={handleChangeTab}
+ TabIndicatorProps={{ style: { display: "none" } }}
+ >
+ <TabStyled contrast={state.contrast} label={tabs[0]}></TabStyled>
+ <TabStyled contrast={state.contrast} label={tabs[1]}></TabStyled>
+ <TabStyled contrast={state.contrast} label={tabs[2]}></TabStyled>
+ </TabsStyled>
+ <br/>
+ <div className="voltarInicio">
+ <a href="ajuda">VOLTAR AO ÃNICIO</a>
+ </div>
+ </Menu>
+ {tabValue === 0 && <HowToDo contrast={state.contrast} title={tabs[0]} />}
+ {tabValue === 1 && <HowToFilter contrast={state.contrast} title={tabs[1]} />}
+ {tabValue === 2 && <HowToRank contrast={state.contrast} title={tabs[2]} />}
+ <div className="resultadosProcura">
+ <span>Não era bem o que você procurava?</span>
+ <div className="subtitulo">
+ <span>Você pode navegar pelos tópicos de ajuda ou entrar em <a href="contato">Contato</a>.</span>
+ </div>
+ </div>
+ </Principal>
+ </Grid>
+ </Grid>
+ <Grid style={{ paddingBottom: "50px" }} container justify={"center"}>
+ <Grid item xs={12} md={3} style={{ margin: 5 }}>
+ <CardPublicando contrast={state.contrast} />
+ </Grid>
+ <Grid item xs={12} md={3} style={{ margin: 5 }}>
+ <CardParticipando contrast={state.contrast} />
+ </Grid>
+ <Grid item xs={12} md={3} style={{ margin: 5 }}>
+ <CardGerenciando contrast={state.contrast} />
+ </Grid>
+ </Grid>
+ </Secao>
+ </div>
+ );
}
const StyledBreadCrumbs = styled(Breadcrumbs)`
- display : flex;
- justify-content : flex-start;
- span {
- color: ${props => props.contrast === "" ? "#a5a5a5" : "white"};
- }
- a {
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- }
+ display : flex;
+ justify-content : flex-start;
+ span {
+ color: ${props => props.contrast === "" ? "#a5a5a5" : "white"};
+ }
+ a {
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ }
`
const BreadCrumbsDiv = styled.div`
-
- padding : 10px;
- display : flex;
+ padding : 10px;
+ display : flex;
`
const Principal = styled.div`
- .fixo {
- background-color: ${props => props.contrast === "" ? "#fff" : "black"};
- height: 40px;
- text-align: center;
- padding: 30px;
- margin-bottom: 30px;
-
- img {
- height: 50px;
- width: 50px;
- margin-right: 40px;
- vertical-align: middle;
-
+ .fixo {
+ background-color: ${props => props.contrast === "" ? "#fff" : "black"};
+ height: 40px;
+ text-align: center;
+ padding: 30px;
+ margin-bottom: 30px;
+
+ img {
+ height: 50px;
+ width: 50px;
+ margin-right: 40px;
+ vertical-align: middle;
+ }
+
+ span {
+ font-size: 20px;
+ color: ${props => props.contrast === "" ? "" : "white"};
+ }
}
-
- span {
- font-size: 20px;
- color: ${props => props.contrast === "" ? "" : "white"};
+ .resultadosProcura {
+ text-align: center;
+ margin-block: 30px;
+ padding-inline: 15px;
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ span {
+ font-size: 24px;
+ }
+ .subtitulo {
+ margin-top: 10px;
+
+ span {
+ font-size: 15px
+ }
+
+ a {
+ font-size: 15px;
+ padding: 0;
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ }
+ }
}
-
+`
- }
- .resultadosProcura {
- text-align: center;
- margin-block: 30px;
- padding-inline: 15px;
- color: ${props => props.contrast === "" ? "#666" : "white"};
- span {
- font-size: 24px;
+const TabsStyled = styled(Tabs)`
+ color: ${props => props.contrast === "" ? "" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ .Mui-selected {
+ background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
}
- .subtitulo {
- margin-top: 10px;
-
- span {
- font-size: 15px
- }
-
- a {
- font-size: 15px;
- padding: 0;
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- }
+ .MuiTab-root{
+ text-transform: none !important;
+ max-width:100%
}
- }
-
-`
-
-const TabsStyled = styled(Tabs)`
- color: ${props => props.contrast === "" ? "" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- .Mui-selected {
- background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
- }
-
- .MuiTab-root{
- text-transform: none !important;
- max-width:100%
- }
- text-align: center;
- width:100%
+ text-align: center;
+ width:100%
`
const TabStyled = styled(Tab)`
- color: ${props => props.contrast === "" ? "" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
- padding: 4px 15px !important;
- font-weight: 500;
- font-size: 14px !important;
- border-radius: 4px !important;
- text-align: center;
-
- &:hover {
- background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
- }
+ color: ${props => props.contrast === "" ? "" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ padding: 4px 15px !important;
+ font-weight: 500;
+ font-size: 14px !important;
+ border-radius: 4px !important;
+ text-align: center;
+
+ &:hover {
+ background-color: ${props => props.contrast === "" ? "#e7e4e4" : "rgba(255,255,0,0.24)"};
+ }
`
const Menu = styled.div`
- width: auto;
- background-color: ${props => props.contrast === "" ? "#fff" : "black"};
- color: ${props => props.contrast === "" ? "#666" : "white"};
- padding-block: 10px;
- box-shadow: ${props => props.contrast === "" ? "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)" : "0 1px 3px rgba(254,254,254,.48),0 1px 2px rgba(254,254,254,.48)"};
- margin-bottom:30px
-
-
- h4 {
- padding-inline: 15px;
- font-size: 18px;
- margin-block: 10px;
- font-weight: 500;
- line-height: 1.1;
- }
+ width: auto;
+ background-color: ${props => props.contrast === "" ? "#fff" : "black"};
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ padding-block: 10px;
+ box-shadow: ${props => props.contrast === "" ? "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)" : "0 1px 3px rgba(254,254,254,.48),0 1px 2px rgba(254,254,254,.48)"};
+ margin-bottom:30px
+
+ h4 {
+ padding-inline: 15px;
+ font-size: 18px;
+ margin-block: 10px;
+ font-weight: 500;
+ line-height: 1.1;
+ }
- .voltarInicio {
- padding: 4px 15px;
- font-size: 15px;
- text-align: center;
- a {
- font-size: 15px;
- padding: 0;
- color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
- text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ .voltarInicio {
+ padding: 4px 15px;
+ font-size: 15px;
+ text-align: center;
+ a {
+ font-size: 15px;
+ padding: 0;
+ color: ${props => props.contrast === "" ? "#00bcd4" : "yellow"};
+ text-decoration: ${props => props.contrast === "" ? "none" : "underline"};
+ }
}
- }
-
- hr {
- border: 0;
- border-top: 1px solid #ccc;
- margin-top: 20px;
- margin-bottom: 20px;
- }
-
- .procurava {
- padding: 4px 15px;
- font-size: 15px;
- text-align: center;
- a {
- font-size: 15px;
- padding: 0;
- color:#00bcd4;
- text-decoration: none;
+ hr {
+ border: 0;
+ border-top: 1px solid #ccc;
+ margin-top: 20px;
+ margin-bottom: 20px;
}
- }
+ .procurava {
+ padding: 4px 15px;
+ font-size: 15px;
+ text-align: center;
+
+ a {
+ font-size: 15px;
+ padding: 0;
+ color:#00bcd4;
+ text-decoration: none;
+ }
+
+ }
`
const Secao = styled.div`
- margin-inline: auto;
-
+ margin-inline: auto;
`
diff --git a/src/Pages/UploadPage.js b/src/Pages/UploadPage.js
index 204d7b73b514ed5a55fd2c92d761bf60d80e7d01..aa1f6d1b3f001b969630ac3de8f6c121880a762a 100644
--- a/src/Pages/UploadPage.js
+++ b/src/Pages/UploadPage.js
@@ -119,7 +119,7 @@ export default function UploadPage(props) {
{
activeStep === 2 ?
(
- <PartThree draftID={draft.id} stepperControl={stepperControl} activeStep={activeStep} handlePost={handlePost} handleSubmit={handleSubmit} />
+ <PartThree contrast={state.contrast} draftID={draft.id} stepperControl={stepperControl} activeStep={activeStep} handlePost={handlePost} handleSubmit={handleSubmit} />
)
:
(
diff --git a/src/Pages/UserPage.js b/src/Pages/UserPage.js
index 35733c32d710ac6449cdcf35ccc8267102203c33..21d4eb73ab91ab9b9f4e4d0b6e994d76667be5d5 100644
--- a/src/Pages/UserPage.js
+++ b/src/Pages/UserPage.js
@@ -124,7 +124,7 @@ export default function UserPage(props) {
{
loading ?
(
- <LoadingSpinner text="Carregando..." />
+ <LoadingSpinner contrast={state.contrast} text="Carregando..." />
)
:
(
diff --git a/src/env.js b/src/env.js
index 95815e96e0a4b6d934c32704a85f04284e77d16e..7284c42754e5c679138196c2bae2a2f128779c2b 100644
--- a/src/env.js
+++ b/src/env.js
@@ -17,7 +17,7 @@ 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/>.*/
-var apiDomain = 'https://api.portalmec.c3sl.ufpr.br',
+var apiDomain = 'https://api.portalmectest.c3sl.ufpr.br',
apiVersion = 'v1',
apiUrl = apiDomain + '/' + apiVersion;