Sunday, 20 December 2015 20:22

JSN-Metro

Written by
/* sobipro fix - makes pagination buttons appear together */
.SobiPro .pagination ul > li > a, .SobiPro .pagination ul > li > span {
	margin: 0 !important;
}

 

/* Make Background White */
#jsn-master {background-color: white;}

 

/* makes mainbody background (on homepage) white */
body.jsn-homepage #jsn-mainbody-content {
	background-color: #FFFFFF !important;	
	/*padding: 10px !important;*/
}

 

/* K2 Fix - Make Listing Background Transparent and not red */
/* jsn_metro_pro/ext/k2/jsn_ext_k2.css - line 401 */
div.itemListCategory {background-color: transparent;}

 

/* k2 Fix - images going mental */
/* jsn_metro_pro/ext/k2/jsn_ext_k2.css - 309 */
div.itemBody img {	
	float: none;
}

 

/* K2 fix - add bullet points back in k2 */
#k2Container ul li {
	list-style: disc;
	margin-left: 1.6em;
}

Where is the color sequence controlled for the main menu list items

/* Metro - where is the color sequence controlled for the main menu list items */

/*Open (joomla-root/templates/jsn_metro_pro/css/colors/white.css)
lines 164 --> 203*/

/*-------- COLOR STYLE -------*/
.menu-mainmenu.menu-iconmenu [class*="icon-"] > a > span {
 opacity:1 !important ;
}
.menu-mainmenu > li {
 background-color: #333 !important;
}
.menu-mainmenu > li:hover {
 background-color: #111 !important;
}
.menu-mainmenu > li:first-child {
 background-color: #009ad7 !important;
}
.menu-mainmenu > li:first-child:hover {
 background-color: #0082b5 !important;
}
.menu-mainmenu > li:first-child + li {
 background-color: #68af27 !important;
}
.menu-mainmenu > li:first-child + li:hover {
 background-color: #4c8c12 !important;
}
.menu-mainmenu > li:first-child + li + li {
 background-color: #d53f26 !important;
}
.menu-mainmenu > li:first-child + li + li:hover {
 background-color: #b72e17 !important;
}
.menu-mainmenu > li:first-child + li + li + li {
 background-color: #673499 !important;
}
.menu-mainmenu > li:first-child + li + li + li:hover {
 background-color: #4b1b7a !important;
}
.menu-mainmenu > li:first-child + li + li + li + li {
 background-color: #ffaa31 !important;
}
.menu-mainmenu > li:first-child + li + li + li + li:hover {
 background-color: #e18d16 !important;
}

Make all Menu Items Grey - Combined Code

/* Make all Menu Items Grey - Combined Code */
.menu-mainmenu.menu-iconmenu [class*="icon-"] > a > span 
{
	opacity:1 !important ;
}

.menu-mainmenu > li,
.menu-mainmenu > li:first-child,
.menu-mainmenu > li:first-child + li,
.menu-mainmenu > li:first-child + li + li,
.menu-mainmenu > li:first-child + li + li + li,
.menu-mainmenu > li:first-child + li + li + li + li 
{
	background-color: #333 !important;
}

.menu-mainmenu > li:hover,
.menu-mainmenu > li:first-child:hover,
.menu-mainmenu > li:first-child + li:hover,
.menu-mainmenu > li:first-child + li + li:hover,
.menu-mainmenu > li:first-child + li + li + li:hover,
.menu-mainmenu > li:first-child + li + li + li + li:hover 
{
	background-color: #111 !important;
}

Menu module is not blue

i have set a menu item up with the following:

  • module name: menu
  • position: innerleft
  • start level: 1
  • end level:
  • menu class suffix: menu-sidemenu
  • module class suffix: _menu box-2 box-blue

But the menu is not displaying in the correct colours. It looks fine in either left or right.

My Solution

The following fixes the issue but i do not know if this is the best way. please check.

in my lancastrian.css add:

/* Bug Fix - Menu Module not displaying in blue */
div.box-blue.jsn-modulecontainer div.jsn-modulecontainer_inner ul.menu-sidemenu li{
	background-color: #006DBC;
}
  • You should change the module class suffix from _menu box-2 box-blue to box-2 box-blue (ie. remove _menu).
  • Removing _menu did not work

Joomlashine Solution

To fix this, there are 2 solutions.

1. Add these lines to lancastrian.css

/* Bug Fix - Menu Module not displaying in blue */
div.jsn-modulecontainer.box-blue[class*="box-"] .jsn-modulecontainer_inner {
	background: #006DBC;
}

2.  Better solution. Open template.css and search for:

#jsn-mainbody-content div.jsn-modulecontainer div.jsn-modulecontainer_inner,
#jsn-usermodules1 div.jsn-modulecontainer div.jsn-modulecontainer_inner,
#jsn-usermodules2 div.jsn-modulecontainer div.jsn-modulecontainer_inner {
	background: none;
	border: none;
}

and replace it with

#jsn-usermodules1 div.jsn-modulecontainer div.jsn-modulecontainer_inner,
#jsn-usermodules2 div.jsn-modulecontainer div.jsn-modulecontainer_inner {
	background: none repeat scroll 0 0 transparent;
	border: medium none;
}

Module with blue richbox color

For a module if i use richbox-1 module suffix, the color is grey, if i use richbox-2 suffix, the colour is green. How can i make a module blue etc?

Use  box-2 box-blue for suffix

Read 1312 times Last modified on Wednesday, 10 August 2016 10:22