Area of Site: Profiles
URL: https://profile.hcommons-test.org/
Description
The main logo is misaligned with the navigation menu on the left. It has media query breakpoints that further complicate this.
Solution
A complete fix would probably require refactoring the layout scaffolding nesting this logo, but a relatively simple and effective improvement to have the logo more closely associated with the navigation elements and prevent the current stuttering between breakpoints would be to change the following styles in static/css/profile.css:
/* line 821 */
@media (min-width: 992px) {
.container {
max-width: 960px;
}
}
/* line 853 */
@media (min-width: 1200px) {
.container {
max-width: 1140px;
}
}
which looks like this
to this:
@media (min-width: 992px) {
.container {
max-width: 93vw;
}
}
@media (min-width: 1200px) {
.container {
max-width: 93vw;
}
}

Area of Site: Profiles
URL: https://profile.hcommons-test.org/
Description
The main logo is misaligned with the navigation menu on the left. It has media query breakpoints that further complicate this.
Solution
A complete fix would probably require refactoring the layout scaffolding nesting this logo, but a relatively simple and effective improvement to have the logo more closely associated with the navigation elements and prevent the current stuttering between breakpoints would be to change the following styles in
static/css/profile.css:which looks like this
to this: