diff --git a/src/Components/AreasSubPages.js b/src/Components/AreasSubPages.js
index b9953cf33a6d2cf75c22bbb9749d7421d75fee17..851ee8812d293fdb7ba1f5c67efa51929840d963 100644
--- a/src/Components/AreasSubPages.js
+++ b/src/Components/AreasSubPages.js
@@ -39,25 +39,33 @@ class ReqCards extends Component{
};
}
componentWillMount(){
- axios.get(`${apiUrl}/learning_objects`+ '?limit=12&sort=["published_at", "desc"]')
+ axios.get(`${apiUrl}/learning_objects?limit=12&sort=["published_at", "desc"]`)
.then(res=> {
this.setState({resources: res.data});
console.log(res.data);
});
}
render(){
+ var row1 = this.state.resources.slice(0, 4);
+ var row2 = this.state.resources.slice(4, 8);
+ var row3 = this.state.resources.slice(8, 13);
return(
+ <Carousel showThumbs={false} autoPlay infiniteLoop={true} showStatus={false}>
<Row>
- {this.state.resources.map(card => <Col md={3} sm={6} key={card.id}><MediaCard name={card.name} description={card.description}/></Col>)}
+ {row1.map(card => <Col md={3} sm={6} key={card.id}><MediaCard name={card.name} type={card.object_type} description={card.description}/></Col>)}
</Row>
+ <Row>
+ {row2.map(card => <Col md={3} sm={6} key={card.id}><MediaCard name={card.name} type={card.object_type} description={card.description}/></Col>)}
+ </Row>
+ <Row>
+ {row3.map(card => <Col md={3} sm={6} key={card.id}><MediaCard name={card.name} type={card.object_type} description={card.description}/></Col>)}
+ </Row>
+ </Carousel>
)
}
}
class SubPages extends Component{
- constructor(props){
- super(props);
- }
areaRender(){
switch(this.props.banner){
@@ -66,7 +74,7 @@ class SubPages extends Component{
<React.Fragment>
<div style={{backgroundColor: "#ff7f00"}}>
<Container style={areaStyle}>
- <img src={recursos} height="100" style={{float: "left"}}/>
+ <img src={recursos} alt="aba recursos" height="100" style={{float: "left"}}/>
<p>Nesta área, você tem acesso a Recursos Educacionais Digitais, isto é,
a vÃdeos, animações e a outros recursos destinados à educação. São Recursos
de portais parceiros do MEC e de professores que, como você, atuam na
@@ -77,17 +85,10 @@ class SubPages extends Component{
<p style={{paddingBottom:"5px", borderBottom: "1px solid #ff7f00", color: "#ff7f00"}}>
Recursos mais recentes </p>
<Hidden sm xs>
- <Carousel showThumbs={false} autoPlay infiniteLoop={true} showStatus={false}>
-
- <ReqCards/>
- </Carousel>
+ <ReqCards/>
</Hidden>
<Visible sm xs>
- <Carousel showThumbs={false} infiniteLoop={true} showStatus={false}>
- <Row justify="around" style={{paddingBottom: "50px"}} >
<ReqCards/>
- </Row>
- </Carousel>
</Visible>
</Container>
</React.Fragment>
@@ -97,7 +98,7 @@ class SubPages extends Component{
<React.Fragment>
<div style={{backgroundColor: "#e81f4f"}}>
<Container style={areaStyle}>
- <img src={materiais} height="100" style={{float: "left"}}/>
+ <img src={materiais} alt="aba materiais" height="100" style={{float: "left"}}/>
<p>Nesta área, você acessa livremente materiais completos de formação,
como cursos já oferecidos pelo MEC e seus parceiros. São conteúdos
elaborados por equipes multidisciplinares e de autoria de pesquisadores
@@ -120,7 +121,7 @@ class SubPages extends Component{
<React.Fragment>
<div style={{backgroundColor: "#673ab7"}}>
<Container style={areaStyle}>
- <img src={colecoes} height="100" style={{float: "left"}}/>
+ <img src={colecoes} alt="aba coleções" height="100" style={{float: "left"}}/>
<p>Nesta área, você tem acesso às coleções criadas e organizadas
pelos usuários da plataforma. É mais uma possibilidade de buscar
recursos educacionais para sua aula!</p>
diff --git a/src/Components/Card.js b/src/Components/Card.js
index 1a41b00f77b93c46fae813c14dda0f9b25efc9e6..788a534c08172b9b88f20dde01601ee827c00ba5 100644
--- a/src/Components/Card.js
+++ b/src/Components/Card.js
@@ -6,24 +6,34 @@ import IconButton from '@material-ui/core/IconButton';
import Typography from '@material-ui/core/Typography';
import FavoriteIcon from '@material-ui/icons/Favorite';
import ShareIcon from '@material-ui/icons/Share';
-import thumbnail from "../img/girassol.jpg"
-
-// const useStyles = {
-// card: {
-// maxWidth: 400,
-// },
-// media: {
-// height: 100,
-// paddingTop: '56.25%', // 16:9
-// },
-// };
+import animacao from "../img/laranja/ANIMACAO_SIMULACAO.jpg";
+import apresentacao from "../img/laranja/APRESENTACAO.jpg";
+import aplicativo from "../img/laranja/APP.jpg";
+import audio from "../img/laranja/AUDIO.jpg";
+import vazio from "../img/laranja/EMPTY.jpg";
+import imagem from "../img/laranja/IMAGEM.jpg";
+import grafico from "../img/laranja/INFOGRAFICO.jpg";
+import jogo from "../img/laranja/JOGO.jpg";
+import livro from "../img/laranja/LIVRO_DIGITAL.jpg";
+import mapa from "../img/laranja/MAPA.jpg";
+import outros from "../img/laranja/OUTROS.jpg";
+import software from "../img/laranja/SOFTWARE.jpg";
+import texto from "../img/laranja/TEXTO.jpg";
+import video from "../img/laranja/VIDEO.jpg";
+var types = [{label: "Animação", thumb: animacao}, {label: "Apresentação", thumb: apresentacao},
+{label: "Aplicativo" , thumb: aplicativo}, {label: "Ãudio", thumb: audio}, {label: "Vazio", thumb: vazio}, {label: "Imagem", thumb: imagem}, {label: "Gráfico", thumb: grafico}, {label: "Jogo", thumb: jogo}, {label: "Livro", thumb: livro}, {label: "Mapa", thumb: mapa}, {label: "Outros", thumb: outros}, {label: "Software", thumb:software}, {label: "Texto", thumb:texto}, {label: "VÃdeo", thumb:video}]
function RecipeReviewCard(props){
+var thumbnail = props.thumbnail;
+if (thumbnail == null) {
+ thumbnail = types.find(function(element){ return element.label == props.type});
+}
+thumbnail = thumbnail.thumb
return (
<Card>
<img src={thumbnail} alt="thumbnail do recurso"/>
- <CardContent >
- <Typography variant="title" color="textSecondary" component="p">
+ <CardContent style={{height: "200px"}}>
+ <Typography variant="body1" color="textPrimary" component="p">
{props.name}
</Typography>
<Typography variant="caption" color="textSecondary" component="p">
diff --git a/src/img/laranja/ANIMACAO_SIMULACAO.jpg b/src/img/laranja/ANIMACAO_SIMULACAO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..6fad96035aeaaf5a261772b2894263a5e4df8ab7
Binary files /dev/null and b/src/img/laranja/ANIMACAO_SIMULACAO.jpg differ
diff --git a/src/img/laranja/APP.jpg b/src/img/laranja/APP.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..519ac1546dcb36912d3c1ad066e086229f309bb6
Binary files /dev/null and b/src/img/laranja/APP.jpg differ
diff --git a/src/img/laranja/APRESENTACAO.jpg b/src/img/laranja/APRESENTACAO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..b171257c80d2f412c0be33f0607d81bfeeca6d3a
Binary files /dev/null and b/src/img/laranja/APRESENTACAO.jpg differ
diff --git a/src/img/laranja/AUDIO.jpg b/src/img/laranja/AUDIO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..486d300ef5c6d0a50868bb95e6cb7128504cf723
Binary files /dev/null and b/src/img/laranja/AUDIO.jpg differ
diff --git a/src/img/laranja/EMPTY.jpg b/src/img/laranja/EMPTY.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4aa2c2878618019818c0cf0d0f7c3deb39fe26ac
Binary files /dev/null and b/src/img/laranja/EMPTY.jpg differ
diff --git a/src/img/laranja/IMAGEM.jpg b/src/img/laranja/IMAGEM.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..8a52983504f4cfb8309f0a35d52cc43e677ce893
Binary files /dev/null and b/src/img/laranja/IMAGEM.jpg differ
diff --git a/src/img/laranja/INFOGRAFICO.jpg b/src/img/laranja/INFOGRAFICO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..b4e0fa95d62b8f20c00d80d9038d10a27f08b951
Binary files /dev/null and b/src/img/laranja/INFOGRAFICO.jpg differ
diff --git a/src/img/laranja/JOGO.jpg b/src/img/laranja/JOGO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..7ef0f5dfa4dc7373b552b96a569df238134d00b5
Binary files /dev/null and b/src/img/laranja/JOGO.jpg differ
diff --git a/src/img/laranja/LIVRO_DIGITAL.jpg b/src/img/laranja/LIVRO_DIGITAL.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f6bcf2fc35f096a55622bb7432306cbcbcfaa8da
Binary files /dev/null and b/src/img/laranja/LIVRO_DIGITAL.jpg differ
diff --git a/src/img/laranja/MAPA.jpg b/src/img/laranja/MAPA.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..aeb04e3d3c247c018686e7c0b949b5de13fa10a5
Binary files /dev/null and b/src/img/laranja/MAPA.jpg differ
diff --git a/src/img/laranja/OUTROS.jpg b/src/img/laranja/OUTROS.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..28afbdbcbb96e52d54139f3a29b7c7f0e6fac3cd
Binary files /dev/null and b/src/img/laranja/OUTROS.jpg differ
diff --git a/src/img/laranja/SOFTWARE.jpg b/src/img/laranja/SOFTWARE.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..8d680e0c37f713c6bfc1df7bad54a94d29ea959c
Binary files /dev/null and b/src/img/laranja/SOFTWARE.jpg differ
diff --git a/src/img/laranja/TEXTO.jpg b/src/img/laranja/TEXTO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..fa6ed82c58189411b5b0c6c7a18c605b3ec26108
Binary files /dev/null and b/src/img/laranja/TEXTO.jpg differ
diff --git a/src/img/laranja/VIDEO.jpg b/src/img/laranja/VIDEO.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f895f6acf8f35b4accea379a9afaa87b62c5c669
Binary files /dev/null and b/src/img/laranja/VIDEO.jpg differ