Amara styleguide

• Global
  • Color palette
  • Typography
  • Lists
  • Definition Lists
  • Tables
  • Dropdown menus
• Layout
  • General Layout
  • Utility classes
  • Tabs
  • Multi-step Pane
• Buttons
  • Tags
  • Options
  • Split Buttons
• Iconography
  • Icons
  • Avatars
  • Step lists
• Forms
  • Forms
  • Fields
  • Checkboxes and Radios
  • Switches
  • multiField
  • Fieldsets
  • Settings page forms
  • Field errors
  • File Uploads
  • Image Uploads
  • Compound fields
  • ButtonField
  • Searchbar
  • Selects
  • Table select
  • Preset or custom
  • Dynamic Help Text
• Modals / Dialogs
  • Modal dialogs
  • Language Switcher
• Containers
  • Content header
  • Filter Box
  • Content footer
  • List View
  • Selection group
  • Accordion
  • Dynamic Formset
  • Dynamic Formset (alternate)
• Elements
  • Alerts
  • Announcements
  • Video cards
  • Video subtitles list
  • Filters
  • Check All
  • Search results / Select List
  • Pagination
  • Constrained content
  • Assignment history table
  • Workflow diagram
  • Zero states
  • Progress bars
  • Date input/display
  • Navbar
  • Checkout table
• Utility Classes
  • Text center
  • Block center
  • Block wrap
  • Video thumbnails

Selects

Selects are used to pick an option from a list of choices. Check out styleguide.forms.SelectsForm for example code to create these.

Simple select Select an option Option 1 Option 2 Very long selection option to demonstrate how the select box will look like if you have a single selection that is very long

Multiple select Select an option Option 1 Option 2 Option 3 Option 4 Option 5 Option 6 Option 7 Option 8 Option 9 Very long selection option to demonstrate how the select box will look like if you have a multiple selection that is very long

Language select

Multiple Language select

Language select with extra options

Disabled select Select an option Option 1 Option 2

Autocomplete

Filter select Select an option Option 1 Option 2 Very long selection option to demonstrate how the select box will look like if you have a single selection that is very long

Submit