TAS Style Menu – Copy Module

• Vertical margin – Include more/normal/less space before and/or after the module.
  Top and bottom | Top | Bottom | None | Top and bottom negative | Top negative | Bottom negative
• Headline – Text to include as an H2 heading (with a class of “section-heading”) at the top of the module.

  text

• Headline style – Presentation style for the headline.  Line center inserts a horizontal line next to the heading text, extending the remainder of the container width.  Normal is the same, without a horizontal line.  Underline makes the heading smaller (26px versus 40px), and inserts a line underneath, the full width of the container.

  Line center | Normal | Underline

• Background texture – Adds a dotted “texture” to the top, bottom, or both of the module.  Placement is obvious.  (This is normally only used to create a “hard” break in content, beyond what spacing or a horizontal line will convey).

  Top | Bottom | Top and Bottom | Disabled

• Background color – Sets the background color for the module.  White is default, and does not set the background color (allowing the parent container’s color of #FFFFFF to display).  White Smoke sets the background color to #F7F6F4, and adds padding to the top and bottom of 20px (which is what it has by default).  Alice blue and Platinum blue both add padding to the top and bottom of 80px.  Alice blue sets the background to #EDF7F7.  Platinum blue sets the background to #E1E8EC.

  Alice blue | White Smoke | White | Platinum blue

• Body copy align – Sets alignment of the body copy text.  Left sets the max-width to the container to 650px.  Full width spans the width of the container element with text.  Center aligns the container <div> to the center of the parent container, but the text is still left-justified.

  Left | Center | Full width

• Body copy – Normal paragraph-level text, with optional headings and styling.  Main content of the module.

  opentext

• Background color – (this is inside the Body copy main section).  Transparent does not set a background color for the body copy section.  Sky teal and Alice blue both open an additional choice of “Full width” or “Box”.  Full width spans the background color the entire page width.  Box spans only the container width. Sky teal sets the background to #E1E8EC.  Alice blue sets the background to #EDF7F7.

  Sky teal | Alice blue | Transparent

• Body Copy Column – This button allows creation sub-sections of content, with their own headline, and column of content. Each presents in a container half of the width of the parent.  An additional checkbox becomes available below the Body Copy Column section, identified as “Background blue”.
  • Headline – This is a single line text field, that displays content in a H3 header.

    text

  • Body copy – This is an opentext field that displays content in a <div> element.  Both the Headline and Body copy display together.

    opentext

  • Background blue – This appears once, if there is one or more Body copy column sections added, and applies to ALL.  It is a checkbox that appears BELOW the Body copy column sections added.  Checking this sets the background color of the container for all columns to #EDF7F7.

    Yes | No

• Boxed Copy – This button allows creation sub-sections of content, with their own headline, and a box around the content. Each presents like slightly raised card (with back-shading), half of the width of the parent.
  • Headline – This is a single line text field, that displays content in a H3 header.

    text

  • Body copy – This is an opentext field that displays content in a <div> element.  Both the Headline and Body copy display together in the “card”.

    opentext

Below is an example of the module with the recommended/typical settings (Vertical Margin = “Top and bottom”, example heading and text, Headline style = Normal, Background texture = Disabled, Background color = White, example heading and text for body copy main, Background color (Body copy main) = Transparent, example heading and text for Body copy column – times 2 for demonstration).

This is the body copy (align set to full width), not the body copy column. This is completely flexible and can display any HTML content.  It is the default content “container” for all articles.  Columns  (demonstrated below) are optional, but should be presented in pairs, for visual balance.

Etiam diam metus, pulvinar id leo vehicula, egestas auctor nulla. Praesent rhoncus at mi vitae commodo. Suspendisse potenti. Donec eu metus condimentum, condimentum dui id, ultricies mi. Phasellus mollis tincidunt nisl non ullamcorper. Donec vulputate non magna ut pellentesque.

This is the body copy (align set to full width), not the boxed copy. This is completely flexible and can display any HTML content.  It is the default content “container” for all articles.  Boxes (demonstrated below) are optional , but should be presented in pairs, for visual balance.

Etiam diam metus, pulvinar id leo vehicula, egestas auctor nulla. Praesent rhoncus at mi vitae commodo. Suspendisse potenti. Donec eu metus condimentum, condimentum dui id, ultricies mi. Phasellus mollis tincidunt nisl non ullamcorper. Donec vulputate non magna ut pellentesque.