EverWeb ThemeKit Text

Fieldset Container

Fieldset Legend
ThemeKit Text Fieldset

Fieldset

Although a fieldset is most commonly used for creating an enclosure for form elements, it can be used to visually define any type of content.
The fielset draws a border around the content and this can be styled for width, type, color and radius. It indicates to the search engines that the content inside is related.
Legend
The legend acts as a caption for the fieldset content. It is inserted in a break in the border. The default alignment is left and the inset can be adjusted using a value for left margin.
The position of the legend can be changed using text align and it can spaced away from the fieldset edge using left/right padding.
Check out the functions for the responsive image …

  • The image with alt text is optional
  • The images were resized and optimised before importing into EverWeb
  • The full size image in the example is 960 x 640px
  • The medium image is 600 x 400px
  • The optional portrait image for phones is 400 x 400px
  • Images have a lazy loading function
  • All images on a responsive website should be lazy loaded if not in view at page load
  • The image has controls for border width and color

List

The list can have a max width. It be positioned left or center and the list items have an adjustable inset. The items have a custom marker using the CSS equivalent of a HTML symbol inserted using a ::before pseudo-element.
The marker has controls for size, color and spacing from the list item text.
Link
The optional - one or two - links open an internal page and have a background hover transition when viewed on computers.

Link Bar

The ThemeKit UI Link Bar can be used for any type of linking - internal or external. It has and has selctable types ofr previous, none and next.
The first and last links can have a radiused end and an animated chevron to double chevron icon. The links also have a hover background animation.