11 Gennaio 2011

Typography

Pubblicato in Template articles

Warnings

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orci non tortor accumsan...

Highlights

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sagittis massa eu nibh gravida ornare. Integer a pellentesque purus, vitae consectetur urna. Cras commodo suscipit magna in porttitor. Cras quis venenatis dolor. Nunc congue id libero ut feugiat.
Use content here... .

Progress Bar

60%

Label one

90%

Label two

80%

Label three

70%

Label four

Code

#wrapper {
  float: left;
  display: block;
}

Use <pre> content here... </pre> or <code> content here... </code>

Unordered lists

<ul>

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

numBlocks

here goes a numberand here text of element

01 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue.

02 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue.

Blocks

Use content here...

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue.

Use content here...

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue.

Use <div class="legend"> <h4> Title </h4> and here text. </div>

Legend

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue.

Blockquote

Use <blockquote> Your quoted text goes here... </blockquote>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue.

Floated blocks

Here goes main part of the text Block of textrest of the text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum pulvinar justo, sed faucibus ligula feugiat ac. Morbi quis enim nulla, vel congue augue. Duis quis quam sed purus porta eleifend.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget dignissim augue. Donec ante felis, aliquam ut consequat eget, lobortis dapibus risus. Aliquam laoreet enim et lectus ornare hendrerit. Aliquam rhoncus enim libero. Morbi aliquam, nibh mattis feugiat dapibus, nisi massa adipiscing.

Here goes main part of the text Block of textrest of the text

Icons - Font Awesome

The Font Awesome is a set of base icons similar to the Glyphicons included with Bootstrap, plus a set of extended icons that include pictograms for external links, thumbs up/down, comments, cogs and more. Font Awesome is licensed under the Creative Commons Attribution 3.0 Unported (CC BY 3.0). More details you can find on project homepage at http://fortawesome.github.com/Font-Awesome

Use content here...

fa-adjust
fa-anchor
fa-archive
fa-arrows
fa-arrows-h
fa-arrows-v
fa-asterisk
fa-ban
fa-bar-chart-o
fa-barcode
fa-bars
fa-beer
fa-bell
fa-bell-o
fa-bolt
fa-book
fa-bookmark
fa-bookmark-o
fa-briefcase
fa-bug
fa-building-o
fa-bullhorn
fa-bullseye
fa-calendar
fa-calendar-o
fa-camera
fa-camera-retro
fa-caret-square-o-down
fa-caret-square-o-left
fa-caret-square-o-right
fa-caret-square-o-up
fa-certificate
fa-check
fa-check-circle
fa-check-circle-o
fa-check-square
fa-check-square-o
fa-circle
fa-circle-o
fa-clock-o
fa-cloud
fa-cloud-download
fa-cloud-upload
fa-code
fa-code-fork
fa-coffee
fa-cog
fa-cogs
fa-comment
fa-comment-o
fa-comments
fa-comments-o
fa-compass
fa-credit-card
fa-crop
fa-crosshairs
fa-cutlery
fa-dashboard (alias)
fa-desktop
fa-dot-circle-o
fa-download
fa-edit (alias)
fa-ellipsis-h
fa-ellipsis-v
fa-envelope
fa-envelope-o
fa-eraser
fa-exchange
fa-exclamation
fa-exclamation-circle
fa-exclamation-triangle
fa-external-link
fa-external-link-square
fa-eye
fa-eye-slash
fa-female
fa-fighter-jet
fa-film
fa-filter
fa-fire
fa-fire-extinguisher
fa-flag
fa-flag-checkered
fa-flag-o
fa-flash (alias)
fa-flask
fa-folder
fa-folder-o
fa-folder-open
fa-folder-open-o
fa-frown-o
fa-gamepad
fa-gavel
fa-gear (alias)
fa-gears (alias)
fa-gift
fa-glass
fa-globe
fa-group (alias)
fa-hdd-o
fa-headphones
fa-heart
fa-heart-o
fa-home
fa-inbox
fa-info
fa-info-circle
fa-key
fa-keyboard-o
fa-laptop
fa-leaf
fa-legal (alias)
fa-lemon-o
fa-level-down
fa-level-up
fa-lightbulb-o
fa-location-arrow
fa-lock
fa-magic
fa-magnet
fa-mail-forward (alias)
fa-mail-reply (alias)
fa-mail-reply-all
fa-male
fa-map-marker
fa-meh-o
fa-microphone
fa-microphone-slash
fa-minus
fa-minus-circle
fa-minus-square
fa-minus-square-o
fa-mobile
fa-mobile-phone (alias)
fa-money
fa-moon-o
fa-music
fa-pencil
fa-pencil-square
fa-pencil-square-o
fa-phone
fa-phone-square
fa-picture-o
fa-plane
fa-plus
fa-plus-circle
fa-plus-square
fa-plus-square-o
fa-power-off
fa-print
fa-puzzle-piece
fa-qrcode
fa-question
fa-question-circle
fa-quote-left
fa-quote-right
fa-random
fa-refresh
fa-reply
fa-reply-all
fa-retweet
fa-road
fa-rocket
fa-rss
fa-rss-square
fa-search
fa-search-minus
fa-search-plus
fa-share
fa-share-square
fa-share-square-o
fa-shield
fa-shopping-cart
fa-sign-in
fa-sign-out
fa-signal
fa-sitemap
fa-smile-o
fa-sort
fa-sort-alpha-asc
fa-sort-alpha-desc
fa-sort-amount-asc
fa-sort-amount-desc
fa-sort-asc
fa-sort-desc
fa-sort-down (alias)
fa-sort-numeric-asc
fa-sort-numeric-desc
fa-sort-up (alias)
fa-spinner
fa-square
fa-square-o
fa-star
fa-star-half
fa-star-half-empty (alias)
fa-star-half-full (alias)
fa-star-half-o
fa-star-o
fa-subscript
fa-suitcase
fa-sun-o
fa-superscript
fa-tablet
fa-tachometer
fa-tag
fa-tags
fa-tasks
fa-terminal
fa-thumb-tack
fa-thumbs-down
fa-thumbs-o-down
fa-thumbs-o-up
fa-thumbs-up
fa-ticket
fa-times
fa-times-circle
fa-times-circle-o
fa-tint
fa-toggle-down (alias)
fa-toggle-left (alias)
fa-toggle-right (alias)
fa-toggle-up (alias)
fa-trash-o
fa-trophy
fa-truck
fa-umbrella
fa-unlock
fa-unlock-alt
fa-unsorted (alias)
fa-upload
fa-user
fa-users
fa-video-camera
fa-volume-down
fa-volume-off
fa-volume-up
fa-warning (alias)
fa-wheelchair
fa-wrench

