├── public ├── assets │ ├── images │ │ ├── sprite.png │ │ ├── sprite@2x.png │ │ ├── Slate.png │ │ └── fallback.png │ ├── favicon │ │ ├── favicon.ico │ │ ├── favicon-16x16.png │ │ ├── favicon-32x32.png │ │ ├── apple-touch-icon.png │ │ ├── firefox_app_60x60.png │ │ ├── android-chrome-36x36.png │ │ ├── android-chrome-48x48.png │ │ ├── android-chrome-72x72.png │ │ ├── android-chrome-96x96.png │ │ ├── firefox_app_128x128.png │ │ ├── firefox_app_512x512.png │ │ ├── android-chrome-144x144.png │ │ ├── android-chrome-192x192.png │ │ ├── android-chrome-256x256.png │ │ ├── android-chrome-384x384.png │ │ ├── android-chrome-512x512.png │ │ ├── apple-touch-icon-57x57.png │ │ ├── apple-touch-icon-60x60.png │ │ ├── apple-touch-icon-72x72.png │ │ ├── apple-touch-icon-76x76.png │ │ ├── apple-touch-icon-114x114.png │ │ ├── apple-touch-icon-120x120.png │ │ ├── apple-touch-icon-144x144.png │ │ ├── apple-touch-icon-152x152.png │ │ ├── apple-touch-icon-167x167.png │ │ ├── apple-touch-icon-180x180.png │ │ ├── apple-touch-icon-precomposed.png │ │ ├── apple-touch-startup-image-320x460.png │ │ ├── apple-touch-startup-image-640x920.png │ │ ├── apple-touch-startup-image-1182x2208.png │ │ ├── apple-touch-startup-image-1242x2148.png │ │ ├── apple-touch-startup-image-1496x2048.png │ │ ├── apple-touch-startup-image-1536x2008.png │ │ ├── apple-touch-startup-image-640x1096.png │ │ ├── apple-touch-startup-image-748x1024.png │ │ ├── apple-touch-startup-image-750x1294.png │ │ ├── apple-touch-startup-image-768x1004.png │ │ ├── manifest.webapp │ │ ├── manifest.json │ │ └── .cache │ ├── fonts │ │ └── fonts.txt │ ├── js │ │ ├── site.js.map │ │ └── site.js │ └── css │ │ ├── site.css │ │ └── site.css.map └── index.html ├── rsync_exclude.txt ├── .gitignore ├── src ├── images │ └── single │ │ ├── Slate.png │ │ └── fallback.png ├── sass │ ├── components │ │ ├── global │ │ │ ├── _G-common.scss │ │ │ └── _G-typography.scss │ │ ├── layouts │ │ │ └── _L-index.scss │ │ └── partials │ │ │ └── _P-sprite.scss │ ├── config │ │ ├── _config-helpers.scss │ │ ├── _config-svg.scss │ │ ├── _config-accessibility.scss │ │ ├── _config-colors.scss │ │ ├── _config-forms.scss │ │ ├── _config-grid.scss │ │ ├── _config-ratios.scss │ │ ├── _config-tables.scss │ │ ├── _config-layout.scss │ │ ├── _config-font-stacks.scss │ │ ├── _config-forms-skin.scss │ │ ├── _config-typography.scss │ │ └── _config-buttons.scss │ ├── site.scss │ └── _slate-engine.scss ├── fonts │ └── fonts.txt ├── js │ └── site.js └── favicon │ └── favicon.svg ├── mix-manifest.json ├── README.md ├── package.json ├── deploy ├── .sass-lint.yml └── webpack.mix.js /public/assets/images/sprite.png: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/assets/images/sprite@2x.png: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /rsync_exclude.txt: -------------------------------------------------------------------------------- 1 | .git 2 | .gitignore 3 | .DS_Store 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | yarn.lock 4 | package-lock.json 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /src/images/single/Slate.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/src/images/single/Slate.png -------------------------------------------------------------------------------- /public/assets/images/Slate.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/images/Slate.png -------------------------------------------------------------------------------- /src/images/single/fallback.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/src/images/single/fallback.png -------------------------------------------------------------------------------- /public/assets/favicon/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/favicon.ico -------------------------------------------------------------------------------- /public/assets/images/fallback.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/images/fallback.png -------------------------------------------------------------------------------- /public/assets/favicon/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/favicon-16x16.png -------------------------------------------------------------------------------- /public/assets/favicon/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/favicon-32x32.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon.png -------------------------------------------------------------------------------- /public/assets/favicon/firefox_app_60x60.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/firefox_app_60x60.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-36x36.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-36x36.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-48x48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-48x48.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-72x72.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-96x96.png -------------------------------------------------------------------------------- /public/assets/favicon/firefox_app_128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/firefox_app_128x128.png -------------------------------------------------------------------------------- /public/assets/favicon/firefox_app_512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/firefox_app_512x512.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-144x144.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-192x192.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-256x256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-256x256.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-384x384.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-384x384.png -------------------------------------------------------------------------------- /public/assets/favicon/android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/android-chrome-512x512.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-57x57.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-57x57.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-60x60.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-60x60.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-72x72.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-76x76.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-76x76.png -------------------------------------------------------------------------------- /mix-manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "/public/assets/js/site.js": "/public/assets/js/site.js", 3 | "/public/assets/css/site.css": "/public/assets/css/site.css" 4 | } -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-114x114.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-114x114.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-120x120.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-120x120.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-144x144.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-152x152.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-167x167.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-167x167.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-180x180.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-180x180.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-icon-precomposed.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-icon-precomposed.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-320x460.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-320x460.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-640x920.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-640x920.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-1182x2208.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-1182x2208.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-1242x2148.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-1242x2148.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-1496x2048.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-1496x2048.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-1536x2008.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-1536x2008.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-640x1096.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-640x1096.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-748x1024.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-748x1024.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-750x1294.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-750x1294.png -------------------------------------------------------------------------------- /public/assets/favicon/apple-touch-startup-image-768x1004.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HashandSalt/slateengine/HEAD/public/assets/favicon/apple-touch-startup-image-768x1004.png -------------------------------------------------------------------------------- /src/sass/components/global/_G-common.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Common 3 | // ====================================================================== 4 | 5 | html { 6 | @include fix-box-model; 7 | } 8 | -------------------------------------------------------------------------------- /src/sass/components/layouts/_L-index.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Index Layout 3 | // ====================================================================== 4 | 5 | .middle { 6 | @include container; 7 | } 8 | -------------------------------------------------------------------------------- /src/sass/config/_config-helpers.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Helpers 3 | // ====================================================================== 4 | 5 | // 16:9 ratio 6 | $ioe-padding: ((100 / 16) * 9); 7 | -------------------------------------------------------------------------------- /public/assets/favicon/manifest.webapp: -------------------------------------------------------------------------------- 1 | { 2 | "version": "1.0", 3 | "name": "Slate Engine", 4 | "description": null, 5 | "icons": { 6 | "60": "firefox_app_60x60.png", 7 | "128": "firefox_app_128x128.png", 8 | "512": "firefox_app_512x512.png" 9 | }, 10 | "developer": { 11 | "name": null, 12 | "url": null 13 | } 14 | } -------------------------------------------------------------------------------- /src/sass/config/_config-svg.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // SVG Icons 3 | // ====================================================================== 4 | 5 | /// Default Icon Color. 6 | $svg-icon-orginal-color: '#000000'; 7 | /// Global Replacement Icon Color. 8 | $svg-icon-replace-color: $primary; 9 | -------------------------------------------------------------------------------- /src/sass/config/_config-accessibility.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Accessibility 3 | // ====================================================================== 4 | 5 | /// Accessibility border style to be used as a focus state on elements 6 | $a11y-outline: 2px solid $warning !default; 7 | 8 | /// Accessibility background color to be used as a focus state on elements 9 | $a11y-background: $warning; 10 | -------------------------------------------------------------------------------- /src/fonts/fonts.txt: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // kirbykit.dev hello@hashandsalt.com 3 | // ====================================================================== 4 | // 5 | // ====================================================================== 6 | // Fonts 7 | // ====================================================================== 8 | 9 | Drop your font files in here, but pay attention to the font license! 10 | -------------------------------------------------------------------------------- /public/assets/fonts/fonts.txt: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // kirbykit.dev hello@hashandsalt.com 3 | // ====================================================================== 4 | // 5 | // ====================================================================== 6 | // Fonts 7 | // ====================================================================== 8 | 9 | Drop your font files in here, but pay attention to the font license! 10 | -------------------------------------------------------------------------------- /src/js/site.js: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Some Project http://yourdomain.com | you@domain.com 3 | // ====================================================================== 4 | 5 | // window.$ = window.jQuery = require('jquery'); 6 | // require any further scripts here ie: 7 | // require('npmpackagename'); 8 | // require('./mylocalfile.js'); 9 | 10 | // ====================================================================== 11 | // Custom Javascript 12 | // ====================================================================== 13 | -------------------------------------------------------------------------------- /src/sass/site.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Some Project http://yourdomain.com | you@domain.com 3 | // ====================================================================== 4 | 5 | // Slate 6 | // ====================================================================== 7 | 8 | @import 'slate-engine'; 9 | 10 | // Components 11 | // ====================================================================== 12 | 13 | // Global 14 | @import 'components/global/G-common'; 15 | @import 'components/global/G-typography'; 16 | 17 | // Layouts 18 | @import 'components/layouts/L-index'; 19 | -------------------------------------------------------------------------------- /src/sass/_slate-engine.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Slate Engine - https://slateengine.com 3 | // ====================================================================== 4 | 5 | @import 'normalize'; 6 | 7 | @import 'config/config-colors'; 8 | @import 'config/config-grid'; 9 | @import 'config/config-layout'; 10 | @import 'config/config-ratios'; 11 | @import 'config/config-font-stacks'; 12 | @import 'config/config-typography'; 13 | @import 'config/config-tables'; 14 | @import 'config/config-forms-skin'; 15 | @import 'config/config-forms'; 16 | @import 'config/config-buttons'; 17 | @import 'config/config-accessibility'; 18 | @import 'config/config-svg'; 19 | @import 'config/config-helpers'; 20 | 21 | @import 'slate'; 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Slate Build Engine 2 | 3 | This repository is part of the _Slate Framework_. _Slate_ is a responsive, modern web framework written in Sass. It is packed full of features to help you build the most awesome things for the web. This is a tool for compiling your projects code, based on Laravel Mix and NPM scripts. 4 | 5 | ### Quick Start 6 | 7 | Assumes you have Yarn & Node installed. NPM will also work of course, but Yarn is encouraged. 8 | 9 | ```sh 10 | $ cd your/project/folder 11 | $ git clone https://github.com/HashandSalt/slateengine.git && yarn install -D 12 | ``` 13 | Additionally, configure the `webpack.mix.js` file to your liking. You can find the docs for Mix [here](https://laravel.com/docs/5.6/mix). 14 | 15 | For full documentation, visit www.slateengine.com. 16 | 17 | _Slate_ was made with ♥ by [Hash&Salt](https://www.hashandsalt.com) 18 | -------------------------------------------------------------------------------- /src/sass/config/_config-colors.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Colors 3 | // ====================================================================== 4 | 5 | /// Monochrome - Bright 6 | $bright: #eee; 7 | /// Monochrome - Gray 8 | $gray: #9f9f9f; 9 | /// Monochrome - Dark 10 | $dark: #414141; 11 | /// Monochrome - Jet 12 | $jet: #000; 13 | 14 | /// Palette - Primary 15 | $primary: #96def0; 16 | /// Palette - Secondary 17 | $secondary: #2980b9; 18 | /// Palette - Secondary 19 | $tertiary: #8e44ad; 20 | 21 | /// Feedback - Positive 22 | $positive: #2ecc71; 23 | /// Feedback - Negative 24 | $negative: #971318; 25 | /// Feedback - Warning 26 | $warning: #f39c12; 27 | // Feedback - Disabled 28 | $disabled: #adadad; 29 | 30 | /// Gradient - Start 31 | $gradient-start: $primary; 32 | /// Gradient - Middle 33 | $gradient-middle: darken($primary, 20%); 34 | /// Gradient - End 35 | $gradient-end: darken($primary, 40%); 36 | -------------------------------------------------------------------------------- /src/sass/config/_config-forms.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Form Complete Skin 3 | // ====================================================================== 4 | 5 | /// Custom Radio & Check Boxes 6 | /// --------------------------------------------------------------------- 7 | 8 | $form-skin: ( 9 | /// Components 10 | components: ( 11 | baseform: true, 12 | inputs: true, 13 | addons: true, 14 | select: true, 15 | validation: true 16 | ), 17 | /// Form Element 18 | form: ( 19 | margin: 0 0 0 0, 20 | padding: 0, 21 | color: $dark, 22 | ), 23 | /// Legend Element 24 | legend: ( 25 | margin: 0 0 24px 0, 26 | line-height: $global-line-height, 27 | ), 28 | /// Fieldset Element 29 | fieldset: ( 30 | margin: 0 0 $gutter-width, 31 | padding: 0 0 $gutter-width, 32 | ), 33 | /// Label Elements 34 | labels: ( 35 | color: $dark, 36 | spacing: 0 0 0 0, 37 | ), 38 | /// Skins 39 | skins: ( 40 | inputs: $input-skin, 41 | addons: $input-skin, 42 | select: $input-skin, 43 | validation: $input-skin, 44 | ), 45 | ); 46 | -------------------------------------------------------------------------------- /src/sass/config/_config-grid.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Grid 3 | // ====================================================================== 4 | 5 | /// Grid Total Columns 6 | $total-columns: 12; 7 | 8 | /// Grid Total Width 9 | $total-width: 100%; 10 | 11 | /// Grid Gutter Width 12 | $gutter-width: 2%; 13 | 14 | /// Grid Column Bottom Spacing 15 | $column-bottom-spacing: 24px; 16 | 17 | /// Grid Container margin 18 | $container-margin: 2%; 19 | 20 | /// Class to use for rows 21 | $class-container: 'row'; 22 | 23 | /// Class to use for columns 24 | $class-column: 'col'; 25 | 26 | /// Class to use for push 27 | $class-push: 'push'; 28 | 29 | /// Center Containers 30 | $center-containers: true; 31 | 32 | /// Center Containers Max Width 33 | $center-container-max-width: 1140px; 34 | 35 | /// Breakpoint - tiny 36 | $bp-tiny: 320px; 37 | 38 | /// Breakpoint - xsmall 39 | $bp-xsmall: 480px; 40 | 41 | /// Breakpoint - small 42 | $bp-small: 640px; 43 | 44 | /// Breakpoint - medium 45 | $bp-medium: 800px; 46 | 47 | /// Breakpoint - large 48 | $bp-large: 960px; 49 | 50 | /// Breakpoint - xl 51 | $bp-xl: 1140px; 52 | -------------------------------------------------------------------------------- /src/sass/config/_config-ratios.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Ratios 3 | // ====================================================================== 4 | 5 | /// Minor Second Ratio 6 | $minor-second: 1.067; 7 | 8 | /// Major Second Ratio 9 | $major-second: 1.125; 10 | 11 | /// Minor Third Ratio 12 | $minor-third: 1.2; 13 | 14 | /// Miajor Third Ratio 15 | $major-third: 1.25; 16 | 17 | /// Perfect Forth Ratio 18 | $perfect-fourth: 1.333; 19 | 20 | /// Augmented Forth Ratio 21 | $augmented-fourth: 1.414; 22 | 23 | /// Perfect Fith Ratio 24 | $perfect-fifth: 1.5; 25 | 26 | /// Minor Sixth Ratio 27 | $minor-sixth: 1.6; 28 | 29 | /// Golden Section Ratio 30 | $golden-section: 1.618; 31 | 32 | /// Major Sixth Ratio 33 | $major-sixth: 1.667; 34 | 35 | /// Minor Seventh Ratio 36 | $minor-seventh: 1.778; 37 | 38 | /// Major Seventh Ratio 39 | $major-seventh: 1.875; 40 | 41 | /// Octave Ratio 42 | $octave: 2; 43 | 44 | /// Major Tenth Ratio 45 | $major-tenth: 2.5; 46 | 47 | /// Major Eleventh Ratio 48 | $major-eleventh: 2.667; 49 | 50 | /// Major Twelth Ratio 51 | $major-twelfth: 3; 52 | 53 | /// Double Octave Ratio 54 | $double-octave: 4; 55 | -------------------------------------------------------------------------------- /public/assets/favicon/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Slate Engine", 3 | "short_name": "Slate Engine", 4 | "description": null, 5 | "dir": "auto", 6 | "lang": "en-US", 7 | "display": "standalone", 8 | "orientation": "any", 9 | "start_url": "/?homescreen=1", 10 | "background_color": "#222222", 11 | "icons": [ 12 | { 13 | "src": "android-chrome-36x36.png", 14 | "sizes": "36x36", 15 | "type": "image/png" 16 | }, 17 | { 18 | "src": "android-chrome-48x48.png", 19 | "sizes": "48x48", 20 | "type": "image/png" 21 | }, 22 | { 23 | "src": "android-chrome-72x72.png", 24 | "sizes": "72x72", 25 | "type": "image/png" 26 | }, 27 | { 28 | "src": "android-chrome-96x96.png", 29 | "sizes": "96x96", 30 | "type": "image/png" 31 | }, 32 | { 33 | "src": "android-chrome-144x144.png", 34 | "sizes": "144x144", 35 | "type": "image/png" 36 | }, 37 | { 38 | "src": "android-chrome-192x192.png", 39 | "sizes": "192x192", 40 | "type": "image/png" 41 | }, 42 | { 43 | "src": "android-chrome-256x256.png", 44 | "sizes": "256x256", 45 | "type": "image/png" 46 | }, 47 | { 48 | "src": "android-chrome-384x384.png", 49 | "sizes": "384x384", 50 | "type": "image/png" 51 | }, 52 | { 53 | "src": "android-chrome-512x512.png", 54 | "sizes": "512x512", 55 | "type": "image/png" 56 | } 57 | ] 58 | } -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Slate Framework 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 |
32 | 33 |

Slate Framework.

34 |

For full documentation, visit the projects website.

