Bootstrap Visuals for Confluence
  • Introduction
  • Free and License Macros
  • Administrator Guide
    • Sample Page Code
    • Interference with other Apps
    • Data Center Compatibility
  • User Guide
    • Alert Box
    • Alert Box 5
    • Bootstrap Color Styles
    • Badge
    • Badge 5
    • Button
    • Button 5
    • Button Group
    • Button Group 5
    • Callout
    • Callout 5
    • Card
    • Card 5
    • Jumbotron
    • List Group
    • List Group 5
    • List Group Item
    • List Group Item 5
    • Panel
    • Progress Bar
    • Progress Bar 5
    • Multi Progress Bar 5
    • Spacer
    • Spinner
    • Spinner 5
    • Toast
  • Credits
Powered by GitBook
On this page
  • Screenshot
  • Description
  • Adding the Macro
  • Macro Options

Was this helpful?

  1. User Guide

Panel

PreviousList Group Item 5NextProgress Bar

Last updated 2 years ago

Was this helpful?

Free Macro

Screenshot

Description

The Bootstrap Panel gives you most freedom in applying Bootstrap styles. It is based on a panel shape with a body text. You can define colors for text, background and border, apply a border radius and give it your own external CSS classes and define custom styles on top.

The parameters used in the three examples above are explained below in the Macro Options table.

Adding the Macro

Edit your page.

Select “+” => Other macros

Type in “Bootstrap” in the Search box

Select the “Bootstrap Spacer” macro

Macro Options

Option
Description
Screenshot (Top)
Screenshot (Middle)
Screenshot (Bottom)

Text Color

Select one of the Bootstrap colors

inherit

light

white

Background Color

Select one of the Bootstrap colors

inherit

info

danger

Top Border

Show a top border

Right Border

Show a right border

Bottom Border

Show a bottom border

Left Border

Show a left border

Border Color

Select one of the Bootstrap colors

warning

warning

Border Radius

Select a border radius

rounded

rounde-circle

ID

Optional ID if you want to address the object from an external source

Other Classes

Apply custom classes that are available on your page

CSS Styles

Enter optional custom styles

width:400px;

padding:8px; border-width:8px !important; width:400px;

width:50px; height:50px; border-width:4px !important; text-align:center; font-size:32px;