Shape 5

Joomla Templates => Samba Spa - Club => : Mothersinc September 08, 2017, 03:15:18 PM

: Resizing the logo on the Samba template
: Mothersinc September 08, 2017, 03:15:18 PM

Hi there.

How do I resize the logo.

http://mothersinc.co.uk/demo/

thanks.

: Re: Resizing the logo on the Samba template
: jonahh September 11, 2017, 10:47:38 AM

Hello,

We don't set a fixed width on it so that the image size is the exact size you save it in your image editing program. But if you want you can resize it by just adding a pixel width like I have done below:

#s5_logo_wrap {
    cursor: pointer;
    display: inline-block;
    margin: 3px auto 0;
    text-align: center;
    width: 234px;
}

template.css line 628

: Re: Resizing the logo on the Samba template
: Mothersinc September 14, 2017, 06:09:14 AM

Hi Jonahh

Thanks for your reply.

The code works nicely.

I was wondering, why don't I have to specify a height for the logo?

: Re: Resizing the logo on the Samba template
: jonahh September 14, 2017, 10:40:01 AM

The height is automatically calculated from the width, this is just how CSS works.

: Re: Resizing the logo on the Samba template
: andrzejw September 20, 2017, 08:41:27 AM

Is it posible to resizing logo to smaller size while scrolling page down with sticky menu enabled ?

: Re: Resizing the logo on the Samba template
: jonahh September 20, 2017, 12:07:34 PM

There is no option to do this on this template but you could add the following CSS to your custom.css file and I believe this should do it. You can adjust the scale to whatever number you desire 0.8, 0.5, etc

	.s5_wrap_fmfullwidth #s5_logo_wrap img {
	transform: scale(0.7);
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7); 
	-ms-transform: scale(0.7);
	-o-transform: scale(0.7);}

: Re: Resizing the logo on the Samba template
: andrzejw September 20, 2017, 04:55:05 PM

You know what? It worked! Thanks.

My CUSTOM.CSS:

/* SETTING FIXED LOGO SIZE */
#s5_logo_wrap {
    margin: 0px auto 0;
    width: 144px;
}
/* SETTING PROPER LOGO POSITION */
#s5_margins_logo {
	margin-bottom: -80px;
}

Result: see jpg previews

: Re: Resizing the logo on the Samba template
: jonahh September 21, 2017, 11:02:38 AM

Awesome happy to hear you got it to your liking :)