Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Download links in header too long #77

Closed
steffhip opened this issue Apr 7, 2019 · 13 comments
Closed

Download links in header too long #77

steffhip opened this issue Apr 7, 2019 · 13 comments
Labels
bug Something isn't working good first issue Good for newcomers

Comments

@steffhip
Copy link

steffhip commented Apr 7, 2019

The text of the download links in the header (inside the gray download box) are too long and thus generate an unwanted linebreak.

Solution might be:

  • adjust the css settings for the width (#download-fast{1,2,3}) from currently 160px to e.g. 190 px.
  • increase the width of the graphic (download-fast.png) for the download field accordingly
@auge8472
Copy link
Contributor

auge8472 commented Apr 7, 2019

It would be better to remove the background graphic and replace it by CSS-rules for background-color and border for the container of the links. I'm willing to make a proposal as PR in the next days.

@PeterN
Copy link
Member

PeterN commented Apr 7, 2019

Too long for what? Can you post screenshots, because I don't see it.

@steffhip
Copy link
Author

steffhip commented Apr 7, 2019

Too long to fit into the downloadbox without linebreak:
detail

@PeterN
Copy link
Member

PeterN commented Apr 7, 2019

Which browser is that? Neither Edge, Chrome or Firefox on PC do this.

@steffhip
Copy link
Author

steffhip commented Apr 7, 2019

Firefox(66) and Chromium(73) running under Linux.

@spnda
Copy link

spnda commented Apr 7, 2019

On Android with newest Chrome on 720p this doesn't happen either.

@planetmaker
Copy link
Contributor

FF 62 under linux doesn't do that thing and shows it as it should in one line

@Eddi-z
Copy link
Contributor

Eddi-z commented Apr 7, 2019

probably has more to do with the system font rather than which browser is being used?

can't reproduce this either with firefox or Falkon.

@TrueBrain
Copy link
Member

It indeed is a font thingy; over the years I added some more and more pixels to the box to fit for everybody, but with the new nightly name it ran out of space again. Adding more pixels is not fully trivial because of the way it is created. Indeed, using CSS stuff for this would be better; someone was working on that, but I have read that for a few months now. So not sure how that is going exactly ;)

Possibly quickest solution is to extend the image again, giving it some more space. 10px or so should be sufficient already, but I guess 200px or so would be fine too.

Anyone up making a PR for that? Tnx :D

@TrueBrain TrueBrain added bug Something isn't working good first issue Good for newcomers labels Apr 7, 2019
@auge8472
Copy link
Contributor

auge8472 commented Apr 8, 2019

probably has more to do with the system font rather than which browser is being used?

It's not only a thing of the choosed font itself but also a thing of it's font size. The site was designed years ago with a typical font in a typical font size (13 or 14 pixels at that time) in mind. So the background image for the block was sized to fit two lines (links to nightly and stable). Back then the block got overcrowded, when it has to contain three lines of links (nightly, beta or release candidate and stable).

For now I can say, that the block is large enough in Firefox with no minimal font size set but to small with a minimal font size of 14px. I can see this behaviour in Windows 10 and in Ubuntu 16.04.06. A similar but at the same time different behaviour I can see in Vivaldi (Chromium engine). There is no minimal font size set but when I play with the zoom slider and set the page zoom down to 80%, the link to the nightly breaks out of the container. This happens only in Windows but not in Ubuntu.

So we can assume that it is a combination of the font used in reality (dependient from the system of the user) and of the font size settings in the browser. As a website creator one has no information about the real conditions on a system. That is inherent to the system. So a CSS ruleset that let the block shrink or grow with it's content is the best solution.

Anyone up making a PR for that? Tnx :D

I want to help but I need a few days for other stuff before.

@auge8472
Copy link
Contributor

auge8472 commented Apr 11, 2019

I opened a pull request for a resizeable download header (#79). I made the change by only altering the CSS code and replacing the background image by another one and tested it in Firefox 66 and in Vivaldi 2.3 (Chromium engine).

@auge8472
Copy link
Contributor

auge8472 commented May 5, 2019

I think it's time to close the issue because it was solved with #79.

@steffhip
Copy link
Author

steffhip commented May 5, 2019

I can confirm the issue is now solved.
(Tested with FF66 and Chromium 74 on the machine which showed this issue in the past and the links are now shown correctly)

@steffhip steffhip closed this as completed May 5, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working good first issue Good for newcomers
Projects
None yet
Development

No branches or pull requests

7 participants