ThemeKit Navigation [1]

Curtain Navigation

The ThemeKit Nav Curtain has curtains slidng in from the left and right. The curtains can have a solid or gradient background or an image for a more dramatic effect.
The animated menu tab will open and close the menu. Also clicking on the background or any link will close it again.
Images
The image is inserted in three sizes for the various devices. The images in the demo were sized and optinised before importing into EverWeb …

  • Large Image - 1200 x 800px
  • Medium Image - 600 x 800px
  • Small Image - 375 x 540px

Setup

The navigation can be open for editing. The links have a background hover animation and the current page link can be displayed with a different background color.

Social Slide In

The ThemeKit Social Slide widget creates a horizontalal block of SVG icon links that can appear on load or slide in after a preset delay.
The link size and vertical spacing is adjustable and they can be positioned left or right.
The links have a common icon color and the background color can be set for each one. When viewed on computers they have a hover animation.
The animation time is set in milliseconds and the delay in seconds.
To insert an SVG …

  • Open the SVG icon download folder
  • Select the icon
  • Double click it to open it in TextEdit.app set in plain text mode …
  • … or use a code editor
  • Copy the code and paste it into the widget settings

SVGs

SVG icons should be used to replace all PNG icons and are more efficient and have better quality than font icons like FontAwesome.
Free Icons
There are 100s of icons in the folder which can be downloaded from the link in the "Read Me First" file in the widgets folder.
The social side menu also uses SVG icons.
SVG ixon code can be quickly copied and pasted using the freeware app CotEditor which can be download from the link below or from the Apple App Store.

FlyoutCotEditor