From 500c0d5e419ecc39e823bdbfd49e4c5842621fa2 Mon Sep 17 00:00:00 2001 From: Luis Alonso Chavez Armendariz Date: Tue, 29 Nov 2016 11:44:07 -0700 Subject: [PATCH] Fix appearance in error pages --- app/views/errors/access_denied.html.haml | 16 +++--- app/views/errors/encoding.html.haml | 14 +++-- app/views/errors/git_not_found.html.haml | 17 +++--- app/views/errors/not_found.html.haml | 14 +++-- app/views/errors/omniauth_error.html.haml | 16 +++--- app/views/layouts/errors.html.haml | 65 ++++++++++++++++++++--- changelogs/unreleased/issue_24363.yml | 4 ++ public/404.html | 5 +- public/422.html | 5 +- public/500.html | 5 +- public/502.html | 5 +- public/503.html | 5 +- 12 files changed, 129 insertions(+), 42 deletions(-) create mode 100644 changelogs/unreleased/issue_24363.yml diff --git a/app/views/errors/access_denied.html.haml b/app/views/errors/access_denied.html.haml index c034bbe430e..8bddbef3562 100644 --- a/app/views/errors/access_denied.html.haml +++ b/app/views/errors/access_denied.html.haml @@ -1,6 +1,10 @@ -- page_title "Access Denied" -%h1 403 -%h3 Access Denied -%hr -%p You are not allowed to access this page. -%p Read more about project permissions #{link_to "here", help_page_path("user/permissions"), class: "vlink"} +- content_for(:title, 'Access Denied') +%img{:alt => "GitLab Logo", + :src => image_path('logo.svg')} + %h1 + 403 +.container + %h3 Access Denied + %hr + %p You are not allowed to access this page. + %p Read more about project permissions #{link_to "here", help_page_path("user/permissions"), class: "vlink"} diff --git a/app/views/errors/encoding.html.haml b/app/views/errors/encoding.html.haml index 90cfbebfcc6..064ff14ad2c 100644 --- a/app/views/errors/encoding.html.haml +++ b/app/views/errors/encoding.html.haml @@ -1,5 +1,9 @@ -- page_title "Encoding Error" -%h1 500 -%h3 Encoding Error -%hr -%p Page can't be loaded because of an encoding error. +- content_for(:title, 'Encoding Error') +%img{:alt => "GitLab Logo", + :src => image_path('logo.svg')} + %h1 + 500 +.container + %h3 Encoding Error + %hr + %p Page can't be loaded because of an encoding error. diff --git a/app/views/errors/git_not_found.html.haml b/app/views/errors/git_not_found.html.haml index ff5d4cc1506..c5c12a410ac 100644 --- a/app/views/errors/git_not_found.html.haml +++ b/app/views/errors/git_not_found.html.haml @@ -1,7 +1,10 @@ -- page_title "Git Resource Not Found" -%h1 404 -%h3 Git Resource Not found -%hr -%p - Application can't get access to some branch or commit in your repository. It - may have been moved. +- content_for(:title, 'Git Resource Not Found') +%img{:alt => "GitLab Logo", + :src => image_path('logo.svg')} + %h1 + 404 +.container + %h3 Git Resource Not found + %hr + %p Application can't get access to some branch or commit in your repository. It + may have been moved diff --git a/app/views/errors/not_found.html.haml b/app/views/errors/not_found.html.haml index 3756b98ebb2..50a54a93cb5 100644 --- a/app/views/errors/not_found.html.haml +++ b/app/views/errors/not_found.html.haml @@ -1,5 +1,9 @@ -- page_title "Not Found" -%h1 404 -%h3 The resource you were looking for doesn't exist. -%hr -%p You may have mistyped the address or the page may have moved. +- content_for(:title, 'Not Found') +%img{:alt => "GitLab Logo", + :src => image_path('logo.svg')} + %h1 + 404 +.container + %h3 The resource you were looking for doesn't exist. + %hr + %p You may have mistyped the address or the page may have moved. diff --git a/app/views/errors/omniauth_error.html.haml b/app/views/errors/omniauth_error.html.haml index 3e70e98a24c..d91f1878cb6 100644 --- a/app/views/errors/omniauth_error.html.haml +++ b/app/views/errors/omniauth_error.html.haml @@ -1,9 +1,13 @@ -- page_title "Auth Error" -%h1 422 -%h3 Sign-in using #{@provider} auth failed -%hr -%p Sign-in failed because #{@error}. -%p There are couple of steps you can take: +- content_for(:title, 'Auth Error') +%img{:alt => "GitLab Logo", + :src => image_path('logo.svg')} + %h1 + 422 +.container + %h3 Sign-in using #{@provider} auth failed + %hr + %p Sign-in failed because #{@error}. + %p There are couple of steps you can take: %ul %li Try logging in using your email diff --git a/app/views/layouts/errors.html.haml b/app/views/layouts/errors.html.haml index 7fbe065df00..a3b925f6afd 100644 --- a/app/views/layouts/errors.html.haml +++ b/app/views/layouts/errors.html.haml @@ -1,10 +1,59 @@ !!! 5 %html{ lang: "en"} - = render "layouts/head" - %body{class: "#{user_application_theme} application navless"} - = Gon::Base.render_data - = render "layouts/header/empty" - .container.navless-container - = render "layouts/flash" - .error-page - = yield + %head + %meta{:content => "width=device-width, initial-scale=1, maximum-scale=1", :name => "viewport"} + %title= yield(:title) + :css + body { + color: #666; + text-align: center; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + margin: auto; + font-size: 14px; + } + + h1 { + font-size: 56px; + line-height: 100px; + font-weight: normal; + color: #456; + } + + h2 { + font-size: 24px; + color: #666; + line-height: 1.5em; + } + + h3 { + color: #456; + font-size: 20px; + font-weight: normal; + line-height: 28px; + } + + hr { + max-width: 800px; + margin: 18px auto; + border: 0; + border-top: 1px solid #EEE; + border-bottom: 1px solid white; + } + + img { + max-width: 40vw; + display: block; + margin: 40px auto; + } + + .container { + margin: auto 20px; + } + + ul { + margin: auto; + text-align: left; + display:inline-block; + } +%body + = yield diff --git a/changelogs/unreleased/issue_24363.yml b/changelogs/unreleased/issue_24363.yml new file mode 100644 index 00000000000..0298890b477 --- /dev/null +++ b/changelogs/unreleased/issue_24363.yml @@ -0,0 +1,4 @@ +--- +title: Fix appearance in error pages +merge_request: +author: Luis Alonso Chavez Armendariz diff --git a/public/404.html b/public/404.html index 92b7f4da0b9..11b29d09a82 100644 --- a/public/404.html +++ b/public/404.html @@ -42,6 +42,8 @@ img { max-width: 40vw; + display: block; + margin: 40px auto; } .container { @@ -51,8 +53,9 @@ + GitLab Logo

