From b3a243c44e5e9bc6d9c023f3dc762b8c476a3c1f Mon Sep 17 00:00:00 2001
From: "Henrique V. Ehrenfried" <hvehrenfried@inf.ufpr.br>
Date: Wed, 10 Feb 2021 09:18:03 -0300
Subject: [PATCH] Improve Layout of Collection page
Signed-off-by: Henrique V. Ehrenfried <hvehrenfried@inf.ufpr.br>
---
src/Components/ResourceList.js | 5 ++---
src/Pages/CollectionPage.js | 31 ++++++++-----------------------
2 files changed, 10 insertions(+), 26 deletions(-)
diff --git a/src/Components/ResourceList.js b/src/Components/ResourceList.js
index 79d0936a..4f2572f4 100644
--- a/src/Components/ResourceList.js
+++ b/src/Components/ResourceList.js
@@ -70,7 +70,7 @@ export default function ResourceList(props) {
resources.push({ "type": "LearningObject", "id": props.resources[i].id });
i++;
}
- const body = {
+ var body = {
"package": {
"object": resources
}
@@ -85,7 +85,6 @@ export default function ResourceList(props) {
});
}
}, [selected, selectable]);
- console.log("CARD >>", props.resources)
return (
<ResourceListContainer>
<Grid container direction="row" justify="space-around" alignItems="center">
@@ -116,7 +115,7 @@ export default function ResourceList(props) {
</UnstyledAnchor>
</Grid>
</Grid>
- <Grid container direction="row" justify="flex-start" alignItems="center">
+ <Grid container direction="row" justify="center" alignItems="center">
{props.resources.map((card) => {
return (
<ResourceGrid item key={card.title}>
diff --git a/src/Pages/CollectionPage.js b/src/Pages/CollectionPage.js
index 7aec85f4..ba89c4d8 100644
--- a/src/Pages/CollectionPage.js
+++ b/src/Pages/CollectionPage.js
@@ -50,7 +50,6 @@ export default function CollectionPage(props) {
const handleScrollToComments = () => {
window.scrollTo(0, comment_ref.current.offsetTop);
}
- console.log("COLLECTION >> ", collection)
return (
<>
<BreadCrumbsDiv>
@@ -59,17 +58,8 @@ export default function CollectionPage(props) {
<span>Coleções</span>
</StyledBreadCrumbs>
</BreadCrumbsDiv>
- <Grid
- container
- direction="row"
- justify="space-around"
- alignItems="center"
- spacing={4}
- >
- <Grid
- item
- md={3}
- >
+ <Grid container direction="row" justify="center" alignItems="center">
+ <Grid item md={3}>
<CollectionAuthor
author_id={collection.owner ? collection.owner.id : 0}
name={collection.owner ? collection.owner.name : ""}
@@ -77,20 +67,14 @@ export default function CollectionPage(props) {
</Grid>
- <Grid
- item
- md={5}
- >
+ <Grid item md={5}>
<CollectionDescription
scrollToComments={handleScrollToComments}
title={collection.name ? collection.name : ""}
collection_id={collection.id ? collection.id : 0} />
</Grid>
- <Grid
- item
- md={3}
- >
+ <Grid item md={3}>
<DowloadButton
id={collection.id ? collection.id : 0}
/>
@@ -103,8 +87,9 @@ export default function CollectionPage(props) {
<VerticalRuler width={1} height={100} color="rgb(238, 238, 238)" />
- <Grid container item xs={12} direction="row" justify="center" alignItems="center" style={{ backgroundColor: '#f4f4f4' }}>
- <Grid item xs={10} alignItems="center" justify="center">
+ <Grid container justify="center" style={{ backgroundColor: '#f4f4f4'}}>
+ {/* <Grid item xs={1}/> */}
+ <Grid item xs={10}>
<ResourceList resources={
collection.collection_items ?
collection.collection_items.map(i => {
@@ -128,7 +113,7 @@ export default function CollectionPage(props) {
} />
</Grid>
- <Grid container item xs={12} style={{ marginTop: 40 }} ref={comment_ref}>
+ <Grid container item xs={12} style={{ marginTop: 40, paddingBottom:40 }} ref={comment_ref}>
<CollectionCommentSection id={collection_id} />
</Grid>
</Grid>
--
GitLab