fa-check-square
fa-check-square-o
fa-circle
fa-circle-o
fa-dot-circle-o
fa-minus-square
fa-minus-square-o
fa-plus-square
fa-plus-square-o
fa-square
fa-square-o

fa-bitcoin (alias)
fa-btc
fa-cny (alias)
fa-dollar (alias)
fa-eur
fa-euro (alias)
fa-gbp
fa-inr
fa-jpy
fa-krw
fa-money
fa-rmb (alias)
fa-rouble (alias)
fa-rub
fa-ruble (alias)
fa-rupee (alias)
fa-try
fa-turkish-lira (alias)
fa-usd
fa-won (alias)
fa-yen (alias)

fa-align-center
fa-align-justify
fa-align-left
fa-align-right
fa-bold
fa-chain (alias)
fa-chain-broken
fa-clipboard
fa-columns
fa-copy (alias)
fa-cut (alias)
fa-dedent (alias)
fa-eraser
fa-file
fa-file-o
fa-file-text
fa-file-text-o
fa-files-o
fa-floppy-o
fa-font
fa-indent
fa-italic
fa-link
fa-list
fa-list-alt
fa-list-ol
fa-list-ul
fa-outdent
fa-paperclip
fa-paste (alias)
fa-repeat
fa-rotate-left (alias)
fa-rotate-right (alias)
fa-save (alias)
fa-scissors
fa-strikethrough
fa-table
fa-text-height
fa-text-width
fa-th
fa-th-large
fa-th-list
fa-underline
fa-undo
fa-unlink (alias)

fa-angle-double-down
fa-angle-double-left
fa-angle-double-right
fa-angle-double-up
fa-angle-down
fa-angle-left
fa-angle-right
fa-angle-up
fa-arrow-circle-down
fa-arrow-circle-left
fa-arrow-circle-o-down
fa-arrow-circle-o-left
fa-arrow-circle-o-right
fa-arrow-circle-o-up
fa-arrow-circle-right
fa-arrow-circle-up
fa-arrow-down
fa-arrow-left
fa-arrow-right
fa-arrow-up
fa-arrows
fa-arrows-alt
fa-arrows-h
fa-arrows-v
fa-caret-down
fa-caret-left
fa-caret-right
fa-caret-square-o-down
fa-caret-square-o-left
fa-caret-square-o-right
fa-caret-square-o-up
fa-caret-up
fa-chevron-circle-down
fa-chevron-circle-left
fa-chevron-circle-right
fa-chevron-circle-up
fa-chevron-down
fa-chevron-left
fa-chevron-right
fa-chevron-up
fa-hand-o-down
fa-hand-o-left
fa-hand-o-right
fa-hand-o-up
fa-long-arrow-down
fa-long-arrow-left
fa-long-arrow-right
fa-long-arrow-up
fa-toggle-down (alias)
fa-toggle-left (alias)
fa-toggle-right (alias)
fa-toggle-up (alias)

