From 6766d332b02096b9c9017836dfa6f917c1ce098a Mon Sep 17 00:00:00 2001 From: Riba <mrp19@inf.ufpr.br> Date: Wed, 20 Nov 2019 12:04:15 -0300 Subject: [PATCH] Fixed CSS on Sections 2 and 4 --- src/Components/ResourceCard.js | 2 +- src/Pages/UserTerms.js | 132 ++++++++++++++++++++++++--------- 2 files changed, 96 insertions(+), 38 deletions(-) diff --git a/src/Components/ResourceCard.js b/src/Components/ResourceCard.js index aa46c979..5e9cfb5f 100644 --- a/src/Components/ResourceCard.js +++ b/src/Components/ResourceCard.js @@ -48,7 +48,7 @@ import Video from '@material-ui/icons/OndemandVideo'; import noAvatar from "../img/default_profile.png"; const 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}] +{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 Educacional", thumb:software}, {label: "Texto", thumb:texto}, {label: "VÃdeo", thumb:video}] const slideStyle={ height: "50px", width: "50px", diff --git a/src/Pages/UserTerms.js b/src/Pages/UserTerms.js index fcdb8751..411fdd62 100644 --- a/src/Pages/UserTerms.js +++ b/src/Pages/UserTerms.js @@ -69,6 +69,8 @@ const AColorido = styled.a` ` const ImagemSeçao2 = styled.div` + font-family: Roboto, sans-serif; + @media (min-width:1450px) { background-image: url(${Busca}); background-position: right; @@ -79,6 +81,31 @@ const ImagemSeçao2 = styled.div` height: auto; align-items: center; padding-block: 30px; + h3 { + line-height: 1.1; + text-align: center; + @media (min-width: 1000px) { + font-size: 30px; + } + + @media (max-width: 1000px){ + font-size: 20px; + } + margin-top: 20px; + margin-bottom: 10px; + font-weight: 100; + padding-bottom: 20px; + + } + + p { + line-height: 1.42857143; + padding-top: 20px; + font-size: 14px; + text-align: justify; + margin: 0 0 10px; + } +} ` const Secao3 = styled.div` background-color: #FF7F00; @@ -137,6 +164,43 @@ const Secao3 = styled.div` } ` +const Secao4 = styled.div` + font-size: 15px; + + .texto { + text-align: left; + padding-top: 20px; + padding-bottom: 20px; + + a { + color:#00BCD4; + } + + p { + font-family: 'Roboto', Bold; + } + + } + + .titulo { + text-align: center; + color: #666666; + h3 { + font-size: 30px; + height: 22px; + padding-bottom: 20px; + margin-top: 20px; + margin-bottom: 10px; + font-weight: 500; + line-height: 1.1; + } + p { + height: 18px; + line-height: 1.42857143; + margin: 0 0 10px; + } + +` class UserTerms extends Component { @@ -156,11 +220,11 @@ class UserTerms extends Component { <Grid item xs={12} md={1}></Grid> <Grid item xs={12} md={10}> <div> - <h3 style= {{textAlign: "center",fontWeight: "100",fontFamily:"'Roboto', sans-serif",fontSize:"30px"}}><strong style={{fontWeight:"700"}}>Plataforma Integrada de Recursos Educacionais Digitais,</strong><br/>uma iniciativa do Ministério da Educação!</h3> + <h3><strong style={{fontWeight:"700"}}>Plataforma Integrada de Recursos Educacionais Digitais,</strong><br/>uma iniciativa do Ministério da Educação!</h3> - <p style={{textAlign:"justify"}}>A <strong>Plataforma Integrada de RED do MEC</strong> é parte do processo de implementação do Compromisso 6 do <AColorido href="http://www.governoaberto.cgu.gov.br/noticias/2017/3o-plano-de-acao-nacional-na-parceria-para-governo-aberto" target="_blank">3º Plano de Ação da Parceria Governo Aberto</AColorido> (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>A <strong>Plataforma Integrada de RED do MEC</strong> é parte do processo de implementação do Compromisso 6 do <AColorido href="http://www.governoaberto.cgu.gov.br/noticias/2017/3o-plano-de-acao-nacional-na-parceria-para-governo-aberto" target="_blank">3º Plano de Ação da Parceria Governo Aberto</AColorido> (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> - <p style={{textAlign:"justify"}}>Seguindo o compromisso, a <strong>Plataforma Integrada de RED do MEC</strong> visa fortalecer a distribuição de recursos educacionais digitais para o ensino básico brasileiro. Há preferência pela disponibilização de Recursos Educacionais Abertos (REA), ou seja, recursos que “se situem no domiÌnio puÌblico ou que tenham sido divulgados sob licença aberta que permita acesso, uso, adaptação e redistribuição gratuita por terceiros, mediante nenhuma restrição ou poucas restrições.†<AColorido href="http://www.unesco.org/new/fileadmin/MULTIMEDIA/HQ/CI/CI/pdf/Events/Portuguese_Paris_OER_Declaration.pdf" target="_blank">(Declaração REA de Paris, 2012)</AColorido>. + <p>Seguindo o compromisso, a <strong>Plataforma Integrada de RED do MEC</strong> visa fortalecer a distribuição de recursos educacionais digitais para o ensino básico brasileiro. Há preferência pela disponibilização de Recursos Educacionais Abertos (REA), ou seja, recursos que “se situem no domiÌnio puÌblico ou que tenham sido divulgados sob licença aberta que permita acesso, uso, adaptação e redistribuição gratuita por terceiros, mediante nenhuma restrição ou poucas restrições.†<AColorido href="http://www.unesco.org/new/fileadmin/MULTIMEDIA/HQ/CI/CI/pdf/Events/Portuguese_Paris_OER_Declaration.pdf" target="_blank">(Declaração REA de Paris, 2012)</AColorido>. </p> </div> </Grid> @@ -197,44 +261,38 @@ class UserTerms extends Component { <Grid container spacing={3}> - <Grid item xs={12} md={1}></Grid> - <Grid item xs={12} md={10}> - <div> - <p> - O <AColorido href="http://www.planalto.gov.br/ccivil_03/_ato2011-2014/2014/lei/l13005.htm" target="_blank">Plano Nacional de Educação</AColorido> (2014-2024) enfatiza nas metas 5 e 7 a importância dos recursos educacionais abertos para fomentar a qualidade da educação baÌsica. A <AColorido href="http://portal.mec.gov.br/index.php?option=com_docman&view=download&alias=35541-res-cne-ces-001-14032016-pdf&category_slug=marco-2016-pdf&Itemid=30192" traget="_blank">Resolução CNE/CES nº 1</AColorido>, de 11 de março de 2016, também destaca a importância dos recursos educacionais abertos para as instituições de educação superior e para as - atividades de educação a distância. - </p> - - - <h1 style = {center}>TERMOS DE USO</h1> - - <h4 style ={center}>InÃcio da vigência: agosto de 2017</h4> - - <div> - <p>Aqui estão os “Termos de Uso†da <strong>Plataforma Integrada de RED do MEC</strong>, isto é, as regras de funcionamento da Plataforma e seus serviços, e o que se espera de seus usuários. Por “usuárioâ€, entende-se qualquer pessoa que acesse o domÃnio portal.mec.gov.br, tanto para pesquisa (acesso) como para a inclusão de dados e informações (participação) mediante cadastro.</p> - <p>Fazem parte dos Termos de Uso as polÃticas de responsabilidade, de privacidade e confidencialidade, a licença de uso do conteúdo e as informações sobre como reportar violações.</p> - <p>Ao utilizar a <strong>Plataforma Integrada de RED do MEC</strong>, o usuário aceita todas as condições aqui estabelecidas. O uso da <strong>Plataforma Integrada de RED do MEC</strong> implica aceite das condições aqui elencadas.</p> - <p>Por “serviçoâ€, entende-se qualquer funcionalidade ou ferramenta que permita a interatividade com o usuário, como, por exemplo, usuário subir um recurso, postar um comentário, criar uma coleção ou enviar uma mensagem.</p> - <p>A aceitação destes "Termos de Uso" é indispensável à utilização da <strong>Plataforma Integrada de RED do MEC</strong>. Todos os usuários deverão ler, certificar-se de tê-los entendido e aceitar todas as condições neles estabelecidas. Dessa forma, deve ficar claro que a utilização desta "<strong>Plataforma Integrada de RED do MEC</strong>" implica aceitação completa deste documento intitulado Termos de Uso. Caso tenha dúvidas sobre os termos, utilize o formulário disponÃvel em “Contato†para saná-las.</p> - </div> - - </div> - </Grid> - <Grid item xs={12} md={1}></Grid> - - + <Grid item xs={12} md={1}></Grid> + <Grid item xs={12} md={10}> + <Secao4> + <div class="texto" style={{paddingTop:"70px"}}> + <p>O <a href="http://www.planalto.gov.br/ccivil_03/_ato2011-2014/2014/lei/l13005.htm" target="_blank">Plano Nacional de Educação</a> (2014-2024) enfatiza nas metas 5 e 7 a importância dos recursos educacionais abertos para fomentar a qualidade da educação baÌsica. A <a href="http://portal.mec.gov.br/index.php?option=com_docman&view=download&alias=35541-res-cne-ces-001-14032016-pdf&category_slug=marco-2016-pdf&Itemid=30192" target="_blank">Resolução CNE/CES nº 1</a>, de 11 de março de 2016, também destaca a importância dos recursos educacionais abertos para as instituições de educação superior e para as atividades de educação a distância.</p> + </div> + <div class="titulo"> + <h3>TERMOS DE USO</h3> + <p>InÃcio da vigência: agosto de 2017</p> + </div> + <div class="texto" style={{paddingBottom:"40px"}}> + <p>Aqui estão os “Termos de Uso†da <strong>Plataforma Integrada de RED do MEC</strong>, isto é, as regras de funcionamento da Plataforma e seus serviços, e o que se espera de seus usuários. Por “usuárioâ€, entende-se qualquer pessoa que acesse o domÃnio portal.mec.gov.br, tanto para pesquisa (acesso) como para a inclusão de dados e informações (participação) mediante cadastro.</p> + <p>Fazem parte dos Termos de Uso as polÃticas de responsabilidade, de privacidade e confidencialidade, a licença de uso do conteúdo e as informações sobre como reportar violações.</p> + <p>Ao utilizar a <strong>Plataforma Integrada de RED do MEC</strong>, o usuário aceita todas as condições aqui estabelecidas. O uso da <strong>Plataforma Integrada de RED do MEC</strong> implica aceite das condições aqui elencadas.</p> + <p>Por “serviçoâ€, entende-se qualquer funcionalidade ou ferramenta que permita a interatividade com o usuário, como, por exemplo, usuário subir um recurso, postar um comentário, criar uma coleção ou enviar uma mensagem.</p> + <p>A aceitação destes "Termos de Uso" é indispensável à utilização da <strong>Plataforma Integrada de RED do MEC</strong>. Todos os usuários deverão ler, certificar-se de tê-los entendido e aceitar todas as condições neles estabelecidas. Dessa forma, deve ficar claro que a utilização desta "<strong>Plataforma Integrada de RED do MEC</strong>" implica aceitação completa deste documento intitulado Termos de Uso. Caso tenha dúvidas sobre os termos, utilize o formulário disponÃvel em “Contato†para saná-las.</p> + </div> + </Secao4> + </Grid> + <Grid item xs={12} md={1}></Grid> </Grid> <Grid container spacing={3}> - <Grid item xs={12} md={1}></Grid> - <Grid item xs={12} md={10}> - <div style={{ marginBottom:"50px"}}> - <SimpleExpansionPanels/> - </div> - </Grid> - <Grid item xs={12} md={1}></Grid> - </Grid> + <Grid item xs={12} md={1}></Grid> + <Grid item xs={12} md={10}> + <div style={{ marginBottom:"50px",paddingTop: "20px"}}> + <SimpleExpansionPanels/> + </div> + </Grid> + <Grid item xs={12} md={1}></Grid> + </Grid> </div> ); } -- GitLab