- GitLab Logo
404

diff --git a/public/422.html b/public/422.html index f625f8a33b7..9bd7cb4b7c8 100644 --- a/public/422.html +++ b/public/422.html @@ -42,6 +42,8 @@ img { max-width: 40vw; + display: block; + margin: 40px auto; } .container { @@ -51,8 +53,9 @@ + GitLab Logo

- GitLab Logo
422

diff --git a/public/500.html b/public/500.html index d76c66ba92a..f92e8839f8d 100644 --- a/public/500.html +++ b/public/500.html @@ -42,6 +42,8 @@ img { max-width: 40vw; + display: block; + margin: 40px auto; } .container { @@ -51,8 +53,9 @@ + GitLab Logo

- GitLab Logo
500

diff --git a/public/502.html b/public/502.html index 1a3c7efc769..c2be4f130a9 100644 --- a/public/502.html +++ b/public/502.html @@ -42,6 +42,8 @@ img { max-width: 40vw; + display: block; + margin: 40px auto; } .container { @@ -51,8 +53,9 @@ + GitLab Logo

- GitLab Logo
502

diff --git a/public/503.html b/public/503.html index c1c4e3ffdb8..8850ffce362 100644 --- a/public/503.html +++ b/public/503.html @@ -42,6 +42,8 @@ img { max-width: 40vw; + display: block; + margin: 40px auto; } .container { @@ -51,8 +53,9 @@ + GitLab Logo

- GitLab Logo
503