[BUG] "Return to level1techs.com" misaligned

Level1Techs Bug report
1

Alignment issue on ultrawides?

image
image.png771x173 21.1 KB

1 Like
2

At 1920x1200

Screenshot_20180810_172735

3

Is it really bad if I just visit for the forum, and don’t particularly want to “return” to the main site?

4

Nope.

I barely ever visit the main site.

1 Like
5

@Eden

The div containing the top navbar is set to a css class of container. This has a breakpoint and will be full width on devices smaller than 1115px across but once its above that it no longer expands.

It’s likely that all @kreestuh has to do is change it to container-fluid to fix this.

6

Just tried that. Put the link all the way to the left. container-fluid fills to 100% page width.

7

Semi misaligned on my 1366X768 display too, I would honestly rather see this banner removed.

8

There are ways of having a nice integrated header. See this site for example http://forum.driveonwood.com/

9

Changing the container class to wrap instead seems to fix it.

Anyone confirm that?

1 Like
10

Looks good here.

Firefox, Linux, 1920x1200.

11

Link doesn’t exist on the light theme.

image
image.png1905x187 13.9 KB

12

Interesting.

Also funny that the level1 name doesn’t change to the correct colour. A different but :smiley:

There you go [BUG] Logo is white.. on the white theme

13

Funny, I never noticed this because I never run a browser full-screen.

3440x1440 half screen:

image

3440x1440 full screen:

image
image.jpg821x372 54.9 KB

1 Like
14

Haven’t tested wrap, but it’s this:

#top-navbar .container {
    margin: 0 auto;
    max-width: 1115px;
}

The Link-container has a max-width and gets centered, that’s why ultrawide looks off.
You could also remove the class if you wanted to, since it doesn’t do anything else.

I guess the idea is/was that it’s supposed to be centered along with the content, but then the logo/menu bar is kinda off…

On a sidenote:
That bar has been missing on the mobile site for pretty much forever.
IMO it would be better off in the hamburger menu next to the FAQ and About anyway, if possible. But I don’t know if discourse allows changing that.

1 Like
15

This is because they don’t use text for the logo branding. It’s literally an image. Which is honestly fine, but if you use dynamic themes then it really should be a SVG instead of a PNG.

16

Agreed. But They use bootstrap so like I said earlier just change the class to container-fluid will fix this ‘bug’.

17

Probably, that’s not a bootstrap style though from what I see :wink:

18

Use .container-fluid for a full width container, spanning the entire width of the viewport.

19

Nono I mean, the style that is applied to that link container isn’t Bootstrap default :smiley:

Also could be base64 since they already seem to optimise for “critical” styles :thinking:

20

I don’t know enough about Ember to know how it mangled bootstrap.

If it supports Tree-Shaking then I suppose the minified CSS assets would remove the unused styles.

1 Like