adapted show and remix button to mobile

This commit is contained in:
Linda 2018-09-14 16:39:35 -04:00
parent 337a9e2f30
commit a4e7ee35e4

View file

@ -2,6 +2,7 @@ const FormattedDate = require('react-intl').FormattedDate;
const injectIntl = require('react-intl').injectIntl; const injectIntl = require('react-intl').injectIntl;
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
const intlShape = require('react-intl').intlShape; const intlShape = require('react-intl').intlShape;
const MediaQuery = require('react-responsive').default;
const React = require('react'); const React = require('react');
const Formsy = require('formsy-react').default; const Formsy = require('formsy-react').default;
const classNames = require('classnames'); const classNames = require('classnames');
@ -28,6 +29,8 @@ const ExtensionChip = require('./extension-chip.jsx');
const projectShape = require('./projectshape.jsx').projectShape; const projectShape = require('./projectshape.jsx').projectShape;
require('./preview.scss'); require('./preview.scss');
const frameless = require('../../lib/frameless');
// disable enter key submission on formsy input fields; otherwise formsy thinks // disable enter key submission on formsy input fields; otherwise formsy thinks
// we meant to trigger the "See inside" button. Instead, treat these keypresses // we meant to trigger the "See inside" button. Instead, treat these keypresses
// as a blur, which will trigger a save. // as a blur, which will trigger a save.
@ -122,20 +125,22 @@ const PreviewPresentation = ({
} }
</div> </div>
</FlexRow> </FlexRow>
<div className="project-buttons"> <MediaQuery minWidth={frameless.tablet}>
{/* TODO: Hide Remix button for now until implemented */} <div className="project-buttons">
{(!userOwnsProject && false) && {/* TODO: Hide Remix button for now until implemented */}
<Button className="button remix-button"> {(!userOwnsProject && false) &&
Remix <Button className="button remix-button">
Remix
</Button>
}
<Button
className="button see-inside-button"
onClick={onSeeInside}
>
See Inside
</Button> </Button>
} </div>
<Button </MediaQuery>
className="button see-inside-button"
onClick={onSeeInside}
>
See Inside
</Button>
</div>
</FlexRow> </FlexRow>
<FlexRow className="preview-row"> <FlexRow className="preview-row">
<div className="guiPlayer"> <div className="guiPlayer">