some fixes and adapted remix and studio thumbnails

This commit is contained in:
Linda 2018-09-14 17:02:13 -04:00
parent a4e7ee35e4
commit 4f3d77f42a
2 changed files with 18 additions and 6 deletions

View file

@ -87,7 +87,7 @@ const PreviewPresentation = ({
{ projectInfo && projectInfo.author && projectInfo.author.id && ( { projectInfo && projectInfo.author && projectInfo.author.id && (
<Formsy onKeyPress={onKeyPress}> <Formsy onKeyPress={onKeyPress}>
<div className="inner"> <div className="inner">
<FlexRow className="preview-row"> <FlexRow className="preview-row force-row">
<FlexRow className="project-header"> <FlexRow className="project-header">
<a href={`/users/${projectInfo.author.username}`}> <a href={`/users/${projectInfo.author.username}`}>
<Avatar <Avatar
@ -125,7 +125,7 @@ const PreviewPresentation = ({
} }
</div> </div>
</FlexRow> </FlexRow>
<MediaQuery minWidth={frameless.tablet}> <MediaQuery minWidth={frameless.mobile}>
<div className="project-buttons"> <div className="project-buttons">
{/* TODO: Hide Remix button for now until implemented */} {/* TODO: Hide Remix button for now until implemented */}
{(!userOwnsProject && false) && {(!userOwnsProject && false) &&
@ -359,10 +359,12 @@ const PreviewPresentation = ({
} }
</FlexRow> </FlexRow>
</div> </div>
<FlexRow className="column"> <MediaQuery minWidth={frameless.mobile}>
<RemixList remixes={remixes} /> <FlexRow className="column">
<StudioList studios={projectStudios} /> <RemixList remixes={remixes} />
</FlexRow> <StudioList studios={projectStudios} />
</FlexRow>
</MediaQuery>
</FlexRow> </FlexRow>
</div> </div>
</div> </div>

View file

@ -154,6 +154,10 @@ $medium-and-small: "screen and (max-width : #{$tablet}-1)";
.comments-container { .comments-container {
width: 65%; width: 65%;
@media #{$medium-and-small} {
width: 100%;
}
} }
.remix-button, .remix-button,
@ -195,6 +199,12 @@ $medium-and-small: "screen and (max-width : #{$tablet}-1)";
justify-content: space-between; justify-content: space-between;
align-items: flex-start; align-items: flex-start;
flex-wrap: nowrap; flex-wrap: nowrap;
&.force-row {
@media #{$medium-and-small} {
flex-direction: row;
}
}
} }
.guiPlayer { .guiPlayer {