83 lines
1.8 KiB
CSS
83 lines
1.8 KiB
CSS
@import url(luna_core.css);
|
|
|
|
/*
|
|
This file inherits from luna_core.css, so styles in this file will override
|
|
styles defined in it. Changes to this file will NOT be overwritten during
|
|
upgrades.
|
|
|
|
Here's a quick tutorial on overriding styles. Say you want to change the
|
|
background colour of the body. Looking at luna_core.css, the colour is
|
|
defined in the rule:
|
|
|
|
body {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
color: #33332e;
|
|
background: #ffffff;
|
|
font: normal 11px tahoma, geneva, verdana, sans-serif;
|
|
}
|
|
|
|
To change the background colour of white (#ffffff) to gray (#dddddd), you would
|
|
add the following to this file:
|
|
|
|
body {
|
|
background: #dddddd;
|
|
}
|
|
|
|
If you also wanted to change the font as well as the background, then you could
|
|
use:
|
|
|
|
body {
|
|
background: #dddddd;
|
|
font: normal 12px times new roman;
|
|
}
|
|
|
|
Also note that every template's body id is assigned the template name (without
|
|
the .htm extension). So if you want to change the h2 heading in the
|
|
home.htm template, you can do this by:
|
|
|
|
#home h2 {
|
|
color: red;
|
|
font-weight: bold;
|
|
}
|
|
|
|
To start you off, some sample overriding styles have been provided below. Note
|
|
that you will have to uncomment the rules for them to work.
|
|
*/
|
|
|
|
/* Logo size and image source */
|
|
/*
|
|
#logo {
|
|
width: 250px;
|
|
height: 80px;
|
|
background-image: url(images/logo.gif);
|
|
}
|
|
*/
|
|
/* If the height of your logo changes from the original, then you will probably
|
|
want to also change the vertical position of the login link */
|
|
/*
|
|
#loginbar a {
|
|
margin-top: 25px;
|
|
}
|
|
*/
|
|
|
|
/* Change width of document */
|
|
/*
|
|
#wrapper {
|
|
width: 750px;
|
|
}
|
|
*/
|
|
|
|
/* Don't want the shadows? */
|
|
/*
|
|
.shadowtop, .shadowbottom, .shadowleft, .shadowright {
|
|
background: none;
|
|
}
|
|
.shadowtopleft, .shadowtopright, .shadowbottomleft, .shadowbottomright {
|
|
width: auto;
|
|
height: auto;
|
|
float: none;
|
|
background: none;
|
|
}
|
|
*/
|