Fórum

Liferay 6.2 color for an active navigation link

thumbnail
William Gosse, modificado 9 Anos atrás.

Liferay 6.2 color for an active navigation link

Liferay Master Postagens: 533 Data de Entrada: 04/07/10 Postagens Recentes
In a Liferay 6.2 theme how do I set the color for an active navigation link in CSS? I found how to set the normal and hover colors in the _aui_variables.scss file using the $linkColor and $linkColorHover variables but not the active color.
thumbnail
Suresh Nimmakayala, modificado 9 Anos atrás.

RE: Liferay 6.2 color for an active navigation link

Liferay Master Postagens: 690 Data de Entrada: 18/08/04 Postagens Recentes
if not feel free to add in _variables.scss and change in _thumbnails.scss

both files

should add to theme /docroot/_diffs/css/aui .... copy original from /docroot/css/aui considering you are using plugin sdk and deploying in your custom theme


in my case in theme/docroot/_diffs/css folder custom.css changes is changed to what i want

---------------------------------------------------------------------
in custom.css below change your color as per your requirements

#navigation a {
color: #CFC;
display: block;
padding: 10px 5px 1px;
text-decoration: none;
}

#navigation a:active,
#navigation a:focus,
#navigation a:hover {
color: #FF0;
}

#navigation .selected a {
color: #FFF;
}
thumbnail
William Gosse, modificado 9 Anos atrás.

RE: Liferay 6.2 color for an active navigation link

Liferay Master Postagens: 533 Data de Entrada: 04/07/10 Postagens Recentes
The custom.css was very helpful. Thanks. Still having a small issue with the color when an item is selected
thumbnail
Michael Williams, modificado 9 Anos atrás.

RE: Liferay 6.2 color for an active navigation link

New Member Postagens: 19 Data de Entrada: 14/03/14 Postagens Recentes
Hi William,

I'm guessing by active, you mean you want to set the color for the navigation link of the page you are currently on. If this is the case, the class you want to set is:

.aui #navigation .active{
background-color: #000;
color:white;
}

Something like the styling above, in your custom.css, should set the style of the background for the active link in the navigation to black and the text white. You will also have to add the 'active' class to the navigation.vm or navigation.ftl. Make sure you do this in your _diffs/templates/ folder. Look for the following line:

<#assign nav_item_css_class = "selected" /> in navigation.ftl, or
#set ($nav_item_css_class = "selected") in navigation.vm

and add the 'active' class to it:

<#assign nav_item_css_class = "selected active" />
#set ($nav_item_css_class = "selected active")

Reload your theme, or redeploy if developer mode is not enabled, and you should see the active page highlighted in black. Hope this helps.
thumbnail
William Gosse, modificado 9 Anos atrás.

RE: Liferay 6.2 color for an active navigation link

Liferay Master Postagens: 533 Data de Entrada: 04/07/10 Postagens Recentes
thanks I got this working.