Breadcrumbs

Changing the output of Panel macros

You can change the output of Panel macros by modifying the Scroll Web Help Theme or your own template. 

Before you begin: To change the output of Panel macros, a template must exist.

To change the output of Panel macros in the exported HTML file:

The styles you set are applied to all exported Panel macros not just individual ones

  1. Open your template folder.

  2. Go to src > main > resources > com.k15t.scroll.scroll-webhelp-theme > scroll-html > css in your template directory.

  3. Open the content-style.css file with your favorite text editor.

  4. Find the Panels and Admonitions Section:

    1. To modify the look of the panel header change the styles of .wiki-content div.panel div.title.panel-header

    2. To modify the look of the panel content change the styles of .wiki-content div.panel div.panel-content 

    3. To modify the look of the whole panel create the selector .wiki-content div.confbox.panel and add your styles there

  5. Save the content-style.css file and rebuild the template by executing the atlas-package command in the terminal.

CSS
/* Panels, Admonitions ***************************************************************************/

.wiki-content div.confbox {
    margin-bottom: 1.5em;
    margin-top: 1.5em;
    border: 1px solid #BBBBBB;
    border-radius: 5px;
}

.wiki-content div.confbox .title {
    font-weight: bold;
}

.wiki-content div.panel div.title.panel-header {
    padding: 0.5em 1em;
    border-bottom: 1px solid #BBBBBB;
    background-color: #F5F5F5;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.wiki-content div.panel div.panel-content {
    padding: 1em;
}