@jac said in NodeBB customisation:
I suppose I’m happy for you to do the most logical solution and I’ll go with that .
A more elegant approach would be this
.Hero {
min-height: 70px;
}
This way, we set the height minimum to 70px to get the same height when the text fits without issue. When the text is longer, the same <div>
will expand to fit. So, you go from this
To this
I also added these two media
queries to handle the text size on mobile devices (it’s huge otherwise and looks, well, nasty)
@media (max-width: 767px) {
h2.PageHero-title {
font-size: 1.8rem !important;
}
}
@media (min-width: 1200px) {
h2.PageHero-title {
font-size: 3rem;
}
}
I think this looks better. It’s active on your site now.