Shape 5

Joomla Templates => Risen Hope - Club => : coffejor January 13, 2015, 11:33:46 PM



: Resize Logo and Menu
: coffejor January 13, 2015, 11:33:46 PM
Hello,

First of all, I love the Risen Hope template; thank you for all of your great work!

I have read all of the forum topics and I can't seem to find and answer: I have a custom HTML module published to the logo position and it seems to be fixed at a width of 398px. I thought this width was set via CSS in other Shape 5 templates, but I have reviewed the template.css file as well as the index.php file and I can't find where this is defined. I would prefer the logo to be 655px and the menu to be take up the remaining topbar width (the max site width is the default 1300px).

Additionally, I would like the menu to begin resizing when it comes into contact with the logo area (e.g., when the screen size drops below the combined logo and menu width).

My development site is available at http://semncap.jordancoffey.com/ (http://semncap.jordancoffey.com/). Thank you in advance for any and all help!

-Jordan


: Re: Resize Logo and Menu
: mikenicoll January 15, 2015, 05:49:35 PM
Hello,

Generally the logo isn't designed to be that wide. You also don't want to use a fixed pixel value on the position or it won't scale responsively. You might be able to specify a % width on the element itself such as this so it can scale:

:
Template.CSS - Line 371

#s5_logo, #s5_logo_module {
    color: #ffffff;
    cursor: pointer;
    float: left;
    margin-bottom: 10px;
    margin-top: 20px;
    width: 60%;
}


: Re: Resize Logo and Menu
: coffejor January 16, 2015, 02:06:40 PM
Thanks Mike, that worked perfectly. And you're absolutely right: a relative approach is much better to preserve full responsive functionality.

All of your hard work and dedication is greatly appreciated!

-Jordan


: Re: Resize Logo and Menu
: mikenicoll January 18, 2015, 10:05:17 PM
Awesome. Glad you got it sorted :)


: Re: Resize Logo and Menu
: adelekepc January 19, 2015, 04:34:23 AM
Please, how can i resize the wrapper holding the logo and the menu, it becomes bigger when you scroll down thus covering a lot of information


: Re: Resize Logo and Menu
: mikenicoll January 19, 2015, 11:38:44 PM
Hello,

Can you be more specific? The floating header by default should be smaller when scrolling down. Which area are you trying to reduce?


: Re: Resize Logo and Menu
: adelekepc January 19, 2015, 11:55:15 PM
Yes, am talking about the floating header

You know when you scroll down, the logo. Menu containers wraps everything and make it float
But, it's looking big, so am asking which css container is controlling that, maybe the margin top and bottom needs to be reduced


: Re: Resize Logo and Menu
: mikenicoll January 19, 2015, 11:59:47 PM
Hello,

The Floating Menu options can be adjusted in the Template Manager under Template Specific but there are no default options for the height adjustment. You can make those changes here:

:
Template.CSS - Line 426

.s5_floating_header #s5_header_wrap {
    height: 60px;
}