Loading...
Find
Log in
Username:
Password:
CapsLock is on.
Remember me (for 1 week)
Log in
Stay in SSL mode
History: Updating a theme for Bootstrap
View page
Source of version: 13
(current)
!! Module boxes Tiki is using the Bootstrap "panels" component (see [http://getbootstrap.com/components/#panels]) for module boxes (and for the "box" plugin). This means, by default, modules will have a border and a title and body background color. For themes such as FiveAlive whose module boxes don't have a border or background color, some rules are needed to override bootstrap.css. These rules only apply to modules and not to panels in other parts of the site such as on admin pages. The HTML for the simple panel looks like this: ~pp~<div class="panel panel-default"> <div class="panel-heading">Panel heading without title</div> <div class="panel-body"> Panel content </div> </div>~/pp~ And the HTML for the panel with title: ~pp~<div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">Panel title</h3> </div> <div class="panel-body"> Panel content </div> </div>~/pp~ To prevent the border and the background color and adjust the white space accordingly, add these CSS rules to your stylesheet: ~pp~.module.panel { background-color: transparent; border: none; box-shadow: none; margin-bottom: 20px; } .module.panel-default { border-color: transparent; } .module.panel-default > .panel-heading { background-color: transparent; border: none; color: inherit; } .module .panel-heading { border-bottom: none; border-radius: 0; padding: 10px 0 5px; } .module h3.panel-title { font-size: 1.55em; font-weight: 700; } .module .panel-body { padding: 5px; }~/pp~ gezza: how about adding bootstrap class called "panel-body" to templates/module.tpl to line 87, than the above extras are not needed Since modules have a title and body, it seems to me that the HTML best matches the Bootstrap panel with title and body. So they'll have to be overridden by the theme stylesheet. But maybe there should be a parameter in the module to switch off the borders and background colors. What do you think? {sign user="chibaguy" datetime="2013-11-20T13:50:01+00:00"} * there is param nobox=y for the fluffies {sign user="luci" datetime="2013-11-27T10:02:38+00:00"} Maybe there could be a dropdown list for styling in the module options with bs styling options like: * default * primary * success * info * warning * danger * + an option for noborder-nobackground
Switch Theme
Site theme (fivealive-lite/grape)
Default
Amelia
Business
Cerulean
Cosmo
Cyborg
Darkly
Darkroom
Darkshine
Feb12
Fivealive-lite
Fivealive
Flatly
Greenvalley
Journal
Jqui
Lighty
Litera
Lumen
Lux
Materia
Minty
Morph
Ohia
Pulse
Quartz
Sandstone
Simplex
Sketchy
Slate
Solar
Spacelab
Strasa
Superhero
Thenews
Tikicorp
Tikinewt
Tikipedia
United
Utopias
Vapor
Yeti
None
Akebi
Grape
Kiwi
Lemon
Orange
Plum
Raspberry
Watermelon
Switch
Layout
Stay on this page
Default
Fixed top navbar (uses site icon + "topbar" module zone)
Basic Bootstrap
Classic Tiki (3 containers - header, middle, footer)
Tikipedia
Latest Changes
No records to display
...more
Subscribe to Tiki Newsletters!
Delivered fresh to your email inbox!
Don't miss major announcements and other big news!
Site Config
Site upgraded to Tiki 23.x
Sat 24 of Jul, 2021 00:30 GMT
Site upgraded to Tiki 20
Wed 29 of May, 2019 07:57 GMT
We are now on Tiki 19.x
Fri 05 of Oct, 2018 10:02 GMT
Shoutbox module removed
Thu 28 of Jun, 2018 07:01 GMT
We are now on Tiki 18.x
Wed 02 of May, 2018 08:46 GMT
Upgraded to Tiki 17.0
Wed 02 of Aug, 2017 08:19 GMT
Upgraded to Tiki 15.0alpha
Tue 08 of Mar, 2016 13:34 GMT
Site updated to Tiki 14 beta
Tue 21 of Apr, 2015 00:01 GMT
Testing Tiki10
Thu 15 of Nov, 2012 23:06 GMT
Configurable header buttons in XtratoVeil layout
Wed 17 of Oct, 2012 14:54 GMT