Responsive Classic (built in to Zen Cart v1.5.5) [Support Thread]

[wilorc]

I would like to change the colour of the blue drop down menu on the mobile version of responsive_classic. It's the three horizontal "hamburger" lines. Normally, I'd just use Inspect Element in my computer's web browser to hunt it down, but can't do this in a standard mobile browser. Can someone point me to the css file that controls the colour?

Thanks

[twitchtoo]

I would like to change the colour of the blue drop down menu on the mobile version of responsive_classic. It's the three horizontal "hamburger" lines. Normally, I'd just use Inspect Element in my computer's web browser to hunt it down, but can't do this in a standard mobile browser. Can someone point me to the css file that controls the colour?

Thanks

You'll want to change:
includes/templates/YOUR_TEMPLATE/common/tpl_header.php
both occurrences line 46 and 48
<i class="fa fa-bars"></i>

You could change it to:
<i class="fa fa-chevron-left"></i>


Then change the colour:includes/templates/YOUR_TEMPLATE/css/jquery.mmenu.all.css
line 1572
change this:
.header .fa-bars{font-size:225%;}

to this:
.header .fa-chevron-left{
font-size: 225%;
margin: .1em;
color: #941818;
}

This will give you independent control of the colour - separate from the menu text/link/hover colours.

You will have a red looking left pointing chevron :)

Font Awesome Icons shows a rather large selection to view and test, just be sure to mind the font-size to fit your menu bar.

[wilorc]

You'll want to change:
includes/templates/YOUR_TEMPLATE/common/tpl_header.php
both occurrences line 46 and 48
<i class="fa fa-bars"></i>

You could change it to:
<i class="fa fa-chevron-left"></i>


Then change the colour:includes/templates/YOUR_TEMPLATE/css/jquery.mmenu.all.css
line 1572
change this:
.header .fa-bars{font-size:225%;}

to this:
.header .fa-chevron-left{
font-size: 225%;
margin: .1em;
color: #941818;
}

This will give you independent control of the colour - separate from the menu text/link/hover colours.

You will have a red looking left pointing chevron :)

Font Awesome Icons shows a rather large selection to view and test, just be sure to mind the font-size to fit your menu bar.

Thank you so much. That worked perfectly

[JakeLawless]

Does anyone have a copy of the 'tpl_header.php' file, i have over written it and need the default coding for it that i could paste in. Would be much appreciated, thanks.

[wilorc]

Does anyone have a copy of the 'tpl_header.php' file, i have over written it and need the default coding for it that i could paste in. Would be much appreciated, thanks.

Best thing to do is download and unzip the Zencart 1.5.5f release software, where you'll find it and all the other files, plus will be useful to keep in case needed again.

[JakeLawless]

Anyone know how to center the 'logo' at the top of the page i ant figure it out?

Also on my CCTV Page why at the bottom do my side boxes go to the left side when they're right side on the main page? Thanks

Site is - http://www.mas-uk.com/cctv-merseyside-1/

[lat9]

Anyone know how to center the 'logo' at the top of the page i ant figure it out?

Also on my CCTV Page why at the bottom do my side boxes go to the left side when they're right side on the main page? Thanks

Site is - http://www.mas-uk.com/cctv-merseyside-1/

To my eyes, it looks like the "logo" is centered ... it's just that the image fades in from the left.

I don't understand the 2nd question. I clicked the CCTV "category link" and don't see any sidebox difference between that and the main page. Perhaps if you posted a screenshot (with a pointer) to illustrate what you see ...

[wilorc]

Anyone know how to center the 'logo' at the top of the page i ant figure it out?

Are you asking about how to centre on standard (desktop) display?

[dw08gm]

Anyone know how to center the 'logo' at the top of the page i ant figure it out?

Also on my CCTV Page why at the bottom do my side boxes go to the left side when they're right side on the main page? Thanks

Site is - http://www.mas-uk.com/cctv-merseyside-1/

You may need to prescribe a width for the element concerned before applying margin:auto; in css.

[wilorc]

You may need to prescribe a width for the element concerned before applying margin:auto; in css.

I centred my logo for desktop display with the following:

In file includes/templates/YOUR_TEMPLATE/css/stylesheet.css line 128 after the #logo element

.centred {text-align:center;}

In file includes/templates/YOUR_TEMPLATE/common/tpl_header.php line 167 change

<div id="logo">

To be

<div id="logo" class="centred">