I’m not sure why, but when I upload logos regardless of how big or small, the logo shows up very small on the header. It’s like the Casper theme shrinks the whole logo and shows a tiny little logo instead.
Anyone have any idea why?
I’ve tried changing the file to different types, but it still doesn’t really work…help?
@AaronMichael that’s part of Casper’s design styles. If you want to change it you’d need to download the theme files and modify the CSS to match the design you want.
Theme’s can be downloaded and uploaded via the Design screen of your admin area:
https://docs.ghost.org/faq/design-settings/
Instructions specific to Casper are in the theme’s readme:
This is really easy actually!
Just go to your admin page, click design, then click download on the theme.
Extract it from the zip file into a folder and go into assets/css and find a file called screen.css. In this file, ctrl + f and find .site-logo
There you can change the max height, which will make your logo bigger.
From there you save it and make it a zip file and upload it as a ‘custom’ theme.
Hey, I manage to find and edit the css! But for some weird reason, even after uploading the new theme file with the edits made to the css, it’s still small.
I inspected the element on Chrome and found that it is still 45px (I set it to 100px max height).
Wonder what could be the reason? I’ve already tried clearing my cache as well.
In all, it’s about styling and this is managed in CSS.
Youtube something like “Chrome inspect elements CSS” to learn about it. It’s quite simple.
Then …
Once you find the value you want to change you can override it within the Code Injections section OR change it directly within the theme (and re-upload it)
For the latest release of Casper, here is how my overrides look like.
Hope this is helping 
I manage to get it to change via the Code Injection side of things. I downloaded and edited the original casper theme css and re-upload it to no success.
That said, I’ve made the following changes and it works
<style>
.site-logo {
max-height: 100px;
}
.site-nav-logo img {
display: block;
width: auto;
height: 45px;
}
.site-nav-logo {
flex-shrink: 0;
display: block;
margin-right: 24px;
padding: 0px 0;
color: #fff;
font-size: 1.7rem;
line-height: 1em;
font-weight: bold;
letter-spacing: -0.5px;
}
</style>Good job :-p
@AaronMichael Casper has specific instructions if you are changing the source CSS files as it has a compilation step. Instructions for how to work with Casper are included in the opening link I gave you 
The Code Injection workaround is a good option if you only want to change a few styles and want to keep Casper updating automatically.
Ah I see. Okay…I ought to try and read the whole document. Haha, not very tech savvy with coding so I get lost a lot.
My link above is broken. It’s
GitHub - firepress-org/Code-Injection-for-Ghost-themes: Code Injection snippets for Ghost themes. Find more themes here ==> (see Firepress_Klimax2.html)
why not just make a resize option in the website designer