Frontend: Layout and accessibility improvements

mcorbin / meuse

A private Cargo crate registry, for Rust

https://meuse.mcorbin.fr/

Eclipse Public License 2.0

287 stars 12 forks source link

Frontend: Layout and accessibility improvements #10

Closed Aloso closed 4 years ago

Aloso commented 4 years ago

This applies various layout changes and accessibility improvements. Examples:

white background, light gray box shadow
new font
refactor some HTML elements to make it simpler and more flexible
search bar grows to fill excess space
Change behavior of the container when the window is resized
Adjust font sizes and spacing on smaller screens
Display columns on top of another on small screens
Remove outline from links. Links are now underlined while focused

mcorbin commented 4 years ago

Thanks, I will review that tomorrow.

mcorbin commented 4 years ago

LGTM, thanks you ;)

Just one thing: Is it possible to serve the font by Meuse itself and not from Google fonts ? It may not work if Meuse is hosted on a corporate network, and I have some privacy concerns about Google fonts.

Aloso commented 4 years ago

That's totally possible, I'll look into it tomorrow.

Aloso commented 4 years ago

@mcorbin I included the font files which I downloaded from Google Fonts.

I made fallbacks for older browser that don't support the WOFF or WOFF2 formats, only one file will be downloaded per font style. The font doesn't include italics, but browsers can generate oblique variants automatically.

After committing, I noticed that there's a newer version of the font on GitHub, which supports italics and many more languages/scripts. Unfortunately, the font files are also much larger (150–200 KiB), so I'll keep the files from Google Fonts.

Aloso commented 4 years ago

I guess the SVG and EOT files could be removed (nobody uses Internet Explorer <= 8 or iOS Safari <= 4.1 anymore)

mcorbin commented 4 years ago

Thanks ;)

I guess the SVG and EOT files could be removed

As you want ;)