Update error pages

[lyubomir-popov]

Done

Rebuiuld the 404 page as per teh design (sans thge enrichment isometric illustration).
Driveby: Make footer stick to the bottom of the window.

QA

• Check out this feature branch
• Run the site using the command ./run serve
• View the site locally in your web browser at: http://0.0.0.0:8002/
• Run through the following QA steps
• Check against hthe design

Issue / Card

Fixes https://warthogs.atlassian.net/browse/WD-3807

Screenshots

[webteam-app]

Demo starting at https://canonical-com-912.demos.haus

[codecov]

Codecov Report

Merging #912 (0d9bd77) into canonical-com-refresh (d9fcb18) will not change coverage.
The diff coverage is n/a.

❗ Current head 0d9bd77 differs from pull request most recent head dba2b65. Consider uploading reports for the commit dba2b65 to get more accurate results

@@                  Coverage Diff                   @@
##           canonical-com-refresh     #912   +/-   ##
======================================================
  Coverage                  60.34%   60.34%           
======================================================
  Files                         10       10           
  Lines                        764      764           
======================================================
  Hits                         461      461           
  Misses                       303      303           

Flag	Coverage Δ
python	60.34% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
webapp/static_data.py	100.00% <ø> (ø)

[juanruitina]

• The link should be in "File a bug"
• Second element should be a paragraph with H2 styling, not an H2.

Other than that, LGTM.

[lyubomir-popov]

ready for another look.

[juanruitina]

LGTM!

[mtruj013]

+1 with changes, please update the nested section to a strip

[mtruj013]

Should we change this to a deep strip as well? Again, from Vanilla: "Sections should not be nested inside each other or inside the strips."

[lyubomir-popov]

yes thanks

[ClementChaumel]

@lyubomir-popov FYI:

401:

500:

502:

[ClementChaumel]

@mtruj013 What do you think of this template? I couldn't use a partial cause the content was too rich but I thought this might do I used the .tmpl format as specified in the docs https://jinja.palletsprojects.com/en/3.1.x/templates/#nesting-extends

[mtruj013]

Yes! Make's total sense, let's do it!

[juanruitina]

@Sophie-32 Can you please review the writing on all the other error messages?

[lyubomir-popov]

I would remove the breaks, and maybe @Sophie-32 can shorten the copy a bit? All else looks good, thanks @ClementChaumel

[Sophie-32]

We couldn't load this page.

Try reloading or file an issue.

Please note, this may be a known issue that we are working on.

[ClementChaumel]

We couldn't load this page.

Try reloading or file an issue.

Please note, this may be a known issue that we are working on.

Thanks! Can you have a look at the other ones too? #912 (comment)

[Sophie-32]

(I'm not 100% clear on this kind of error, but suggest the following copy. In general, is there anything else a user can do when they get this issue like reloading etc)

Bad gateway

The proxy server did not get a valid response from an upstream server.

You can file a bug to report this issue.

[Sophie-32]

You do not have access to this page.

You can file a bug if this is an error.

(Is there anything else the user can do in this case? Like contacting us? or requesting access?)