Autonav Menu

Permalink Browser Info Environment
I need to change the color of the nav menu to blue (from green). I was hoping you wouldn't mind pointing me in the right direction as to where I can make this change. I am assuming it is in a css file somewhere? Please help. Thank you.

Sincerely,

Daniel Thornton

Type: Discussion
Status: In Progress
dthornton
View Replies:
datasouth replied on at Permalink Reply
datasouth
Hi Daniel,

Thanks for trying out our theme. There are currently two ways to apply the color change to the autonav and the simplest way is to go to dashboard -> theme -> and click the customize button on the casual theme -> click "Add Your Css" and paste this code:

.masthead .nav > .active, .masthead .nav > .nav-selected > a, .masthead .nav > .active > a:hover, .masthead .nav > .active > a:focus {
background:blue;
}
.nav > li > a:hover, .nav > li > a:focus {
background-color: blue;
}

you can change the color "blue" to a hex color (e.g #ffffff, #000000, #fff000).

Let me know if you need more help.

Regards,
Datasouth
BillHochsprung replied on at Permalink Reply
BillHochsprung
I was just looking to accomplish the same thing (with a different color of course).. When I followed the directions as you presented them, I did not have the outcome you suggested I would. Everything remained the same.. Any other ideas?

Bill
dthornton replied on at Permalink Reply
dthornton
Go to packages/theme_casual_/themes/casual/main.css open main.css and on or around line 160 you will see:

body .container .nav a, body section .nav a{
color: #fff;
background: #32556b;
display: block;
padding: 10px 15px;
border-bottom: 1px solid #fff;
position: relative;
}
body .container .nav li li a, body section .nav li li a{
background: none repeat scroll 0 0 #777;
padding-left: 25px;
}
body .container .nav li li a:hover,
body .container .nav li li a.nav-selected,
body .container .nav li a.nav-selected,
body .container .nav a:hover,
body section .nav li li a:hover,
body section .nav li li a.nav-selected,
body section .nav li a.nav-selected,
body section .nav a:hover
{
background-color: #7495ab;
text-decoration: none;
color: #fff;

On the third line above and third from the bottom is where you change the two colors for nav bar. You will also notice just a little further down where you change colors for links.
BillHochsprung replied on at Permalink Reply
BillHochsprung
That is wonderful.. Thank you so much for helping me resolve that.. I am a bit newer to this so I am finding some points where I get stuck.. Took a second for me to figure out which place adjusted what color but it worked perfectly.. Thanks so much for your help.. Much appreciated.

Bill Hochsprung
dthornton replied on at Permalink Reply
dthornton
Sorry, I just read my own explanation and it warrants clarification. I mean on or around line 159, you see the following code. On or around line 161, you will see a reference to background. Then on or around line 180 there is another reference to background color. Don't know if this helps, but I hope so. I tried the solution provided by author myself and it didn't work for me either. So I just looked for the code in main.css
BillHochsprung replied on at Permalink Reply
BillHochsprung
It worked perfect so no worries at all.. I really do appreciate the prompt reply and the much needed help.. :-)
datasouth replied on at Permalink Reply
datasouth
Hello,

The solution I posted works for the main navigation's active and hover states. For autonavs outside of the main nav area, drthornton's solution works best.

Let us know if we could be of more help.

Thanks and regards,
Datasouth
fono replied on at Permalink Reply
fono
Hi, I need to resize the sidebar block, as well as the main block...how am i going to established this on your theme please

Thanks in advance and God Bless
datasouth replied on at Permalink Reply
datasouth
Hi Fono,

Try following the steps below to edit the width of the Main and Sidebar Areas respectively:

1. On your theme_casual directory, open the file theme_casual/themes/casual/default.php

2. On line 51, you can see the container <div> for both the Main and Sidebar Area.

<div class="container">
<div class="row">
<div class="col-md-8">
<div class="content">
<?php
$a = new Area('Main');
$a->display($c);
?>
</div>
</div>
<div class="col-md-4">
<div class="sidecontent">
<?php
$a = new Area('Sidebar');
$a->display($c);
?>
</div>
</div>
</div>
</div>

3. Go to line 53 (<div class="col-md-8">) Main Area and line 64 (<div class="col-md-4">) Sidebar Area.

4. Update the class to your desired size.

ie. If you want to make the Main Area Wider
- Change <div class="col-md-8"> to <div class="col-md-10">
- Change <div class="col-md-4"> to <div class="col-md-2">


IMPORTANT: Please note that on CSS Bootsrap, the total for both <div> should be equal to 12 (ie. 8 + 4 = 12, 10 + 2 = 12)

Hope this helps.

Thanks
fono replied on at Permalink Reply
fono
Thanks in advance it works perfect!!!

concrete5 Environment Information

# concrete5 Version
5.6.2.1

# concrete5 Packages
Amiant CSS3 Menu (0.3), Casual Theme (0.9.5), CrimsonRed Menus (1.4), Login (1.1.1), PC5 Custom Templates (3.5).

# concrete5 Overrides
None

# Server Software
Apache

# Server API
cgi-fcgi

# PHP Version
5.4.32

# PHP Extensions
bcmath, bz2, calendar, cgi-fcgi, Core, ctype, curl, date, dom, ereg, exif, fileinfo, filter, ftp, gd, gettext, gmp, hash, iconv, imagick, imap, intl, ionCube Loader, json, libxml, mbstring, mcrypt, mhash, mssql, mysql, mysqli, odbc, openssl, pcre, PDO, pdo_mysql, pdo_sqlite, Phar, posix, pspell, Reflection, session, SimpleXML, soap, sockets, SourceGuardian, SPL, sqlite3, standard, tidy, tokenizer, wddx, xml, xmlreader, xmlrpc, xmlwriter, xsl, Zend Guard Loader, zip, zlib.

# PHP Settings
max_execution_time - 30
log_errors_max_len - 1024
max_file_uploads - 20
max_input_nesting_level - 64
max_input_time - 60
max_input_vars - 1000
memory_limit - 256M
post_max_size - 64M
sql.safe_mode - Off
upload_max_filesize - 64M
mssql.max_links - Unlimited
mssql.max_persistent - Unlimited
mssql.max_procs - Unlimited
mssql.textlimit - Server default
mysql.max_links - Unlimited
mysql.max_persistent - Unlimited
mysqli.max_links - Unlimited
mysqli.max_persistent - Unlimited
odbc.max_links - Unlimited
odbc.max_persistent - Unlimited
pcre.backtrack_limit - 1000000
pcre.recursion_limit - 100000
session.cache_limiter - nocache
session.gc_maxlifetime - 7200
soap.wsdl_cache_limit - 5

Browser User-Agent String

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:33.0) Gecko/20100101 Firefox/33.0

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You may not request a refund that is not currently owned by you.