Skip to content
Snippets Groups Projects
Commit 9779ea11 authored by lfr20's avatar lfr20
Browse files

Nothing changed

parent 1d8d6a14
No related branches found
No related tags found
4 merge requests!57Merge of develop into master,!56Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments...,!40merge admin into develop,!37Merge sistema_admin into Update_Admin_System
Hide whitespace changes
Inline Side-by-side
src/Components/Header.js
+ 43
− 43
View file @ 9779ea11
......@@ -32,57 +32,57 @@ import MuiAlert from '@material-ui/lab/Alert';
// boxShadow :none;
//`
function Alert(props) {
return <MuiAlert elevation={6} variant="filled" {...props} />;
return <MuiAlert elevation={6} variant="filled" {...props} />;
}
export default function Header(props){
const { state, dispatch } = useContext(Store)
const [signUpOpen, setSignUp] = useState(false)
const [loginOpen, setLogin] = useState(false)
const [successfulLoginOpen, handleSuccessfulLogin] = useState(false)
const [modalColaborar, setModalColaborar] = useState(false)
export default function Header(props) {
const { state, dispatch } = useContext(Store)
const [signUpOpen, setSignUp] = useState(false)
const [loginOpen, setLogin] = useState(false)
const [successfulLoginOpen, handleSuccessfulLogin] = useState(false)
const [modalColaborar, setModalColaborar] = useState(false)
const toggleSnackbar = (event, reason) => {
if (reason === 'clickaway') {
return;
}
const toggleSnackbar = (event, reason) => {
if (reason === 'clickaway') {
return;
}
handleSuccessfulLogin(false);
}
handleSuccessfulLogin(false);
}
const handleSignUp = () => {
setSignUp(!signUpOpen)
}
const handleSignUp = () => {
setSignUp(!signUpOpen)
}
const handleLogin = () => {
setLogin(!loginOpen)
}
const handleLogin = () => {
setLogin(!loginOpen)
}
const handleClickSearch = (open) => {
dispatch({
type: "HANDLE_SEARCH_BAR",
opened: !state.searchOpen
})
}
const handleClickSearch = (open) => {
dispatch({
type: "HANDLE_SEARCH_BAR",
opened: !state.searchOpen
})
}
return(
<>
<AcessibilityBar/>
<Snackbar open={successfulLoginOpen} autoHideDuration={1000} onClose={toggleSnackbar}
anchorOrigin = {{ vertical:'top', horizontal:'center' }}
>
<Alert severity="success" style={{backgroundColor:"#00acc1"}}>Você está conectado(a)!</Alert>
</Snackbar>
<MenuBar openSearchBar={handleClickSearch} openSignUp = {handleSignUp} openLogin = {handleLogin}/>
{ state.searchOpen &&
<SearchBar/>
}
<SignUpModal open={signUpOpen} handleClose={handleSignUp} openLogin={handleLogin}/>
<LoginModal open={loginOpen} handleClose={() => setLogin(false)} openSignUp={handleSignUp}
openSnackbar={() => {handleSuccessfulLogin(true)}}/>
<ColaborarModal open={modalColaborar} handleClose={() => {setModalColaborar(!modalColaborar)}} />
return (
<>
<AcessibilityBar />
<Snackbar open={successfulLoginOpen} autoHideDuration={1000} onClose={toggleSnackbar}
anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
>
<Alert severity="success" style={{ backgroundColor: "#00acc1" }}>Você está conectado(a)!</Alert>
</Snackbar>
<MenuBar openSearchBar={handleClickSearch} openSignUp={handleSignUp} openLogin={handleLogin} />
{state.searchOpen &&
<SearchBar />
}
<SignUpModal open={signUpOpen} handleClose={handleSignUp} openLogin={handleLogin} />
<LoginModal open={loginOpen} handleClose={() => setLogin(false)} openSignUp={handleSignUp}
openSnackbar={() => { handleSuccessfulLogin(true) }} />
<ColaborarModal open={modalColaborar} handleClose={() => { setModalColaborar(!modalColaborar) }} />
</>
)
</>
)
}
src/Components/SearchSection.js
+ 56
− 55
View file @ 9779ea11
......@@ -16,73 +16,74 @@ 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} from 'react';
import React, { Component } from 'react';
import '../App.css';
import banner from '../img/bannerBusca.jpg';
// import SearchBar from './SearchBar';
import {Row} from 'react-grid-system';
import {MdInfoOutline} from "react-icons/md"
import { FaRegPlayCircle} from "react-icons/fa";
import { Row } from 'react-grid-system';
import { MdInfoOutline } from "react-icons/md"
import { FaRegPlayCircle } from "react-icons/fa";
const bannerStyle={
width: "100%",
backgroundImage: `url(${banner})`,
backgroundSize: "cover",
textAlign: "center"
const bannerStyle = {
width: "100%",
backgroundImage: `url(${banner})`,
backgroundSize: "cover",
textAlign: "center"
}
const titleStyle={
color: "white",
paddingTop: "5%"
const titleStyle = {
color: "white",
paddingTop: "5%"
}
const buttonStyle={
alignItems: "flex-start",
fontSize: "0.7em",
textAlign: "center",
cursor: "pointer",
borderTopLeftRadius: "15px",
borderTopRightRadius: "15px",
lineHeight: 1.42857143,
width: "20%",
marginTop: "1%",
color: "white",
padding: "1.2%",
borderWidth: "5%",
borderStyle: "none",
borderImage: "initial"
const buttonStyle = {
alignItems: "flex-start",
fontSize: "0.7em",
textAlign: "center",
cursor: "pointer",
borderTopLeftRadius: "15px",
borderTopRightRadius: "15px",
lineHeight: 1.42857143,
width: "20%",
marginTop: "1%",
color: "white",
padding: "1.2%",
borderWidth: "5%",
borderStyle: "none",
borderImage: "initial"
}
class SearchSection extends Component{
constructor(props){
super(props);
this.state={
color: "#ff7f00"
};}
class SearchSection extends Component {
constructor(props) {
super(props);
this.state = {
color: "#ff7f00"
};
}
render(){
return(
<div style={bannerStyle}>
<div style={titleStyle}>
<h2>Plataforma MEC de Recursos Educacionais Digitais</h2>
<h3 style={{fontWeight: "100"}}>
Encontre e compartilhe vídeos, animações e muitos outros Recursos
</h3>
</div>
{/* <Container style={{backgroundColor: "white" ,width: "50%" ,float: "center", alignItems: "center", borderRadius: "5px", color: this.state.color}}>
render() {
return (
<div style={bannerStyle}>
<div style={titleStyle}>
<h2>Plataforma MEC de Recursos Educacionais Digitais</h2>
<h3 style={{ fontWeight: "100" }}>
Encontre e compartilhe vídeos, animações e muitos outros Recursos
</h3>
</div>
{/* <Container style={{backgroundColor: "white" ,width: "50%" ,float: "center", alignItems: "center", borderRadius: "5px", color: this.state.color}}>
<SearchBar/>
</Container> */}
<div style={{paddingBottom: "100px", color: "white"}}>
<a href="sobre" style={{color:"#fff",textDecoration: "none", outline:"none"}}><MdInfoOutline size="24px" style={{verticalAlign: "middle"}} />SOBRE A PLATAFORMA</a>
<a href="#apresentacao" style={{color:"#fff",textDecoration: "none"}}> <FaRegPlayCircle size="20px" style={{verticalAlign: "middle"}} />VÍDEO DE APRESENTAÇÃO</a>
</div>
<Row justify="center">
<button style={{...buttonStyle, ...{backgroundColor: "#ff7f00",fontSize:"1.14em", outline:"none"}}} onClick={()=> {this.props.function("Recursos")}}>Recursos Educacionais Digitais</button>
<button style={{...buttonStyle, ...{backgroundColor: "#e81f4f",fontSize:"1.14em", outline:"none"}}} onClick={()=> {this.props.function("Materiais")}}>Materiais de Formação</button>
<button style={{...buttonStyle, ...{backgroundColor: "#673ab7",fontSize:"1.14em", outline:"none"}}} onClick={()=> {this.props.function("Colecoes")}}>Coleções dos Usuários</button>
</Row>
</div>
);
}
<div style={{ paddingBottom: "100px", color: "white" }}>
<a href="sobre" style={{ color: "#fff", textDecoration: "none", outline: "none" }}><MdInfoOutline size="24px" style={{ verticalAlign: "middle" }} />SOBRE A PLATAFORMA</a>
<a href="#apresentacao" style={{ color: "#fff", textDecoration: "none" }}> <FaRegPlayCircle size="20px" style={{ verticalAlign: "middle" }} />VÍDEO DE APRESENTAÇÃO</a>
</div>
<Row justify="center">
<button style={{ ...buttonStyle, ...{ backgroundColor: "#ff7f00", fontSize: "1.14em", outline: "none" } }} onClick={() => { this.props.function("Recursos") }}>Recursos Educacionais Digitais</button>
<button style={{ ...buttonStyle, ...{ backgroundColor: "#e81f4f", fontSize: "1.14em", outline: "none" } }} onClick={() => { this.props.function("Materiais") }}>Materiais de Formação</button>
<button style={{ ...buttonStyle, ...{ backgroundColor: "#673ab7", fontSize: "1.14em", outline: "none" } }} onClick={() => { this.props.function("Colecoes") }}>Coleções dos Usuários</button>
</Row>
</div>
);
}
}
export default SearchSection;
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment