• Welcome to the Chevereto user community!

    Here users from all over the world gather around to learn the latest about Chevereto and contribute with ideas to improve the software.

    Please keep in mind:

    • 😌 This community is user driven. Be polite with other users.
    • 👉 Is required to purchase a Chevereto license to participate in this community (doesn't apply to Pre-sales).
    • 💸 Purchase a Pro Subscription to get access to active software support and faster ticket response times.

how to change scaling of logo in phone?

Status
Not open for further replies.
B

bangsters

Chevereto Member
Website URL
https://www.pixelsbin.com

Chevereto version
3.10.1

Description of the issue
Hello. I almost got my css the way I like it. My only issue now is the logo is too big when viewed from phone. How can I change the scaling of the logo only when viewed in phone? I like the size when in desktop.
 
Nice logo... What inspired your design? ;)

What about playing with these numbers located in the Dashboard under Theme?

Custom CSS code:
.top-bar-logo img{height:80px;margin-top:-15px;}#index
 
Focker said:
Nice logo... What inspired your design? ;)

What about playing with these numbers located in the Dashboard under Theme?

Custom CSS code:
.top-bar-logo img{height:80px;margin-top:-15px;}#index
Click to expand...

Yea got the squares from you bro. Then some of my touches and whallaaa.... :)

Wouldn't those numbers affect both desktop and phone? I need only the phone rendering one, as the logo is too big it is overlapping with the cloud logo. For now I made the logo smaller, from 60 to 40 to make do.
 
Rodolfo said:
.phone .selector {}
.laptop .selector {}
Click to expand...

Uhmm how do I use it? I added it in the style.css below .phone body.landing {} . I added it like this:

.phone .selector { display:none;}
.laptop .selector {}


I put display:none to test it out... which should disable the logo when viewed from phone, but it doesn't seem to work. What am I doing wrong?

Thank you.
 
.selector must be a valid selector. Top logo selector is:
Code: 
.top-bar-logo
 
Update:

.laptop .top-bar-logo { display:none:} works but .phone .top-bar-logo { display:none;} does not work...

also, anything else in .laptop .top-bar-logo such as height:100px; does not work as well. only display:none seems to work inside the .laptop .top-bar-logo
 
Got it to work, somewhat :)

.laptop #logo img {
height:60px;
}
.laptop #logo {
top:15px;
}


The .phone .selector does not work, so my work around is I put it in the settings what I want the phone to be, and the .laptop overrides it for desktop :)
 
on phone logo is small now. try refreshing. send me screenshot.

my issue now is reducing the h1 font on phone.... I am able to change on desktop but it's not reflecting on phone
 
looks like I needed to put the css changes in the dashboard inside the custom css box. If I put directly on the style.css file, the phone does not reflect the changes.
 
Status
Not open for further replies.
Back
Top