ThemeKit Slide

Slide Heading

The ThemeKit Slide Heading widget has a two column grid layout with an optional SVG icon link and an h1 through h3 heading.
EverWeb Widgets and ThemeKit Themes and widgets use HTML5. Each HTML5 container is like a mini page so the first heading is alwats an h1.
Headings are set up as …

  • h1 is used for the website name
  • h2 is used for the page subject name
  • h3 is used as a section or change of subject heading

Animation

The heading text has an optional animation from the left, down, up or scale in. The animation can fire every time the heading is in view or only once.
Animations are best removed for mobile phones since they just cause confusion. The animation can be turned on for phones if deemed necessary.

Slide Links

The ThemeKit Slide Links widget shows an action tab at the left or right of the browser/viewing device's window vertically centered in the viewport.
The slide panel can have any amount of internal/external links with a z-index control to make sure it is above the other page items in the stacking order.
Action Tab
The tab has the animated icon and vertical text. It has controls for adjusting the inset from the browser/device window edge and to add a border radius.
Vertical Text
The widget has the option to make the text uppercase which gives the best results. Once the font size has been selected the text is adjusted using the controls for text width and letter spacing.

Navigation Links

The links have a background hover animation and the current page link can be defined using a different background color. There are controls for link vertical spacing and for padding the panel and the navigation background color has an opacity slider

Vertical Text

Proper vertical text is not normally used on websites since the recognised method is simply to use a CSS transform to rotate the text through 90° which makes the text unreadable.
The homegrown method used for the slide links widgets sets it up just like avertical neon sign using some really simple CSS styles.

Slide Social Media Share

The ThemeKit Slide Share widget can be at the left or right of the browser/device window and is fixed in position at a variable percentage distance from the top.

© EverWeb Widgets -