Discussion:
color modification
Thomas Feldman
2009-03-04 10:00:26 UTC
Permalink
Hi,

I have a work to do with templates and JAhia 6. As far, I know how to
manipulate templates. I also knew in Jahia 5 how to change look and feel
in a page. Now everything seems to be put in a CSS (web.css).Allright.
The problem is I'm trying yo change some font colors: the font of the
menu when an item is selected, as the font of section title or font of
links in a link box.

The color code for the default color is #990000.

The problem is that I can't find it anywhere in the jahia code
(template+core)....So I wonder where are all thise L&F informations.



Thanks for your help.



Thomas Feldman
Chef de projet technique -Technical Project Manager
____________________________________________________________

Duke - A Razorfish Company
86-90, rue Notre Dame de Nazareth
75003 Paris - France
T : +33 (0)1 53 44 17 19

mailto:***@duke-interactive.com
<mailto:***@duke-interactive.com>
http://www.duke-interactive.com <http://www.duke-interactive.com>
____________________________________________________________

If emails save time, not printing them saves trees
Clément Egger
2009-03-04 11:10:59 UTC
Permalink
Hello thomas



Can you tell me what set of templates you’ve used to start your project ?
web-templates ? community ?



I don’t understand what problem you have precisely, as it is very standard
css work to add a different color to links when they belong to a box, or to
a certain depth level in the menu for instance.



Perhaps this will help you



In the css the

#navigationN1 correspond to first level of pages (so the main menu most of
the time)

#navigationN2 correspond to the second depth of pages (so the first level
items in the side menu, most of the time)

And so on.



So if you want to change what you call the “section menu” (I suppose it’s
the font color of the main menu) in green (#0000FF) for instance and orange
(#ff6600) when the mouse rolls on it, you should change the following
styles



#bodywrapper #navigationN1 li a {

background: transparent url( ../img/navigationN1-separator.png )
no-repeat 100% 50%;

color: #0000FF;

display: inline;

…

}



and



#bodywrapper #navigationN1 li a:hover,

#bodywrapper #navigationN1 li a.selected, #bodywrapper #navigationN1 li
a.inpath {

color: #ff6600;

}





For the links located in a links box, you’re right they inherit from the
global declaration #bodywrapper a, #bodywrapper a:link



But you can override that easily

If you look at the source code of the links list, we can see that lists of
links are enclosed in a <div class=”links”></div> so you may add



#bodywrapper .links a {color : blue ; }

#bodywrapper .link a :visited { color :#silver;}

#bodywrapper .link a :hoevr { color :#purple;}



Or, other solution, you certainly have seen in the source code that external
links are specifically enclosed in a <span class=”externallink”></span> and
internal links (links to other Jahia pages) are enclosed in a <span
class=”link”></span>



So you can easily put in you css the required styles to apply on those
classes





De : template_list-***@jahia.org
[mailto:template_list-***@jahia.org] De la part de Thomas Feldman
Envoyé : mercredi 4 mars 2009 11:00
À : Any questions regarding template development and/or about the taglibs
extension
Objet : [template_list] color modification



Hi,

I have a work to do with templates and JAhia 6. As far, I know how to
manipulate templates. I also knew in Jahia 5 how to change look and feel in
a page. Now everything seems to be put in a CSS (web.css).Allright. The
problem is I’m trying yo change some font colors: the font of the menu when
an item is selected, as the font of section title or font of links in a
link box.

The color code for the default color is #990000.

The problem is that I can’t find it anywhere in the jahia code
(template+core)….So I wonder where are all thise L&F informations.



Thanks for your help.



Thomas Feldman
Chef de projet technique -Technical Project Manager
____________________________________________________________

Duke - A Razorfish Company
86-90, rue Notre Dame de Nazareth
75003 Paris - France
T : +33 (0)1 53 44 17 19

mailto:***@duke-interactive.com
http://www.duke-interactive.com
____________________________________________________________

If emails save time, not printing them saves trees



No virus found in this incoming message.
Checked by AVG - www.avg.com
Version: 8.0.237 / Virus Database: 270.11.3/1971 - Release Date: 03/03/09
16:09:00
Thomas Feldman
2009-03-05 13:18:38 UTC
Permalink
Hi clement,



Thanks for your help...In fact, I couldn't find in which CSS was the desired link because its color was referred as #990000 under firefox , and as #900 in the CSS...very strange... Apart from that, that blocked me initially, I managed to do all the changes I wanted in the CSS.



Can I add something to the wish list for the next release?

I wanted to have my logo left aligned at the beginning of the nav toolbar. SO nav and logo should be on the same line. Sadly, it is not possible as it is because nav engine produce a html code for the nav that is embedded in a div...so the nav always goes to the next line, whatever I do.

So , as this is a limit to the look & feel, my wish would be : "let us position the different element like the nav as we would like"...



Thanks again for your help... The new site we did with Jahia now rocks!

Thomas





De : template_list-***@jahia.org [mailto:template_list-***@jahia.org] De la part de Clément Egger
Envoyé : mercredi 4 mars 2009 12:11
À : ***@jahia.org
Objet : Re: [template_list] color modification



Hello thomas



Can you tell me what set of templates you've used to start your project ? web-templates ? community ?



I don't understand what problem you have precisely, as it is very standard css work to add a different color to links when they belong to a box, or to a certain depth level in the menu for instance.



Perhaps this will help you



In the css the

#navigationN1 correspond to first level of pages (so the main menu most of the time)

#navigationN2 correspond to the second depth of pages (so the first level items in the side menu, most of the time)

And so on.



So if you want to change what you call the "section menu" (I suppose it's the font color of the main menu) in green (#0000FF) for instance and orange (#ff6600) when the mouse rolls on it, you should change the following styles



#bodywrapper #navigationN1 li a {

background: transparent url( ../img/navigationN1-separator.png ) no-repeat 100% 50%;

color: #0000FF;

display: inline;

...

}



and



#bodywrapper #navigationN1 li a:hover,

#bodywrapper #navigationN1 li a.selected, #bodywrapper #navigationN1 li a.inpath {

color: #ff6600;

}





