ionic-researchKit icon indicating copy to clipboard operation
ionic-researchKit copied to clipboard

Places irk-scale-question-step min/max text below the slider

Open dman7 opened this issue 8 years ago • 3 comments

When using ionic-researchKit on iOS and Android device in portrait mode, the slider was squished between the min and max text:

screen shot 2017-03-16 at 5 58 44 pm

I propose to place the min/max text below the slider:

screen shot 2017-03-16 at 5 55 12 pm

dman7 avatar Mar 21 '17 01:03 dman7

Thanks for your suggestion but I'd like to keep the same look as in Apple's ResearchKit as much as possible. A better fix would be to keep the min/max values on the same line as the range slider, give it a fixed width style in css so the range slider will not get squished, then place the mix/maxDescriptions below with fixed widths too that is slightly wider to accommodate long text descriptions.

ninoguba avatar Mar 21 '17 15:03 ninoguba

That makes sense, but with one comment: why not make the row of min/max values and range slider a flexbox? The min/max values take up as little as they need, and the range slider takes up the rest.

dman7 avatar Mar 21 '17 15:03 dman7

Sure go ahead and use flexbox. Look forward to an updated PR.

ninoguba avatar Mar 21 '17 16:03 ninoguba