Button Element

Every theme must have 2 button colors (one regular and one highlight), as well as 2 sizes (small and large), so you need to create 4 different styles. Each of the 4 button styles needs to define a:

  • regular state
  • :hover state (when the user’s mouse is over)
  • :active state (when the user presses down).

The Gallery element displays multiple images. You need to provide styling for the following:

  • Full caption (on hover or persistent)
  • Partial caption (on over or persistent)
  • Lightbox styling (close, next, previous, background)

Divider Element

The Divider adds a horizontal line to the page.

You need to provide the following styling:

  • Line color
  • Line weight
  • Spacing

Forms

Form elements consist of a number input components (such as a dropdown), text (such as a label) and buttons. When adding the form to a page, users can decide which elements to use, and how to style them. Provide styling for the following:

  • Field labels
  • Field titles
  • Required input
  • Small text box
  • Large text box
  • Radio buttons
  • Dropdown box
  • Checkboxes
  • File upload
  • Phone number
  • Submit button

Miscellaneous Elements

You need to provide styling for the following:

  • Search box
  • Social icons - vector social font with CSS
  • Image container
  • H2 - Product title
  • Product price
  • Sale price
  • Product description
  • Button (view and add to cart)

Help make these docs better!