Website@School Users' Guide | ||
---|---|---|
Prev |
2. Editing Bazaar Style Style Sheets
3. Examples
3.1 Override an element
3.2 Page Manager: vertical lines
program/styles/base.css
. It can be accessed with your browser:
http://yourschoolurl.org/program/styles/base.css
Now proceed as follows:
In this way, the complet styleseet is used in the Extra style at area level field. Onother way of woarking is described below>
base.css
in the Extra style at area level field. See an example below for entries in this field.
base.css
file. Assume we name this copy my.css
. This file contains all the changes you have made in the Extra Style at area Level field.
my.css
to areas/intranet_title/style/my.css, as example.
- At 'Static stylesheet enter:
/file.php/areas/intranet_title/my.css
base.css
, search for:
|
There you see among other lines: font-size: 0.9em;
.
To override this font size, you can add in thenoemde 'Extra Style at area level' for example:
|
/* Larger fonts: 1.5em i.s.o 0.9em */
is the comment line. Do not forget to add this line, your easily forget your changes.
It's also possible to add an element with the content:
|
Or do them in one time together:
|
If the result suits you, you can do the adaptions in
base.css, upload it as
my.css
, upload, etcetera.
3.2 Page Manager: vertical lines
When you have a deep site with many subsections, it can becom difficult to see the levels. This is how to make vertical lines like:
lines1.png
cd /program/styles/admin_base.css,
around line 233 you see
#content li {
margin: 0px;
padding: 0px 5px 0px 105px;
font-weight: bold;
line-height: 1em;
}
Between the { and } add this line:
border-left: 1px #0000FF dashed;
Save the file and do a couple of refreses in your browser
(i.e press F5 repeatedly)
You see something like "lines1.png"
Eventually in the lines thereunder you you see:
#content li.level0 {
padding: 0px 0px 0px 20px;
}
Add between the { and } this line:
border-left: 0px #FF0000 solid;
Save and refresh! You should see "lines2.png"
lines1.png
4. Concluding remarks