Survey Task: Chooser and ChoiceButton styling updates

[seanmiller26]

Package

Choose from the list:

• [ ] app-content-pages
• [ ] app-project
• [ x ] lib-classifier
• [ ] lib-panoptes-js
• [ ] lib-react-components
• [ ] unknown

Is your feature request related to a problem? Please describe.

Changing the animal choice designs to be more intentional and future-proof. This also addresses mobile friendliness.

Describe the solution you'd like

There are three display options for a survey task: 1 column, 2 columns, or 3 columns, with or without a thumbnail.

1 column styling: A consistent cell size of 60px H x 500 W. 16pt font. This stretches the full width of the task area.

2 column styling: A consistent cell size of 60px H x 250px W. 16pt font. Each line should alternate between a #FFFFFF fill and a #EFF2F5 fill.

3 column styling: Cell size of 60px H x 166px W. 14pt font. Each line should alternate between a #FFFFFF fill and a #EFF2F5 fill.

No thumbnail:

Figma for reference https://www.figma.com/design/ASqNlLhicNRzEDhYDA2t8j/Survey?node-id=0-1&m=dev&t=PxDxXDB67AH8V9Aa-1

Tied closely with #6237