A two column grid layout with reveal on click. The grid has an image with alt text in a <figure> and a heading, text and optional link in an <article>.
Mobile
On screen widths below the break point the right curtain is removed and the grid items stack.
The ThemeKit Toggle Curtain widget has an overlay which can be toggled open/closed using an animated action tab.
The image is inserted in three sizes for the various devices and has an optional lazy loading function.
Curtain Styles
The angle at which the curtains meet can be adjust using a slider. Below the breakpoint there is a single curtain sliding in from the left.
Stage
Behind the curtain is an article style element with an image and a text block with a heading, text, styled spans and an optional link.
The ThemeKit Toggle Link Bar widget can be inserted below any content item to provide extra links to internal or external pages.
The link bar has an action tab with label and an animated icon and can be styled with a solid color or two color gradient background.
The slide up menu has controls for adjusting its background color and opacity, padding and the link spacing.
Info Links
The ThemeKit Toggle Scroll widget scrolls the page down in viewport height stages and scrolls to the top.
The action tabs can be positioned left or right and their position X and Y and vertical spacing can be adjusted.
There are controls for icon color, background and for hover background colors.
Action>
he scroll down tab apears on page load and then the scroll to the top tab appears after the page is scrolled by 600px.
The ThemeKit Toggle Social links widget action tab can be positioned left or right and appears half way down the bbrwoser/device window. It has the share icon and has controls for the icon color and the background color and its opacity.
The links fly out on click. Therre are ten links for the most popular social media sites and an extra ink which can be configured as an internal/external link.
The links can have the same icon color and background color or, by checking a box, individual backgrounds.
The preinstalled SVG icons are for …
The action tab rotates on click and the links fly out in a horizontal line. On mobile phones the links are arranged tobe stacked vertically.