diff --git a/README.md b/README.md index d1049f66..3d7ae706 100644 --- a/README.md +++ b/README.md @@ -122,7 +122,6 @@ The project is structured as follows: - Update `URLInputsTab` as necessary - Be sure to read the `IMPORTANT` comment before editing the inputs - There are multiple paths in the render function depending on if your input is a `useMultipleInput`, `multiple`, etc. - if you change one, you will likely need to update all of them. - ...WIP? - Add the new task to `ModelDetailPage` in `getSampleInputs` and `getInputType` @@ -131,8 +130,6 @@ The project is structured as follows: - In the `makeOutput` function, add a new case statement for your new Output - Generally you will only need to pass through the `trialOutput` and `onBackClicked` but if you need to be able to re-run the trial on the same page (for example with Conversations) then you would also add a prop here for `runTrial`. -- ...to be continued - - Additional Notes: - To test the upload dashboard in storybook, open `useUploadInputControl` and: - Find the text `COMMENT THIS OUT BEFORE COMMITTING` and uncomment it. diff --git a/src/components/Experiment/QuickOutput/MultiInputPreview.js b/src/components/Experiment/QuickOutput/MultiInputPreview.js index b80147cf..ceb0cd73 100644 --- a/src/components/Experiment/QuickOutput/MultiInputPreview.js +++ b/src/components/Experiment/QuickOutput/MultiInputPreview.js @@ -5,6 +5,7 @@ import { ReactComponent as DocumentIcon } from "../../../resources/icons/icon-do import "./MultiInput.scss"; import { TaskInputTypes } from "../../../helpers/TaskInputTypes"; +import { QuickInputType } from "../QuickInput/quickInputType"; const defaultProps = { className: "multi-input-preview", @@ -19,11 +20,11 @@ export default function MultiInputPreview(givenProps) { const getInputs = (input) => { switch (input.inputType) { - case TaskInputTypes.Text: + case QuickInputType.Text: return (
{input.src}
); - case TaskInputTypes.Document: + case QuickInputType.Document: return ( ); - case TaskInputTypes.Image: + case QuickInputType.Image: return (Unable to display input
diff --git a/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3D.scss b/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3D.scss index d50bc08e..ce61c9f1 100644 --- a/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3D.scss +++ b/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3D.scss @@ -72,18 +72,20 @@ &-subtitle { @include body; border-bottom: 1px solid $smokeDarkest; - margin-bottom: 24px; padding-bottom: 16px; @include mobileWidth-lg { @include bodySmall; } } - &-help-text { - @include bodySmall; - font-size: 14px; - margin-bottom: 12px; - } + &-model-controls { + display: flex; + justify-content: center; + + img { + max-width: 300px; + } + } &-model { border: 1px solid $smokeDarkest; border-radius: 5px; diff --git a/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3DOutput.js b/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3DOutput.js index 947d6096..4a69ade0 100644 --- a/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3DOutput.js +++ b/src/components/Experiment/QuickOutput/Outputs/ImageTo3D/ImageTo3DOutput.js @@ -12,6 +12,8 @@ import Rating from "../Classification/Rating"; import OutputDuration from "../_Common/components/OutputDuration"; import OBJComponent from "./OBJComponent"; +import directions from "../../../../../resources/img/3d-model-guide.png"; + import "./ImageTo3D.scss"; // Uncomment these to try out other 3D examples @@ -53,9 +55,10 @@ export default function ImageTo3DOutput(props) {{task.outputText}
-- Hover over the model and scroll to zoom, click-and-hold to rotate, right-click-and-hold to drag -
+