From 9089f97ac69623e1a4b4b9c8ac960f7a1812b222 Mon Sep 17 00:00:00 2001
From: "Henrique V. Ehrenfried" <hvehrenfried@inf.ufpr.br>
Date: Wed, 3 Feb 2021 09:26:26 -0300
Subject: [PATCH] Improve reponsivity of some pages
Signed-off-by: Henrique V. Ehrenfried <hvehrenfried@inf.ufpr.br>
---
src/Components/CollectionCommentSection.js | 2 +-
.../ResourcePageComponents/CommentForm.js | 30 +++++++++----------
.../ResourcePageComponents/Sobre.js | 1 -
.../SearchExpansionPanel/ExpansionPanel.css | 7 +++++
.../SearchExpansionPanel.js | 4 +--
src/Pages/CollectionPage.js | 1 -
6 files changed, 25 insertions(+), 20 deletions(-)
diff --git a/src/Components/CollectionCommentSection.js b/src/Components/CollectionCommentSection.js
index 9351596e..375a4ba4 100644
--- a/src/Components/CollectionCommentSection.js
+++ b/src/Components/CollectionCommentSection.js
@@ -74,7 +74,7 @@ export default function CollectionCommentSection(props) {
`
return (
<NoCommentsContainer>
- <Image src={Comentario} />
+ <Image src={Comentario} style={{width:"100%", maxWidth:234}}/>
<BlueTitle>Compartilhe sua opinião com a rede!</BlueTitle>
<Secondary>Gostou desta coleção? Comente e compartilhe com a rede sua opinião. Interagindo com a rede, você contribui para que mais coleções como esta sejam criadas.</Secondary>
<Button
diff --git a/src/Components/ResourcePageComponents/CommentForm.js b/src/Components/ResourcePageComponents/CommentForm.js
index 1859e116..0c1b3a85 100644
--- a/src/Components/ResourcePageComponents/CommentForm.js
+++ b/src/Components/ResourcePageComponents/CommentForm.js
@@ -90,7 +90,7 @@ export default function CommentForm (props) {
<div className="star-alert" style={attemptedSubmit ? {visibility : "visible"} : {visibility : "hidden" }}>{props.recurso ? "Avalie se o recurso foi útil." : "Avalie se esta coleção foi útil."}</div>
<Grid container>
- <Grid item xs={10}>
+ <Grid item xs={12} md={9}>
<StyledTextField
colecao={!props.recurso}
value={comment.value}
@@ -103,22 +103,22 @@ export default function CommentForm (props) {
help = {comment.error ? (props.recurso ? "Escreva aqui a sua experiência com este Recurso" : "Escreva aqui a sua experiência com esta Coleção") : ''}
/>
</Grid>
- <Grid item xs={2}>
+ <Grid item xs={12} md={3}>
<div style={{height : "100%", display : "flex", flexDirection : "column", justifyContent : "flex-end"}}>
- {
- props.recurso ?
- (
- <OrangeButton type="submit">Publicar</OrangeButton>
- )
- :
- (
- <PurpleButton type="submit"><EditIcon/>Enviar</PurpleButton>
- )
- }
- </div>
- </Grid>
+ {
+ props.recurso ?
+ (
+ <OrangeButton type="submit">Publicar</OrangeButton>
+ )
+ :
+ (
+ <PurpleButton type="submit"><EditIcon/>Enviar</PurpleButton>
+ )
+ }
+ </div>
+ </Grid>
- <div className="campos-obrigatorios">* Campos obrigatórios.</div>
+ <div className="campos-obrigatorios">* Campos obrigatórios.</div>
</Grid >
</StyledForm>
)
diff --git a/src/Components/ResourcePageComponents/Sobre.js b/src/Components/ResourcePageComponents/Sobre.js
index 0ff18fa7..7cf58bf7 100644
--- a/src/Components/ResourcePageComponents/Sobre.js
+++ b/src/Components/ResourcePageComponents/Sobre.js
@@ -270,7 +270,6 @@ const SobreDiv = styled.div`
.tags-container {
padding : 0;
width : 100%;
- display : flex;
flex-direction : row;
align-items : center;
font-size : .8em;
diff --git a/src/Components/SearchExpansionPanel/ExpansionPanel.css b/src/Components/SearchExpansionPanel/ExpansionPanel.css
index c96e8361..f97d0f57 100644
--- a/src/Components/SearchExpansionPanel/ExpansionPanel.css
+++ b/src/Components/SearchExpansionPanel/ExpansionPanel.css
@@ -5,3 +5,10 @@
min-width: 30px !important;
}
+.MuiListItem-secondaryAction {
+ padding-right: 0px !important;
+}
+
+.MuiListItem-gutters {
+ padding-left: 10px !important;
+}
\ No newline at end of file
diff --git a/src/Components/SearchExpansionPanel/SearchExpansionPanel.js b/src/Components/SearchExpansionPanel/SearchExpansionPanel.js
index 6a8dea5d..ca65cb10 100644
--- a/src/Components/SearchExpansionPanel/SearchExpansionPanel.js
+++ b/src/Components/SearchExpansionPanel/SearchExpansionPanel.js
@@ -64,7 +64,7 @@ const TesteTypography = withStyles({
const ExpansionPanelDetails = withStyles(theme => ({
root: {
- padding: theme.spacing(2)
+ // padding: theme.spacing(2)
}
}))(MuiExpansionPanelDetails);
@@ -98,7 +98,7 @@ export default function SearchExpansionPanel(props) {
direction="row"
justify="space-between"
>
- <Grid item>
+ <Grid item >
<Typography
style={{
fontSize: "18px",
diff --git a/src/Pages/CollectionPage.js b/src/Pages/CollectionPage.js
index 123f6c6a..d2b71215 100644
--- a/src/Pages/CollectionPage.js
+++ b/src/Pages/CollectionPage.js
@@ -190,7 +190,6 @@ export default function CollectionPage(props) {
const StyledBreadCrumbs = styled(Breadcrumbs)`
display: flex;
justify-content: flex-start;
- max-width: 1170px;
span {
color: #a5a5a5;
}
--
GitLab