Change width in the home page?

[giabaio]

I'm just starting playing around with the theme, which is super cool, actually!

I have managed to increase the width of the pages, but I can't figure out how to increase (say, to 80%) the home page. Is there an easy way to do so? Thanks Gianluca

[gcushen]

You would need to use custom CSS (refer to Academic's documentation website). Then you can try something similar to:

.container {
    width: 80% !important;
}

[giabaio]

Great --- thanks! I'm fiddling with the theme and it's very interesting. Not sure I found what I like, but your answer is very helpful. Many thanks!

[JOduMonT]

@gcushen I added

.container {
    width: 80% !important;
}

inside ./assets/scss/custom.scss and serve the website with hugo serve but I don't see any difference.

but it work when I add this in my custom.scss it is the right way ??

@media (min-width: 576px) {.container-sm, .container {max-width: 80%; }}
@media (min-width: 768px) {.container-md, .container-sm, .container {max-width: 80%;}}
@media (min-width: 992px) {.container-lg, .container-md, .container-sm, .container {max-width: 80%;}}
@media (min-width: 1200px) {.container-xl, .container-lg, .container-md, .container-sm, .container {max-width: 80%;}}

also if I try .container {max-width: 80% !important;} the navbar don't align with the content