[cols][col size=”1/4″]
[pricetable color=”#9FB44F” title=”Like A Noob” price=”Freeyay!” button_type=”danger” button_url=”#” button_label=”Register”]
- Includes stuff
- Other great items
- Yep that too
[/pricetable]
[/col][col size=”1/4″]
[pricetable color=”#FAA732″ title=”Like a Player” price=”$1999 /m” button_type=”danger” button_url=”#” button_label=”Sign Up”]
- Includes stuff
- Other great items
- Yep that too
[/pricetable]
[/col][col size=”1/4″]
[pricetable color=”#49AFCD” title=”Like A Sir” price=”$2999/m” button_type=”danger” button_url=”#” button_label=”Sign Up”]
- Includes stuff
- Other great items
- Yep that too
[/pricetable]
[/col][col size=”1/4″]
[pricetable color=”#414141″ title=”Like A Boss!” price=”$4999/m” button_type=”danger” button_url=”#” button_label=”Cha-Ching”]
- Includes stuff
- Other great items
- Yep that too
[/pricetable]
[/col][/cols]
[cols][col size=”1/2″]
Tabs
[tabs][tab title=”Home”]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis.[/tab]
[tab title=”Profile”]Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. [/tab]
[tab title=”Message”]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. [/tab]
[tab title=”Settings”] Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Nullam mollis. [/tab][/tabs]
[/col][col size=”1/2″]
Accordion
[accordion][item title=”Heading 01″]Lorem ipsum dolor sit amet dapibus id [/item]
[item title=”Heading 02″] Lorem ipsum dolor sit amet nullam mollis[/item]
[item title=”Heading 03″]Lorem ipsum dolor sit amet nisi neque [/item][/accordion]
[/col][/cols]
Alerts
[cols][col size=”1/2″]
[alert type=”danger” display=”block”]Oh snap! You got an error![/alert]
[alert type=”danger” display=”block”]
You Have A Decision To Make!
Change this and that an…rus sit amet fermentum.
[button type=”danger” size=”medium” url=”#”]Take this action[/button] [button type=”inverse” size=”medium” url=”#”]Or do this[/button]
[/alert]
[/col][col size=”1/2″]
[alert type=”warning” display=”inline”]Holy guacamole! Best check yo self, yo…ng too good.[/alert]
[alert type=”info” display=”inline”]Heads up! Options fo… attributes.[/alert]
[alert type=”success” display=”block”]Success! You did it, now relax and enjoy it
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
[/alert]
[/col][/cols]
[divider type=”dotted”]
[cols][col size=”1/2″]
Buttons
[button type=”default” size=”medium” url=”#”]Default[/button]
[button type=”primary” size=”medium” url=”#”]Primary[/button]
[button type=”info” size=”medium” url=”#”]Info[/button]
[button type=”warning” size=”medium” url=”#”]Warning[/button]
[button type=”danger” size=”medium” url=”#”]Danger[/button]
[button type=”inverse” size=”medium” url=”#”]Inverse[/button]
[button type=”success” size=”medium” url=”#”]Success[/button]
[divider type=”dotted”]
Buttons Large
[button type=”default” size=”large” url=”#”]01[/button]
[button type=”primary” size=”large” url=”#”]02[/button]
[button type=”info” size=”large” url=”#”]03[/button]
[button type=”warning” size=”large” url=”#”]04[/button]
[button type=”danger” size=”large” url=”#”]05[/button]
[button type=”inverse” size=”large” url=”#”]06[/button]
[button type=”success” size=”large” url=”#”]07[/button]
[/col][col size=”1/2″]
Icon Buttons
[button type=”default” size=”medium” url=”#”][icon type=”icon-refresh” color=”black”]Refresh[/button]
[button type=”success” size=”medium” url=”#”][icon type=”icon-shopping-cart” color=”white”]Checkout[/button]
[button type=”danger” size=”medium” url=”#”][icon type=”icon-trash” color=”white”]Delete[/button]
[button type=”primary” size=”large” url=”#”][icon type=”icon-comment” color=”white”]Comment[/button]
[button type=”warning” size=”large” url=”#”][icon type=”icon-cog” color=”white”]Settings[/button]
[button type=”info” size=”large” url=”#”][icon type=”icon-info-sign” color=”white”]More Info[/button]
[divider type=”dotted”]
Buttons Small
[button type=”default” size=”small” url=”#”]Default[/button]
[button type=”primary” size=”small” url=”#”]Primary[/button]
[button type=”info” size=”small” url=”#”]Info[/button]
[button type=”warning” size=”small” url=”#”]Warning[/button]
[button type=”danger” size=”small” url=”#”]Danger[/button]
[button type=”inverse” size=”small” url=”#”]Inverse[/button]
[button type=”success” size=”small” url=”#”]Success[/button]
[/col][/cols]
[divider type=”dotted”]
[cols][col size=”1/2″]
Inline Labels
[label type=”default”]Default[/label]
[label type=”success”]Success[/label]
[label type=”warning”]Warning[/label]
[label type=”important”]Important[/label]
[label type=”info”]Info[/label]
[label type=”inverse”]Inverse[/label]
Label buttons
[label type=”default” url=”#”]Read More[/label]
[label type=”important” url=”#”]Go[/label]
[label type=”info” url=”#”]Follow Us[/label]
[label type=”Success” url=”#”]Download Sources[/label]
[/col][col size=”1/2″]
Share Buttons
[share type=”facebook”]
[share type=”twitter”]
[share type=”google”]
[share type=”pinterest”]
Badges
[badge type=”default”]1[/badge]
[badge type=”info”]2[/badge]
[badge type=”important”]3[/badge]
[badge type=”warning”]4[/badge]
[badge type=”inverse”]5[/badge]
[badge type=”success”]6[/badge]
[badge type=”important” url=”#”]ON[/badge]
[badge type=”default” url=”#”]OFF[/badge]
[badge type=”success” url=”#”]NEW[/badge]
[badge type=”inverse” url=”#”]Mute[/badge]
[/col][/cols]
[divider type=”dotted”]
[cols][col size=”1/3″]
Vimeo Video
[/col][col size=”1/3″]
YouTube Video
[/col][col size=”1/3″]
Local Video
[/col][/cols]
[divider type=”dotted”]
Code Syntax Highlighting [label type=”info”]A Shortcode Class From The Pixelentity Framework[/label]
<?php class PeThemeShortcodeBS_Divider extends PeThemeShortcode { public function __construct($master) { parent::__construct($master); $this->trigger = "divider"; $this->group = __pe("UI"); $this->name = __pe("Divider"); $this->description = __pe("Add a divider"); $this->fields = array( "type"=> array( "divider" => __pe("Divider Type"), "type" => "Select", "description" => __pe("Select the type of divider required."), "options" => array( __pe("Solid") => "solid", __pe("Dotted") => "dotted" ), "default" => "solid" ) ); } public function output($atts,$content=null,$code="") { extract($atts); $html =<<<EOL <div class="row-fluid"> <div class="span12"> <div class="divider $type clearfix"><span></span></div> </div> </div> EOL; return trim($html); } } ?>
[divider type=”dotted”]
[hero type=”default” title=”Headline Banner”]This is a simple hero unit, a jumbotron-style component for calling extra attention to featured content or information.
[button type=”warning” size=”large” url=”#”]Action Button[/button] [/hero]
[divider type=”dotted”]
[cols][col size=”1/2″]
Popovers
Hover over the button to see the popover.
[popover position=”top” url=”#” type=”danger” title=”Popover Title” body=”Popover content”]Hover for popover[/popover]
[popover position=”bottom” url=”#” type=”warning” title=”Popover Title” body=”Popover content”]Popover Bottom[/popover]
Plain Text Popover
This is an example of a plain text [popover position=”top” url=”#” type=”none” title=”Popover Title” body=”Popover content”]popover[/popover]. Rollover the [popover position=”right” url=”#” type=”none” title=”Popover Title” body=”Popover content”]highlighted text[/popover] to see the demo in action.
[/col][col size=”1/2″]
Tooltip
Rollover the various elements below to see a demo of the tooltip function.
[tooltip position=”top” url=”#” type=”info” title=”Button Tooltip”]Rollover for tooltip[/tooltip]
[tooltip position=”top” url=”#” type=”none” title=”Label Tooltip”][label type=”important”]Label Example[/label][/tooltip]
[tooltip position=”top” url=”#” type=”none” title=”Badge”][badge type=”success”]01[/badge][/tooltip]
[tooltip position=”top” url=”#” type=”none” title=”Icon Example”][icon type=”icon-download” color=”black”] [/tooltip]
Plain Text Tooltip
This is a plain text exmaple of the [tooltip position=”top” url=”#” type=”none” title=”Top Tooltip”]tooltip function[/tooltip]. Rollover the highlighted text to see the [tooltip position=”bottom” url=”#” type=”none” title=”Btm Tooltip”]tooltips[/tooltip].[/col][/cols]
[divider type=”dotted”]
Bundled Icons [label type=”info”]Available in White & Black[/label]
[cols][col size=”1/4″]
[icon type=”icon-adjust” color=”black”] icon-adjust
[icon type=”icon-align-center” color=”black”] icon-align-center
[icon type=”icon-align-justify” color=”black”] icon-align-justify
[icon type=”icon-align-left” color=”black”] icon-align-left
[icon type=”icon-align-right” color=”black”] icon-align-right
[icon type=”icon-arrow-down” color=”black”] icon-arrow-down
[icon type=”icon-arrow-left” color=”black”] icon-arrow-left
[icon type=”icon-arrow-right” color=”black”] icon-arrow-right
[icon type=”icon-arrow-up” color=”black”] icon-arrow-up
[icon type=”icon-asterisk” color=”black”] icon-asterisk
[icon type=”icon-backward” color=”black”] icon-backward
[icon type=”icon-ban-circle” color=”black”] icon-ban-circle
[icon type=”icon-barcode” color=”black”] icon-barcode
[icon type=”icon-bell” color=”black”] icon-bell
[icon type=”icon-bold” color=”black”] icon-bold
[icon type=”icon-book” color=”black”] icon-book
[icon type=”icon-bookmark” color=”black”] icon-bookmark
[icon type=”icon-briefcase” color=”black”] icon-briefcase
[icon type=”icon-bullhorn” color=”black”] icon-bullhorn
[icon type=”icon-calendar” color=”black”] icon-calendar
[icon type=”icon-camera” color=”black”] icon-camera
[icon type=”icon-certificate” color=”black”] icon-certificate
[icon type=”icon-check” color=”black”] icon-check
[icon type=”icon-chevron-down” color=”black”] icon-chevron-down
[icon type=”icon-chevron-left” color=”black”] icon-chevron-left
[icon type=”icon-chevron-right” color=”black”] icon-chevron-right
[icon type=”icon-chevron-up” color=”black”] icon-chevron-up
[icon type=”icon-circle-arrow-down” color=”black”] icon-circle-arrow-down
[icon type=”icon-circle-arrow-left” color=”black”] icon-circle-arrow-left
[icon type=”icon-circle-arrow-right” color=”black”] icon-circle-arrow-right
[icon type=”icon-circle-arrow-up” color=”black”] icon-circle-arrow-up
[icon type=”icon-cog” color=”black”] icon-cog
[icon type=”icon-comment” color=”black”] icon-comment
[icon type=”icon-download” color=”black”] icon-download
[icon type=”icon-download-alt” color=”black”] icon-download-alt
[/col][col size=”1/4″]
[icon type=”icon-edit” color=”black”] icon-edit
[icon type=”icon-eject” color=”black”] icon-eject
[icon type=”icon-envelope” color=”black”] icon-envelope
[icon type=”icon-exclamation-sign” color=”black”] icon-exclamation-sign
[icon type=”icon-eye-close” color=”black”] icon-eye-close
[icon type=”icon-eye-open” color=”black”] icon-eye-open
[icon type=”icon-facetime-video” color=”black”] icon-facetime-video
[icon type=”icon-fast-backward” color=”black”] icon-fast-backward
[icon type=”icon-fast-forward” color=”black”] icon-fast-forward
[icon type=”icon-file” color=”black”] icon-file
[icon type=”icon-film” color=”black”] icon-film
[icon type=”icon-filter” color=”black”] icon-filter
[icon type=”icon-fire” color=”black”] icon-fire
[icon type=”icon-flag” color=”black”] icon-flag
[icon type=”icon-folder-close” color=”black”] icon-folder-close
[icon type=”icon-folder-open” color=”black”] icon-folder-open
[icon type=”icon-font” color=”black”] icon-font
[icon type=”icon-forward” color=”black”] icon-forward
[icon type=”icon-fullscreen” color=”black”] icon-fullscreen
[icon type=”icon-gift” color=”black”] icon-gift
[icon type=”icon-glass” color=”black”] icon-glass
[icon type=”icon-globe” color=”black”] icon-globe
[icon type=”icon-hand-down” color=”black”] icon-hand-down
[icon type=”icon-hand-left” color=”black”] icon-hand-left
[icon type=”icon-hand-right” color=”black”] icon-hand-right
[icon type=”icon-hand-up” color=”black”] icon-hand-up
[icon type=”icon-hdd” color=”black”] icon-hdd
[icon type=”icon-headphones” color=”black”] icon-headphones
[icon type=”icon-heart” color=”black”] icon-heart
[icon type=”icon-home” color=”black”] icon-home
[icon type=”icon-inbox” color=”black”] icon-inbox
[icon type=”icon-indent-left” color=”black”] icon-indent-left
[icon type=”icon-indent-right” color=”black”] icon-indent-right
[icon type=”icon-info-sign” color=”black”] icon-info-sign
[icon type=”icon-italic” color=”black”] icon-italic
[/col][col size=”1/4″]
[icon type=”icon-leaf” color=”black”] icon-leaf
[icon type=”icon-list” color=”black”] icon-list
[icon type=”icon-list-alt” color=”black”] icon-list-alt
[icon type=”icon-lock” color=”black”] icon-lock
[icon type=”icon-magnet” color=”black”] icon-magnet
[icon type=”icon-map-marker” color=”black”] icon-map-marker
[icon type=”icon-minus” color=”black”] icon-minus
[icon type=”icon-minus-sign” color=”black”] icon-minus-sign
[icon type=”icon-move” color=”black”] icon-move
[icon type=”icon-music” color=”black”] icon-music
[icon type=”icon-off” color=”black”] icon-off
[icon type=”icon-ok” color=”black”] icon-ok
[icon type=”icon-ok-circle” color=”black”] icon-ok-circle
[icon type=”icon-ok-sign” color=”black”] icon-ok-sign
[icon type=”icon-pause” color=”black”] icon-pause
[icon type=”icon-pencil” color=”black”] icon-pencil
[icon type=”icon-picture” color=”black”] icon-picture
[icon type=”icon-plane” color=”black”] icon-plane
[icon type=”icon-play” color=”black”] icon-play
[icon type=”icon-play-circle” color=”black”] icon-play-circle
[icon type=”icon-plus” color=”black”] icon-plus
[icon type=”icon-plus-sign” color=”black”] icon-plus-sign
[icon type=”icon-print” color=”black”] icon-print
[icon type=”icon-qrcode” color=”black”] icon-qrcode
[icon type=”icon-question-sign” color=”black”] icon-question-sign
[icon type=”icon-random” color=”black”] icon-random
[icon type=”icon-refresh” color=”black”] icon-refresh
[icon type=”icon-remove” color=”black”] icon-remove
[icon type=”icon-remove-circle” color=”black”] icon-remove-circle
[icon type=”icon-remove-sign” color=”black”] icon-remove-sign
[icon type=”icon-repeat” color=”black”] icon-repeat
[icon type=”icon-resize-full” color=”black”] icon-resize-full
[icon type=”icon-resize-horizontal” color=”black”] icon-resize-horizontal
[icon type=”icon-resize-small” color=”black”] icon-resize-small
[icon type=”icon-resize-vertical” color=”black”] icon-resize-vertical
[/col][col size=”1/4″]
[icon type=”icon-retweet” color=”black”] icon-retweet
[icon type=”icon-road” color=”black”] icon-road
[icon type=”icon-screenshot” color=”black”] icon-screenshot
[icon type=”icon-search” color=”black”] icon-search
[icon type=”icon-share” color=”black”] icon-share
[icon type=”icon-share-alt” color=”black”] icon-share-alt
[icon type=”icon-shopping-cart” color=”black”] icon-shopping-cart
[icon type=”icon-signal” color=”black”] icon-signal
[icon type=”icon-star” color=”black”] icon-star
[icon type=”icon-star-empty” color=”black”] icon-star-empty
[icon type=”icon-step-backward” color=”black”] icon-step-backward
[icon type=”icon-step-forward” color=”black”] icon-step-forward
[icon type=”icon-stop” color=”black”] icon-stop
[icon type=”icon-tag” color=”black”] icon-tag
[icon type=”icon-tags” color=”black”] icon-tags
[icon type=”icon-tasks” color=”black”] icon-tasks
[icon type=”icon-text-height” color=”black”] icon-text-height
[icon type=”icon-text-width” color=”black”] icon-text-width
[icon type=”icon-th” color=”black”] icon-th
[icon type=”icon-th-large” color=”black”] icon-th-large
[icon type=”icon-th-list” color=”black”] icon-th-list
[icon type=”icon-thumbs-down” color=”black”] icon-thumbs-down
[icon type=”icon-thumbs-up” color=”black”] icon-thumbs-up
[icon type=”icon-time” color=”black”] icon-time
[icon type=”icon-tint” color=”black”] icon-tint
[icon type=”icon-trash” color=”black”] icon-trash
[icon type=”icon-upload” color=”black”] icon-upload
[icon type=”icon-user” color=”black”] icon-user
[icon type=”icon-volume-down” color=”black”] icon-volume-down
[icon type=”icon-volume-off” color=”black”] icon-volume-off
[icon type=”icon-volume-up” color=”black”] icon-volume-up
[icon type=”icon-warning-sign” color=”black”] icon-warning-sign
[icon type=”icon-wrench” color=”black”] icon-wrench
[icon type=”icon-zoom-in” color=”black”] icon-zoom-in
[icon type=”icon-zoom-out” color=”black”] icon-zoom-out
[/col][/cols]