-
Components
-
Plugins
Cislunar includes 6 different style headers and some options to customize it. The actual code is in the comments to avoid conflicts on the page. To get the source code for the header you wan to use, find it in this file by opening it in any text editor.
Fixed Header
Headers are fixed by default in Cislunar, hence you can use the code as it is. In case you want to use Static Header, add .scrolled class in class attribute of header, also add data-keep="true" in header as new attribute.
Dynamic Logo
As the header color toggles between Transparent and Light/Dark while scrolling the page, sometimes you would like to use different color logo images to suit the background. You can achieve this by putting the original image path in src attribute and adding data-other="path/to/different/color/logo.png" as new attribute containing path to other logo image, in img element under .navbar-brand.
Header With Search Bar Light
Header With Search Bar Dark
Header With Button Light
Header With Button Dark
Header With Contact Info Light
Header With Contact Info Dark