For the links located in a links box, you're right they inherit from the global declaration #bodywrapper a, #bodywrapper a:link



But you can override that easily

If you look at the source code of the links list, we can see that lists of links are enclosed in a <div class="links"></div> so you may add



#bodywrapper .links a {color : blue ; }

#bodywrapper .link a :visited { color :#silver;}

#bodywrapper .link a :hoevr { color :#purple;}



Or, other solution, you certainly have seen in the source code that external links are specifically enclosed in a <span class="externallink"></span> and internal links (links to other Jahia pages) are enclosed in a <span class="link"></span>



So you can easily put in you css the required styles to apply on those classes





De : template_list-***@jahia.org [mailto:template_list-***@jahia.org] De la part de Thomas Feldman
Envoyé : mercredi 4 mars 2009 11:00
À : Any questions regarding template development and/or about the taglibs extension
Objet : [template_list] color modification



Hi,

I have a work to do with templates and JAhia 6. As far, I know how to manipulate templates. I also knew in Jahia 5 how to change look and feel in a page. Now everything seems to be put in a CSS (web.css).Allright. The problem is I'm trying yo change some font colors: the font of the menu when an item is selected, as the font of section title or font of links in a link box.

The color code for the default color is #990000.

The problem is that I can't find it anywhere in the jahia code (template+core)....So I wonder where are all thise L&F informations.



Thanks for your help.



Thomas Feldman
Chef de projet technique -Technical Project Manager
____________________________________________________________

Duke - A Razorfish Company
86-90, rue Notre Dame de Nazareth
75003 Paris - France
T : +33 (0)1 53 44 17 19

mailto:***@duke-interactive.com
http://www.duke-interactive.com
____________________________________________________________

If emails save time, not printing them saves trees



No virus found in this incoming message.
Checked by AVG - www.avg.com
Version: 8.0.237 / Virus Database: 270.11.3/1971 - Release Date: 03/03/09 16:09:00
Continue reading on narkive:
Loading...