ThemeKit EZ Jumbotron
LayoutGradient or image background with a grid layout overlay with an optional image and a text block with heading, optional styled span text and an optional navigation with internal/external links.
ThemeKit EZ Animation
ThemeKit
Jumbotron
The ThemeKit EZ Jumbotron can have a solid, two color gradient or an image background. The image is inserted in three sizes with an alt text attribute and a lazy loading option.
The height of the jumbo is the sum of the content height and the values for percentage top and bottom padding.
Items
The jumbotron can have either the text block in the center or be switched to a two column layout with an image and the text block.
When both items are present the layout above the breakpoint can be switched. Below the break the image appears above the text.
Text Area
The text area is an HTML5 <article> and has …
- A heading with font size and align controls
- An optional styled span with font size color & align controls
- A paragraph with font size, text align and line height controls
- A link bar with internal/external links
- Link min width & spacing controls
Container Styles
The image and text have controls to add a border to define them and for a bottom box shadow to help "lift" them off the canvas to add a sense of depth to the layout
ThemeKit EZ Heading
Heading
The ThemeKit EZ Heading widget creates an h1 through h3 heading with the option to add a logo link at the left leaving space for the navigation action tab at the right when used as the page header.
Animation
The heading text can animate in with a gentle swing animation from the left to attract attention.
Logo
The optional logo/internal link can have an SVG icon or can be used for text or a number. It has controls for …
- Logo width, height & padding
- Font, Google font & web safe fallback
- Font size, background color & opacity
- Background hover animation
- Border width, color & radius
- A checkbox to make it round/oval
- A checkbox to hide the icon on phones