Feature #17570

Responsive web design on new Home and About

Added by sajolida 2020-03-28 01:55:05 . Updated 2020-05-12 15:53:34 .

Status:
Resolved
Priority:
Normal
Assignee:
Category:
Hardware support
Target version:
Tails_4.7
Start date:
Due date:
% Done:

0%

Feature Branch:
web/16537-new-home-and-about
Type of work:
Website
Blueprint:

https://tails.boum.org/blueprint/explain_tails/

Starter:
Affected tool:
Deliverable for:
341

Description

Files

Schermata da 2020-05-12 16-03-41.png (167299 B) ignifugo, 2020-05-12 14:11:27
Schermata da 2020-05-12 16-18-48.png (142621 B) ignifugo, 2020-05-12 14:19:12

Subtasks

History

#1 Updated by sajolida 2020-03-28 02:20:01

  • Status changed from Confirmed to Needs Validation
  • Assignee set to ignifugo

Today I worked on making the new Home and About pages more responsive. I pushed my work straight to master, so anybody can test it:

@ignifugo: Do you want to work on this review?

I think that the result is almost “good enough” right now. Things that I still want to do:

  • Fix some important margins here and there.
  • Go back to the problem with the Search box pointed out during feedback.
  • Fix some images. For example, right now the “benefits” on Home don’t fit on iPhones.
  • Maybe replace all images with SVG versions.
  • Build ikiwiki with translations activated to maybe spot bugs in the HTML or unfuzz translations.
  • Unfuzz the translations that I might have broken while editing the HTML.

There could probably still be tons of smaller improvements to be made on these pages but I’m seriously overbudget so I don’t plan to spend a lot more time on it myself.

#2 Updated by CyrilBrulebois 2020-05-06 04:28:53

  • Target version changed from Tails_4.6 to Tails_4.7

#3 Updated by ignifugo 2020-05-12 14:20:19

I’m happy that we adopted the flex-grid! :) And with the new images the home is really nice!
In this: https://tails.boum.org/about/staging/home/index.en.html, my screen in 1400px of width/firefox 68.8.0esr (64-bit), there is a transparent margin in the top of the page.
I think that in line 11 of home.ccs we have to change margin-top in padding-top

.hero, .benefits-1 section, .benefits-2 section, .cfas, .news, .users, .recommended {
padding-top: 3em;
}
hugs

#4 Updated by sajolida 2020-05-12 15:53:34

  • Status changed from Needs Validation to Resolved
  • Assignee deleted (ignifugo)
  • Feature Branch changed from master to web/16537-new-home-and-about

Hey @ignifugo, thanks for the review!

The transparent margin is a glitch that I fixed on web/16537-new-home-and-about.

So if we’re all good here, it seems like I can close this ticket.