0
Welcome Guest! Login
0 items Join Now

Callisto: Recreating the Demo - Template Settings

Your Guide to Recreating Elements of the Callisto Demo for Joomla


Theme Style Settings

One of the most important aspects of any Gantry template is its ability to be easily customized using the settings presets in the Template Settings page. These settings can be adjusted by navigating to Administration -> Components -> Gantry 5 Themes -> Callisto. To replicate the demo, the styling changes being made Styles tab.

This table will break down the various settings you may need to adjust in order to recreate the demo. Most of the settings under Styles are adjusted automatically with the selection of a template preset. You can set presets using the Presets options located at the top of the Styles admin panel.

Once you have selected a Preset, these options can be further adjusted to match the demo. Keep in mind that the Style indicated here relates to the template Style in this menu. More information about how Styles work can be found in our Gantry documentation.

Style Settings

Core Styles

Outline Category Option Setting
Base Outline Base Styles Base Background #1f1f1f
Base Outline Base Styles Base Text Color #888888
Base Outline Base Styles Body Font roboto, sans-serif
Base Outline Base Styles Heading Font roboto, sans-serif
Base Outline Accent Colors Accent Color 1 #ecbc2e
Base Outline Accent Colors Accent Color 2 #8b5717

Section Styles

Outline Category Option Setting
Base Outline Header Colors Background #ecbc2e
Base Outline Header Colors Text #b08523
Base Outline Navigation Colors Background #353535
Base Outline Navigation Colors Text #828282
Base Outline Showcase Colors Background #23262f
Base Outline Showcase Colors Text #878787
Base Outline Feature Colors Background #1a1a1a
Base Outline Feature Colors Text #878787
Base Outline Main Colors Background #1a1a1a
Base Outline Main Colors Text #878787
Base Outline Footer Colors Background #1f1f1f
Base Outline Footer Colors Text #878787
Base Outline Copyright Colors Background #1a1a1a
Base Outline Copyright Colors Text #878787
Base Outline Extension Colors Background #1a1a1a
Base Outline Extension Colors Text #878787
Base Outline Offcanvas Section Background #1a1a1a
Base Outline Offcanvas Section Text #878787
Base Outline Offcanvas Section Panel Width 17rem
Base Outline Offcanvas Section Toggle Color #ffffff

Outline Styles

Outline Category Option Setting
Base Outline Breakpoints Large Desktop 75rem
Base Outline Breakpoints Desktop 60rem
Base Outline Breakpoints Tablet 48rem
Base Outline Breakpoints Mobile 30rem
Base Outline Menu Dropdown Widths 180px

Found errors? Think you can improve this documentation? Please edit this page. You can also view the history of this page.