Vimeo Video
This is the ThemeKit Video Player widget set up to play a Vimeo hosted video. Note that the default Vimeo player skin is displayed on hover and the dark/light skin option is not available.
Vimeo Player Option
ThemeKit Heading
Heading
The heading widget create an h1 throguh h4 heading which has plenty of styling options, can over the item above it and can be congiured as an anchor for use with the ThemeKit Scroll Nav,
The heading has a maximum width setting so that when the texxt align is set to left - or right - it can be aligned with the items above and below.
Text Module
ThemeKit Text Module
The ThemeKit Text Module should be used to replace the EverWeb default text box which is not really suitable for responsive page designs.
The text is contained in an HTML5 <article> element and has an optional heading, text, span styles and optional links.
Links
Text links are not user friendly for mobile device users and are less likely to be clicked than separate CTA(Call To Action) style links.
The module has the option for up to three links. These can be configured to open internal or external pages and have anew windwo option.
The links can be "Apple" style with a trailing double chevron or block links with a contrasting background and a border radius control.
Spans
Spans can be inserted for emphasis or as sub headings and there are controls for setting their font size and color.
Text x 2
Left Column
The container has a CSS grid layout which encloses two HTML5 <article> elements.
Each article has an h1 heading, text and a CTA style link tab
Vertical Align
These are grid items so they can be vertically aligned at the "start" or the "center".
Right Column
When viewed on browser/screen widths above the break pont the columns can have a separator line.
On screen widths below the break point the right column sits below the left and the separator - if used - becomes horizontal.
Two Text Blocks
The side by side text blocks are a better idea than full width text if the page content width is set very wide. It is easier for the eye to move from one line to the next if they are short.
The columns have controls for adjusting their relative widths. In the example the left column is 4fr (fractional unite) and the right one is 3fr giving a ratio of 4:3.