blog-tutorial-post-template

Tutorials

Simple Tabs

General

Max Width

Determines the maxium width of the stack, including the contents and tabs

Floating Pill Style

This is a neat feature that creates a floating pill as the selected tab marker, which will then resize and move to the active tab when a tab is changed.

Connect Tabs

This will connect the tabs to the content area, and remove border-radiuses where necessary

Active Tab

Here you can set which tab will be active when the stack initially loads

–

Tabs

Alignment

Here you can select the horizontal alignment for the tabs you can set them to be:

  • Left
  • Right
  • Center

Text Size

Determines the font-size of the text inside of each tab

Icon Size

Determines the size of the icon inside of each tab

Spacing

Controls the space around each tab, both vertical and horizontal spacing options are avialable.

Padding

Controls the amount of space inside of each tab (around the text and the icon)

Radius

Controls the corner roundness of each tab

Text

Sets the basic text color of all tabs (not selected ones)

Background

Sets the background for all tabs

Active Text

Sets the color of the active tab

Active BG

Sets the background of the active tab

–

Tabs > Responsive

Breakpoints (Tablet & Mobile)

Here you can set the points at which the tabs will turn into columns for mobile devices. You can set both the tablet and mobile breakpoints

Columns

Here you can set the number of columns for the tab grids on mobile devices. For example 3 columsn means 3 tabs per row, etc.

Hide Text

Simple tabs allows you to hide text optionally for Desktop, Tablet, and Mobile devices, you can select more than one option at a time.

Hide Icons

Simple tabs allows you to hide icons optionally for Desktop, Tablet, and Mobile devices, you can select more than one option at a time.

–

Content

Padding

Sets the amount of vertical/horizontal spacing around the content inside of the content area

Radius

Controls the corner roundness of the content area

Text

Sets the color of the text within the content area

Background

Sets the background color of the content area

Quick Links

RapidWeaver Stack Tutorials

RapidWeaver Theme Tutorials

RapidWeaver Project Documentation

Tutorials and documentation for all 1LD Project files can be found at the link below.

See Documentation

Get the power of a framework, for the price of a theme, in the convenience of a prebuilt RapidWeaver project file

Blog

Movable Windows

  • Posted On

Move beyond the confines of static content layouts! Movable Windows allows your page visitors to effortlessly drag and reposition custom content windows anywhere in the browser viewport. Windows can be minimized to free up space and stay fixed to the browser viewport so they are always accessible.

Resize & Minimize

Windows can be resized to take up more or less space, or maximized to fill the entire screen. But that’s not all – these windows are like handy sidekicks, always ready to assist. Need quick reference? No problem! Windows can be minimized when not in use, saving precious screen space for what really matters – your page content.

Inline

Open windows stay fixed on screen so they are always accessible. Minimized windows have three modes to choose from. “Inline” keeps it in line with other content, “Fixed” is always on screen, and “Draggable” lets you move it around while minimized.

Customizable

It’s not just about functionality; it’s about style too. Customize your windows by size, position, and color. Add in text, images, forms, links – you name it! Want a little more flair? Allow window resizing, choose whether they start minimized or open, change the toggle icon, or hide the window title when minimized.

Check it out!

 

 

© 2011 One Little Designer, 1 Little Designer (1LD)

RapidWeaver is a trademark of Realmac Software