diff --git a/src/Pages/TabsHelp/TabResoursePub.js b/src/Pages/TabsHelp/TabResoursePub.js index 00214bc494e26f617c2a50c9767a88e43e96e72f..75dead021e85c99fc38053789a634f487d94e9dd 100644 --- a/src/Pages/TabsHelp/TabResoursePub.js +++ b/src/Pages/TabsHelp/TabResoursePub.js @@ -60,48 +60,37 @@ export default function TabResoursePub (props) { </Link> <Link to="ajuda" > Ajuda - </Link> - + </Link> <span> {tabs[3]} </span> - - </StyledBreadCrumbs> </BreadCrumbsDiv> - <Grid container spacing={4}> - <Grid item xs={3}> - <Menu> - <h4>{tabs[3]}</h4> - <TabsStyled orientation = "vertical" - variant = "scrollable" - value = {tabValue} - onChange = {handleChangeTab} - TabIndicatorProps = {{style:{display: "none"}}} - > - <TabStyled label={tabs[0]}></TabStyled> - <TabStyled label={tabs[1]}></TabStyled> - <TabStyled label={tabs[2]}></TabStyled> - </TabsStyled> - <br/> - <div className="voltarInicio"> - <a href="ajuda">VOLTAR AO ÃNICIO</a> - </div> - <hr/> - <div className="procurava"> - Não encontrou o que procurava? Entre em - <a href="contato"> contato</a> - </div> - </Menu> - </Grid> - - <Grid item xs={9}> + <Grid container justify="center"> + <Grid item xs={12} md={10} > <Principal> - <div className="fixo"> - <img src={PublicandoRecursos} alt="Publicando Recursos"/> - <span>{tabs[3]}</span> - </div> + <Menu> + <div className="fixo"> + <img src={PublicandoRecursos} alt="Publicando Recursos"/> + <span>{tabs[3]}</span> + </div> + <TabsStyled orientation = "vertical" + variant = "scrollable" + value = {tabValue} + onChange = {handleChangeTab} + TabIndicatorProps = {{style:{display: "none"}}} + > + <TabStyled label={tabs[0]}></TabStyled> + <TabStyled label={tabs[1]}></TabStyled> + <TabStyled label={tabs[2]}></TabStyled> + </TabsStyled> + <br/> + <div className="voltarInicio"> + <a href="ajuda">VOLTAR AO ÃNICIO</a> + </div> + </Menu> + {tabValue === 0 && <Why title={tabs[0]}/>} {tabValue === 1 && <How title={tabs[1]}/>} {tabValue === 2 && <Which title={tabs[2]}/>} @@ -111,22 +100,22 @@ export default function TabResoursePub (props) { <span>Você pode navegar pelos tópicos de ajuda ou entrar em <a href="contato">Contato</a>.</span> </div> </div> - <Grid style={{marginBottom:"50px"}} container spacing={2}> - <Grid item xs={4}> - <CardEncontrando/> - </Grid> - <Grid item xs={4}> - <CardParticipando/> - </Grid> - <Grid item xs={4}> - <CardGerenciando/> - </Grid> - - </Grid> </Principal> </Grid> - </Grid> + </Grid> + <Grid style={{paddingBottom:"50px"}} container justify={"center"}> + <Grid item xs={12} md={3} style={{margin:5}}> + <CardEncontrando/> + </Grid> + <Grid item xs={12} md={3} style={{margin:5}}> + <CardParticipando/> + </Grid> + <Grid item xs={12} md={3} style={{margin:5}}> + <CardGerenciando/> + </Grid> + + </Grid> </Secao> @@ -136,7 +125,6 @@ export default function TabResoursePub (props) { const StyledBreadCrumbs = styled(Breadcrumbs)` display : flex; justify-content : flex-start; - max-width : 1170px; span { color : #a5a5a5; } @@ -160,7 +148,6 @@ const Principal = styled.div` height: 40px; text-align: center; background-color: #fff; - box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); padding: 30px; margin-bottom: 30px; color: #666; @@ -217,7 +204,10 @@ const TabsStyled = styled(Tabs)` .MuiTab-root{ text-transform: none !important; + max-width:100% } + text-align: center; + width:100% ` @@ -227,6 +217,7 @@ const TabStyled = styled(Tab)` font-weight: 500; font-size: 14px !important; border-radius: 4px !important; + text-align: center; @@ -244,6 +235,8 @@ const Menu = styled.div` color: #666; padding-block: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); + margin-bottom:30px + h4 { padding-inline: 15px; @@ -289,7 +282,6 @@ const Menu = styled.div` ` const Secao = styled.div` - width: 1138px; margin-inline: auto; `