35 | 36 |
37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "slateengine", 3 | "version": "0.5.2", 4 | "description": "A build engine for Slate", 5 | "author": "Hash&Salt", 6 | "email": "hello@hashandsalt.com", 7 | "repository": { 8 | "type": "git", 9 | "url": "https://github.com/HashandSalt/slateengine" 10 | }, 11 | "bugs": { 12 | "url": "https://github.com/HashandSalt/slateengine/issues" 13 | }, 14 | "license": "MIT", 15 | "config": { 16 | "webpack": "node_modules/laravel-mix/setup/webpack.config.js", 17 | "favout": "public/assets/favicon" 18 | }, 19 | "scripts": { 20 | "test": "echo \"Error: no test specified\" && exit 1", 21 | "start": "yarn watch", 22 | "dev": "cross-env NODE_ENV=development webpack --progress --hide-modules --config=$npm_package_config_webpack", 23 | "watch": "cross-env NODE_ENV=development webpack --watch --progress --hide-modules --config=$npm_package_config_webpack", 24 | "production": "cross-env NODE_ENV=production webpack --progress --hide-modules --config=$npm_package_config_webpack", 25 | "deploy:live:sim": "./deploy live", 26 | "deploy:live": "./deploy live go", 27 | "deploy:staging:sim": "./deploy staging", 28 | "deploy:staging": "./deploy staging go", 29 | "content:sync:sim": "./deploy sync", 30 | "content:sync": "./deploy sync go", 31 | "postinstall": "yarn start" 32 | }, 33 | "devDependencies": {}, 34 | "dependencies": { 35 | "browser-sync": "^2.21.0", 36 | "browser-sync-webpack-plugin": "^2.0.1", 37 | "cross-env": "^5.1.3", 38 | "favicons-webpack-plugin": "^0.0.9", 39 | "laravel-mix": "^2.0.0", 40 | "normalize.css": "^8.0.0", 41 | "slatecore": "^6.0.2", 42 | "webpack-spritesmith": "^0.4.0" 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /deploy: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | ERRORSTRING="Whoops! That didn't work. Have another go." 4 | if [ $# -eq 0 ] 5 | then 6 | echo "$ERRORSTRING"; 7 | 8 | elif [[ "$1" == "sync" ]] 9 | then 10 | if [[ -z $2 ]] 11 | then 12 | echo "Running content sync from live dry-run" 13 | rsync --dry-run -az --force --delete --progress --exclude-from=rsync_exclude.txt -e "ssh -p22" USER@12.34.5.678:/var/www/vhosts/domain.com/httpdocs/ ./public/ 14 | elif [[ "$2" == "go" ]] 15 | then 16 | echo "Running content sync from live actual" 17 | rsync -az --force --delete --progress --exclude-from=rsync_exclude.txt -e "ssh -p22" USER@12.34.5.678:/var/www/vhosts/domain.com/httpdocs/ ./public/ 18 | else 19 | echo "$ERRORSTRING"; 20 | fi 21 | 22 | elif [[ "$1" == "live" ]] 23 | then 24 | if [[ -z $2 ]] 25 | then 26 | echo "Running live dry-run" 27 | rsync --dry-run -az --force --delete --progress --exclude-from=rsync_exclude.txt -e "ssh -p22" ./public/ USER@12.34.5.678:/var/www/vhosts/domain.com/httpdocs 28 | elif [[ "$2" == "go" ]] 29 | then 30 | echo "Running live actual deploy" 31 | rsync -az --force --delete --progress --exclude-from=rsync_exclude.txt -e "ssh -p22" ./public/ USER@12.34.5.678:/var/www/vhosts/domain.com/httpdocs 32 | else 33 | echo "$ERRORSTRING"; 34 | fi 35 | 36 | elif [[ "$1" == "staging" ]] 37 | then 38 | if [[ -z $2 ]] 39 | then 40 | echo "Running staging dry-run" 41 | rsync --dry-run -az --force --delete --progress --exclude-from=rsync_exclude.txt -e "ssh -p22" ./public/ USER@12.34.5.678:/var/www/vhosts/domain.com/subdomains/dev.domain.com 42 | elif [[ "$2" == "go" ]] 43 | then 44 | echo "Running staging actual deploy" 45 | rsync -az --force --delete --progress --exclude-from=rsync_exclude.txt -e "ssh -p22" ./public/ USER@12.34.5.678:/var/www/vhosts/domain.com/subdomains/dev.domain.com 46 | else 47 | echo "$ERRORSTRING"; 48 | fi 49 | fi 50 | -------------------------------------------------------------------------------- /.sass-lint.yml: -------------------------------------------------------------------------------- 1 | options: 2 | formatter: stylish 3 | files: 4 | include: '**/*.s+(a|c)ss' 5 | rules: 6 | # Extends 7 | extends-before-mixins: 1 8 | extends-before-declarations: 1 9 | placeholder-in-extend: 1 10 | 11 | # Mixins 12 | mixins-before-declarations: 0 13 | 14 | # Line Spacing 15 | one-declaration-per-line: 1 16 | empty-line-between-blocks: 0 17 | single-line-per-selector: 1 18 | 19 | # Disallows 20 | no-attribute-selectors: 0 21 | no-color-hex: 0 22 | no-color-keywords: 1 23 | no-color-literals: 1 24 | no-combinators: 0 25 | no-css-comments: 1 26 | no-debug: 1 27 | no-disallowed-properties: 0 28 | no-duplicate-properties: 1 29 | no-empty-rulesets: 1 30 | no-extends: 0 31 | no-ids: 0 32 | no-important: 1 33 | no-invalid-hex: 1 34 | no-mergeable-selectors: 1 35 | no-misspelled-properties: 1 36 | no-qualifying-elements: 1 37 | no-trailing-whitespace: 1 38 | no-trailing-zero: 1 39 | no-transition-all: 1 40 | no-universal-selectors: 0 41 | no-url-domains: 0 42 | no-url-protocols: 0 43 | no-vendor-prefixes: 0 44 | no-warn: 1 45 | property-units: 0 46 | 47 | # Nesting 48 | declarations-before-nesting: 1 49 | force-attribute-nesting: 1 50 | force-element-nesting: 1 51 | force-pseudo-nesting: 1 52 | 53 | # Name Formats 54 | class-name-format: 1 55 | function-name-format: 1 56 | id-name-format: 0 57 | mixin-name-format: 1 58 | placeholder-name-format: 1 59 | variable-name-format: 1 60 | 61 | # Style Guide 62 | attribute-quotes: 1 63 | bem-depth: 0 64 | border-zero: 1 65 | brace-style: 1 66 | clean-import-paths: 1 67 | empty-args: 1 68 | hex-length: 1 69 | hex-notation: 1 70 | indentation: 0 71 | leading-zero: 1 72 | max-line-length: 0 73 | max-file-line-count: 0 74 | nesting-depth: 0 75 | property-sort-order: 0 76 | pseudo-element: 1 77 | quotes: 1 78 | shorthand-values: 1 79 | url-quotes: 1 80 | variable-for-property: 1 81 | zero-unit: 1 82 | 83 | # Inner Spacing 84 | space-after-comma: 1 85 | space-before-colon: 1 86 | space-after-colon: 1 87 | space-before-brace: 1 88 | space-before-bang: 1 89 | space-after-bang: 1 90 | space-between-parens: 1 91 | space-around-operator: 1 92 | 93 | # Final Items 94 | trailing-semicolon: 1 95 | final-newline: 1 96 | -------------------------------------------------------------------------------- /src/sass/config/_config-tables.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Tables 3 | // ====================================================================== 4 | 5 | /// Default Table Skin. 6 | 7 | $default-table: ( 8 | fontfamily: $global-font-stack, 9 | layout: fixed, 10 | background: #fff, 11 | borderwidth: 1px 1px 1px 1px, 12 | bordercolor: #fff #fff #fff #fff, 13 | borderstyle: solid solid solid solid, 14 | margin: 24px 0 24px 0, 15 | bordercollapse: collapse, 16 | width: 100%, 17 | 18 | caption: ( 19 | background: #fff, 20 | padding: 24px 0, 21 | fontfamily: inherit, 22 | fontweight: $bold, 23 | fontcolor: $global-font-color, 24 | fontsize: 22px, 25 | textalign: center, 26 | borderwidth: 0 0 1px 0, 27 | bordercolor: $bright $bright $bright $bright, 28 | borderstyle: solid solid solid solid 29 | ), 30 | header: ( 31 | background: $bright, 32 | padding: 16px 0, 33 | fontfamily: inherit, 34 | fontweight: $global-font-weight, 35 | fontcolor: $global-font-color, 36 | fontsize: 18px, 37 | textalign: center, 38 | verticalalign: middle, 39 | borderwidth: 1px 1px 1px 1px, 40 | bordercolor: #fff #fff #fff #fff, 41 | borderstyle: solid solid solid solid 42 | ), 43 | body: ( 44 | background: $bright, 45 | oddbackground: $bright, 46 | evenbackground: #fff, 47 | padding: 8px 0, 48 | fontfamily: inherit, 49 | fontweight: $global-font-weight, 50 | fontcolor: $global-font-color, 51 | fontsize: 18px, 52 | textalign: center, 53 | verticalalign: middle, 54 | borderwidth: 1px 1px 1px 1px, 55 | bordercolor: #fff #fff #fff #fff, 56 | borderstyle: solid solid solid solid 57 | ), 58 | footer: ( 59 | background: $bright, 60 | padding: 8px 0, 61 | fontfamily: inherit, 62 | fontweight: $global-font-weight, 63 | fontcolor: $global-font-color, 64 | fontsize: 18px, 65 | textalign: center, 66 | borderwidth: 1px 1px 1px 1px, 67 | bordercolor: #fff #fff #fff #fff, 68 | borderstyle: solid solid solid solid 69 | ), 70 | ); 71 | -------------------------------------------------------------------------------- /src/sass/config/_config-layout.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Gridler Defaults 3 | // ====================================================================== 4 | 5 | /// Gridler Mixin - Class to use for the columns 6 | $gridler-element: $class-column; 7 | 8 | // Breakpoints 9 | 10 | /// Gridler Mixin - Small column breakpoint 11 | $gridler-sm: $bp-small; 12 | 13 | /// Gridler Mixin - Medium column breakpoint 14 | $gridler-me: $bp-medium; 15 | 16 | /// Gridler Mixin - Large column breakpoint 17 | $gridler-lg: $bp-large; 18 | 19 | // Columns 20 | 21 | /// Gridler Mixin - Small column count 22 | $gridler-sm-c: 6; 23 | 24 | /// Gridler Mixin - Medium column count 25 | $gridler-me-c: 4; 26 | 27 | /// Gridler Mixin - Large column count 28 | $gridler-lg-c: 3; 29 | 30 | /// Gridler Mixin - Spacing below each column 31 | $gridler-column-bottom-spacing: $column-bottom-spacing; 32 | 33 | // ====================================================================== 34 | // Holy Grail Defaults 35 | // ====================================================================== 36 | 37 | /// Holy Grail Left Sidebar Element Class 38 | $holygrail-left-element: 'left'; 39 | 40 | /// Holy Grail Middle Class 41 | $holygrail-middle-element: 'middle'; 42 | 43 | /// Holy Grail Right Sidebar Class 44 | $holygrail-right-element: 'right'; 45 | 46 | /// Holy Grail Left Sidebar Column Width 47 | $holygrail-left-column: 3; 48 | 49 | /// Holy Grail middle Sidebar Column Width 50 | $holygrail-middle-column: 5; 51 | 52 | /// Holy Grail right Sidebar Column Width 53 | $holygrail-right-column: 4; 54 | 55 | /// Holy Grail Breakpoint 56 | $holygrail-breakpoint: $bp-medium; 57 | 58 | /// Holy Grail Bottom Spacing 59 | $holygrail-column-bottom-spacing: $column-bottom-spacing; 60 | 61 | // ====================================================================== 62 | // Flank 63 | // ====================================================================== 64 | 65 | /// Flank Direction 66 | $flankdir: 'right'; 67 | 68 | /// Flank Main Class 69 | $flank-main-element: 'main'; 70 | 71 | /// Flank Flank Class 72 | $flank-flank-element: 'flank'; 73 | 74 | /// Flank Main Column Width 75 | $flank-main-column: 8; 76 | 77 | /// Flank Column Width 78 | $flank-flank-column: 4; 79 | 80 | /// Flank Breakpoint 81 | $flank-breakpoint: $bp-medium; 82 | 83 | /// Flank Bottom Spacing 84 | $flank-column-bottom-spacing: $column-bottom-spacing; 85 | -------------------------------------------------------------------------------- /src/sass/config/_config-font-stacks.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Font Stacks 3 | // ====================================================================== 4 | 5 | /// Simple Times Font Stack 6 | $times: Times, 'Times New Roman', serif !default; 7 | 8 | /// Simple Arial Font Stack 9 | $arial: Arial, sans-serif !default; 10 | 11 | /// Simple Georgia Font Stack 12 | $georgia: Georgia, serif !default; 13 | 14 | /// Simple Garamond Font Stack 15 | $garamond: 'Apple Garamond', 'ITC Garamond Narrow', 'Garamond', serif !default; 16 | 17 | /// Simple Helvetica Font Stack 18 | $helvetica: 'Helvetica Neue', Helvetica, sans-serif !default; 19 | 20 | /// Simple Verdana Font Stack 21 | $verdana: 'Verdana Ref', Verdana, sans-serif !default; 22 | 23 | /// Simple Trebuchet Font Stack 24 | $trebuchet: 'Trebuchet MS', sans-serif !default; 25 | 26 | /// Simple Gill Sans Font Stack 27 | $gillsans: 'Gill Sans MT', 'Gill Sans', Tahoma, Geneva, sans-serif !default; 28 | 29 | /// Full Times Font Stack 30 | $stimes: Cambria, 'Hoefler Text', Utopia, 'Liberation Serif', 'Nimbus Roman No9 L Regular', 'Times New Roman', Times, serif !default; 31 | 32 | /// Full Georgia Font Stack 33 | $sgeorgia: Constantia, 'Lucida Bright', Lucidabright, 'Lucida Serif', Lucida, 'DejaVu Serif', 'Bitstream Vera Serif', 'Liberation Serif', Georgia, serif !default; 34 | 35 | /// Full Garamond Font Stack 36 | $sgaramond: 'Palatino Linotype', Palatino, Palladio, 'URW Palladio L', 'Book Antiqua', Baskerville, 'Bookman Old Style', 'Bitstream Charter', 'Nimbus Roman No9 L', 'Apple Garamond', 'ITC Garamond Narrow', 'New Century Schoolbook', 'Century Schoolbook', 'Century Schoolbook L', Garamond, serif !default; 37 | 38 | /// Full Helvetica Font Stack 39 | $shelvetica: Frutiger, 'Frutiger Linotype', Univers, Calibri, 'Gill Sans', 'Gill Sans MT', 'Myriad Pro', Myriad, 'DejaVu Sans Condensed', 'Liberation Sans', 'Nimbus Sans L', Tahoma, Geneva, 'Helvetica Neue', Helvetica, sans-serif !default; 40 | 41 | /// Full Verdana Font Stack 42 | $sverdana: Corbel, 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', 'Verdana Ref', Verdana, sans-serif !default; 43 | 44 | /// Full Trebuchet Font Stack 45 | $strebuchet: 'Segoe UI', Candara, 'Bitstream Vera Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Trebuchet MS', Trebuchet, sans-serif !default; 46 | 47 | /// Full Gill Sans Font Stack 48 | $sgillsans: Frutiger, 'Frutiger Linotype', Univers, Calibri, 'Myriad Pro', Myriad, 'DejaVu Sans Condensed', 'Liberation Sans', 'Nimbus Sans L', Tahoma, Geneva, 'Gill Sans MT', 'Gill Sans', sans-serif !default; 49 | 50 | /// Terminal / Monospace font 51 | $terminal: Monaco, 'Lucida Sans Typewriter', Consolas, 'Courier New', monospace !default; 52 | -------------------------------------------------------------------------------- /public/assets/js/site.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///webpack/bootstrap c1bf50065895ae4c2720"],"names":["installedModules","__webpack_require__","moduleId","exports","module","i","l","modules","call","m","c","d","name","getter","o","Object","defineProperty","configurable","enumerable","get","n","__esModule","object","property","prototype","hasOwnProperty","p","s"],"mappings":"aACA,IAAAA,KAGA,SAAAC,EAAAC,GAGA,GAAAF,EAAAE,GACA,OAAAF,EAAAE,GAAAC,QAGA,IAAAC,EAAAJ,EAAAE,IACAG,EAAAH,EACAI,GAAA,EACAH,YAUA,OANAI,EAAAL,GAAAM,KAAAJ,EAAAD,QAAAC,IAAAD,QAAAF,GAGAG,EAAAE,GAAA,EAGAF,EAAAD,QAKAF,EAAAQ,EAAAF,EAGAN,EAAAS,EAAAV,EAGAC,EAAAU,EAAA,SAAAR,EAAAS,EAAAC,GACAZ,EAAAa,EAAAX,EAAAS,IACAG,OAAAC,eAAAb,EAAAS,GACAK,cAAA,EACAC,YAAA,EACAC,IAAAN,KAMAZ,EAAAmB,EAAA,SAAAhB,GACA,IAAAS,EAAAT,KAAAiB,WACA,WAA2B,OAAAjB,EAAA,SAC3B,WAAiC,OAAAA,GAEjC,OADAH,EAAAU,EAAAE,EAAA,IAAAA,GACAA,GAIAZ,EAAAa,EAAA,SAAAQ,EAAAC,GAAsD,OAAAR,OAAAS,UAAAC,eAAAjB,KAAAc,EAAAC,IAGtDtB,EAAAyB,EAAA,GAGAzB,IAAA0B,EAAA","file":"/public/assets/js/site.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap c1bf50065895ae4c2720"],"sourceRoot":""} -------------------------------------------------------------------------------- /src/sass/config/_config-forms-skin.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Form Skins 3 | // ====================================================================== 4 | 5 | /// Inputs 6 | /// ---------------------------------------------------------------------- 7 | 8 | /// Default Input Theme 9 | /// @group Inputs 10 | $input-skin: ( 11 | // Global 12 | 'use-borders': true, 13 | 'textlight': $bright, 14 | 'textdark': $dark, 15 | 'width': 100%, 16 | 'height': 54px, 17 | 'margin': 0 0 24px, 18 | 'padding': 12px, 19 | 'font': inherit, 20 | 'font-size': $global-base-font-size, 21 | 'line-height': $global-line-height, 22 | // Backgrounds 23 | 'bg': ( 24 | 'bg-color': #fff, 25 | 'bg-color-hover': #eee, 26 | 'bg-color-focus': #eee, 27 | 'bg-color-disabled': $gray, 28 | ), 29 | // Borders 30 | 'borders': ( 31 | 'border-width': 2px 2px 2px 2px, 32 | 'border-style': solid solid solid solid, 33 | 'border-color': $gray $gray $gray $gray, 34 | 'border-focus-color': $dark $dark $dark $dark, 35 | 'border-hover-color': $positive $positive $positive $positive, 36 | 'border-disabled-color': $disabled $disabled $disabled $disabled, 37 | ), 38 | // Selects 39 | 'selects': ( 40 | 'arrow': '', 41 | 'triangle-color-dark': $dark, 42 | 'triangle-color-light': $gray, 43 | 'triangle-size': 11px 6px, 44 | 'triangle-position': 98% center, 45 | ), 46 | // Addons 47 | 'addons': ( 48 | 'addon-background-color': $primary, 49 | 'addon-hover': $positive, 50 | 'addon-focus': $positive, 51 | 'addon-active': $dark, 52 | 'addon-disabled': #adadad, 53 | 'wrapper': 'form-addon', 54 | 'icon': 'addon-icon', 55 | 'button': 'addon-button', 56 | 'field': 'addon-field', 57 | 'left': 'addon-left', 58 | 'right': 'addon-right', 59 | 'both': 'addon-both', 60 | 'font-weight': $semibold, 61 | 'button-width': 15%, 62 | ), 63 | // Radios & Checkboxes 64 | 'radios': ( 65 | 'width': 36px, 66 | 'height': 36px, 67 | 'selected-color': $positive, 68 | 'radio-radius': 50%, 69 | 'check-radio-margin': 8px, 70 | 71 | 'spacing': 36px, 72 | 'label-h-align': 48px, 73 | 'input-v-align': -5px, 74 | 75 | 'border-checked-color': $gray, 76 | 'border-focus-color': $positive, 77 | 'border-focus-checked-color': $positive, 78 | 'border-hover-color': $positive, 79 | 'border-hover-checked-color': $positive, 80 | 81 | 'checkicon': '', 82 | 'checkicon-size': 15px 14px, 83 | 84 | 'radioicon': '', 85 | 'radioicon-size': 10px 10px, 86 | 87 | ), 88 | // Validation 89 | 'validation': ( 90 | 91 | 'use-classes': true, 92 | 93 | 'invalid-class': 'invalid', 94 | 'valid-class': 'valid', 95 | 'required-class': 'required', 96 | 97 | 'valid-color': $positive, 98 | 'invalid-color': $warning, 99 | 'required-color': $negative, 100 | 'valid-input-border-color': $positive, 101 | 'invalid-input-border-color': $warning, 102 | 'required-input-border-color': $negative, 103 | 104 | ), 105 | 106 | 107 | ); 108 | -------------------------------------------------------------------------------- /webpack.mix.js: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // slateengine.dev 3 | // ====================================================================== 4 | 5 | const { 6 | mix 7 | } = require('laravel-mix') 8 | const SpritesmithPlugin = require('webpack-spritesmith'); 9 | const FaviconsWebpackPlugin = require('favicons-webpack-plugin'); 10 | 11 | // ====================================================================== 12 | // Mix Settings 13 | // ====================================================================== 14 | 15 | // BrowserSync 16 | // ====================================================================== 17 | mix.browserSync({ 18 | proxy: 'engine.dev', 19 | files: [ 20 | "public/assets/js/**/*.js", 21 | "public/assets/css/**/*.css", 22 | "public/**/*.html" 23 | ] 24 | }) 25 | 26 | // Copy Files 27 | // ====================================================================== 28 | mix.copyDirectory('src/fonts', 'public/assets/fonts'); 29 | mix.copyDirectory('src/images/single', 'public/assets/images'); 30 | 31 | // Javascript 32 | // ====================================================================== 33 | mix.js('src/js/site.js', 'public/assets/js') 34 | 35 | // SASS 36 | // ====================================================================== 37 | mix.sass('src/sass/site.scss', 'public/assets/css', { 38 | includePaths: ["node_modules/slatecore/slate", "node_modules/normalize.css"], 39 | precision: 10 40 | }); 41 | 42 | // Sourcemaps 43 | // ====================================================================== 44 | mix.sourceMaps() 45 | 46 | // ====================================================================== 47 | // Mix Options 48 | // ====================================================================== 49 | mix.options({ 50 | processCssUrls: false, 51 | postCss: [ 52 | require('autoprefixer')(), 53 | ], 54 | }) 55 | 56 | // ====================================================================== 57 | // Custom Webpack Config 58 | // ====================================================================== 59 | mix.webpackConfig({ 60 | plugins: [ 61 | 62 | // Generate Sprites 63 | // ================ 64 | new SpritesmithPlugin({ 65 | src: { 66 | cwd: path.resolve(__dirname, 'src/images/sprites'), 67 | glob: '*.png' 68 | }, 69 | target: { 70 | image: path.resolve(__dirname, 'public/assets/images/sprite.png'), 71 | css: path.resolve(__dirname, 'src/sass/components/partials/_P-sprite.scss') 72 | }, 73 | apiOptions: { 74 | cssImageRef: "/assets/images/sprite.png" 75 | }, 76 | retina: "@2x", 77 | }), 78 | 79 | // Favicons 80 | // ================ 81 | new FaviconsWebpackPlugin({ 82 | // Your source logo 83 | logo: './src/favicon/favicon.svg', 84 | // The prefix for all image files (might be a folder or a name) 85 | prefix: './public/assets/favicon/', 86 | // Emit all stats of the generated icons 87 | emitStats: false, 88 | // The name of the json containing all favicon information 89 | statsFilename: 'iconstats-[hash].json', 90 | // Generate a cache file with control hashes and 91 | // don't rebuild the favicons until those hashes change 92 | persistentCache: true, 93 | // Inject the html into the html-webpack-plugin 94 | inject: false, 95 | // favicon background color (see https://github.com/haydenbleasel/favicons#usage) 96 | background: '#222222', 97 | // favicon app title (see https://github.com/haydenbleasel/favicons#usage) 98 | title: 'Slate Engine', 99 | // which icons should be generated (see https://github.com/haydenbleasel/favicons#usage) 100 | icons: { 101 | android: true, 102 | appleIcon: true, 103 | appleStartup: true, 104 | coast: false, 105 | favicons: true, 106 | firefox: true, 107 | opengraph: false, 108 | twitter: false, 109 | yandex: false, 110 | windows: false 111 | } 112 | }) 113 | ] 114 | }); 115 | -------------------------------------------------------------------------------- /src/sass/config/_config-typography.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Typography Setup 3 | // ====================================================================== 4 | 5 | // Basic Setup 6 | // ====================================================================== 7 | 8 | /// Enable Type Debug 9 | $type-debug: false; 10 | 11 | // Basic Setup 12 | // ====================================================================== 13 | 14 | /// Set Global Font size 15 | $global-base-font-size: 16px; 16 | 17 | /// Set Global Line height 18 | $global-line-height: 1.5; 19 | 20 | /// Set Global REM Fallback 21 | $rem-fallback: true; 22 | 23 | /// Set Global PX units only 24 | $rem-px-only: false; 25 | 26 | /// Set Global line-heights with no units 27 | $unitless-lineheight: true; 28 | 29 | /// The ratio used to generate sizes and margins on heading tags 30 | $type-ratio: $perfect-fourth; 31 | 32 | /// Toggle percenatage based font scaling based on screen size. 33 | $responsive-text: true; 34 | 35 | /// Global Font Smoothing 36 | $webkit-smoothing: antialiased; 37 | 38 | // Modular Steps 39 | // ====================================================================== 40 | 41 | /// Modular Stepping Multipliers 42 | $modular-step-alpha: 5; 43 | $modular-step-beta: 4; 44 | $modular-step-gamma: 3; 45 | $modular-step-delta: 2; 46 | $modular-step-epsilon: 1; 47 | $modular-step-zeta: 0; 48 | $modular-step-eta: -1; 49 | $modular-step-theta: -2; 50 | $modular-step-iota: -3; 51 | 52 | // Font Weights 53 | // ====================================================================== 54 | 55 | /// Thin 56 | $thin: 100; 57 | 58 | /// Extra light 59 | $extralight: 200; 60 | 61 | /// Light 62 | $light: 300; 63 | 64 | /// Regular 65 | $regular: 400; 66 | 67 | /// Medium 68 | $medium: 500; 69 | 70 | /// Semibold 71 | $semibold: 600; 72 | 73 | /// Bold 74 | $bold: 700; 75 | 76 | /// Extra Bold 77 | $extra-bold: 800; 78 | 79 | /// Black 80 | $black: 900; 81 | 82 | // Global font styles 83 | // ====================================================================== 84 | 85 | /// Global Font Stack 86 | $global-font-stack: $gillsans; 87 | 88 | /// Global Font Weight 89 | $global-font-weight: $light; 90 | 91 | /// Global Font Color 92 | $global-font-color: $dark; 93 | 94 | // Global heading font styles 95 | // ====================================================================== 96 | 97 | /// Heading Font Stack 98 | $global-heading-stack: $gillsans; 99 | 100 | /// Heading Font Color 101 | $global-heading-weight: $semibold; 102 | 103 | /// Heading Font Weight 104 | $global-heading-color: $jet; 105 | 106 | /// Custom Font Path 107 | $custom-font-path: '/assets/fonts/'; 108 | 109 | // Links 110 | // ====================================================================== 111 | 112 | /// Link Color 113 | $link: $primary; 114 | 115 | /// Link Hover Color 116 | $link-hover: $primary; 117 | 118 | /// Link Hover Color 119 | $link-hover-decoration: none; 120 | 121 | // Horizontal Rules 122 | // ====================================================================== 123 | 124 | /// Horizontal Rule color and thickness 125 | $global-hr-style: 1px solid $primary; 126 | 127 | // ====================================================================== 128 | // Responsive type scaling (set $responsive-text true for this) 129 | // Numbers match $perfect-fourth. Recalculate them for other ratios. 130 | // ====================================================================== 131 | 132 | /// Base responsive font size for screens under $bp-tiny 133 | $rt-bp-base: 50%; // 8px 134 | 135 | /// Responsive font size for screens between $bp-tiny and $bp-xsmall 136 | $rt-bp-tiny: 62.5%; // 10px 137 | 138 | /// Responsive font size for screens between $bp-xsmall and $bp-small 139 | $rt-bp-xsmall: 75%; // 12px 140 | 141 | /// Responsive font size for screens between $bp-xmall and $bp-medium 142 | $rt-bp-small: 87.5%; // 14px 143 | 144 | /// Responsive font size for screens between $bp-medium and $bp-large 145 | $rt-bp-medium: 100%; // 16px 146 | 147 | /// Responsive font size for screens between $bp-large and $bp-xl 148 | $rt-bp-large: 125%; // 20px 149 | 150 | /// Responsive font size for screens between $bp-xl and above. 151 | $rt-bp-xl: 137.5%; // 22px 152 | -------------------------------------------------------------------------------- /src/sass/components/partials/_P-sprite.scss: -------------------------------------------------------------------------------- 1 | // SCSS variables are information about icon's compiled state, stored under its original file name 2 | // 3 | // .icon-home { 4 | // width: $icon-home-width; 5 | // } 6 | // 7 | // The large array-like variables contain all information about a single icon 8 | // $icon-home: x y offset_x offset_y width height total_width total_height image_path; 9 | // 10 | // At the bottom of this section, we provide information about the spritesheet itself 11 | // $spritesheet: width height image $spritesheet-sprites; 12 | $spritesheet-width: 0px; 13 | $spritesheet-height: 0px; 14 | $spritesheet-image: '/assets/images/sprite.png'; 15 | $spritesheet-sprites: (); 16 | $spritesheet: (0px, 0px, '/assets/images/sprite.png', $spritesheet-sprites, ); 17 | $retina-spritesheet-width: 0px; 18 | $retina-spritesheet-height: 0px; 19 | $retina-spritesheet-image: '/assets/images/sprite@2x.png'; 20 | $retina-spritesheet-sprites: (); 21 | $retina-spritesheet: (0px, 0px, '/assets/images/sprite@2x.png', $retina-spritesheet-sprites, ); 22 | 23 | // These "retina group" variables are mappings for the naming and pairing of normal and retina sprites. 24 | // 25 | // The list formatted variables are intended for mixins like `retina-sprite` and `retina-sprites`. 26 | $retina-groups: (); 27 | 28 | // The provided mixins are intended to be used with the array-like variables 29 | // 30 | // .icon-home { 31 | // @include sprite-width($icon-home); 32 | // } 33 | // 34 | // .icon-email { 35 | // @include sprite($icon-email); 36 | // } 37 | // 38 | // Example usage in HTML: 39 | // 40 | // `display: block` sprite: 41 | //
42 | // 43 | // To change `display` (e.g. `display: inline-block;`), we suggest using a common CSS class: 44 | // 45 | // // CSS 46 | // .icon { 47 | // display: inline-block; 48 | // } 49 | // 50 | // // HTML 51 | // 52 | @mixin sprite-width($sprite) { 53 | width: nth($sprite, 5); 54 | } 55 | 56 | @mixin sprite-height($sprite) { 57 | height: nth($sprite, 6); 58 | } 59 | 60 | @mixin sprite-position($sprite) { 61 | $sprite-offset-x: nth($sprite, 3); 62 | $sprite-offset-y: nth($sprite, 4); 63 | background-position: $sprite-offset-x $sprite-offset-y; 64 | } 65 | 66 | @mixin sprite-image($sprite) { 67 | $sprite-image: nth($sprite, 9); 68 | background-image: url(#{$sprite-image}); 69 | } 70 | 71 | @mixin sprite($sprite) { 72 | @include sprite-image($sprite); 73 | @include sprite-position($sprite); 74 | @include sprite-width($sprite); 75 | @include sprite-height($sprite); 76 | } 77 | 78 | // The `retina-sprite` mixin sets up rules and a media query for a sprite/retina sprite. 79 | // It should be used with a "retina group" variable. 80 | // 81 | // The media query is from CSS Tricks: https://css-tricks.com/snippets/css/retina-display-media-query/ 82 | // 83 | // $icon-home-group: ('icon-home', $icon-home, $icon-home-2x, ); 84 | // 85 | // .icon-home { 86 | // @include retina-sprite($icon-home-group); 87 | // } 88 | @mixin sprite-background-size($sprite) { 89 | $sprite-total-width: nth($sprite, 7); 90 | $sprite-total-height: nth($sprite, 8); 91 | background-size: $sprite-total-width $sprite-total-height; 92 | } 93 | 94 | @mixin retina-sprite($retina-group) { 95 | $normal-sprite: nth($retina-group, 2); 96 | $retina-sprite: nth($retina-group, 3); 97 | @include sprite($normal-sprite); 98 | 99 | @media (-webkit-min-device-pixel-ratio: 2), 100 | (min-resolution: 192dpi) { 101 | @include sprite-image($retina-sprite); 102 | @include sprite-background-size($normal-sprite); 103 | } 104 | } 105 | 106 | // The `sprites` mixin generates identical output to the CSS template 107 | // but can be overridden inside of SCSS 108 | // 109 | // @include sprites($spritesheet-sprites); 110 | @mixin sprites($sprites) { 111 | @each $sprite in $sprites { 112 | $sprite-name: nth($sprite, 10); 113 | .#{$sprite-name} { 114 | @include sprite($sprite); 115 | } 116 | } 117 | } 118 | 119 | // The `retina-sprites` mixin generates a CSS rule and media query for retina groups 120 | // This yields the same output as CSS retina template but can be overridden in SCSS 121 | // 122 | // @include retina-sprites($retina-groups); 123 | @mixin retina-sprites($retina-groups) { 124 | @each $retina-group in $retina-groups { 125 | $sprite-name: nth($retina-group, 1); 126 | .#{$sprite-name} { 127 | @include retina-sprite($retina-group); 128 | } 129 | } 130 | } 131 | -------------------------------------------------------------------------------- /public/assets/js/site.js: -------------------------------------------------------------------------------- 1 | /******/ (function(modules) { // webpackBootstrap 2 | /******/ // The module cache 3 | /******/ var installedModules = {}; 4 | /******/ 5 | /******/ // The require function 6 | /******/ function __webpack_require__(moduleId) { 7 | /******/ 8 | /******/ // Check if module is in cache 9 | /******/ if(installedModules[moduleId]) { 10 | /******/ return installedModules[moduleId].exports; 11 | /******/ } 12 | /******/ // Create a new module (and put it into the cache) 13 | /******/ var module = installedModules[moduleId] = { 14 | /******/ i: moduleId, 15 | /******/ l: false, 16 | /******/ exports: {} 17 | /******/ }; 18 | /******/ 19 | /******/ // Execute the module function 20 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 | /******/ 22 | /******/ // Flag the module as loaded 23 | /******/ module.l = true; 24 | /******/ 25 | /******/ // Return the exports of the module 26 | /******/ return module.exports; 27 | /******/ } 28 | /******/ 29 | /******/ 30 | /******/ // expose the modules object (__webpack_modules__) 31 | /******/ __webpack_require__.m = modules; 32 | /******/ 33 | /******/ // expose the module cache 34 | /******/ __webpack_require__.c = installedModules; 35 | /******/ 36 | /******/ // define getter function for harmony exports 37 | /******/ __webpack_require__.d = function(exports, name, getter) { 38 | /******/ if(!__webpack_require__.o(exports, name)) { 39 | /******/ Object.defineProperty(exports, name, { 40 | /******/ configurable: false, 41 | /******/ enumerable: true, 42 | /******/ get: getter 43 | /******/ }); 44 | /******/ } 45 | /******/ }; 46 | /******/ 47 | /******/ // getDefaultExport function for compatibility with non-harmony modules 48 | /******/ __webpack_require__.n = function(module) { 49 | /******/ var getter = module && module.__esModule ? 50 | /******/ function getDefault() { return module['default']; } : 51 | /******/ function getModuleExports() { return module; }; 52 | /******/ __webpack_require__.d(getter, 'a', getter); 53 | /******/ return getter; 54 | /******/ }; 55 | /******/ 56 | /******/ // Object.prototype.hasOwnProperty.call 57 | /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; 58 | /******/ 59 | /******/ // __webpack_public_path__ 60 | /******/ __webpack_require__.p = "/"; 61 | /******/ 62 | /******/ // Load entry module and return exports 63 | /******/ return __webpack_require__(__webpack_require__.s = 0); 64 | /******/ }) 65 | /************************************************************************/ 66 | /******/ ([ 67 | /* 0 */ 68 | /***/ (function(module, exports, __webpack_require__) { 69 | 70 | __webpack_require__(1); 71 | module.exports = __webpack_require__(2); 72 | 73 | 74 | /***/ }), 75 | /* 1 */ 76 | /***/ (function(module, exports) { 77 | 78 | eval("// ======================================================================\n// Some Project http://yourdomain.com | you@domain.com\n// ======================================================================\n\n// window.$ = window.jQuery = require('jquery');\n// require any further scripts here ie:\n// require('npmpackagename');\n// require('./mylocalfile.js');\n\n// ======================================================================\n// Custom Javascript\n// ======================================================================//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9zcmMvanMvc2l0ZS5qcz8wNmI0Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBO0FBQ0E7QUFDQTs7QUFFQTtBQUNBO0FBQ0E7QUFDQTs7QUFFQTtBQUNBO0FBQ0EiLCJmaWxlIjoiMS5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT1cbi8vIFNvbWUgUHJvamVjdCBodHRwOi8veW91cmRvbWFpbi5jb20gfCB5b3VAZG9tYWluLmNvbVxuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuXG4vLyB3aW5kb3cuJCA9IHdpbmRvdy5qUXVlcnkgPSByZXF1aXJlKCdqcXVlcnknKTtcbi8vIHJlcXVpcmUgYW55IGZ1cnRoZXIgc2NyaXB0cyBoZXJlIGllOlxuLy8gcmVxdWlyZSgnbnBtcGFja2FnZW5hbWUnKTtcbi8vIHJlcXVpcmUoJy4vbXlsb2NhbGZpbGUuanMnKTtcblxuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gQ3VzdG9tIEphdmFzY3JpcHRcbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT1cblxuXG5cbi8vIFdFQlBBQ0sgRk9PVEVSIC8vXG4vLyAuL3NyYy9qcy9zaXRlLmpzIl0sInNvdXJjZVJvb3QiOiIifQ==\n//# sourceURL=webpack-internal:///1\n"); 79 | 80 | /***/ }), 81 | /* 2 */ 82 | /***/ (function(module, exports) { 83 | 84 | eval("// removed by extract-text-webpack-plugin//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9zcmMvc2Fzcy9zaXRlLnNjc3M/ZTljNyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSIsImZpbGUiOiIyLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLy8gcmVtb3ZlZCBieSBleHRyYWN0LXRleHQtd2VicGFjay1wbHVnaW5cblxuXG4vLy8vLy8vLy8vLy8vLy8vLy9cbi8vIFdFQlBBQ0sgRk9PVEVSXG4vLyAuL3NyYy9zYXNzL3NpdGUuc2Nzc1xuLy8gbW9kdWxlIGlkID0gMlxuLy8gbW9kdWxlIGNodW5rcyA9IDAiXSwic291cmNlUm9vdCI6IiJ9\n//# sourceURL=webpack-internal:///2\n"); 85 | 86 | /***/ }) 87 | /******/ ]); -------------------------------------------------------------------------------- /src/sass/components/global/_G-typography.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Typography 3 | // ====================================================================== 4 | // ====================================================================== 5 | // Root 6 | // ====================================================================== 7 | 8 | :root { 9 | @include responsive-type; 10 | } 11 | // ====================================================================== 12 | // HTML 13 | // ====================================================================== 14 | 15 | html { 16 | @include baseline; 17 | @include rem-baseline(100%); 18 | line-height: $global-line-height; 19 | color: $global-font-color; 20 | font-family: $global-font-stack; 21 | font-weight: $global-font-weight; 22 | -webkit-font-smoothing: $webkit-smoothing; 23 | text-rendering: optimizeLegibility; 24 | } 25 | // ====================================================================== 26 | // Headings 27 | // ====================================================================== 28 | 29 | h1 { 30 | @include type-modular(gamma); 31 | // @include type-free(42px, 24px, 48px, 48px, true); 32 | } 33 | 34 | h2 { 35 | @include type-modular(delta); 36 | // @include type-free(32px, 24px, 24px, 48px, true); 37 | } 38 | 39 | h3 { 40 | @include type-modular(epsilon, $global-base-font-size * $global-line-height, 0); 41 | // @include type-free(24px, 24px, 24px, 48px, true); 42 | } 43 | 44 | h4, 45 | h5, 46 | h6 { 47 | @include type-modular(zeta, $global-base-font-size * $global-line-height, 0); 48 | // @include type-free($global-base-font-size, 24px, 0, 24px, true); 49 | } 50 | 51 | h1, 52 | h2, 53 | h3, 54 | h4, 55 | h5, 56 | h6 { 57 | color: $global-heading-color; 58 | font-family: $global-heading-stack; 59 | font-weight: $global-heading-weight; 60 | } 61 | // ====================================================================== 62 | // Paragraphs 63 | // ====================================================================== 64 | 65 | p { 66 | @include type-modular(zeta, 0, $global-base-font-size * $global-line-height); 67 | // @include type-free($global-base-font-size, 0, 24px, 24px, true); 68 | } 69 | // ====================================================================== 70 | // Lists 71 | // ====================================================================== 72 | 73 | ol, 74 | ul { 75 | @include type-modular(zeta); 76 | // @include type-free($global-base-font-size, 0, 24px, 24px, true); 77 | ol { 78 | margin-bottom: 0; 79 | margin-top: 0; 80 | } 81 | 82 | ul { 83 | margin-bottom: 0; 84 | margin-top: 0; 85 | } 86 | } 87 | 88 | dl { 89 | @include type-modular(zeta); 90 | // @include type-free($global-base-font-size, 0, 24px, 24px, true); 91 | dt { 92 | font-weight: $semibold; 93 | } 94 | 95 | dd { 96 | font-style: italic; 97 | } 98 | } 99 | // ====================================================================== 100 | // Tables 101 | // ====================================================================== 102 | 103 | table { 104 | @include table($default-table); 105 | } 106 | // ====================================================================== 107 | // Quotes 108 | // ====================================================================== 109 | 110 | blockquote { 111 | @include rem(padding, 18px); 112 | font-style: italic; 113 | margin: 0; 114 | background-color: #eee; 115 | 116 | p { 117 | @include type-modular(zeta, 0, 0); 118 | // @include type-free($global-base-font-size, 0, 0, 24px, true); 119 | } 120 | } 121 | 122 | blockquote > p { 123 | padding: 0; 124 | } 125 | // ====================================================================== 126 | // Misc 127 | // ====================================================================== 128 | 129 | a { 130 | color: $link; 131 | text-decoration: none; 132 | 133 | &:hover { 134 | color: $link-hover; 135 | text-decoration: $link-hover-decoration; 136 | } 137 | } 138 | 139 | hr { 140 | border: 0; 141 | border-top: $global-hr-style; 142 | display: block; 143 | height: 1px; 144 | padding: 0; 145 | } 146 | 147 | sub, 148 | sup { 149 | position: relative; 150 | top: -.4rem; 151 | vertical-align: baseline; 152 | } 153 | 154 | sub { 155 | top: .4rem; 156 | } 157 | 158 | b { 159 | line-height: 1; 160 | } 161 | 162 | small { 163 | line-height: 1; 164 | } 165 | 166 | strong { 167 | font-weight: $semibold; 168 | color: $dark; 169 | } 170 | 171 | cite, 172 | dfn, 173 | em, 174 | q { 175 | line-height: $global-line-height; 176 | } 177 | 178 | code { 179 | @include type-free(14px, 0, 24px, 24px, true); 180 | } 181 | 182 | kbd { 183 | margin-bottom: 1px; 184 | padding: 0; 185 | position: relative; 186 | top: -1px; 187 | } 188 | 189 | pre { 190 | @include rem(padding, 12px) @include rem(border-radius, 4px); 191 | @include type-free(14px, 0, 24px, 24px, true); 192 | background-color: $dark; 193 | color: $bright; 194 | font-weight: $bold; 195 | font-family: $terminal; 196 | white-space: pre; 197 | word-break: break-all; 198 | word-wrap: break-word; 199 | white-space: pre-wrap; 200 | white-space: pre\9; 201 | } 202 | -------------------------------------------------------------------------------- /public/assets/favicon/.cache: -------------------------------------------------------------------------------- 1 | {"hash":"7121789690ddd8fa5e574fd51381ef64","version":"0.0.9","optionHash":"4452bae3ba1718ecf400668da6c0cb1e","result":{"outputFilePrefix":"./public/assets/favicon/","html":["","","","","","","","","","","","","","","","","","","","","","","","","","","",""],"files":["./public/assets/favicon/apple-touch-icon-76x76.png","./public/assets/favicon/apple-touch-icon.png","./public/assets/favicon/apple-touch-icon-72x72.png","./public/assets/favicon/apple-touch-icon-60x60.png","./public/assets/favicon/apple-touch-icon-180x180.png","./public/assets/favicon/apple-touch-icon-precomposed.png","./public/assets/favicon/apple-touch-icon-57x57.png","./public/assets/favicon/apple-touch-icon-114x114.png","./public/assets/favicon/apple-touch-icon-120x120.png","./public/assets/favicon/apple-touch-icon-152x152.png","./public/assets/favicon/apple-touch-icon-167x167.png","./public/assets/favicon/apple-touch-icon-144x144.png","./public/assets/favicon/favicon-16x16.png","./public/assets/favicon/favicon-32x32.png","./public/assets/favicon/favicon.ico","./public/assets/favicon/android-chrome-256x256.png","./public/assets/favicon/android-chrome-72x72.png","./public/assets/favicon/android-chrome-96x96.png","./public/assets/favicon/android-chrome-36x36.png","./public/assets/favicon/android-chrome-48x48.png","./public/assets/favicon/android-chrome-192x192.png","./public/assets/favicon/android-chrome-144x144.png","./public/assets/favicon/android-chrome-384x384.png","./public/assets/favicon/android-chrome-512x512.png","./public/assets/favicon/firefox_app_60x60.png","./public/assets/favicon/firefox_app_128x128.png","./public/assets/favicon/firefox_app_512x512.png","./public/assets/favicon/apple-touch-startup-image-320x460.png","./public/assets/favicon/apple-touch-startup-image-640x920.png","./public/assets/favicon/apple-touch-startup-image-748x1024.png","./public/assets/favicon/apple-touch-startup-image-768x1004.png","./public/assets/favicon/apple-touch-startup-image-640x1096.png","./public/assets/favicon/apple-touch-startup-image-750x1294.png","./public/assets/favicon/apple-touch-startup-image-1182x2208.png","./public/assets/favicon/apple-touch-startup-image-1242x2148.png","./public/assets/favicon/apple-touch-startup-image-1536x2008.png","./public/assets/favicon/apple-touch-startup-image-1496x2048.png","./public/assets/favicon/manifest.json","./public/assets/favicon/manifest.webapp"]}} -------------------------------------------------------------------------------- /src/favicon/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Favicon 5 | Created with Sketch. 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /src/sass/config/_config-buttons.scss: -------------------------------------------------------------------------------- 1 | // ====================================================================== 2 | // Buttons 3 | // ====================================================================== 4 | 5 | // Button Themes 6 | // ---------------------------------------------------------------------- 7 | 8 | // Default Button Theme 9 | $button-default: ( 10 | 11 | use-borders: true, 12 | 13 | default: $primary, 14 | hover: darken($primary, 15%), 15 | focus: darken($primary, 20%), 16 | active: darken($primary, 10%), 17 | disabled: $disabled, 18 | 19 | font-family: inherit, 20 | textlight: $bright, 21 | textdark: $dark, 22 | textweight: $semibold, 23 | font-size: $global-base-font-size, 24 | textalign: center, 25 | text-transform: uppercase, 26 | 27 | border-left: 2px solid $medium, 28 | border-right: 2px solid $medium, 29 | border-top: 2px solid $medium, 30 | border-bottom: 2px solid $medium, 31 | 32 | border-hover-left: 2px solid $dark, 33 | border-hover-right: 2px solid $dark, 34 | border-hover-top: 2px solid $dark, 35 | border-hover-bottom: 2px solid $dark, 36 | 37 | border-focus-left: 2px solid $dark, 38 | border-focus-right: 2px solid $dark, 39 | border-focus-top: 2px solid $dark, 40 | border-focus-bottom: 2px solid $dark, 41 | 42 | border-disabled-left: 2px solid darken($disabled, 20%), 43 | border-disabled-right: 2px solid darken($disabled, 20%), 44 | border-disabled-top: 2px solid darken($disabled, 20%), 45 | border-disabled-bottom: 2px solid darken($disabled, 20%), 46 | 47 | height: 50px, 48 | margin: 0 0 27px 0, 49 | padding: 0 9px, 50 | rounded: 0, 51 | 52 | display: inline-block, 53 | boxsizing: content-box 54 | 55 | ); 56 | 57 | // Positive Button Theme 58 | $button-positive: ( 59 | 60 | use-borders: true, 61 | 62 | default: $positive, 63 | hover: darken($positive, 15%), 64 | focus: darken($positive, 20%), 65 | active: darken($positive, 10%), 66 | disabled: $disabled, 67 | 68 | font-family: inherit, 69 | textlight: $bright, 70 | textdark: $dark, 71 | textweight: $semibold, 72 | font-size: $global-base-font-size, 73 | textalign: center, 74 | text-transform: uppercase, 75 | 76 | border-left: 2px solid darken($positive, 10%), 77 | border-right: 2px solid darken($positive, 10%), 78 | border-top: 2px solid darken($positive, 10%), 79 | border-bottom: 2px solid darken($positive, 10%), 80 | 81 | border-hover-left: 2px solid darken($positive, 15%), 82 | border-hover-right: 2px solid darken($positive, 15%), 83 | border-hover-top: 2px solid darken($positive, 15%), 84 | border-hover-bottom: 2px solid darken($positive, 15%), 85 | 86 | border-focus-left: 2px solid $dark, 87 | border-focus-right: 2px solid $dark, 88 | border-focus-top: 2px solid $dark, 89 | border-focus-bottom: 2px solid $dark, 90 | 91 | border-disabled-left: 2px solid darken($disabled, 20%), 92 | border-disabled-right: 2px solid darken($disabled, 20%), 93 | border-disabled-top: 2px solid darken($disabled, 20%), 94 | border-disabled-bottom: 2px solid darken($disabled, 20%), 95 | 96 | height: 50px, 97 | margin: 0 0 27px 0, 98 | padding: 0 9px, 99 | rounded: 0, 100 | 101 | display: inline-block, 102 | boxsizing: content-box 103 | 104 | ); 105 | 106 | // Negative Button Theme 107 | $button-negative: ( 108 | 109 | use-borders: true, 110 | 111 | default: $negative, 112 | hover: darken($negative, 15%), 113 | focus: darken($negative, 20%), 114 | active: darken($negative, 10%), 115 | disabled: $disabled, 116 | 117 | font-family: inherit, 118 | textlight: $bright, 119 | textdark: $dark, 120 | textweight: $semibold, 121 | font-size: $global-base-font-size, 122 | textalign: center, 123 | text-transform: uppercase, 124 | 125 | border-left: 2px solid darken($negative, 10%), 126 | border-right: 2px solid darken($negative, 10%), 127 | border-top: 2px solid darken($negative, 10%), 128 | border-bottom: 2px solid darken($negative, 10%), 129 | 130 | border-hover-left: 2px solid darken($negative, 15%), 131 | border-hover-right: 2px solid darken($negative, 15%), 132 | border-hover-top: 2px solid darken($negative, 15%), 133 | border-hover-bottom: 2px solid darken($negative, 15%), 134 | 135 | border-focus-left: 2px solid $dark, 136 | border-focus-right: 2px solid $dark, 137 | border-focus-top: 2px solid $dark, 138 | border-focus-bottom: 2px solid $dark, 139 | 140 | border-disabled-left: 2px solid darken($disabled, 20%), 141 | border-disabled-right: 2px solid darken($disabled, 20%), 142 | border-disabled-top: 2px solid darken($disabled, 20%), 143 | border-disabled-bottom: 2px solid darken($disabled, 20%), 144 | 145 | height: 50px, 146 | margin: 0 0 27px 0, 147 | padding: 0 9px, 148 | rounded: 0, 149 | 150 | display: inline-block, 151 | boxsizing: content-box 152 | 153 | ); 154 | 155 | // Gradient Button Theme 156 | $button-gradient: ( 157 | 158 | use-borders: true, 159 | 160 | font-family: inherit, 161 | textlight: $bright, 162 | textdark: $dark, 163 | textweight: $semibold, 164 | font-size: $global-base-font-size, 165 | textalign: center, 166 | text-transform: uppercase, 167 | 168 | height: 50px, 169 | margin: 0 0 27px 0, 170 | padding: 0 9px, 171 | rounded: 0, 172 | 173 | display: inline-block, 174 | boxsizing: content-box, 175 | 176 | mode: 'ttb', 177 | start-pos: 0%, 178 | end-pos: 100%, 179 | 180 | // Default Colors 181 | start-color: $gradient-start, 182 | end-color: $gradient-end, 183 | // Hover Colors 184 | start-color-hover: $gradient-start, 185 | end-color-hover: darken($gradient-end, 10%), 186 | // Focus Colors 187 | start-color-focus: $gradient-start, 188 | end-color-focus: darken($gradient-end, 10%), 189 | // Active Colors 190 | start-color-active: $gradient-start, 191 | end-color-active: darken($gradient-end, 10%), 192 | // Disabled Colors 193 | start-color-disabled: $disabled, 194 | end-color-disabled: darken($disabled, 30%), 195 | 196 | border-left: 2px solid darken($gradient-start, 10%), 197 | border-right: 2px solid darken($gradient-start, 10%), 198 | border-top: 2px solid darken($gradient-start, 10%), 199 | border-bottom: 2px solid darken($gradient-start, 10%), 200 | 201 | border-hover-left: 2px solid darken($gradient-start, 15%), 202 | border-hover-right: 2px solid darken($gradient-start, 15%), 203 | border-hover-top: 2px solid darken($gradient-start, 15%), 204 | border-hover-bottom: 2px solid darken($gradient-start, 15%), 205 | 206 | border-focus-left: 2px solid $dark, 207 | border-focus-right: 2px solid $dark, 208 | border-focus-top: 2px solid $dark, 209 | border-focus-bottom: 2px solid $dark, 210 | 211 | border-disabled-left: 2px solid darken($disabled, 20%), 212 | border-disabled-right: 2px solid darken($disabled, 20%), 213 | border-disabled-top: 2px solid darken($disabled, 20%), 214 | border-disabled-bottom: 2px solid darken($disabled, 20%), 215 | 216 | ); 217 | 218 | // Button Icons 219 | // ---------------------------------------------------------------------- 220 | 221 | // Button Icon Display 222 | $button-icons-display: inline-block; 223 | 224 | // Button Icon Left Spacing 225 | $button-icons-left-spacing: 0 8px 0 4px; 226 | 227 | // Button Icon Right Spacing 228 | $button-icons-right-spacing: 0 8px 0 4px; 229 | 230 | // Button Icon Weight 231 | $button-icons-weight: $semibold; 232 | 233 | // Button Math Icons 234 | $button-icons-math: false; 235 | 236 | // Button Solid Arrows Icons 237 | $button-icons-solid-arrows: false; 238 | 239 | // Button Dashed Arrows Icons 240 | $button-icons-dashed-arrows: false; 241 | 242 | // Button Dashed Chevrons 243 | $button-icons-chevrons: false; 244 | -------------------------------------------------------------------------------- /public/assets/css/site.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ 2 | /* Document 3 | ========================================================================== */ 4 | /** 5 | * 1. Correct the line height in all browsers. 6 | * 2. Prevent adjustments of font size after orientation changes in iOS. 7 | */ 8 | html { 9 | line-height: 1.15; 10 | /* 1 */ 11 | -webkit-text-size-adjust: 100%; 12 | /* 2 */ 13 | } 14 | 15 | /* Sections 16 | ========================================================================== */ 17 | /** 18 | * Remove the margin in all browsers. 19 | */ 20 | body { 21 | margin: 0; 22 | } 23 | 24 | /** 25 | * Correct the font size and margin on `h1` elements within `section` and 26 | * `article` contexts in Chrome, Firefox, and Safari. 27 | */ 28 | h1 { 29 | font-size: 2em; 30 | margin: 0.67em 0; 31 | } 32 | 33 | /* Grouping content 34 | ========================================================================== */ 35 | /** 36 | * 1. Add the correct box sizing in Firefox. 37 | * 2. Show the overflow in Edge and IE. 38 | */ 39 | hr { 40 | -webkit-box-sizing: content-box; 41 | box-sizing: content-box; 42 | /* 1 */ 43 | height: 0; 44 | /* 1 */ 45 | overflow: visible; 46 | /* 2 */ 47 | } 48 | 49 | /** 50 | * 1. Correct the inheritance and scaling of font size in all browsers. 51 | * 2. Correct the odd `em` font sizing in all browsers. 52 | */ 53 | pre { 54 | font-family: monospace, monospace; 55 | /* 1 */ 56 | font-size: 1em; 57 | /* 2 */ 58 | } 59 | 60 | /* Text-level semantics 61 | ========================================================================== */ 62 | /** 63 | * Remove the gray background on active links in IE 10. 64 | */ 65 | a { 66 | background-color: transparent; 67 | } 68 | 69 | /** 70 | * 1. Remove the bottom border in Chrome 57- 71 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 72 | */ 73 | abbr[title] { 74 | border-bottom: none; 75 | /* 1 */ 76 | text-decoration: underline; 77 | /* 2 */ 78 | -webkit-text-decoration: underline dotted; 79 | text-decoration: underline dotted; 80 | /* 2 */ 81 | } 82 | 83 | /** 84 | * Add the correct font weight in Chrome, Edge, and Safari. 85 | */ 86 | b, 87 | strong { 88 | font-weight: bolder; 89 | } 90 | 91 | /** 92 | * 1. Correct the inheritance and scaling of font size in all browsers. 93 | * 2. Correct the odd `em` font sizing in all browsers. 94 | */ 95 | code, 96 | kbd, 97 | samp { 98 | font-family: monospace, monospace; 99 | /* 1 */ 100 | font-size: 1em; 101 | /* 2 */ 102 | } 103 | 104 | /** 105 | * Add the correct font size in all browsers. 106 | */ 107 | small { 108 | font-size: 80%; 109 | } 110 | 111 | /** 112 | * Prevent `sub` and `sup` elements from affecting the line height in 113 | * all browsers. 114 | */ 115 | sub, 116 | sup { 117 | font-size: 75%; 118 | line-height: 0; 119 | position: relative; 120 | vertical-align: baseline; 121 | } 122 | 123 | sub { 124 | bottom: -0.25em; 125 | } 126 | 127 | sup { 128 | top: -0.5em; 129 | } 130 | 131 | /* Embedded content 132 | ========================================================================== */ 133 | /** 134 | * Remove the border on images inside links in IE 10. 135 | */ 136 | img { 137 | border-style: none; 138 | } 139 | 140 | /* Forms 141 | ========================================================================== */ 142 | /** 143 | * 1. Change the font styles in all browsers. 144 | * 2. Remove the margin in Firefox and Safari. 145 | */ 146 | button, 147 | input, 148 | optgroup, 149 | select, 150 | textarea { 151 | font-family: inherit; 152 | /* 1 */ 153 | font-size: 100%; 154 | /* 1 */ 155 | line-height: 1.15; 156 | /* 1 */ 157 | margin: 0; 158 | /* 2 */ 159 | } 160 | 161 | /** 162 | * Show the overflow in IE. 163 | * 1. Show the overflow in Edge. 164 | */ 165 | button, 166 | input { 167 | /* 1 */ 168 | overflow: visible; 169 | } 170 | 171 | /** 172 | * Remove the inheritance of text transform in Edge, Firefox, and IE. 173 | * 1. Remove the inheritance of text transform in Firefox. 174 | */ 175 | button, 176 | select { 177 | /* 1 */ 178 | text-transform: none; 179 | } 180 | 181 | /** 182 | * Correct the inability to style clickable types in iOS and Safari. 183 | */ 184 | button, 185 | [type="button"], 186 | [type="reset"], 187 | [type="submit"] { 188 | -webkit-appearance: button; 189 | } 190 | 191 | /** 192 | * Remove the inner border and padding in Firefox. 193 | */ 194 | button::-moz-focus-inner, 195 | [type="button"]::-moz-focus-inner, 196 | [type="reset"]::-moz-focus-inner, 197 | [type="submit"]::-moz-focus-inner { 198 | border-style: none; 199 | padding: 0; 200 | } 201 | 202 | /** 203 | * Restore the focus styles unset by the previous rule. 204 | */ 205 | button:-moz-focusring, 206 | [type="button"]:-moz-focusring, 207 | [type="reset"]:-moz-focusring, 208 | [type="submit"]:-moz-focusring { 209 | outline: 1px dotted ButtonText; 210 | } 211 | 212 | /** 213 | * Correct the padding in Firefox. 214 | */ 215 | fieldset { 216 | padding: 0.35em 0.75em 0.625em; 217 | } 218 | 219 | /** 220 | * 1. Correct the text wrapping in Edge and IE. 221 | * 2. Correct the color inheritance from `fieldset` elements in IE. 222 | * 3. Remove the padding so developers are not caught out when they zero out 223 | * `fieldset` elements in all browsers. 224 | */ 225 | legend { 226 | -webkit-box-sizing: border-box; 227 | box-sizing: border-box; 228 | /* 1 */ 229 | color: inherit; 230 | /* 2 */ 231 | display: table; 232 | /* 1 */ 233 | max-width: 100%; 234 | /* 1 */ 235 | padding: 0; 236 | /* 3 */ 237 | white-space: normal; 238 | /* 1 */ 239 | } 240 | 241 | /** 242 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 243 | */ 244 | progress { 245 | vertical-align: baseline; 246 | } 247 | 248 | /** 249 | * Remove the default vertical scrollbar in IE 10+. 250 | */ 251 | textarea { 252 | overflow: auto; 253 | } 254 | 255 | /** 256 | * 1. Add the correct box sizing in IE 10. 257 | * 2. Remove the padding in IE 10. 258 | */ 259 | [type="checkbox"], 260 | [type="radio"] { 261 | -webkit-box-sizing: border-box; 262 | box-sizing: border-box; 263 | /* 1 */ 264 | padding: 0; 265 | /* 2 */ 266 | } 267 | 268 | /** 269 | * Correct the cursor style of increment and decrement buttons in Chrome. 270 | */ 271 | [type="number"]::-webkit-inner-spin-button, 272 | [type="number"]::-webkit-outer-spin-button { 273 | height: auto; 274 | } 275 | 276 | /** 277 | * 1. Correct the odd appearance in Chrome and Safari. 278 | * 2. Correct the outline style in Safari. 279 | */ 280 | [type="search"] { 281 | -webkit-appearance: textfield; 282 | /* 1 */ 283 | outline-offset: -2px; 284 | /* 2 */ 285 | } 286 | 287 | /** 288 | * Remove the inner padding in Chrome and Safari on macOS. 289 | */ 290 | [type="search"]::-webkit-search-decoration { 291 | -webkit-appearance: none; 292 | } 293 | 294 | /** 295 | * 1. Correct the inability to style clickable types in iOS and Safari. 296 | * 2. Change font properties to `inherit` in Safari. 297 | */ 298 | ::-webkit-file-upload-button { 299 | -webkit-appearance: button; 300 | /* 1 */ 301 | font: inherit; 302 | /* 2 */ 303 | } 304 | 305 | /* Interactive 306 | ========================================================================== */ 307 | /* 308 | * Add the correct display in Edge, IE 10+, and Firefox. 309 | */ 310 | details { 311 | display: block; 312 | } 313 | 314 | /* 315 | * Add the correct display in all browsers. 316 | */ 317 | summary { 318 | display: list-item; 319 | } 320 | 321 | /* Misc 322 | ========================================================================== */ 323 | /** 324 | * Add the correct display in IE 10+. 325 | */ 326 | template { 327 | display: none; 328 | } 329 | 330 | /** 331 | * Add the correct display in IE 10. 332 | */ 333 | [hidden] { 334 | display: none; 335 | } 336 | 337 | html { 338 | -webkit-box-sizing: border-box; 339 | box-sizing: border-box; 340 | } 341 | 342 | html *, html *:before, html *:after { 343 | -webkit-box-sizing: inherit; 344 | box-sizing: inherit; 345 | } 346 | 347 | :root { 348 | font-size: 50%; 349 | } 350 | 351 | @media only screen and (min-width: 320px) { 352 | :root { 353 | font-size: 62.5%; 354 | } 355 | } 356 | 357 | @media only screen and (min-width: 480px) { 358 | :root { 359 | font-size: 75%; 360 | } 361 | } 362 | 363 | @media only screen and (min-width: 640px) { 364 | :root { 365 | font-size: 87.5%; 366 | } 367 | } 368 | 369 | @media only screen and (min-width: 800px) { 370 | :root { 371 | font-size: 100%; 372 | } 373 | } 374 | 375 | @media only screen and (min-width: 960px) { 376 | :root { 377 | font-size: 125%; 378 | } 379 | } 380 | 381 | @media only screen and (min-width: 1140px) { 382 | :root { 383 | font-size: 137.5%; 384 | } 385 | } 386 | 387 | html { 388 | font-size: 100%; 389 | line-height: 1.5; 390 | color: #414141; 391 | font-family: "Gill Sans MT", "Gill Sans", Tahoma, Geneva, sans-serif; 392 | font-weight: 300; 393 | -webkit-font-smoothing: antialiased; 394 | text-rendering: optimizeLegibility; 395 | } 396 | 397 | h1 { 398 | font-size: 37.897488592px; 399 | font-size: 2.368593037rem; 400 | line-height: 1.5; 401 | margin-top: 24px; 402 | margin-top: 1.5rem; 403 | margin-bottom: 24px; 404 | margin-bottom: 1.5rem; 405 | } 406 | 407 | h2 { 408 | font-size: 28.430224px; 409 | font-size: 1.776889rem; 410 | line-height: 1.5; 411 | margin-top: 24px; 412 | margin-top: 1.5rem; 413 | margin-bottom: 24px; 414 | margin-bottom: 1.5rem; 415 | } 416 | 417 | h3 { 418 | font-size: 21.328px; 419 | font-size: 1.333rem; 420 | line-height: 1.5; 421 | margin-top: 24px; 422 | margin-top: 1.5rem; 423 | margin-bottom: 0; 424 | margin-bottom: 0; 425 | } 426 | 427 | h4, 428 | h5, 429 | h6 { 430 | font-size: 16px; 431 | font-size: 1rem; 432 | line-height: 1.5; 433 | margin-top: 24px; 434 | margin-top: 1.5rem; 435 | margin-bottom: 0; 436 | margin-bottom: 0; 437 | } 438 | 439 | h1, 440 | h2, 441 | h3, 442 | h4, 443 | h5, 444 | h6 { 445 | color: #000; 446 | font-family: "Gill Sans MT", "Gill Sans", Tahoma, Geneva, sans-serif; 447 | font-weight: 600; 448 | } 449 | 450 | p { 451 | font-size: 16px; 452 | font-size: 1rem; 453 | line-height: 1.5; 454 | margin-top: 0; 455 | margin-top: 0; 456 | margin-bottom: 24px; 457 | margin-bottom: 1.5rem; 458 | } 459 | 460 | ol, 461 | ul { 462 | font-size: 16px; 463 | font-size: 1rem; 464 | line-height: 1.5; 465 | margin-top: 24px; 466 | margin-top: 1.5rem; 467 | margin-bottom: 24px; 468 | margin-bottom: 1.5rem; 469 | } 470 | 471 | ol ol, 472 | ul ol { 473 | margin-bottom: 0; 474 | margin-top: 0; 475 | } 476 | 477 | ol ul, 478 | ul ul { 479 | margin-bottom: 0; 480 | margin-top: 0; 481 | } 482 | 483 | dl { 484 | font-size: 16px; 485 | font-size: 1rem; 486 | line-height: 1.5; 487 | margin-top: 24px; 488 | margin-top: 1.5rem; 489 | margin-bottom: 24px; 490 | margin-bottom: 1.5rem; 491 | } 492 | 493 | dl dt { 494 | font-weight: 600; 495 | } 496 | 497 | dl dd { 498 | font-style: italic; 499 | } 500 | 501 | table { 502 | border-width: 1px 1px 1px 1px; 503 | border-width: 0.0625rem 0.0625rem 0.0625rem 0.0625rem; 504 | font-family: "Gill Sans MT", "Gill Sans", Tahoma, Geneva, sans-serif; 505 | table-layout: fixed; 506 | border-color: #fff #fff #fff #fff; 507 | border-style: solid solid solid solid; 508 | border-collapse: collapse; 509 | width: 100%; 510 | margin: 24px 0 24px 0; 511 | background: #fff; 512 | } 513 | 514 | table caption { 515 | padding: 24px 0; 516 | padding: 1.5rem 0; 517 | font-size: 22px; 518 | font-size: 1.375rem; 519 | border-width: 0 0 1px 0; 520 | border-width: 0 0 0.0625rem 0; 521 | background: #fff; 522 | font-family: inherit; 523 | font-weight: 700; 524 | color: #414141; 525 | text-align: center; 526 | border-color: #eee #eee #eee #eee; 527 | border-style: solid solid solid solid; 528 | } 529 | 530 | table thead td, 531 | table thead th { 532 | border-width: 1px 1px 1px 1px; 533 | border-width: 0.0625rem 0.0625rem 0.0625rem 0.0625rem; 534 | font-size: 18px; 535 | font-size: 1.125rem; 536 | padding: 16px 0; 537 | padding: 1rem 0; 538 | background: #eee; 539 | font-family: inherit; 540 | font-weight: 300; 541 | color: #414141; 542 | text-align: center; 543 | border-color: #fff #fff #fff #fff; 544 | border-style: solid solid solid solid; 545 | } 546 | 547 | table tbody td { 548 | font-size: 18px; 549 | font-size: 1.125rem; 550 | border-width: 1px 1px 1px 1px; 551 | border-width: 0.0625rem 0.0625rem 0.0625rem 0.0625rem; 552 | padding: 8px 0; 553 | padding: 0.5rem 0; 554 | background: #eee; 555 | font-family: inherit; 556 | font-weight: 300; 557 | color: #414141; 558 | text-align: center; 559 | border-color: #fff #fff #fff #fff; 560 | border-style: solid solid solid solid; 561 | } 562 | 563 | table tbody tr:nth-child(even) td { 564 | background: #fff; 565 | } 566 | 567 | table tbody tr:nth-child(odd) td { 568 | background: #eee; 569 | } 570 | 571 | table tfoot td { 572 | font-size: 18px; 573 | font-size: 1.125rem; 574 | border-width: 1px 1px 1px 1px; 575 | border-width: 0.0625rem 0.0625rem 0.0625rem 0.0625rem; 576 | padding: 8px 0; 577 | padding: 0.5rem 0; 578 | background: #eee; 579 | font-family: inherit; 580 | font-weight: 300; 581 | color: #414141; 582 | text-align: center; 583 | border-color: #fff #fff #fff #fff; 584 | border-style: solid solid solid solid; 585 | } 586 | 587 | blockquote { 588 | padding: 18px; 589 | padding: 1.125rem; 590 | font-style: italic; 591 | margin: 0; 592 | background-color: #eee; 593 | } 594 | 595 | blockquote p { 596 | font-size: 16px; 597 | font-size: 1rem; 598 | line-height: 1.5; 599 | margin-top: 0; 600 | margin-top: 0; 601 | margin-bottom: 0; 602 | margin-bottom: 0; 603 | } 604 | 605 | blockquote > p { 606 | padding: 0; 607 | } 608 | 609 | a { 610 | color: #96def0; 611 | text-decoration: none; 612 | } 613 | 614 | a:hover { 615 | color: #96def0; 616 | text-decoration: none; 617 | } 618 | 619 | hr { 620 | border: 0; 621 | border-top: 1px solid #96def0; 622 | display: block; 623 | height: 1px; 624 | padding: 0; 625 | } 626 | 627 | sub, 628 | sup { 629 | position: relative; 630 | top: -.4rem; 631 | vertical-align: baseline; 632 | } 633 | 634 | sub { 635 | top: .4rem; 636 | } 637 | 638 | b { 639 | line-height: 1; 640 | } 641 | 642 | small { 643 | line-height: 1; 644 | } 645 | 646 | strong { 647 | font-weight: 600; 648 | color: #414141; 649 | } 650 | 651 | cite, 652 | dfn, 653 | em, 654 | q { 655 | line-height: 1.5; 656 | } 657 | 658 | code { 659 | font-size: 14px; 660 | font-size: 0.875rem; 661 | line-height: 1.7142857143; 662 | margin-top: 0; 663 | margin-top: 0; 664 | margin-bottom: 24px; 665 | margin-bottom: 1.5rem; 666 | } 667 | 668 | kbd { 669 | margin-bottom: 1px; 670 | padding: 0; 671 | position: relative; 672 | top: -1px; 673 | } 674 | 675 | pre { 676 | padding: 12px; 677 | padding: 0.75rem; 678 | border-radius: 4px; 679 | border-radius: 0.25rem; 680 | font-size: 14px; 681 | font-size: 0.875rem; 682 | line-height: 1.7142857143; 683 | margin-top: 0; 684 | margin-top: 0; 685 | margin-bottom: 24px; 686 | margin-bottom: 1.5rem; 687 | background-color: #414141; 688 | color: #eee; 689 | font-weight: 700; 690 | font-family: Monaco, "Lucida Sans Typewriter", Consolas, "Courier New", monospace; 691 | white-space: pre; 692 | word-break: break-all; 693 | word-wrap: break-word; 694 | white-space: pre-wrap; 695 | white-space: pre\9; 696 | } 697 | 698 | .middle { 699 | max-width: 1140px; 700 | max-width: 71.25rem; 701 | margin-left: auto; 702 | margin-right: auto; 703 | width: 96%; 704 | } 705 | 706 | .middle:after { 707 | content: ""; 708 | display: table; 709 | clear: both; 710 | } 711 | -------------------------------------------------------------------------------- /public/assets/css/site.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///./node_modules/normalize.css/normalize.css","webpack:///./site.scss","webpack:///./src/sass/components/global/_G-common.scss","webpack:///./node_modules/slatecore/slate/libs/_helpers.scss","webpack:///./src/sass/components/global/_G-typography.scss","webpack:///./node_modules/slatecore/slate/kits/typography/_type-kit.scss","webpack:///./src/sass/config/_config-typography.scss","webpack:///./src/sass/config/_config-colors.scss","webpack:///./src/sass/config/_config-font-stacks.scss","webpack:///./node_modules/slatecore/slate/libs/functions/_type.scss","webpack:///./node_modules/slatecore/slate/libs/functions/_math.scss","webpack:///./node_modules/slatecore/slate/kits/tables/_table-kit.scss","webpack:///./src/sass/config/_config-tables.scss","webpack:///./src/sass/components/layouts/_L-index.scss","webpack:///./src/sass/config/_config-grid.scss","webpack:///./node_modules/slatecore/slate/kits/grids/_grid-kit.scss","webpack:///./node_modules/slatecore/slate/libs/functions/_grid.scss"],"names":[],"mappings":"AAAA,4EAUA,KACE,iBACA,6BAA8B,CAUhC,KACE,QAAS,CAQX,GACE,cACA,cAAgB,CAWlB,GACE,+BAAuB,uBACvB,SACA,gBAAiB,CAQnB,IACE,gCACA,aAAc,CAUhB,EACE,4BAA6B,CAQ/B,YACE,mBACA,0BACA,yCAAiC,iCAOnC,SAEE,kBAAmB,CAQrB,cAGE,gCACA,aAAc,CAOhB,MACE,aAAc,CAQhB,QAEE,cACA,aAAc,CAKhB,IACE,aAAe,CAGjB,IACE,SAAW,CAUb,IACE,iBAAkB,CAWpB,sCAKE,oBACA,eACA,iBACA,QAAS,CAQX,aAEE,gBAAiB,CAQnB,cAEE,mBAAoB,CAOtB,gDAIE,yBAA0B,CAO5B,wHAIE,kBACA,SAAU,CAOZ,4GAIE,6BAA8B,CAOhC,SACE,0BAA8B,CAUhC,OACE,8BAAsB,sBACtB,cACA,cACA,eACA,UACA,kBAAmB,CAOrB,SACE,uBAAwB,CAO1B,SACE,aAAc,CCEhB,6BDQE,8BAAsB,sBACtB,SAAU,CCEZ,kFDOE,WAAY,CCEd,cDOE,6BACA,mBAAoB,CCEtB,yCDME,uBAAwB,CAQ1B,6BACE,0BACA,YAAa,CAUf,QACE,aAAc,CAOhB,QACE,iBAAkB,CCQpB,kBDWE,YAAa,CE/Uf,KCWI,8BAAsB,sBAEtB,gCACI,2BAAmB,mBCX3B,MCgJE,gBAAkD,CA7BhD,yCDnHJ,MCgJE,kBAAkD,CD9InD,CCoHG,yCDtHJ,MCgJE,iBAAkD,CD9InD,CCuHG,yCDzHJ,MCgJE,kBAAkD,CD9InD,CC0HG,yCD5HJ,MCgJE,gBAAkD,CD9InD,CC6HG,yCD/HJ,MCgJE,gBAAkD,CD9InD,CCgIG,0CDlIJ,MCgJE,gBAAkD,CD9InD,CAKD,KCyIE,iBAAkD,iBCtI3B,WCNf,4DCewD,gBFmCvD,mCA1BmB,iCFbM,CAMpC,GDoIgB,yBM1Ie,yBCcsC,wBLwH7B,CD3HxC,MD+HgB,kBEhHkF,mBKZ7B,qBLYgG,qBKZhG,CNApE,GD4He,sBM1Ie,sBCcsC,wBLwH7B,CDtHxC,GD0HgB,mBM5IY,mBCgByC,wBLwH7B,CDjHxC,YDqHgB,kBCzH6D,mBMHR,eNGW,CAS/E,SDgHe,eGlJY,eIsByC,gBLwH7B,CD1GxC,kBAME,cG/CY,4DCiBoD,eF4CpD,CFNd,EDmGgB,YClGe,CAO/B,QDwFgB,eGlJY,eIsByC,iBLwH7B,qBD3FqC,qBM7BR,CNiDpE,MD2Ee,kBEhHkF,kBKZ7B,CNiDpE,wBAHG,gBACA,YAAa,CAIjB,GDyEgB,eGlJY,eIsByC,iBLwH7B,kBA5G0D,mBKZ7B,qBLYgG,qBKZhG,CN6DpE,MANG,eErBU,CFsBX,MAGC,iBAAkB,CAOtB,MD0DgB,iBQ5Id,4DACA,mBACA,iCAEA,yBACA,WACA,cACA,eClBkB,CDoBlB,cRmIc,eS7IO,yCAID,0BFa+C,qBEXvC,gCDQ1B,gBAEA,gBAGA,kBACA,kBCZwC,CDgBxC,4CATA,oBAEA,WACA,iBCbqB,CD+BpB,8BRyGW,eSjIO,yBD4BnB,6CRqGY,iBS1HoB,eAHd,eDahB,gBAEA,gBAGA,gCCdkC,CDgCnC,eRyFW,cSlHM,yBDkBhB,oBAEA,WACA,iBChBmB,CDuBnB,gCACE,eC9BoB,CD0CxB,gDANI,eJ5EK,CI8FR,eR6DW,eSjGM,eF3B+C,iBE6BjC,cANd,yBDiChB,oBACA,gBACA,WACA,kBACA,gCC9BkC,CDiCnC,WR6DW,aClDY,aM1EyC,kBN4EnE,SACA,qBAAsB,CAMvB,aDyCe,eGlJY,eIsByC,iBLwH7B,aDxCP,eAAG,CAKpC,aACE,SAAU,CAMZ,UAKI,cGvHa,oBDwGW,CFoB5B,GACE,SACA,6BG9He,cHgIf,WACA,SAAU,CAGZ,QAEE,kBACA,WACA,uBAAwB,CAG1B,IACE,SAAU,CAOZ,QACE,aAAc,CAGhB,OACE,gBEhGY,aC7DA,CHiKd,cAIE,gBE7JuB,CFgKzB,KDjBgB,eCkBS,yBM9I4C,yBLwH7B,aDsBZ,mBAAM,6BM9ImC,CNiJrE,IACE,kBACA,UACA,kBACA,QAAS,CAGX,ID5BgB,aC6BY,uBMzJyC,kBNyJR,6BMzJQ,eN0J5C,yBM1J4C,yBLwH7B,aDkCZ,mBAAM,8BM1JmC,yBH3BvD,WAJD,gBDoEH,yEEvBqE,gBJkJ7E,qBACA,qBACA,qBACA,iBAAkB,CSnMpB,QV4JgB,iBWhImB,2BCL7B,iBACA,kBAEF,SCS4B,CHjC/B,cVkDW,WACA,cACA,UAAW","file":"public/assets/css/site.css","sourcesContent":["/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n margin: 0;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n display: none;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/normalize.css/normalize.css","/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */\n/* Document\n ========================================================================== */\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\nhtml {\n line-height: 1.15;\n /* 1 */\n -webkit-text-size-adjust: 100%;\n /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n/**\n * Remove the margin in all browsers.\n */\nbody {\n margin: 0;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\nhr {\n box-sizing: content-box;\n /* 1 */\n height: 0;\n /* 1 */\n overflow: visible;\n /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\npre {\n font-family: monospace, monospace;\n /* 1 */\n font-size: 1em;\n /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n/**\n * Remove the gray background on active links in IE 10.\n */\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\nabbr[title] {\n border-bottom: none;\n /* 1 */\n text-decoration: underline;\n /* 2 */\n text-decoration: underline dotted;\n /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace;\n /* 1 */\n font-size: 1em;\n /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n/**\n * Remove the border on images inside links in IE 10.\n */\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit;\n /* 1 */\n font-size: 100%;\n /* 1 */\n line-height: 1.15;\n /* 1 */\n margin: 0;\n /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\nbutton,\ninput {\n /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\nbutton,\nselect {\n /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\nlegend {\n box-sizing: border-box;\n /* 1 */\n color: inherit;\n /* 2 */\n display: table;\n /* 1 */\n max-width: 100%;\n /* 1 */\n padding: 0;\n /* 3 */\n white-space: normal;\n /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box;\n /* 1 */\n padding: 0;\n /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n[type=\"search\"] {\n -webkit-appearance: textfield;\n /* 1 */\n outline-offset: -2px;\n /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n::-webkit-file-upload-button {\n -webkit-appearance: button;\n /* 1 */\n font: inherit;\n /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n/**\n * Add the correct display in IE 10+.\n */\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n[hidden] {\n display: none;\n}\n\nhtml {\n box-sizing: border-box;\n}\n\nhtml *, html *:before, html *:after {\n box-sizing: inherit;\n}\n\n:root {\n font-size: 56.25%;\n}\n\n@media only screen and (min-width: 320px) {\n :root {\n font-size: 70.3125%;\n }\n}\n\n@media only screen and (min-width: 480px) {\n :root {\n font-size: 84.375%;\n }\n}\n\n@media only screen and (min-width: 640px) {\n :root {\n font-size: 98.4375%;\n }\n}\n\n@media only screen and (min-width: 800px) {\n :root {\n font-size: 112.5%;\n }\n}\n\n@media only screen and (min-width: 960px) {\n :root {\n font-size: 112.5%;\n }\n}\n\n@media only screen and (min-width: 1140px) {\n :root {\n font-size: 112.5%;\n }\n}\n\nhtml {\n font-size: 112.5%;\n line-height: 1.75;\n color: #000;\n font-family: \"Gill Sans MT\", \"Gill Sans\", Tahoma, Geneva, sans-serif;\n font-weight: 300;\n -webkit-font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n}\n\nh1 {\n font-size: 42.634674666px;\n font-size: 2.368593037rem;\n line-height: 1.4776704758;\n margin-top: 31.5px;\n margin-top: 1.75rem;\n margin-bottom: 31.5px;\n margin-bottom: 1.75rem;\n}\n\nh2 {\n font-size: 31.984002px;\n font-size: 1.776889rem;\n line-height: 1.9697347443;\n margin-top: 31.5px;\n margin-top: 1.75rem;\n margin-bottom: 31.5px;\n margin-bottom: 1.75rem;\n}\n\nh3 {\n font-size: 23.994px;\n font-size: 1.333rem;\n line-height: 2.6256564141;\n margin-top: 31.5px;\n margin-top: 1.75rem;\n margin-bottom: 0;\n margin-bottom: 0;\n}\n\nh4,\nh5,\nh6 {\n font-size: 18px;\n font-size: 1rem;\n line-height: 1.75;\n margin-top: 31.5px;\n margin-top: 1.75rem;\n margin-bottom: 0;\n margin-bottom: 0;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n color: #414141;\n font-family: \"Gill Sans MT\", \"Gill Sans\", Tahoma, Geneva, sans-serif;\n font-weight: 600;\n}\n\np {\n font-size: 18px;\n font-size: 1rem;\n line-height: 1.75;\n margin-top: 0;\n margin-top: 0;\n margin-bottom: 31.5px;\n margin-bottom: 1.75rem;\n}\n\nol,\nul {\n font-size: 18px;\n font-size: 1rem;\n line-height: 1.75;\n margin-top: 31.5px;\n margin-top: 1.75rem;\n margin-bottom: 31.5px;\n margin-bottom: 1.75rem;\n}\n\nol ol,\nul ol {\n margin-bottom: 0;\n margin-top: 0;\n}\n\nol ul,\nul ul {\n margin-bottom: 0;\n margin-top: 0;\n}\n\ndl {\n font-size: 18px;\n font-size: 1rem;\n line-height: 1.75;\n margin-top: 31.5px;\n margin-top: 1.75rem;\n margin-bottom: 31.5px;\n margin-bottom: 1.75rem;\n}\n\ndl dt {\n font-weight: 600;\n}\n\ndl dd {\n font-style: italic;\n}\n\ntable {\n border-width: 1px 1px 1px 1px;\n border-width: 0.0555555556rem 0.0555555556rem 0.0555555556rem 0.0555555556rem;\n font-family: \"Gill Sans MT\", \"Gill Sans\", Tahoma, Geneva, sans-serif;\n table-layout: fixed;\n border-color: #fff #fff #fff #fff;\n border-style: solid solid solid solid;\n border-collapse: collapse;\n width: 100%;\n margin: 24px 0 24px 0;\n background: #fff;\n}\n\ntable caption {\n padding: 24px 0;\n padding: 1.3333333333rem 0;\n font-size: 22px;\n font-size: 1.2222222222rem;\n border-width: 0 0 1px 0;\n border-width: 0 0 0.0555555556rem 0;\n background: #fff;\n font-family: inherit;\n font-weight: 700;\n color: #000;\n text-align: center;\n border-color: #eee #eee #eee #eee;\n border-style: solid solid solid solid;\n}\n\ntable thead td,\ntable thead th {\n border-width: 1px 1px 1px 1px;\n border-width: 0.0555555556rem 0.0555555556rem 0.0555555556rem 0.0555555556rem;\n font-size: 18px;\n font-size: 1rem;\n padding: 16px 0;\n padding: 0.8888888889rem 0;\n background: #eee;\n font-family: inherit;\n font-weight: 300;\n color: #000;\n text-align: center;\n border-color: #fff #fff #fff #fff;\n border-style: solid solid solid solid;\n}\n\ntable tbody td {\n font-size: 18px;\n font-size: 1rem;\n border-width: 1px 1px 1px 1px;\n border-width: 0.0555555556rem 0.0555555556rem 0.0555555556rem 0.0555555556rem;\n padding: 8px 0;\n padding: 0.4444444444rem 0;\n background: #eee;\n font-family: inherit;\n font-weight: 300;\n color: #000;\n text-align: center;\n border-color: #fff #fff #fff #fff;\n border-style: solid solid solid solid;\n}\n\ntable tbody tr:nth-child(even) td {\n background: #fff;\n}\n\ntable tbody tr:nth-child(odd) td {\n background: #eee;\n}\n\ntable tfoot td {\n font-size: 18px;\n font-size: 1rem;\n border-width: 1px 1px 1px 1px;\n border-width: 0.0555555556rem 0.0555555556rem 0.0555555556rem 0.0555555556rem;\n padding: 8px 0;\n padding: 0.4444444444rem 0;\n background: #eee;\n font-family: inherit;\n font-weight: 300;\n color: #000;\n text-align: center;\n border-color: #fff #fff #fff #fff;\n border-style: solid solid solid solid;\n}\n\nblockquote {\n padding: 18px;\n padding: 1rem;\n font-style: italic;\n margin: 0;\n background-color: #eee;\n}\n\nblockquote p {\n font-size: 18px;\n font-size: 1rem;\n line-height: 1.75;\n margin-top: 0;\n margin-top: 0;\n margin-bottom: 0;\n margin-bottom: 0;\n}\n\nblockquote > p {\n padding: 0;\n}\n\na {\n color: #96def0;\n text-decoration: none;\n}\n\na:hover {\n color: #96def0;\n text-decoration: none;\n}\n\nhr {\n border: 0;\n border-top: 1px solid #96def0;\n display: block;\n height: 1px;\n padding: 0;\n}\n\nsub,\nsup {\n position: relative;\n top: -.4rem;\n vertical-align: baseline;\n}\n\nsub {\n top: .4rem;\n}\n\nb {\n line-height: 1;\n}\n\nsmall {\n line-height: 1;\n}\n\nstrong {\n font-weight: 600;\n color: #414141;\n}\n\ncite,\ndfn,\nem,\nq {\n line-height: 1.75;\n}\n\ncode {\n font-size: 14px;\n font-size: 0.7777777778rem;\n line-height: 1.7142857143;\n margin-top: 0;\n margin-top: 0;\n margin-bottom: 24px;\n margin-bottom: 1.3333333333rem;\n}\n\nkbd {\n margin-bottom: 1px;\n padding: 0;\n position: relative;\n top: -1px;\n}\n\npre {\n padding: 12px;\n padding: 0.6666666667rem;\n border-radius: 4px;\n border-radius: 0.2222222222rem;\n font-size: 14px;\n font-size: 0.7777777778rem;\n line-height: 1.7142857143;\n margin-top: 0;\n margin-top: 0;\n margin-bottom: 24px;\n margin-bottom: 1.3333333333rem;\n background-color: #414141;\n color: #eee;\n font-weight: 700;\n font-family: Monaco, \"Lucida Sans Typewriter\", Consolas, \"Courier New\", monospace;\n white-space: pre;\n word-break: break-all;\n word-wrap: break-word;\n white-space: pre-wrap;\n white-space: pre\\9;\n}\n\n.middle {\n max-width: 1140px;\n max-width: 63.3333333333rem;\n margin-left: auto;\n margin-right: auto;\n width: 96%;\n}\n\n.middle:after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./site.scss","// ======================================================================\n// Common\n// ======================================================================\n\nhtml {\n @include fix-box-model;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/components/global/_G-common.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Helpers\n// ======================================================================\n\n/// Fix stupid box model in stupid browsers.\n/// @example scss\n/// html {\n/// @include fix-box-model;\n/// }\n/// @group Helpers\n@mixin fix-box-model {\n box-sizing: border-box;\n\n *, *:before, *:after {\n box-sizing: inherit;\n }\n}\n\n/// Multiple Clearfixes in one mixin! Use modern, PIE or Mojo Clearfixes, depending on your needs.\n/// @example scss - Clearfix\n/// .yourelement {\n/// @include clearfix(modern);\n/// @include clearfix(pie);\n/// @include clearfix(mojo);\n/// ...\n/// }\n/// @link http://www.positioniseverything.net/easyclearing.html\n/// @link http://cssmojo.com/latest_new_clearfix_so_far/\n/// @param {string} $fix-type [modern] - Desired CSS property\n/// @group Clearfix\n@mixin clearfix($fix-type: \"modern\") {\n\n // Moden clearfix.\n @if $fix-type == \"modern\" {\n overflow: hidden;\n }\n // Position is everything clearfix clearfix.\n @if $fix-type == \"pie\" {\n *zoom: 1;\n\n &:after {\n content: \"\\0020\";\n display: block;\n height: 0;\n clear: both;\n overflow: hidden;\n visibility: hidden;\n }\n }\n // Mojo Clearfix.\n @if $fix-type == \"mojo\" {\n &:after {\n content: \"\";\n display: table;\n clear: both;\n }\n }\n}\n\n\n/// iFrame / Object / Emded helper to make those elements responsive. Works a treat on things like google maps and youtube videos.\n/// Apply this to the PARENT element, not the iframe.\n/// @example scss - IOE\n/// .yourelement {\n/// @include ioe;\n/// ...\n/// }\n/// @group Media\n@mixin ioe {\n position: relative;\n padding-bottom: 56.25%;\n padding-top: 30px;\n height: 0;\n overflow: hidden;\n\n embed,\n iframe,\n object,\n video {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border: 0;\n }\n}\n\n// Min-Width Media Query Mixin\n/// @example scss\n/// @include break(sm) {\n/// display: block;\n/// }\n/// @group Helpers\n@mixin minbreak($size: $bp-medium) {\n @media screen and (min-width: rem-convert(px, $size)) {\n @content;\n }\n}\n\n/// Max-Width Media Query Mixin\n/// @example scss\n/// @include break(sm) {\n/// display: block;\n/// }\n/// @group Helpers\n@mixin maxbreak($size: $bp-medium) {\n @media screen and (max-width: rem-convert(px, $size)) {\n @content;\n }\n}\n\n/// Retina Media Query Mixin\n/// @example scss\n/// @include retina {\n/// ...\n/// }\n/// @group Helpers\n@mixin retina {\n @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {\n @content;\n }\n}\n\n/// Print Mixin\n/// @example scss\n/// @include print {\n/// ...\n/// }\n/// @group Helpers\n@mixin print {\n @media print {\n @content;\n }\n}\n\n/// REM Calculator. Generate REM sizes from a pixel value on almost any css property\n/// @example scss - Free Type\n/// .yourelement {\n/// @include rem(margin-top, 16px);\n/// }\n/// .yourelement {\n/// @include rem(margin, 16px 20px 16px 20px);\n/// }\n/// @param {string} $properties - Desired CSS property\n/// @param {number} $values - Desired values to convert\n/// @group Helpers\n@mixin rem($properties, $values...) {\n @if type-of($properties) == \"map\" {\n @each $property in map-keys($properties) {\n @include rem($property, map-get($properties, $property));\n }\n }\n @else {\n @each $property in $properties{\n @if $rem-fallback or $rem-px-only {\n #{$property}: rem-convert(px, $values...);\n }\n @if not $rem-px-only {\n #{$property}: rem-convert(rem, $values...);\n }\n }\n }\n}\n\n/// SVG. Use SVG graphic from a variable and optionally change its\n/// @example scss - SVG Icon Color\n/// .yourelement {\n/// @include svgbg($youriconvar);\n/// }\n/// @param {string} $icon - Variable with svg as a string\n/// @param {string} $newcolor - Variable with svg as a string\n/// @param {string} $oldcolor - Icons original color to replace\n/// @group Helpers\n@mixin svgbg($icon, $newcolor: $svg-icon-replace-color, $oldcolor: $svg-icon-orginal-color) {\n background-image: svg-url-with-replaced-fill($examplesvg, $oldcolor, $newcolor);\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/libs/_helpers.scss","// ======================================================================\n// Typography\n// ======================================================================\n// ======================================================================\n// Root\n// ======================================================================\n\n:root {\n @include responsive-type;\n}\n// ======================================================================\n// HTML\n// ======================================================================\n\nhtml {\n @include baseline;\n @include rem-baseline(100%);\n line-height: $global-line-height;\n color: $global-font-color;\n font-family: $global-font-stack;\n font-weight: $global-font-weight;\n -webkit-font-smoothing: $webkit-smoothing;\n text-rendering: optimizeLegibility;\n}\n// ======================================================================\n// Headings\n// ======================================================================\n\nh1 {\n @include type-modular(gamma);\n // @include type-free(42px, 24px, 48px, 48px, true);\n}\n\nh2 {\n @include type-modular(delta);\n // @include type-free(32px, 24px, 24px, 48px, true);\n}\n\nh3 {\n @include type-modular(epsilon, $global-base-font-size * $global-line-height, 0);\n // @include type-free(24px, 24px, 24px, 48px, true);\n}\n\nh4,\nh5,\nh6 {\n @include type-modular(zeta, $global-base-font-size * $global-line-height, 0);\n // @include type-free($global-base-font-size, 24px, 0, 24px, true);\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n color: $global-heading-color;\n font-family: $global-heading-stack;\n font-weight: $global-heading-weight;\n}\n// ======================================================================\n// Paragraphs\n// ======================================================================\n\np {\n @include type-modular(zeta, 0, $global-base-font-size * $global-line-height);\n // @include type-free($global-base-font-size, 0, 24px, 24px, true);\n}\n// ======================================================================\n// Lists\n// ======================================================================\n\nol,\nul {\n @include type-modular(zeta);\n // @include type-free($global-base-font-size, 0, 24px, 24px, true);\n ol {\n margin-bottom: 0;\n margin-top: 0;\n }\n\n ul {\n margin-bottom: 0;\n margin-top: 0;\n }\n}\n\ndl {\n @include type-modular(zeta);\n // @include type-free($global-base-font-size, 0, 24px, 24px, true);\n dt {\n font-weight: $semibold;\n }\n\n dd {\n font-style: italic;\n }\n}\n// ======================================================================\n// Tables\n// ======================================================================\n\ntable {\n @include table($default-table);\n}\n// ======================================================================\n// Quotes\n// ======================================================================\n\nblockquote {\n @include rem(padding, 18px);\n font-style: italic;\n margin: 0;\n background-color: #eee;\n\n p {\n @include type-modular(zeta, 0, 0);\n // @include type-free($global-base-font-size, 0, 0, 24px, true);\n }\n}\n\nblockquote > p {\n padding: 0;\n}\n// ======================================================================\n// Misc\n// ======================================================================\n\na {\n color: $link;\n text-decoration: none;\n\n &:hover {\n color: $link-hover;\n text-decoration: $link-hover-decoration;\n }\n}\n\nhr {\n border: 0;\n border-top: $global-hr-style;\n display: block;\n height: 1px;\n padding: 0;\n}\n\nsub,\nsup {\n position: relative;\n top: -.4rem;\n vertical-align: baseline;\n}\n\nsub {\n top: .4rem;\n}\n\nb {\n line-height: 1;\n}\n\nsmall {\n line-height: 1;\n}\n\nstrong {\n font-weight: $semibold;\n color: $dark;\n}\n\ncite,\ndfn,\nem,\nq {\n line-height: $global-line-height;\n}\n\ncode {\n @include type-free(14px, 0, 24px, 24px, true);\n}\n\nkbd {\n margin-bottom: 1px;\n padding: 0;\n position: relative;\n top: -1px;\n}\n\npre {\n @include rem(padding, 12px) @include rem(border-radius, 4px);\n @include type-free(14px, 0, 24px, 24px, true);\n background-color: $dark;\n color: $bright;\n font-weight: $bold;\n font-family: $terminal;\n white-space: pre;\n word-break: break-all;\n word-wrap: break-word;\n white-space: pre-wrap;\n white-space: pre\\9;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/components/global/_G-typography.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Type Kit\n// ======================================================================\n\n$modular-scale-alpha: type-setting($global-base-font-size, $type-ratio, $modular-step-alpha);\n$modular-scale-beta: type-setting($global-base-font-size, $type-ratio, $modular-step-beta);\n$modular-scale-gamma: type-setting($global-base-font-size, $type-ratio, $modular-step-gamma);\n$modular-scale-delta: type-setting($global-base-font-size, $type-ratio, $modular-step-delta);\n$modular-scale-epsilon: type-setting($global-base-font-size, $type-ratio, $modular-step-epsilon);\n$modular-scale-zeta: type-setting($global-base-font-size, $type-ratio, $modular-step-zeta);\n$modular-scale-eta: type-setting($global-base-font-size, $type-ratio, $modular-step-eta);\n$modular-scale-theta: type-setting($global-base-font-size, $type-ratio, $modular-step-theta);\n$modular-scale-iota: type-setting($global-base-font-size, $type-ratio, $modular-step-iota);\n\n$lineheight-alpha: ($global-base-font-size * $global-line-height) * 2;\n$lineheight-beta: ($global-base-font-size * $global-line-height) * 2;\n$lineheight-gamma: ($global-base-font-size * $global-line-height) * 2;\n$lineheight-delta: ($global-base-font-size * $global-line-height) * 2;\n$lineheight-epsilon: ($global-base-font-size * $global-line-height) * 2;\n$lineheight-zeta: $global-base-font-size * $global-line-height;\n$lineheight-eta: $global-line-height;\n$lineheight-theta: $global-line-height;\n$lineheight-iota: $global-line-height;\n\n// Map of modular font scales\n// @group Typography\n$type-scale: ( alpha: $modular-scale-alpha, beta: $modular-scale-beta, gamma: $modular-scale-gamma, delta: $modular-scale-delta, epsilon: $modular-scale-epsilon, zeta: $modular-scale-zeta, eta: $modular-scale-eta, theta: $modular-scale-theta, iota: $modular-scale-iota );\n\n// Map of line heights\n// @group Typography\n$line-heights: ( alpha: $lineheight-alpha, beta: $lineheight-beta, gamma: $lineheight-gamma, delta: $lineheight-delta, epsilon: $lineheight-epsilon, zeta: $lineheight-zeta, eta: $lineheight-eta, theta: $lineheight-theta, iota: $lineheight-iota );\n\n/// Modular type mixin lets you easily generate a font size on an element with lineheights and margins based on a modular scale.\n/// @example scss - Modular Type\n/// p {\n/// @include type-modular(gamma, 24px, 24px, 24px, true )\n/// }\n/// @param {string} $type-scale - Desired modular scale\n/// @param {string} $type-scale-vtspace - Desired margin above element (optional)\n/// @param {string} $type-scale-vbspace - Desired margin below element (optional)\n/// @param {string} $tflh - Overide line-height. Use pixel values, they will be converted. (optional)\n/// @param {string} $tfuline - Generate unitless lineheights. (optional)\n/// @group Typography\n\n@mixin type-modular($type-scale, $type-scale-vtspace: $global-base-font-size * $global-line-height, $type-scale-vbspace: $global-base-font-size * $global-line-height, $mlh: line-height($type-scale), $muline: $unitless-lineheight) {\n @include rem(font-size, type-scale($type-scale));\n @if $muline == true {\n @include unitless-line-height(type-scale($type-scale), $mlh);\n } @else {\n @include rem(line-height, $mlh);\n }\n @include rem(margin-top, $type-scale-vtspace);\n @include rem(margin-bottom, $type-scale-vbspace);\n}\n\n/// Free type mixin lets you easily generate a font size on an element with lineheights and margins based on a pixel value.\n/// @example scss - Free Type\n/// p {\n/// @include type-free(16px, 24px, 24px, 24px, true)\n/// }\n/// @param {string} $type-size - Desired font size in pixels\n/// @param {string} $type-scale-vtspace - Desired margin above element (optional)\n/// @param {string} $type-scale-vbspace - Desired margin below element (optional)\n/// @param {string} $tflh - Overide line-height. Use pixel values, they will be converted. (optional)\n/// @param {string} $tfuline - Generate unitless lineheights. (optional)\n/// @group Typography\n\n@mixin type-free($type-size, $type-scale-vtspace, $type-scale-vbspace, $tflh: $global-line-height, $tfuline: $unitless-lineheight) {\n @include rem(font-size, $type-size);\n @if $tfuline == true {\n @include unitless-line-height($type-size, $tflh);\n } @else {\n @include rem(line-height, $tflh);\n }\n @include rem(margin-top, $type-scale-vtspace);\n @include rem(margin-bottom, $type-scale-vbspace);\n}\n\n/// Font face mixin lets you very easily add custom fonts in multiple formats.\n/// @example scss - Fontface\n/// @include fontface(\"IM FELL English\", \"IMFeENrm28P\", $extrabold, normal, $formats: eot woff woff2 ttf svg);\n///\n/// .custom-font {\n/// font-family: \"IM FELL English\";\n/// }\n/// @param {string} $font-family - The fonts name eg \"IM FELL English\"\n/// @param {string} $font-name - The fonts filename without the extension \"IMFeENrm28P\"\n/// @param {string} $weight [normal] - Font weight\n/// @param {string} $style [normal] - Font style\n/// @param {string} $formats - List of font file types to use\n/// @group Typography\n\n@mixin fontface($font-family, $font-name, $weight: normal, $style: normal, $formats: eot woff ttf svg) {\n @if index('italic' 'oblique', $weight) {\n $style: $weight;\n $weight: normal;\n }\n @font-face {\n font-family: $font-family;\n font-weight: $weight;\n font-style: $style;\n @if index($formats, eot) {\n src: url('#{$custom-font-path}#{$font-name}.eot');\n }\n src: fontsrc($formats, $font-name, $font-family);\n }\n}\n\n/// Responsive Type\n/// @example scss - Free Type\n/// :root {\n/// @include responsive-type;\n/// }\n/// @group Type Kit\n\n@mixin responsive-type {\n @if $responsive-text == true {\n @include rem-baseline($rt-bp-base);\n @media only screen and (min-width: $bp-tiny) {\n @include rem-baseline($rt-bp-tiny);\n }\n @media only screen and (min-width: $bp-xsmall) {\n @include rem-baseline($rt-bp-xsmall);\n }\n @media only screen and (min-width: $bp-small) {\n @include rem-baseline($rt-bp-small);\n }\n @media only screen and (min-width: $bp-medium) {\n @include rem-baseline($rt-bp-medium);\n }\n @media only screen and (min-width: $bp-large) {\n @include rem-baseline($rt-bp-large);\n }\n @media only screen and (min-width: $bp-xl) {\n @include rem-baseline($rt-bp-xl);\n }\n }\n}\n\n/// REM Baseline\n/// @example scss - Free Type\n/// .yourelement {\n/// @include rem-baseline;\n/// }\n/// @param {number} $zoom - zoom amount\n/// @group Type Kit\n@mixin rem-baseline($zoom: 100%) {\n font-size: ($zoom / 16px) * $global-base-font-size;\n}\n\n// unitless line height mixin\n@mixin unitless-line-height($font-size, $line-height: $global-base-font-size) {\n line-height: $line-height / $font-size;\n}\n\n/// Draw Baselines to help with setting typography.\n/// @example scss - lines\n/// .yourelement {\n/// @include lines($global-base-font-size, $global-line-height);\n/// }\n/// @param {number} $line-font-size - Overide the font size used to calculate the lines\n/// @param {number} $line-line-height - Overide the lineheight used to calculate the lines\n/// @group Type Kit\n@mixin baseline($line-font-size: $global-base-font-size, $line-line-height: $global-line-height) {\n @if($type-debug == true) {\n @include rem(background-size, ($line-font-size * $line-line-height) ($line-font-size * $line-line-height));\n background-image: linear-gradient(to bottom, hsla(200, 100%, 50%, .3) 1px, transparent 1px);\n background-position: left -1px;\n background-repeat: repeat;\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/kits/typography/_type-kit.scss","// ======================================================================\n// Typography Setup\n// ======================================================================\n\n// Basic Setup\n// ======================================================================\n\n/// Enable Type Debug\n$type-debug: false;\n\n// Basic Setup\n// ======================================================================\n\n/// Set Global Font size\n$global-base-font-size: 18px;\n\n/// Set Global Line height\n$global-line-height: 1.75;\n\n/// Set Global REM Fallback\n$rem-fallback: true;\n\n/// Set Global PX units only\n$rem-px-only: false;\n\n/// Set Global line-heights with no units\n$unitless-lineheight: true;\n\n/// The ratio used to generate sizes and margins on heading tags\n$type-ratio: $perfect-fourth;\n\n/// Toggle percenatage based font scaling based on screen size.\n$responsive-text: true;\n\n/// Global Font Smoothing\n$webkit-smoothing: antialiased;\n\n// Modular Steps\n// ======================================================================\n\n/// Modular Stepping Multipliers\n$modular-step-alpha: 5;\n$modular-step-beta: 4;\n$modular-step-gamma: 3;\n$modular-step-delta: 2;\n$modular-step-epsilon: 1;\n$modular-step-zeta: 0;\n$modular-step-eta: -1;\n$modular-step-theta: -2;\n$modular-step-iota: -3;\n\n// Font Weights\n// ======================================================================\n\n/// Thin\n$thin: 100;\n\n/// Extra light\n$extralight: 200;\n\n/// Light\n$light: 300;\n\n/// Regular\n$regular: 400;\n\n/// Medium\n$medium: 500;\n\n/// Semibold\n$semibold: 600;\n\n/// Bold\n$bold: 700;\n\n/// Extra Bold\n$extra-bold: 800;\n\n/// Black\n$black: 900;\n\n// Global font styles\n// ======================================================================\n\n/// Global Font Stack\n$global-font-stack: $gillsans;\n\n/// Global Font Weight\n$global-font-weight: $light;\n\n/// Global Font Color\n$global-font-color: $jet;\n\n// Global heading font styles\n// ======================================================================\n\n/// Heading Font Stack\n$global-heading-stack: $gillsans;\n\n/// Heading Font Color\n$global-heading-weight: $semibold;\n\n/// Heading Font Weight\n$global-heading-color: $dark;\n\n/// Custom Font Path\n$custom-font-path: '/assets/fonts/';\n\n// Links\n// ======================================================================\n\n/// Link Color\n$link: $primary;\n\n/// Link Hover Color\n$link-hover: $primary;\n\n/// Link Hover Color\n$link-hover-decoration: none;\n\n// Horizontal Rules\n// ======================================================================\n\n/// Horizontal Rule color and thickness\n$global-hr-style: 1px solid $primary;\n\n// ======================================================================\n// Responsive type scaling (set $responsive-text true for this)\n// Numbers match $perfect-fourth. Recalculate them for other ratios.\n// ======================================================================\n\n/// Base responsive font size for screens under $bp-tiny\n$rt-bp-base: 50%; // 8px\n\n/// Responsive font size for screens between $bp-tiny and $bp-xsmall\n$rt-bp-tiny: 62.5%; // 10px\n\n/// Responsive font size for screens between $bp-xsmall and $bp-small\n$rt-bp-xsmall: 75%; // 12px\n\n/// Responsive font size for screens between $bp-xmall and $bp-medium\n$rt-bp-small: 87.5%; // 14px\n\n/// Responsive font size for screens between $bp-medium and $bp-large\n$rt-bp-medium: 100%; // 16px\n\n/// Responsive font size for screens between $bp-large and $bp-xl\n$rt-bp-large: 100%; // 20px\n\n/// Responsive font size for screens between $bp-xl and above.\n$rt-bp-xl: 100%; // 22px\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/config/_config-typography.scss","// ======================================================================\n// Colors\n// ======================================================================\n\n/// Monochrome - Bright\n$bright: #eee;\n/// Monochrome - Gray\n$gray: #9f9f9f;\n/// Monochrome - Dark\n$dark: #414141;\n/// Monochrome - Jet\n$jet: #000;\n\n/// Palette - Primary\n$primary: #96def0;\n/// Palette - Secondary\n$secondary: #2980b9;\n/// Palette - Secondary\n$tertiary: #8e44ad;\n\n/// Feedback - Positive\n$positive: #2ecc71;\n/// Feedback - Negative\n$negative: #971318;\n/// Feedback - Warning\n$warning: #f39c12;\n// Feedback - Disabled\n$disabled: #adadad;\n\n/// Gradient - Start\n$gradient-start: $primary;\n/// Gradient - Middle\n$gradient-middle: darken($primary, 20%);\n/// Gradient - End\n$gradient-end: darken($primary, 40%);\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/config/_config-colors.scss","// ======================================================================\n// Font Stacks\n// ======================================================================\n\n/// Simple Times Font Stack\n$times: Times, 'Times New Roman', serif !default;\n\n/// Simple Arial Font Stack\n$arial: Arial, sans-serif !default;\n\n/// Simple Georgia Font Stack\n$georgia: Georgia, serif !default;\n\n/// Simple Garamond Font Stack\n$garamond: 'Apple Garamond', 'ITC Garamond Narrow', 'Garamond', serif !default;\n\n/// Simple Helvetica Font Stack\n$helvetica: 'Helvetica Neue', Helvetica, sans-serif !default;\n\n/// Simple Verdana Font Stack\n$verdana: 'Verdana Ref', Verdana, sans-serif !default;\n\n/// Simple Trebuchet Font Stack\n$trebuchet: 'Trebuchet MS', sans-serif !default;\n\n/// Simple Gill Sans Font Stack\n$gillsans: 'Gill Sans MT', 'Gill Sans', Tahoma, Geneva, sans-serif !default;\n\n/// Full Times Font Stack\n$stimes: Cambria, 'Hoefler Text', Utopia, 'Liberation Serif', 'Nimbus Roman No9 L Regular', 'Times New Roman', Times, serif !default;\n\n/// Full Georgia Font Stack\n$sgeorgia: Constantia, 'Lucida Bright', Lucidabright, 'Lucida Serif', Lucida, 'DejaVu Serif', 'Bitstream Vera Serif', 'Liberation Serif', Georgia, serif !default;\n\n/// Full Garamond Font Stack\n$sgaramond: 'Palatino Linotype', Palatino, Palladio, 'URW Palladio L', 'Book Antiqua', Baskerville, 'Bookman Old Style', 'Bitstream Charter', 'Nimbus Roman No9 L', 'Apple Garamond', 'ITC Garamond Narrow', 'New Century Schoolbook', 'Century Schoolbook', 'Century Schoolbook L', Garamond, serif !default;\n\n/// Full Helvetica Font Stack\n$shelvetica: Frutiger, 'Frutiger Linotype', Univers, Calibri, 'Gill Sans', 'Gill Sans MT', 'Myriad Pro', Myriad, 'DejaVu Sans Condensed', 'Liberation Sans', 'Nimbus Sans L', Tahoma, Geneva, 'Helvetica Neue', Helvetica, sans-serif !default;\n\n/// Full Verdana Font Stack\n$sverdana: Corbel, 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', 'Verdana Ref', Verdana, sans-serif !default;\n\n/// Full Trebuchet Font Stack\n$strebuchet: 'Segoe UI', Candara, 'Bitstream Vera Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Trebuchet MS', Trebuchet, sans-serif !default;\n\n/// Full Gill Sans Font Stack\n$sgillsans: Frutiger, 'Frutiger Linotype', Univers, Calibri, 'Myriad Pro', Myriad, 'DejaVu Sans Condensed', 'Liberation Sans', 'Nimbus Sans L', Tahoma, Geneva, 'Gill Sans MT', 'Gill Sans', sans-serif !default;\n\n/// Terminal / Monospace font\n$terminal: Monaco, 'Lucida Sans Typewriter', Consolas, 'Courier New', monospace !default;\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/config/_config-font-stacks.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Type Functions\n// ======================================================================\n\n// Type Setting\n// ======================================================================\n@function type-setting($base, $ratio, $level) {\n $scale: $base;\n @if($level < 0) {\n $scale: $base / $ratio;\n @while($level < -1) {\n $scale: $scale / $ratio;\n $level: $level + 1;\n }\n } @else {\n @if($level > 0) {\n $scale: $base * $ratio;\n @while($level > 1) {\n $scale: $scale * $ratio;\n $level: $level - 1;\n }\n }\n }\n @return $scale;\n}\n\n\n// Type Scale\n// ======================================================================\n@function type-scale($level) {\n @return map-get($type-scale, $level);\n}\n\n// Line Heights\n// ======================================================================\n@function line-height($level) {\n @return map-get($line-heights, $level);\n}\n\n// Unitless lineheight function\n// ======================================================================\n@function unitless-line-height($global-base-font-size, $line-height: $global-base-font-size) {\n @return $line-height / $global-base-font-size;\n}\n\n// Fontface\n// ======================================================================\n\n@function fontsrc($formats, $font-name, $font-family) {\n // Return the list of `src` values, in order, that\n // a good `@font-face` will need, including only\n // those formats specified in the list `$formats`.\n $result: ();\n @if index($formats, eot) {\n $eot-val: url('#{$custom-font-path}#{$font-name}.eot?#iefix') format('embedded-opentype');\n $result: append($result, $eot-val, comma);\n }\n @if index($formats, woff2) {\n $woff2-val: url('#{$custom-font-path}#{$font-name}.woff2') format('woff2');\n $result: append($result, $woff2-val, comma);\n }\n @if index($formats, woff) {\n $woff-val: url('#{$custom-font-path}#{$font-name}.woff') format('woff');\n $result: append($result, $woff-val, comma);\n }\n @if index($formats, ttf) {\n $ttf-val: url('#{$custom-font-path}#{$font-name}.ttf') format('truetype');\n $result: append($result, $ttf-val, comma);\n }\n @if index($formats, svg) {\n $svg-val: url('#{$custom-font-path}#{$font-name}.svg##{$font-family}') format('svg');\n $result: append($result, $svg-val, comma);\n }\n @return $result;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/libs/functions/_type.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Math Functions\n// ======================================================================\n\n\n// Convert PX to REM\n// ======================================================================\n\n// https://github.com/pierreburel/sass-rem\n@function rem-separator($list, $separator: false) {\n @if $separator == 'comma' or $separator == 'space' {\n @return append($list, null, $separator);\n }\n @if function-exists('list-separator') == true {\n @return list-separator($list);\n }\n // list-separator polyfill by Hugo Giraudel (https://sass-compatibility.github.io/#list_separator_function)\n $test-list: ();\n @each $item in $list {\n $test-list: append($test-list, $item, space);\n }\n @return if($test-list == $list, space, comma);\n}\n\n@function rem-convert($to, $values...) {\n $result: ();\n $separator: rem-separator($values);\n @each $value in $values {\n @if type-of($value) == 'number' and unit($value) == 'rem' and $to == 'px' {\n $result: append($result, $value / 1rem * $global-base-font-size + 0px, $separator);\n } @else\n if type-of($value) == 'number' and unit($value) == 'px' and $to == 'rem' {\n $result: append($result, $value / $global-base-font-size + 0rem, $separator);\n } @else\n if type-of($value) == 'list' {\n $value-separator: rem-separator($value);\n $value: rem-convert($to, $value...);\n $value: rem-separator($value, $value-separator);\n $result: append($result, $value, $separator);\n } @else {\n $result: append($result, $value, $separator);\n }\n }\n @return if(length($result) == 1, nth($result, 1), $result);\n}\n\n// REM Values from map\n// ======================================================================\n\n@function rem($values...) {\n @if $rem-px-only {\n @return rem-convert(px, $values...);\n } @else {\n @return rem-convert(rem, $values...);\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/libs/functions/_math.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Table Kit\n// ======================================================================\n// ======================================================================\n// Tables\n// ======================================================================\n/// Quickly skin tables using variables from a SASS map\n/// @example scss - Tables\n/// table {\n/// @include table($default-table);\n/// }\n/// @author Hash&Salt\n/// @param {Variable} $table-skin [$default-table] - SASS map to use for the skin.\n/// @group Tables\n@mixin table($table-skin: $default-table) {\n @include rem(border-width, map-deep-get($table-skin, 'borderwidth'));\n font-family: map-deep-get($table-skin, 'fontfamily');\n table-layout: map-deep-get($table-skin, 'layout');\n border-color: map-deep-get($table-skin, 'bordercolor');\n border-style: map-deep-get($table-skin, 'borderstyle');\n border-collapse: map-deep-get($table-skin, 'bordercollapse');\n width: map-deep-get($table-skin, 'width');\n margin: map-deep-get($table-skin, 'margin');\n background: map-deep-get($table-skin, 'background');\n\n caption {\n @include rem(padding, map-deep-get($table-skin, 'caption', 'padding'));\n @include rem(font-size, map-deep-get($table-skin, 'caption', 'fontsize'));\n @include rem(border-width, map-deep-get($table-skin, 'caption', 'borderwidth'));\n background: map-deep-get($table-skin, 'caption', 'background');\n font-family: map-deep-get($table-skin, 'caption', 'fontfamily');\n font-weight: map-deep-get($table-skin, 'caption', 'fontweight');\n color: map-deep-get($table-skin, 'caption', 'fontcolor');\n text-align: map-deep-get($table-skin, 'caption', 'textalign');\n border-color: map-deep-get($table-skin, 'caption', 'bordercolor');\n border-style: map-deep-get($table-skin, 'caption', 'borderstyle');\n }\n\n thead {\n td,\n th {\n @include rem(border-width, map-deep-get($table-skin, 'header', 'borderwidth'));\n @include rem(font-size, map-deep-get($table-skin, 'header', 'fontsize'));\n @include rem(padding, map-deep-get($table-skin, 'header', 'padding'));\n background: map-deep-get($table-skin, 'header', 'background');\n font-family: map-deep-get($table-skin, 'header', 'fontfamily');\n font-weight: map-deep-get($table-skin, 'header', 'fontweight');\n color: map-deep-get($table-skin, 'header', 'fontcolor');\n text-align: map-deep-get($table-skin, 'header', 'textalign');\n border-color: map-deep-get($table-skin, 'header', 'bordercolor');\n border-style: map-deep-get($table-skin, 'header', 'borderstyle');\n }\n }\n\n tbody {\n td {\n @include rem(font-size, map-deep-get($table-skin, 'body', 'fontsize'));\n @include rem(border-width, map-deep-get($table-skin, 'body', 'borderwidth'));\n @include rem(padding, map-deep-get($table-skin, 'body', 'padding'));\n background: map-deep-get($table-skin, 'body', 'background');\n font-family: map-deep-get($table-skin, 'body', 'fontfamily');\n font-weight: map-deep-get($table-skin, 'body', 'fontweight');\n color: map-deep-get($table-skin, 'body', 'fontcolor');\n text-align: map-deep-get($table-skin, 'body', 'textalign');\n border-color: map-deep-get($table-skin, 'body', 'bordercolor');\n border-style: map-deep-get($table-skin, 'body', 'borderstyle');\n vertical-align: map-deep-get($table-skin, 'body', 'bverticalalign');\n }\n\n tr:nth-child(even) {\n td {\n background: map-deep-get($table-skin, 'body', 'evenbackground');\n }\n }\n\n tr:nth-child(odd) {\n td {\n background: map-deep-get($table-skin, 'body', 'oddbackground');\n }\n }\n }\n\n tfoot {\n td {\n @include rem(font-size, map-deep-get($table-skin, 'footer', 'fontsize'));\n @include rem(border-width, map-deep-get($table-skin, 'footer', 'borderwidth'));\n @include rem(padding, map-deep-get($table-skin, 'footer', 'padding'));\n background: map-deep-get($table-skin, 'footer', 'background');\n font-family: map-deep-get($table-skin, 'footer', 'fontfamily');\n font-weight: map-deep-get($table-skin, 'footer', 'fontweight');\n color: map-deep-get($table-skin, 'footer', 'fontcolor');\n text-align: map-deep-get($table-skin, 'footer', 'textalign');\n border-color: map-deep-get($table-skin, 'footer', 'bordercolor');\n border-style: map-deep-get($table-skin, 'footer', 'borderstyle');\n vertical-align: map-deep-get($table-skin, 'footer', 'bverticalalign');\n }\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/kits/tables/_table-kit.scss","// ======================================================================\n// Tables\n// ======================================================================\n\n/// Default Table Skin.\n\n$default-table: (\n fontfamily: $global-font-stack,\n layout: fixed,\n background: #fff,\n borderwidth: 1px 1px 1px 1px,\n bordercolor: #fff #fff #fff #fff,\n borderstyle: solid solid solid solid,\n margin: 24px 0 24px 0,\n bordercollapse: collapse,\n width: 100%,\n\n caption: (\n background: #fff,\n padding: 24px 0,\n fontfamily: inherit,\n fontweight: $bold,\n fontcolor: $global-font-color,\n fontsize: 22px,\n textalign: center,\n borderwidth: 0 0 1px 0,\n bordercolor: $bright $bright $bright $bright,\n borderstyle: solid solid solid solid\n ),\n header: (\n background: $bright,\n padding: 16px 0,\n fontfamily: inherit,\n fontweight: $global-font-weight,\n fontcolor: $global-font-color,\n fontsize: 18px,\n textalign: center,\n verticalalign: middle,\n borderwidth: 1px 1px 1px 1px,\n bordercolor: #fff #fff #fff #fff,\n borderstyle: solid solid solid solid\n ),\n body: (\n background: $bright,\n oddbackground: $bright,\n evenbackground: #fff,\n padding: 8px 0,\n fontfamily: inherit,\n fontweight: $global-font-weight,\n fontcolor: $global-font-color,\n fontsize: 18px,\n textalign: center,\n verticalalign: middle,\n borderwidth: 1px 1px 1px 1px,\n bordercolor: #fff #fff #fff #fff,\n borderstyle: solid solid solid solid\n ),\n footer: (\n background: $bright,\n padding: 8px 0,\n fontfamily: inherit,\n fontweight: $global-font-weight,\n fontcolor: $global-font-color,\n fontsize: 18px,\n textalign: center,\n borderwidth: 1px 1px 1px 1px,\n bordercolor: #fff #fff #fff #fff,\n borderstyle: solid solid solid solid\n ),\n);\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/config/_config-tables.scss","// ======================================================================\n// Index Layout\n// ======================================================================\n\n.middle {\n @include container;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/components/layouts/_L-index.scss","// ======================================================================\n// Grid\n// ======================================================================\n\n/// Grid Total Columns\n$total-columns: 12;\n\n/// Grid Total Width\n$total-width: 100%;\n\n/// Grid Gutter Width\n$gutter-width: 2%;\n\n/// Grid Column Bottom Spacing\n$column-bottom-spacing: 24px;\n\n/// Grid Container margin\n$container-margin: 2%;\n\n/// Class to use for rows\n$class-container: 'row';\n\n/// Class to use for columns\n$class-column: 'col';\n\n/// Class to use for push\n$class-push: 'push';\n\n/// Center Containers\n$center-containers: true;\n\n/// Center Containers Max Width\n$center-container-max-width: 1140px;\n\n/// Breakpoint - tiny\n$bp-tiny: 320px;\n\n/// Breakpoint - xsmall\n$bp-xsmall: 480px;\n\n/// Breakpoint - small\n$bp-small: 640px;\n\n/// Breakpoint - medium\n$bp-medium: 800px;\n\n/// Breakpoint - large\n$bp-large: 960px;\n\n/// Breakpoint - xl\n$bp-xl: 1140px;\n\n\n\n// WEBPACK FOOTER //\n// ./src/sass/config/_config-grid.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Slate Grid\n// ======================================================================\n// Insipired by:\n// -------------------\n// Profound Grid: http://www.profoundgrid.com/\n// Semantic Grid: http://www.semantic.gs\n// Susy: http://susy.oddbird.net\n// Negative Grid: http://chrisplaneta.com/freebies/negativegrid-fluid-css-grid-by-chris-planeta/\n// ======================================================================\n/// Establish the grid-containing element. This is wrapper element for your columns.\n/// @example scss - Container\n/// .element {\n/// @include container;\n/// }\n/// @param {Variable} $grid-max-width [$center-container-max-width] - Maximum width that the containers will grow too.\n/// @param {Variable} $grid-center [$center-containers] - Center the container on the page without the need for additional markup\n/// @group Grid\n@mixin container($grid-max-width: $center-container-max-width, $grid-center: $center-containers, $c-margin: $container-margin) {\n @include clearfix('mojo');\n @if $grid-center {\n @include rem(max-width, $grid-max-width);\n margin: {\n left: auto;\n right: auto;\n }\n width: container-width($c-margin);\n } @else {\n width: container-width($c-margin);\n margin-left: $c-margin;\n margin-right: $c-margin;\n }\n}\n/// Define columns.\n/// @example scss - Column\n/// .element {\n/// @include container;\n/// .col {@include column(6,3);}\n/// }\n/// @param {Variable} $columns-width - How many columns to span\n/// @param {Variable} $padding-columns - How many columns to push over by\n/// @group Grid\n@mixin column($columns-width, $padding-columns: null, $g-width: $gutter-width) {\n float: left;\n margin-right: -100%;\n $width-perc: element-width($columns-width, $g-width);\n width: $width-perc;\n @if $padding-columns != null {\n @include push($padding-columns, $g-width);\n }\n}\n/// Push columns over.\n/// @example scss - Push\n/// .wrapper {\n/// @include container;\n/// .col {@include column(6); @include push(3);}\n/// }\n/// @param {Variable} $column-index - How many columns to push over by\n/// @group Grid\n@mixin push($column-index, $g-width: $gutter-width) {\n $width-perc: 0;\n @if $total-width == 100% {\n $width-perc: $g-width + element-width($column-index, $g-width);\n } @else {\n // $width-perc: (column_width() + $g-width)*$column-index;\n $width-perc: $g-width + element-width($column-index, $g-width);\n }\n margin-left: $width-perc;\n}\n// HELPER MIXINS\n/// Not really recommended, but if you like using a whole load of predefined classes, this is for you. It uses the column and container classes defined in the config.scss to generate CSS for a container, all columns as defined in $total-columns, and all matching push classes. Warning: This will add CSS to your project that you may or may not use.\n/// @example scss - Helper Classes\n/// @include generate_helper_classes;\n/// @example html - Helper Classes\n///
\n///
6 wide column pushed over by 3
\n///
\n/// @param {Variable} $helper-break [medium] - The breakpoint at which the columns stack up into full width columns.\n/// @group Grid\n@mixin generate-helper-classes($helper-break: $bp-medium) {\n // Helper Class: Container\n .#{$class-container} {\n @include container;\n }\n // Helper Class: Columns\n @for $i from 1 through $total-columns {\n .#{$class-column}#{$i} {\n @include column(12);\n margin-bottom: $column-bottom-spacing;\n clear: both;\n }\n }\n @include minbreak($helper-break) {\n // Helper Class: Columns\n @for $i from 1 through $total-columns {\n .#{$class-column}#{$i} {\n @include column($i);\n clear: none;\n }\n }\n // Helper Class: Horizontal Position\n @for $i from 0 through $total-columns - 1 {\n .#{$class-push}#{$i} {\n @include push($i);\n margin-bottom: $column-bottom-spacing;\n }\n }\n }\n}\n/// Use this to push equal columns over with the same class, for example a page equal sized product thumbnails or portfolio of images.\n/// Just so you know, it's much easier and more flexible to do this with the Gridler mixin :)\n/// @example scss - Grid Positions\n/// .wrapper {\n/// @include container;\n/// .positioncol {@include column(3);}\n/// @include generate_grid_positions('positioncol', 3, 26px);\n/// }\n/// @example html - Grid Positions\n///
\n///
A Pushed Column
\n///
A Pushed Column
\n///
A Pushed Column
\n///
A Pushed Column
\n///
\n/// @param {Variable} $column-selector - The class name of the element to effect.\n/// @param {Variable} $element-width - Desired column width.\n/// @param {Variable} $ggsp [$column-bottom-spacing] - Space under the repeated columns.\n/// @group Grid\n@mixin generate-grid-positions($column-selector, $element-width, $ggsp: $column-bottom-spacing, $g-width: $gutter-width) {\n $cols-per-row: floor($total-columns / $element-width);\n @for $i from 1 through $cols-per-row {\n #{$column-selector}:nth-child(#{$cols-per-row}n+#{$i}) {\n @include push(($i - 1) * $element-width, $g-width);\n @include rem(margin-bottom, $ggsp);\n @if $i == 1 {\n clear: both;\n } @else {\n clear: none;\n }\n }\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/kits/grids/_grid-kit.scss","// ======================================================================\n// Slate Engine \n// ======================================================================\n//\n// ======================================================================\n// Grid Functions\n// ======================================================================\n\n\n// Calculate element width\n@function element-width($column-index, $g-width: $gutter-width) {\n @if $total-width == 100% {\n $not-rounded-value: (100% + $g-width) / $total-columns * $column-index - $g-width;\n $not-rounded-value: $not-rounded-value * 100;\n $rounded-value: round($not-rounded-value) / 100;\n @return $rounded-value;\n } @else {\n @return ($total-width + $g-width) / $total-columns * $column-index - $g-width;\n }\n}\n\n// Calculate column width\n@function column-width($g-width: $gutter-width) {\n @if $total-width == 100% {\n $not-rounded-value: (100% + $g-width) / $total-columns - $g-width;\n $not-rounded-value: $not-rounded-value * 100;\n $rounded-value: round($not-rounded-value) / 100;\n @return $rounded-value * 1%;\n } @else {\n @return ($total-width - $g-width * ($total-columns - 1)) / $total-columns;\n }\n}\n\n// Calculate container width\n@function container-width($c-margin: $container-margin) {\n @if $total-width == 100% {\n @if $c-margin == auto {\n @return 100%;\n }\n @return 100% - 2 * $c-margin;\n } @else {\n @return $total-width;\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./node_modules/slatecore/slate/libs/functions/_grid.scss"],"sourceRoot":""} --------------------------------------------------------------------------------