Embedded Job Board Style Guide

This style guide provides an overview of the available CSS classes that comprise the embedded job board theme.

Important:

There is a required space between #HumiJobBoard and the class name.

#HumiJobBoard .humi-job-board

mceclip0.png

  • Contains the entire job board.
  • Determines the border width, colour, and rounded corners.
  • Determines the font.

#HumiJobBoard .humi-job-board-content

mceclip1.png

  • Contains the job board content.
  • Determines the spacing between the content and the border.

#HumiJobBoard .humi-job-board-categorymceclip2.png

  • Contains a job board category.
  • Determines the spacing between each category.

#HumiJobBoard .humi-job-board-category-heading

mceclip3.png

  • Contains the heading section of a job board category.
  • Determines the space between the category heading and the first job posting.

#HumiJobBoard .humi-job-board-category-heading-title

mceclip4.png

  • Contains the title of the job board category.
  • Determines the font size of category titles and the spacing around them.

#HumiJobBoard .humi-job-board-category-header-posting-count

mceclip5.png

  • Contains the job posting count for the category.
  • Determines the font size, line height, spacing above, and the transform to uppercase.

#HumiJobBoard .humi-job-board-postingsmceclip6.png

  • Contains all of the job postings for a given category.
  • Determines the left indent spacing.

#HumiJobBoard .humi-job-board-postingmceclip7.png

  • Contains an individual job posting.
  • Determines the spacing below each job posting.

#HumiJobBoard .humi-job-board-posting-title

mceclip8.png

  • Contains the title of an individual job posting.
  • Determines the font size and the spacing around the title.

 

#HumiJobBoard .humi-job-board-posting-details

mceclip9.png

  • Contains the details of an individual job posting, including the location, full-time/part-time status, and the posting date.
  • Determines the font size, font-weight (bold), the spacing above, and the transform to uppercase.

#HumiJobBoard .humi-job-board-posting-link

mceclip10.png

  • Contains the link to the job posting.
  • Determines the spacing above the link.

  Discover More About Job Boards

Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.