diff options
| author | Sam Potts <me@sampotts.me> | 2017-10-25 23:59:53 +1100 |
|---|---|---|
| committer | Sam Potts <me@sampotts.me> | 2017-10-25 23:59:53 +1100 |
| commit | 378aa159b8d91b2d9950575141a6ee67e7db350c (patch) | |
| tree | 1baaa3b1d94efd49e016d74b60ff6ae14d17b33a /demo/src/less/layout | |
| parent | 57517a9dcc7ce75aef455b157fb6d1b97eab4e79 (diff) | |
| download | plyr-378aa159b8d91b2d9950575141a6ee67e7db350c.tar.lz plyr-378aa159b8d91b2d9950575141a6ee67e7db350c.tar.xz plyr-378aa159b8d91b2d9950575141a6ee67e7db350c.zip | |
Docs/demo refresh
Diffstat (limited to 'demo/src/less/layout')
| -rw-r--r-- | demo/src/less/layout/core.less | 44 | ||||
| -rw-r--r-- | demo/src/less/layout/error.less | 21 | ||||
| -rw-r--r-- | demo/src/less/layout/grid.less | 19 |
3 files changed, 84 insertions, 0 deletions
diff --git a/demo/src/less/layout/core.less b/demo/src/less/layout/core.less new file mode 100644 index 00000000..aca66952 --- /dev/null +++ b/demo/src/less/layout/core.less @@ -0,0 +1,44 @@ +// ========================================================================== +// Core +// ========================================================================== + +html { + background: @page-background; + background-attachment: fixed; +} + +html, +body { + height: 100%; +} + +body { + display: flex; + align-items: center; + flex-direction: column; +} + +main { + text-align: center; +} + +.grid { + flex: 1; +} + +aside { + width: 100%; + padding: (@spacing-base * 0.75); + background: #fff; + text-align: center; + color: @gray; + text-shadow: none; + + a { + color: @color-twitter; + + &.tab-focus { + .tab-focus(@color-twitter); + } + } +} diff --git a/demo/src/less/layout/error.less b/demo/src/less/layout/error.less new file mode 100644 index 00000000..0ed02241 --- /dev/null +++ b/demo/src/less/layout/error.less @@ -0,0 +1,21 @@ +// ========================================================================== +// Errors (AWS pages) +// ========================================================================== + +// Error page +html.error, +.error body { + height: 100%; +} + +.error body { + width: 100%; + display: table; + table-layout: fixed; +} + +.error main { + display: table-cell; + width: 100%; + vertical-align: middle; +} diff --git a/demo/src/less/layout/grid.less b/demo/src/less/layout/grid.less new file mode 100644 index 00000000..02ff28c8 --- /dev/null +++ b/demo/src/less/layout/grid.less @@ -0,0 +1,19 @@ +// ========================================================================== +// Super basic grid +// ========================================================================== + +.grid { + margin: 0 auto; + padding: @spacing-base; + + @media @mq-md { + display: flex; + align-items: center; + width: 100%; + max-width: @container-max-width; + + > * { + flex: 1; + } + } +} |