scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-23 07:38:07 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Merge pull request #2596 from benjiwheeler/hotfix/view-all-remixes

Browse source 
[Master] Show link to view all remixes on project page
This commit is contained in:
Benjamin Wheeler 2019-01-04 11:47:47 -05:00 committed by GitHub
commit ad0da48eeb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 53 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/views/preview/l10n.json
View file

@ -22,6 +22,7 @@
"project.remixButton.altText": "Save a copy of this project and add your own ideas.",
"project.remixButton.remixing": "Remixing...",
"project.remixes": "Remixes",
"project.viewAllInList": "View all",
"project.inviteToRemix": "Invite user to remix",
"project.instructionsLabel": "Instructions",
"project.notesAndCreditsLabel": "Notes and Credits",

10
src/views/preview/presentation.jsx
View file

@ -581,8 +581,14 @@ const PreviewPresentation = ({
</FlexRow>
</div>
<FlexRow className="column">
<RemixList remixes={remixes} />
<StudioList studios={projectStudios} />
<RemixList
projectId={projectId}
remixes={remixes}
/>
<StudioList
projectId={projectId}
studios={projectStudios}
/>
</FlexRow>
</FlexRow>
</div>

22
src/views/preview/preview.scss
View file

@ -554,12 +554,33 @@ $stage-width: 480px;
.remix-list,
.studio-list {
flex-direction: column;
width: 14.625rem;
.list-header {
display: flex;
width: 100%;
justify-content: space-between;
}
.list-header-spacer {
flex: 1 0 1px;
}
.list-title {
margin-left: 1rem;
font-size: 1.2rem;
font-weight: bold;
align-self: flex-start;
line-height: 110%;
text-align: left;
}
.list-header-link {
margin-right: 1rem;
align-self: flex-end;
font-size: .75rem;
line-height: 110%;
text-align: right;
}
.creator-image img {
@ -585,6 +606,7 @@ $stage-width: 480px;
@media #{$medium-and-smaller} {
margin-top: 1rem;
width: 100%;
}
}
}

9
src/views/preview/remix-list.jsx
View file

@ -10,9 +10,17 @@ const RemixList = props => {
if (remixes.length === 0) return null;
return (
<FlexRow className="remix-list">
<div className="list-header">
<div className="list-title">
<FormattedMessage id="project.remixes" />
</div>
<div className="list-header-spacer" />
<div className="list-header-link">
<a href={`/projects/${props.projectId}/remixes`}>
<FormattedMessage id="project.viewAllInList" />
</a>
</div>
</div>
{remixes.length === 0 ? (
// TODO: style remix invitation
<FormattedMessage id="project.inviteToRemix" />
@ -32,6 +40,7 @@ const RemixList = props => {
};
RemixList.propTypes = {
projectId: PropTypes.string,
remixes: PropTypes.arrayOf(projectShape)
};

9
src/views/preview/studio-list.jsx
View file

@ -10,9 +10,17 @@ const StudioList = props => {
if (studios.length === 0) return null;
return (
<FlexRow className="studio-list">
<div className="list-header">
<div className="list-title">
<FormattedMessage id="general.studios" />
</div>
<div className="list-header-spacer" />
<div className="list-header-link">
<a href={`/projects/${props.projectId}/studios`}>
<FormattedMessage id="project.viewAllInList" />
</a>
</div>
</div>
{studios.length === 0 ? (
// TODO: style remix invitation
<FormattedMessage id="addToStudio.inviteUser" />
@ -32,6 +40,7 @@ const StudioList = props => {
};
StudioList.propTypes = {
projectId: PropTypes.string,
studios: PropTypes.arrayOf(projectShape)
};