breadcrumb in another module positions

Responsive Joomla template for Entertainment and Music purpose with clean and lightweight design.
GK User
Tue Apr 24, 2012 11:13 am
Hi,

How to change breadcrumb position keeping the good style.
I would like breadcrumb in the topnav position.
User avatar
Fresh Boarder

GK User
Thu Apr 26, 2012 12:20 am
Hi

This is considerate customization but nevertheless, follow this instructions:

Go to template parameters and enable override.css file.
Next add this lines on this file (located on css template directory):

Code: Select all
#gkTopNav .breadcrumbs {overflow: hidden; padding: 5px; background: #f9f9f9; clear: both; min-height: 18px; border: 1px solid #EBEBEB; border-radius: 3px; font-size: 10px; text-transform: uppercase; font-weight: bold; width: 100%!important}
#gkTopNav .breadcrumbs { width: auto; float: left; color: #333; }
#gkTopNav .breadcrumbs li.separator { display: block; float: left; margin: 0 20px 0 0; color:#d7d7d7; }
#gkTopNav .breadcrumbs > ul { margin-left: 0; height: 24px; line-height: 24px; padding: 0; }
#gkTopNav .breadcrumbs > ul > li { float: left; width: auto; clear: none; height: 24px; line-height: 24px; }
#gkTopNav .breadcrumbs > ul > li a { color: #888; }
#gkTopNav .breadcrumbs > ul > li a:hover { color: #fc764a; }
#gkTopNav .breadcrumbs > ul > li:first-child { margin-right: 12px; }
#gkTopNav .breadcrumbs > ul > li:first-child > span { padding: 0 10px 0; display: block; color: #fc764a; }


Then add this line on style?.css files:

style1.css
Code: Select all
#gkTopNav .breadcrumbs > ul > li a:hover,
#gkTopNav .breadcrumbs > ul > li:first-child > span { color: #fc764a; }


style2.css
Code: Select all
#gkTopNav .breadcrumbs > ul > li a:hover,
#gkTopNav .breadcrumbs > ul > li:first-child > span { color: #c9485a; }


style3.css
Code: Select all
#gkTopNav .breadcrumbs > ul > li a:hover,
#gkTopNav .breadcrumbs > ul > li:first-child > span { color: #93bc46; }


style4.css
Code: Select all
#gkTopNav .breadcrumbs > ul > li a:hover,
#gkTopNav .breadcrumbs > ul > li:first-child > span { color: #c40809; }


Cheers ;)
User avatar
Platinum Boarder


cron