ThemeFlood.

Introduction

Earthquake is a ground-breaking new theme that shatters conventional design rules of straight lines in web design. Through the use of diagonal lines slanted at various angles, Earthquake gains a slightly more lazy, laid-back feel; a truly distinctive theme design. Needless to say, Earthquake would be an absolutely ideal theme for use in fashion, business, e-commerce, marketting, design or contemporary art websites. Any projects where you need a theme that is going to shake things up a little!

This theme is both extremely lightweight and highly customisable. The slanted blocks are all created using pure HTML and CSS markup; with the only graphics being optional images you can place in the banner container. Every colour on the page can be customised, giving you the ability to build pages that match your existing branding. Embedded web fonts grant the ability to create stunningly distinctive websites. And as you would expect, Earthquake is a mobile-first, fully responsive RapidWeaver theme, built upon the Bootstrap 4 framework.

Horizontal containers

You'll notice this theme design has support for several horizontal (slanted) containers located above and below the main content region. Each of these horizontal content containers can be enabled or disabled independently within the theme style settings. Some slant to the left, and others slant to the right. Additionally you can customise the colour scheme of each container. Within these horizontal content containers are ExtraContent containers. So you use the documented ExtraContent technique to embed your content with these containers. Choose to use as many or as few horizontal containers as you want.

By default, most horizontal containers have 5vh (vh is 'viewport height' unit of measurement) applied to the top or bottom, to provide space for overlaid slants. You can modify any of these dimensions using custom CSS code like this:

#horizontalBlock1 .horizontalBlockContent {
padding-bottom: 0vh;	
}

Custom CSS code can be added to the custom CSS box in RapidWeaver or the theme custom.css file.

FreeStyle banner

The banner region within Earthquake utilises the FreeStyle technique. This basically means the banner area is an empty canvas, into which you can place static images, a slideshow or even video. The banner region is responsive and automatically scales to fit different screen sizes and content sizes. So you will not find any rigid banner height or background settings in this theme! It is perfectly feasible to use a different banner image on different pages. On wider screens, the website slogan is layered over the banner region.

Sidebar

By default, the sidebar is disabled in Earthquake. However you can enable the display of a RapidWeaver sidebar in the theme style settings. You can opt to float the sidebar either left or right within the page, and choose a preferred width. Please note that the sidebar will need to be enabled if you're using block or split navigation layouts and some RapidWeaver page types (like the blog) require a sidebar to display complimentary links. Colour settings are provided for the sidebar content.

Navigation

Within the theme style settings, you can toggle between a drop-down navigation menu, a split navigation layout or a sidebar block navigation layout. These layout options give you plenty of flexibility to provide the most optimal form of website navigation; based on your website design and structure. If using the drop-down menu, downward-pointing caret icons can be displayed next to pages (with subpages) by simply entering the following Font Awesome code after the page name, in the RapidWeaver sidebar:

<i class='arrow fas fa-caret-down'></i>

The icon can be customised to use any Font Awesome icon. Earthquake is a mobile-first RapidWeaver theme, so on screens less-than 992px wide the navigation layout automatically becomes a toggle / accordion navigation for improved usability. Colour settings are provided for all navigation layouts.

Optimised for RapidCart Pro

RapidCart Pro is the leading e-commerce addon for RapidWeaver; making it safe and simple to get selling online. Earthquake is one of several ThemeFlood themes optimised and tested for RapidCart Pro. Combining Earthquake and RapidCart Pro, you have the necessary tools to build brilliant web stores and boost your sales! Alongside support for all the normal RapidCart Pro features, Earthquake permits you to display a shopping cart link under the website slogan using this code on your RapidCart pro page:

<div id="myExtraContent3">
	<div id="cartTotal" class="cartTotal">
		<a href="<?php echo $rc->extras->cartURL; ?>">
			<i class="fa fa-shopping-cart"></i> 
			 <span class="<?php echo $rc->extras->cartTotalCSSClass; ?>"><?php echo $rc->extras->cartTotalLocalized; ?></span>
		</a>
	</div><!--/cartTotalCSSClass-->
</div>

This code displays the cart total and a link to the cart page. This feature lets customers see how much is in their current cart, and quickly click to checkout.