Layouts

Warp comes with a sophisticated layout system to create any kind of sidebar or widget layout. You can easily manage the sidebar's positions and widths in the theme administration. Widgets can have different styles and be placed in any position offered by this theme. Each position has its own layout. You can align widgets side-by-side, stack them or choose your own grid layout. Show or hide widgets on mobile devices, while the grid adapts perfectly to your layout.

Warp Layout System

UIkit


Article title

UIkit

Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<div class="myclass">...</div>

text-muted
text-primary
text-success
text-warning
text-danger
a element
em element
strong
code element
del element
ins element
mark element
q inside a q element
abbr element
dfn element

Badge 1 Success 4 Warning 3 Danger 4

h1

h2

h3

h4

h5
h6

Lorem ipsum dolor.

Someone famous
  • Author

    May 2, 2090 at 1:55 pm

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna.

Divider

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Header

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Box

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Box primary

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Box secondary

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Info message

Success message

Warning message

Danger message

55%
55%
55%
55%
Form states
Form styles


  • List item 1
  • List item 2
  • List item 3
  • List item 1
  • List item 2
  • List item 3
Table caption
Table Heading
Table Data
Table Data
Description lists
Description text.
Description lists
Description text.

Title

Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

Title

Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

Dummy Content

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Theme

Theme Features

Gusto is featuring brand new and advanced Warp options.

Block Appearance

Block Appearance

Gusto supports some useful options for all block layout positions. All settings can be combined for a block position. If you need different block settings for different pages, you can use layout profiles and assign them to your menu items.

Options

  • Background - Select from 4 different background colors.
  • Image - Add a path to your background image.
  • Image Blend - Define how the background image will mix / blend with the background color.
  • Image Opacity - Will add an overlay with the same background color of the block and an opacity value.
  • White - Enables the Contrast component. Recommended for block positions with a primary background color or image.
  • Padding - Select the spacing between the content and its block container.
  • Full Width - This will remove the constraint of the content container so it will extend to the full viewport width. Recommended for full width Widgetkit slideshows, for example.
  • Full Height - The block will take up full viewport height. If the navbar is set to default, the navbar height will automatically be subtracted from the subsequent block.
  • Grid Collapse - This option will reset the grid gutter and is recommended, if you want to use a full width Widgetkit slideshow or something similar.
  • Class - Use this input field for a custom CSS class which will be added to the block.

Navigation

Navigation

The main navigation of Gusto Theme supports the latest UIkit sticky navigation component features. You are able to select from 3 different navigation behaviors/styles and 2 layouts. The styles and the layout can be combined, this makes 6 different navigation combinations.

Navigation Styles

  • Not Sticky - Default navigation.
  • Always Sticky - Default navigation style but it will stick to the browser window when you scroll up and down.
  • Transparent and Sticky - Will start on a transparent background and overlays a block position with full-height property and switches back to the default sticky navigation style at a specific point.

Navigation Layouts

  • Default - A condensed navbar with the logo on the left side and the menu items on the right side.
  • Center - Logo and menu items are centered and stacked.

Home

This is a hidden article.

Opening Hours

Mon-Fri 10am - 12pm
Sat-Sun 1pm - 12pm
Cocktails 5pm - 12pm
BBQ 1pm - 9pm

About Us

In 1991 three guys thought it was time to create something very good for the human race.
read more...