Kickstart Cassiopeia CSS

/* Background colour of mobile menu */

Please add the following css code to your custom css section in the module options:

Where the #000 now stands for black, but you can simply add any other hex color code here.

IF The Off canvas menu module is used then the background colours can be changed there in Settings. 

The article info, such as author, creation date, views etc, by default is displayed below each other.

You can easily change this using a CSS hack. Always make a backup first!

/* Add the following line to your custom CSS section for article info in horizontal /*

dl.article-info{margin-bottom: 10px;padding-bottom: 6px;color: #349dd1; display: inline-flex; width:100% } dl.article-info dd {margin-right: 40px}

Creating nice layouts for your blog pages is essential. Setting image height is easy.

.columns-2 .left.item-image {height: 200px;} .columns-2 .left.item-image img {height: 200px;}

You can change the CSS to your liking of course. This example only works if you have 2 columns set (.columns-2) in the settings of your blog. If you have 3 columns, change the code to suit your needs. Read this article for more info.

This option sets the height of each image to 200px. So it could mean that your X and Y scaling of the image will not be proportional. only use this is images you use are sort of the same, in that case, there is little to no need to exactly slice the images the same height. 

COLOUR SLIDER

1 is quite simple. just choose the colour, 2 Selecting the opacity will allow your colour to be somewhat transparent. For instance, if you use a background image you can set the colour to be transparent, to let the image be somewhat visible, like this:

HOW TO ADD COLOUR TO LINKS IN ARTICLES

.com-content-article__body a {color: #F67A14}

CHANGE MOBILE MENU COLOUR

To set the background-color for your mobile menu please read this article!

Please add the following css code to your custom css section in the module options: