diff --git a/src/Components/ExpansionPanels.js b/src/Components/ExpansionPanels.js
index b7389997197b41c7ed03adceecbb3c0eaf6d3474..5f4434c6d0729abe7c5517288c55f0a7b8dc1fcb 100644
--- a/src/Components/ExpansionPanels.js
+++ b/src/Components/ExpansionPanels.js
@@ -16,7 +16,8 @@ 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 React, {Component} from 'react';
import ExpansionPanel from '@material-ui/core/ExpansionPanel';
import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';
import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';
@@ -30,15 +31,32 @@ import styled from 'styled-components';
import { makeStyles } from '@material-ui/styles';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-const useStyles = makeStyles(theme => ({
- root: {
- width: '100%',
- },
- heading: {
- fontSize: "15px",
- fontWeight: "400",
- },
-}));
+
+
+const ExpansionPanelTeste = styled(ExpansionPanel)`
+
+ .MuiExpansionPanel-root:expanded{
+ background-color: black !important;
+ }
+
+`
+const ExpansionPanelSummaryColorido = styled(ExpansionPanelSummary)`
+
+
+ background-color:#e5e5e5 !important;
+
+ .MuiExpansionPanel-root {
+ background-color: #00BCD4 !important;
+ }
+
+
+`
+const ExpansionPanelDetailsColorido = styled(ExpansionPanelDetails)`
+
+ background-color: #fff;
+ font-size: 15px;
+`
+
const TypographyColorido = styled(Typography)`
@@ -53,20 +71,22 @@ const AColorido = styled.a`
`
+
+
export default function SimpleExpansionPanel() {
- const classes = useStyles();
+
return (
- <div className={classes.root}>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<AddIcon />}
+ <div >
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon=<AddIcon/>
aria-controls="panel1a-content"
id="panel1a-header"
>
<TypographyColorido >1. CaracterÃsticas da <strong>Plataforma Integrada de RED do MEC</strong></TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido >
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div>
@@ -96,17 +116,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel2a-content"
id="panel2a-header"
>
<TypographyColorido >2. Cadastro e segurança</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div>
@@ -131,17 +151,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel3a-content"
id="panel3a-header"
>
<TypographyColorido >3. Publicações de usuários</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div>
@@ -198,17 +218,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel4a-content"
id="panel4a-header"
>
<TypographyColorido >4. Licença de uso do conteúdo</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div>
@@ -246,18 +266,18 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
+ </ExpansionPanelDetailsColorido>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel5a-content"
id="panel5a-header"
>
<TypographyColorido >5. Práticas de uso e armazenamento</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div>
@@ -272,17 +292,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel6a-content"
id="panel6a-header"
>
<TypographyColorido >6. Privacidade da informação</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -300,17 +320,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel7a-content"
id="panel7a-header"
>
<TypographyColorido >7. Violação no sistema ou na base de dados</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -325,17 +345,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel8a-content"
id="panel8a-header"
>
<TypographyColorido >8. Sanções</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -361,17 +381,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel9a-content"
id="panel9a-header"
>
<TypographyColorido >9. Limitações de responsabilidade</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -390,17 +410,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel10a-content"
id="panel10a-header"
>
<TypographyColorido >10.Inexistência de vÃnculo</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -415,17 +435,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel11a-content"
id="panel11a-header"
>
<TypographyColorido >11. Como reportar violações</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -442,17 +462,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel12a-content"
id="panel12a-header"
>
<TypographyColorido >12. Modificações nos Termos de Uso</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -467,17 +487,17 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
- <ExpansionPanel>
- <ExpansionPanelSummary
- expandIcon={<ExpandMoreIcon />}
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
+ <ExpansionPanelTeste>
+ <ExpansionPanelSummaryColorido
+ expandIcon={<AddIcon />}
aria-controls="panel13a-content"
id="panel13a-header"
>
<TypographyColorido >13. Foro</TypographyColorido>
- </ExpansionPanelSummary>
- <ExpansionPanelDetails>
+ </ExpansionPanelSummaryColorido>
+ <ExpansionPanelDetailsColorido>
<Grid container spacing={3}>
<Grid item xs={12} md={7}>
<div >
@@ -492,8 +512,8 @@ export default function SimpleExpansionPanel() {
</div>
</Grid>
</Grid>
- </ExpansionPanelDetails>
- </ExpansionPanel>
+ </ExpansionPanelDetailsColorido>
+ </ExpansionPanelTeste>
</div>
);
diff --git a/src/Components/Modal.js b/src/Components/Modal.js
index 6c5e794883080f444a4fcdb08ff4473cfb330803..3028e371b0e098633ed1d5abf6c6b5112cdedf1e 100644
--- a/src/Components/Modal.js
+++ b/src/Components/Modal.js
@@ -21,12 +21,16 @@ import { makeStyles } from '@material-ui/styles';
import Modal from '@material-ui/core/Modal';
import { Carousel } from 'react-responsive-carousel';
import Backdrop from '@material-ui/core/Backdrop';
+import Grid from '@material-ui/core/Grid';
import Fade from '@material-ui/core/Fade';
import VisibilityOutlinedIcon from '@material-ui/icons/VisibilityOutlined';
import ArrowBackIosIcon from '@material-ui/icons/ArrowBackIos';
import ArrowForwardIosIcon from '@material-ui/icons/ArrowForwardIos';
import styled from 'styled-components'
+/*Importação de imagens para a página*/
+import Handshake from "../img/termos/handshake.svg"
+
@@ -70,6 +74,16 @@ const CarouselStyled = styled(Carousel)`
}
`
+const Termos1 = styled.div `
+
+ .termsTemplates{
+
+
+
+ }
+`
+
+
export default function TransitionsModal() {
const classes = useStyles();
const [open, setOpen] = React.useState(false);
@@ -101,8 +115,16 @@ export default function TransitionsModal() {
>
<Fade in={open}>
<CarouselStyled className={classes.carousel} showArrows={true} showThumbs={false} infiniteLoop={true} showStatus={false}>
- <div style={{background:"blue"}}>
- <p>A Plataforma Integrada MEC RED é parte do Compromisso 6 do 3º Plano de Ação da Parceria para Governo Aberto (OGP-Brasil), que tem por objetivo “incorporar na polÃtica educacional o potencial da cultura digital, de modo a fomentar a autonomia para uso, reuso e adaptação de recursos educacionais digitais, valorizando a pluralidade e a diversidade da educação brasileiraâ€.</p>
+
+ <div style={{background:"#00BCD4"}} >
+ <Grid container spacing={3}>
+ <Grid item md={6}>
+ <p>A Plataforma Integrada MEC RED é parte do Compromisso 6 do 3º Plano de Ação da Parceria para Governo Aberto (OGP-Brasil), que tem por objetivo “incorporar na polÃtica educacional o potencial da cultura digital, de modo a fomentar a autonomia para uso, reuso e adaptação de recursos educacionais digitais, valorizando a pluralidade e a diversidade da educação brasileiraâ€.</p>
+ </Grid>
+
+ <Grid item md={6} style={{backgroundImage: "url(${Handshake)"}}></Grid>
+ </Grid>
+
</div>
<div style={{background:"red"}}>
diff --git a/src/img/termos/handshake.svg b/src/img/termos/handshake.svg
new file mode 100644
index 0000000000000000000000000000000000000000..7bde658e631f91995a5aed3591aa46b202295bb2
--- /dev/null
+++ b/src/img/termos/handshake.svg
@@ -0,0 +1,14 @@
+<svg width="236" height="179" viewBox="0 0 236 179" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M167.815 25.0125C167.815 25.0125 70.3541 -9.26785 68.9849 60.7128C68.9849 60.7128 68.7345 75.7231 79.161 74.5914C92.0435 73.2249 101.367 66.7126 101.367 55.1239C101.367 43.5352 120.797 51.8784 120.797 51.8784L186.926 109.843L204.577 81.061" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M32.8828 86.666C32.8828 86.666 109.208 169.629 122.624 167.312C136.039 164.995 133.279 154.8 133.279 154.8L106.433 132.572" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M157.5 84.0771C157.5 84.0771 193.398 109.379 191.549 118.651C189.701 127.923 177.671 130.234 170.744 125.137C163.818 120.039 127.723 93.6428 127.723 93.6428" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M117.537 114.957C117.537 114.957 158.241 147.401 166.105 144.62C175.002 141.476 176.127 130.934 169.195 125.82C162.264 120.706 127.713 93.6055 127.713 93.6055" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M117.537 114.957C117.537 114.957 156.706 141.311 156.616 149.654C156.515 159.107 146.919 163.575 139.855 158.654C132.79 153.732 106.434 132.572 106.434 132.572" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M185.722 2.01043L162.527 16.4248L210.805 94.4066L233.999 79.9922L185.722 2.01043Z" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M2.0007 79.9816L25.1953 94.396L73.4726 16.4142L50.278 1.99984L2.0007 79.9816Z" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M57.1547 103.426L57.1506 103.423C51.5036 98.8576 43.232 99.7433 38.6754 105.401L30.5923 115.438C26.0358 121.095 26.9198 129.383 32.5668 133.948L32.5709 133.951C38.2179 138.517 46.4895 137.631 51.0461 131.973L59.1291 121.937C63.6857 116.279 62.8017 107.991 57.1547 103.426Z" fill="#1AB9DE" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M76.2726 136.557C80.1935 131.688 79.4338 124.557 74.5757 120.63C69.7176 116.702 62.6008 117.465 58.6798 122.334L50.8611 132.042C46.9401 136.911 47.6999 144.041 52.558 147.969C57.4161 151.896 64.5329 151.134 68.4538 146.265L76.2726 136.557Z" fill="#1AB9DE" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M94.3195 153.237C98.2404 148.369 97.4807 141.238 92.6226 137.311C87.7645 133.383 80.6476 134.146 76.7267 139.014L68.9079 148.723C64.987 153.591 65.7468 160.722 70.6049 164.65C75.463 168.577 82.5798 167.814 86.5007 162.946L94.3195 153.237Z" fill="#1AB9DE" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M110.877 163.334C114.192 159.218 113.549 153.189 109.44 149.868C105.332 146.547 99.3147 147.191 95.9999 151.307L89.3855 159.52C86.0707 163.636 86.7138 169.665 90.8219 172.986C94.9301 176.308 100.948 175.663 104.262 171.547L110.877 163.334Z" fill="#1AB9DE" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+<path d="M71.6484 24.2119L81.606 28.3382" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
+</svg>