tweak: UX improvements to research

This commit is contained in:
NunoSempere 2021-11-25 13:54:21 +00:00
parent c04bf0649d
commit 1180d167c9

View File

@ -230,7 +230,7 @@ export default function Home({ listOfElementsDefault }) {
let nextStepSlider = ({ posList, binaryComparisons, sliderValue, Reasoning, element1, element2 }) => { let nextStepSlider = ({ posList, binaryComparisons, sliderValue, Reasoning, element1, element2 }) => {
if (sliderValue < 1 && sliderValue > 0) { if (sliderValue < 1 && sliderValue > 0) {
sliderValue = 1/sliderValue; sliderValue = 1 / sliderValue;
[element1, element2] = [element2, element1] [element1, element2] = [element2, element1]
} }
console.log(`posList@nextStepSlider:`) console.log(`posList@nextStepSlider:`)
@ -288,18 +288,20 @@ export default function Home({ listOfElementsDefault }) {
<input <input
type="number" type="number"
value={sliderValue} value={sliderValue}
onChange={(event) =>{ onChange={(event) => {
//console.log(event) //console.log(event)
//console.log(event.target.value) //console.log(event.target.value)
setSliderValue(event.target.value) setSliderValue(event.target.value)
}} }}
className="text-center" className="text-center px-2 py-1 placeholder-blueGray-300 text-blueGray-600 relative bg-white bg-white rounded text-lg border-0 shadow outline-none focus:outline-none focus:ring w-8/12 m-2 "
/> />
<br /> <br />
{`times as valuable as ...`} {`times as valuable as ...`}
</label> </label>
<br /> <br />
<br />
<SubmitSliderButton <SubmitSliderButton
posList={posList} posList={posList}
binaryComparisons={binaryComparisons} binaryComparisons={binaryComparisons}
@ -309,6 +311,7 @@ export default function Home({ listOfElementsDefault }) {
nextStepSlider={nextStepSlider} nextStepSlider={nextStepSlider}
/> />
</div> </div>
</div> </div>
<div <div
className="flex m-auto border-gray-300 border-4 h-72 w-72 p-5 " className="flex m-auto border-gray-300 border-4 h-72 w-72 p-5 "
@ -320,6 +323,16 @@ export default function Home({ listOfElementsDefault }) {
</div> </div>
</div> </div>
</div> </div>
<br />
<label className="">
Reasoning (optional):
<br />
<textarea className="mt-2 px-3 py-4 placeholder-blueGray-300 text-blueGray-600 relative bg-white bg-white rounded text-base border-0 shadow outline-none focus:outline-none focus:ring w-full"
value={reasoning}
onChange={(event) => setReasoning(event.target.value)}
/>
</label>
<br />
<div> <div>
</div> </div>
{/* {/*