diff --git a/core/client/assets/img/404-ghost.png b/core/client/assets/img/404-ghost.png new file mode 100644 index 0000000000..3475674dfd Binary files /dev/null and b/core/client/assets/img/404-ghost.png differ diff --git a/core/client/assets/img/404-ghost@2x.png b/core/client/assets/img/404-ghost@2x.png new file mode 100644 index 0000000000..9260c48514 Binary files /dev/null and b/core/client/assets/img/404-ghost@2x.png differ diff --git a/core/client/assets/sass/layouts/errors.scss b/core/client/assets/sass/layouts/errors.scss new file mode 100644 index 0000000000..a98f88aceb --- /dev/null +++ b/core/client/assets/sass/layouts/errors.scss @@ -0,0 +1,80 @@ +/* + * These styles control elements specific to the error screens + * + * Table of Contents: + * + * General + * 404 + */ + +/* ============================================================================= + General + ============================================================================= */ + +.error-content { + max-width: 530px; + margin: 0 auto; + padding: 0; + + @include breakpoint(630px) { + max-width: 264px; + text-align: center; + } +} + +.error-image { + display: inline-block; + vertical-align: middle; + width: 96px; + height: 150px; + + @include breakpoint(630px) { + width: 72px; + height: 112px; + } + + img { + width: 100%; + height: 100%; + } +} + +.error-message { + position: relative; + top: -5px; + display: inline-block; + vertical-align: middle; + margin-left: 10px; +} + +.error-code { + margin: 0; + font-size: 7.8em; + line-height: 0.9em; + color: #979797; + + @include breakpoint(630px) { + font-size: 5.8em; + } +} + +.error-description { + margin: 0; + padding: 0; + font-weight: 300; + font-size: 1.9em; + color: #979797; + border: none; + + @include breakpoint(630px) { + font-size: 1.4em; + } +} + +/* ============================================================================= + 404 + ============================================================================= */ + +.error-404 { + width: 300px; +} \ No newline at end of file diff --git a/core/client/assets/sass/screen.scss b/core/client/assets/sass/screen.scss index f6635bbba8..348e770e50 100644 --- a/core/client/assets/sass/screen.scss +++ b/core/client/assets/sass/screen.scss @@ -47,4 +47,7 @@ /* The settings screen. */ @import "layouts/login"; - /* The settings screen. */ \ No newline at end of file + /* The settings screen. */ + + @import "layouts/errors"; + /* The errors screens. */ \ No newline at end of file diff --git a/core/test/html/404.html b/core/test/html/404.html new file mode 100644 index 0000000000..89f1bec86e --- /dev/null +++ b/core/test/html/404.html @@ -0,0 +1,78 @@ + + + + + + +
+ + +