Error pages

This commit is contained in:
Sam Potts
2017-10-26 20:59:40 +11:00
parent 959b5a20e3
commit 71db66d802
9 changed files with 82 additions and 43 deletions

View File

@ -1,35 +0,0 @@
// ==========================================================================
// Plyr.io Demo Page
// ==========================================================================
// Libs
@import 'lib/animation';
@import 'lib/fontface';
@import 'lib/mixins';
@import 'lib/normalize';
// Settings
@import 'settings/breakpoints';
@import 'settings/colors';
@import 'settings/cosmetic';
@import 'settings/icons';
@import 'settings/layout';
@import 'settings/spacing';
@import 'settings/type';
// Layout
@import 'layout/core';
@import 'layout/grid';
// Type
@import 'type/base';
@import 'type/headings';
// Components
@import 'components/buttons';
@import 'components/header';
@import 'components/icons';
@import 'components/links';
@import 'components/lists';
@import 'components/navigation';
@import 'components/players';

View File

@ -0,0 +1,35 @@
// ==========================================================================
// Plyr.io Demo Page
// ==========================================================================
// Libs
@import '../lib/animation';
@import '../lib/fontface';
@import '../lib/mixins';
@import '../lib/normalize';
// Settings
@import '../settings/breakpoints';
@import '../settings/colors';
@import '../settings/cosmetic';
@import '../settings/icons';
@import '../settings/layout';
@import '../settings/spacing';
@import '../settings/type';
// Layout
@import '../layout/core';
@import '../layout/grid';
// Type
@import '../type/base';
@import '../type/headings';
// Components
@import '../components/buttons';
@import '../components/header';
@import '../components/icons';
@import '../components/links';
@import '../components/lists';
@import '../components/navigation';
@import '../components/players';

View File

@ -0,0 +1,27 @@
// ==========================================================================
// Plyr.io Error Page
// ==========================================================================
// Libs
@import '../lib/fontface';
@import '../lib/mixins';
@import '../lib/normalize';
// Settings
@import '../settings/colors';
@import '../settings/cosmetic';
@import '../settings/icons';
@import '../settings/layout';
@import '../settings/spacing';
@import '../settings/type';
// Layout
@import '../layout/error';
// Type
@import '../type/base';
@import '../type/headings';
// Components
@import '../components/buttons';
@import '../components/links';

View File

@ -7,7 +7,7 @@ header {
text-align: center;
p {
.font-size(18);
.font-size(@font-size-large);
margin-bottom: @spacing-base * 1.5;
}

View File

@ -8,14 +8,23 @@ html.error,
height: 100%;
}
html.error {
background: @page-background;
background-attachment: fixed;
}
.error body {
width: 100%;
display: table;
table-layout: fixed;
display: flex;
align-items: center;
}
.error main {
display: table-cell;
width: 100%;
vertical-align: middle;
padding: @spacing-base;
text-align: center;
p {
.font-size(@font-size-large);
}
}

View File

@ -6,6 +6,7 @@
@font-size-base: 16;
@font-size-small: 14;
@font-size-large: 18;
@font-size-h1: 64;
@font-weight-base: 500;