Skip to content
Snippets Groups Projects
Commit a4ed590f authored by mrp19's avatar mrp19
Browse files

Fix aba mapa do site e acessibilidade

parent 7a7ece10
Branches
Tags
4 merge requests!57Merge of develop into master,!56Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments...,!39Update admin system,!32Homologa
Show whitespace changes
Inline Side-by-side
src/App.js
+ 4
− 0
View file @ a4ed590f
......@@ -45,6 +45,8 @@ import EditProfilePage from './Pages/EditProfilePage.js'
import PublicUserPage from './Pages/PublicUserPage.js'
import UploadPage from './Pages/UploadPage.js'
import EditLearningObjectPage from './Pages/EditLearningObjectPage.js'
import SiteMap from './Pages/SiteMap'
import Accessibility from './Pages/Accessibility'
export default function App(){
// eslint-disable-next-line
......@@ -95,6 +97,8 @@ export default function App(){
<Route path="/termos" component={UserTerms}/>
<Route path="/teste" component={Teste}/>
<Route path="/sobre" component={AboutPage}/>
<Route path="/mapa-site" component={SiteMap}/>
<Route path="/acessibilidade" component={Accessibility}/>
<Route path="/publicando-recurso" component={TabResoursePub}/>
<Route path="/encontrando-recurso" component={TabResourseFind}/>
<Route path="/participando-da-rede" component={TabNetPart}/>
......
src/Pages/Accessibility.js 0 → 100644
+ 151
− 0
View file @ a4ed590f
/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
Departamento de Informatica - Universidade Federal do Parana
This file is part of Plataforma Integrada MEC.
Plataforma Integrada MEC is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Plataforma Integrada MEC is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
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, {useState, useContext} from 'react';
import styled from 'styled-components'
import { Link } from "react-router-dom";
import Breadcrumbs from "@material-ui/core/Breadcrumbs";
const titulo ={
fontFamily: "Roboto, sans-serif",
marginTop: "0",
fontSize: "26px",
fontWeight: "300",
marginBottom: "10px",
color: "#666"
}
const subtitulo ={
fontFamily: "Roboto, sans-serif",
marginBottom: "20px",
marginTop: "0",
fontWeight: "500",
fontSize: "16px",
color: "#00bcd4"
}
const paper ={
padding: "30px 30px 100px 30px",
backgroundColor: "#fff",
boxShadow: "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)",
width:"1170px",
margin: "30px auto",
marginBottom:"0",
display: "flex",
flexDirection:"column",
boxSizing: "border-box"
}
const paragrafo={
textAlign: "left",
padding: "30px 0",
margin: "0",
fontFamily: "'Roboto Light','Roboto Regular',Roboto",
fontWeight: "300",
fontSize: "18px",
color: "#666",
display:"block"
}
const azulzinho={
textAlign: "right",
display:"block",
color: "#00bcd4",
fontSize: "16px"
}
const atalhos = {
fontWeight: "400",
color: "#00bcd4"
}
const breadCrumbs={
padding: "10px",
display: "flex",
margin: "0 auto",
width:"1170px"
}
const StyledBreadCrumbs = styled(Breadcrumbs)`
display: flex;
justify-content: flex-start;
max-width: 1170px;
span {
color: #a5a5a5;
font-size: 14px;
}
a {
color: #00bcd4;
text-decoration: none;
font-size: 14px;
}
`;
export default function Acessibility (props) {
return (
<div style={{padding:"0 0 30px 0",backgroundColor :"#f4f4f4"}}>
<div style={breadCrumbs}>
<StyledBreadCrumbs>
<Link to="/">Página Inicial</Link>
<span>Acessibilidade</span>
</StyledBreadCrumbs>
</div>
<link href="https://fonts.googleapis.com/css?family=Roboto:300;400;500&display=swap" rel="stylesheet"/>
<div style={paper}>
<h3 style={titulo}>Acessibilidade</h3>
<div style={{maxWidth:"660px",margin:"0 auto"}}>
<p style={paragrafo}>
Acessibilidade na web é possibilitar qualquer indivíduo de usufruir de quaisquer
atividades ou conteúdos em sítios e serviços disponíveis na web, com igualdade e
autonomia, independentemente de sua capacidade motora, visual, auditiva,
intelectual, cultural ou social
</p>
<span style={azulzinho}>
Cartilha Acessibilidade na Web - W3C Brasil, 2013
</span>
<p style={paragrafo}>
Na Plataforma a acessibilidade foi baseada principalmente no Modelo de
Acessibilidade em Governo Eletrônico (e-MAG), o modelo pode ser acessado
<a
style={{textDecoration:"none", color:"#222"}}
target="_blank"
href="https://www.governoeletronico.gov.br/documentos-e-arquivos/e-MAG%20V3.pdf"> aqui</a>.
</p>
</div>
<div style={{color:"#666", fontSize:"14px"}}>
<h3 style={subtitulo}>Atalhos padrões da Plataforma</h3>
Teclando-se <strong style={atalhos}>Alt + 1</strong> em qualquer página da Plataforma, chega-se diretamente ao começo do conteúdo principal da página.
<br/><br/>
Teclando-se <strong style={atalhos}>Alt + 2</strong> em qualquer página da Plataforma, chega-se diretamente ao início do menu principal.
<br/><br/>
Teclando-se <strong style={atalhos}>Alt + 3</strong> em qualquer página da Plataforma, chega-se diretamente no campo de busca.
<br/><br/>
Teclando-se <strong style={atalhos}>Alt + 4</strong> em qualquer página da Plataforma, chega-se diretamente ao rodapé.
<br/><br/>
No caso do <strong style={atalhos}>Firefox</strong>, em vez de Alt + número, tecle simultaneamente <strong style={atalhos}>Alt + Shift + número</strong>.
<br/><br/>
Sendo <strong style={atalhos}>Firefox</strong> no <strong style={atalhos}>Mac OS</strong>, em vez de Alt + Shift + número, tecle simultaneamente <strong style={atalhos}>Ctrl + Alt + número</strong>.
<br/><br/>
No <strong style={atalhos}>Opera</strong>, as teclas são <strong style={atalhos}>Shift + Escape + número</strong>. Ao teclar apenas <strong style={atalhos}>Shift + Escape</strong>, o usuário encontrará uma janela com todas as alternativas de ACCESSKEY da página.
</div>
</div>
</div>
);
}
src/Pages/SiteMap.js 0 → 100644
+ 188
− 0
View file @ a4ed590f
/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
Departamento de Informatica - Universidade Federal do Parana
This file is part of Plataforma Integrada MEC.
Plataforma Integrada MEC is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Plataforma Integrada MEC is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
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, {useState, useContext} from 'react';
import styled from 'styled-components'
import { Link } from "react-router-dom";
import Breadcrumbs from "@material-ui/core/Breadcrumbs";
const titulo ={
fontFamily: "Roboto, sans-serif",
marginTop: "0",
fontSize: "26px",
fontWeight: "300",
marginBottom: "10px",
color: "#666"
}
const subtitulo ={
fontFamily: "Roboto, sans-serif",
marginTop: "40px",
fontWeight:"500",
fontSize:"16px",
color: "#00bcd4"
}
const item={
fontFamily: "Roboto, sans-serif",
textDecoration: "none",
display:"block",
fontSize:"15px",
color: "#333",
fontWeight:"300",
paddingBottom: "5px"
}
const linha={
margin: "15px 0",
borderTop: "2px solid #00bcd4",
borderBottom:"none"
}
const paper ={
padding: "30px 30px 100px 30px",
backgroundColor: "#fff",
boxShadow: "0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)",
maxWidth:"1170px",
margin: "30px auto",
marginBottom:"0",
display: "flex",
flexDirection:"column",
boxSizing: "border-box"
}
const cards={
display:"flex",
flexDirection:"row"
}
const card = {
padding:"0 15px",
width:"25%"
}
const breadCrumbs={
padding: "10px",
display: "flex",
margin: "0 auto",
width:"1170px"
}
const StyledBreadCrumbs = styled(Breadcrumbs)`
display: flex;
justify-content: flex-start;
max-width: 1170px;
span {
color: #a5a5a5;
font-size: 14px;
}
a {
color: #00bcd4;
text-decoration: none;
font-size: 14px;
}
`;
export default function SiteMap (props) {
return (
<div style={{ padding:"0 0 30px 0",backgroundColor :"#f4f4f4"}}>
<div style={breadCrumbs}>
<StyledBreadCrumbs>
<Link to="/">Página Inicial</Link>
<span>Mapa do site</span>
</StyledBreadCrumbs>
</div>
<link href="https://fonts.googleapis.com/css?family=Roboto:300;500&display=swap" rel="stylesheet"/>
<div style={paper}>
<h3 style={titulo}>Mapa do site</h3>
<div style={cards}>
<div style={card}>
<h3 style={subtitulo}>Sobre</h3>
<hr style={linha} />
<a style={item} href="sobre">Sobre a Plataforma</a>
<a style={item} href="sobre#portaisparceiros">Portais Parceiros</a>
<a style={item} href="termos">Termos de Uso</a>
<a style={item} href="contato">Contato</a>
</div>
<div style={card}>
<h3 style={subtitulo}>Ajuda</h3>
<hr style={linha} />
<a style={item} href="ajuda">Central de Ajuda</a>
<Link
style={item}
to={{
pathname: "plataforma-mec",
state: { value: "0" }
}}
> O que é a Plataforma MEC</Link>
<Link
style={item}
to={{
pathname: "publicando-recurso",
state: { value: "0" }
}}
> Publicando Recurso
</Link>
<Link
style={item}
to={{
pathname: "encontrando-recurso",
state: { value: "0" }
}}
> Encontrando Recurso
</Link>
<Link
style={item}
to={{
pathname: "/participando-da-rede",
state: { value: "0" }
}}
> Participando da Rede
</Link>
<Link
style={item}
to={{
pathname: "gerenciando-conta",
state: { value: "0" }
}}
> Gerenciando a conta
</Link>
</div>
<div style={card}>
<h3 style={subtitulo}>Acessibilidade</h3>
<hr style={linha} />
<a style={item} href="acessibilidade">Acessibilidade</a>
</div>
<div style={card}>
<h3 style={subtitulo}>Área do Usuário</h3>
<hr style={linha} />
<a style={item} href="/perfil">Perfil e Atividades</a>
<a style={item} href="perfil">Recursos Publicados</a>
<a style={item} href="/perfil">Favoritos</a>
<a style={item} href="perfil">Coleções</a>
<a style={item} href="/perfil">Rede</a>
</div>
</div>
</div>
</div>
);
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment