diff --git a/src/Components/HelpCenter/TabsPlataformaMEC/How.js b/src/Components/HelpCenter/TabsPlataformaMEC/How.js index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..f332af1665feb4ff666251d9155acac52db64d53 100644 --- a/src/Components/HelpCenter/TabsPlataformaMEC/How.js +++ b/src/Components/HelpCenter/TabsPlataformaMEC/How.js @@ -0,0 +1,86 @@ +/*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, { Component, useState, useEffect } from 'react'; +import styled from 'styled-components'; + + + + + +export default function How(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> + <div style ={{width:"640px", height: "360px" }}> + <iframe src="https://www.youtube.com/watch?v=CRW5h2pHugM&feature=emb_logo" + width="640px" + height="360px" + frameborder="0" + allow="autoplay; fullscreen" + allowfullscreen + ></iframe> + </div> + </Card> + ); +} + +const Card = styled.div` + margin-bottom: 5px; + background-color: #fff; + box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); + padding: 30px; + color: #666; + span { + font-size: 14px; + font-weight: bold; + } + + a { + color: #00bcd4; + text-decoration: none; + :hover { + text-decoration: underline; + } + } + + + + ul { + padding-left: 0 !important; + margin-top: 0; + margin-bottom: 10px; + line-height: 1.42857143; + } + + li { + list-style-type: none; + font-size: 14px; + } + + p { + margin: 0 0 10px; + font-size: 15px; + } + + + +` \ No newline at end of file diff --git a/src/Pages/HelpCenter.js b/src/Pages/HelpCenter.js index 7ae6b9d8fc1076fba56e1574095b4a901a6d6105..4151f5d7e5ff0d6921deed2be52f1b519343c055 100644 --- a/src/Pages/HelpCenter.js +++ b/src/Pages/HelpCenter.js @@ -173,9 +173,9 @@ const Secao1 = styled.div` margin-left: auto; img { - position: absolute; - left: 364px; - top: 36.9%; + position: relative; + left: 82px; + top: 41.6%; width: 230px; float: left; min-height: 1px; diff --git a/src/Pages/TabsHelp/TabPlataformaMEC.js b/src/Pages/TabsHelp/TabPlataformaMEC.js index 46b49ac5db920d38df87ee53226f5cf12ba3bf28..894d3a9ecc9d47c2be3e5b16b682eecc4b59212a 100644 --- a/src/Pages/TabsHelp/TabPlataformaMEC.js +++ b/src/Pages/TabsHelp/TabPlataformaMEC.js @@ -22,8 +22,6 @@ import Tabs from '@material-ui/core/Tabs' import Tab from '@material-ui/core/Tab'; import Breadcrumbs from '@material-ui/core/Breadcrumbs'; import Grid from '@material-ui/core/Grid'; -import Why from '../../Components/HelpCenter/TabsResoursePub/Why' -import How from '../../Components/HelpCenter/TabsResoursePub/How' import CardEncontrando from '../../Components/HelpCenter/Cards/CardEncontrando'; import CardParticipando from '../../Components/HelpCenter/Cards/CardParticipando'; import CardGerenciando from '../../Components/HelpCenter/Cards/CardGerenciando'; @@ -32,6 +30,7 @@ import Understand from '../../Components/HelpCenter/TabsPlataformaMEC/Understand import Which from '../../Components/HelpCenter/TabsPlataformaMEC/Which'; import Types from '../../Components/HelpCenter/TabsPlataformaMEC/Types'; import Software from '../../Components/HelpCenter/TabsPlataformaMEC/Software'; +import How from '../../Components/HelpCenter/TabsPlataformaMEC/How'; @@ -97,9 +96,9 @@ export default function TabPlataformaMEC (props) { {tabValue === 0 && <What title={tabs[0]}/>} {tabValue === 1 && <How title={tabs[1]}/>} {tabValue === 2 && <Understand title={tabs[2]}/>} - {tabValue === 3 && <Which title={tabs[2]}/>} - {tabValue === 4 && <Types title={tabs[2]}/>} - {tabValue === 5 && <Software title={tabs[2]}/>} + {tabValue === 3 && <Which title={tabs[3]}/>} + {tabValue === 4 && <Types title={tabs[4]}/>} + {tabValue === 5 && <Software title={tabs[5]}/>} <Grid style={{marginBlock:"50px"}} container spacing={2}> <Grid item xs={4}>