fa-arrows-alt
fa-backward
fa-compress
fa-eject
fa-expand
fa-fast-backward
fa-fast-forward
fa-forward
fa-pause
fa-play
fa-play-circle
fa-play-circle-o
fa-step-backward
fa-step-forward
fa-stop
fa-youtube-play

fa-adn
fa-android
fa-apple
fa-bitbucket
fa-bitbucket-square
fa-bitcoin (alias)
fa-btc
fa-css3
fa-dribbble
fa-dropbox
fa-facebook
fa-facebook-square
fa-flickr
fa-foursquare
fa-github
fa-github-alt
fa-github-square
fa-gittip
fa-google-plus
fa-google-plus-square
fa-html5
fa-instagram
fa-linkedin
fa-linkedin-square
fa-linux
fa-maxcdn
fa-pagelines
fa-pinterest
fa-pinterest-square
fa-renren
fa-skype
fa-stack-exchange
fa-stack-overflow
fa-trello
fa-tumblr
fa-tumblr-square
fa-twitter
fa-twitter-square
fa-vimeo-square
fa-vk
fa-weibo
fa-windows
fa-xing
fa-xing-square
fa-youtube
fa-youtube-play
fa-youtube-square

fa-ambulance
fa-h-square
fa-hospital-o
fa-medkit
fa-plus-square
fa-stethoscope
fa-user-md
fa-wheelchair

14 Settembre 2011

Page Break

Pubblicato in Template articles

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin posuere nisi quis odio egestas non tempus est sollicitudin. Nulla facilisi. Pellentesque tempus suscipit nulla sed tempor. Phasellus et lorem id libero fermentum molestie sit amet sit amet mi. Quisque ultrices, neque et laoreet dictum, arcu sapien pulvinar odio, in aliquam mi dui eu leo. Nullam posuere, arcu et egestas fermentum, enim purus fermentum diam, quis porta mauris lectus ut odio. In tincidunt dapibus malesuada. Integer a lorem ligula. In tincidunt augue eget velit convallis nec pharetra eros tincidunt. Maecenas et tortor libero, vel malesuada est.

Quisque magna tellus, condimentum a porttitor eu, fermentum nec enim. Aenean et erat nec lectus adipiscing auctor. Sed tellus sapien, condimentum eget tristique ac, faucibus sed nisi. Curabitur pretium porta pulvinar. Integer cursus venenatis dictum. Morbi massa est, ultricies ut ultrices vitae, hendrerit vitae tellus. Duis a nulla quis tellus lacinia tristique.

Donec libero urna, cursus vitae sollicitudin sit amet, elementum et massa. Donec feugiat, turpis a dictum vulputate, dui diam faucibus nunc, ac sodales augue magna id augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec sit amet nisi felis. Morbi faucibus nunc id elit aliquam ac condimentum leo laoreet. Sed nec risus sed nulla mattis volutpat in eget diam. In leo nisl, eleifend vel lobortis vel, tincidunt a ligula. Nulla placerat gravida laoreet. In lobortis, ligula in sagittis pellentesque, orci magna venenatis neque, eu sagittis lacus ante et tellus. Morbi vel semper augue. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam erat volutpat.

10 Settembre 2011

Page break example

Pubblicato in Template articles

Ut dignissim aliquet nibh tristique hendrerit. Donec ullamcorper nulla quis metus vulputate id placerat augue eleifend. Aenean venenatis consectetur orci, sit amet ultricies magna sagittis vel. Nulla non diam nisi, ut ultrices massa. Pellentesque sed nisl metus. Praesent a mi vel ante molestie venenatis.

Donec sed odio dui. Cras mattis consectetur purus sit amet fermentum. Nullam quis risus eget urna mollis ornare vel eu leo. Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam.

13 Gennaio 2011

Module variations

Pubblicato in Template articles

On this page you can see basic suffixes used in this template.

01The clear suffix is very useful to create banners or images without additional borders, margins and paddings. The clear suffix is also very useful inside the mainbody, mainbody_top and mainbody_bottom module positions.

02For the News Show Pro GK5 and Tabs GK5 modules please always disable usage of the default CSS styles in the module settings.

03If you want to get special spacing while using the module instead the component on the frontpage, please add the frontpage suffix.

04You can also use the following suffixes: title-centered, narrow

05For the NSP GK5 module you can also use the following suffixes: offerts, category-layout

Typography

Warnings

Highlights

Progress Bar

Code

Unordered lists

numBlocks

Blocks

Legend

Blockquote

Floated blocks

Icons - Font Awesome

Web Application Icons

Form Control Icons

Currency Icons

Text Editor Icons

Directional Icons

Video Player Icons

Brand Icons

Medical Icons

Page Break

Page break example

Module variations

Warnings

Highlights

Progress Bar

Code

Unordered lists

numBlocks

Blocks

Legend

Blockquote

Floated blocks

Icons - Font Awesome

Web Application Icons

Form Control Icons

Currency Icons

Text Editor Icons

Directional Icons

Video Player Icons

Brand Icons

Medical Icons

Log in