mirror of
https://github.com/locomotivemtl/locomotive-boilerplate.git
synced 2026-01-15 00:55:08 +08:00
Merge remote-tracking branch 'origin/master'
Conflicts: project-x/assets/styles/dist/main.css project-x/assets/styles/src/base/_forms.scss
This commit is contained in:
Antoine Boulanger
@@ -1,4 +1,9 @@
|
||||
{
|
||||
"exclude": [
|
||||
".git/**",
|
||||
"node_modules/**",
|
||||
"bower_components/**"
|
||||
],
|
||||
"remove-empty-rulesets": true,
|
||||
"always-semicolon": true,
|
||||
"color-case": "upper",
|
||||
@@ -16,9 +21,309 @@
|
||||
"space-between-declarations": "\n",
|
||||
"space-before-opening-brace": " ",
|
||||
"space-after-opening-brace": "\n",
|
||||
"space-before-selector-delimiter": "",
|
||||
"space-after-selector-delimiter": " ",
|
||||
"space-before-closing-brace": "\n",
|
||||
"strip-spaces": true,
|
||||
"unitless-zero": true,
|
||||
"vendor-prefix-align": true
|
||||
"vendor-prefix-align": true,
|
||||
"sort-order": [
|
||||
[
|
||||
"font",
|
||||
"font-family",
|
||||
"font-size",
|
||||
"font-weight",
|
||||
"font-style",
|
||||
"font-variant",
|
||||
"font-size-adjust",
|
||||
"font-stretch",
|
||||
"font-effect",
|
||||
"font-emphasize",
|
||||
"font-emphasize-position",
|
||||
"font-emphasize-style",
|
||||
"font-smooth",
|
||||
"line-height"
|
||||
],
|
||||
[
|
||||
"position",
|
||||
"z-index",
|
||||
"top",
|
||||
"right",
|
||||
"bottom",
|
||||
"left"
|
||||
],
|
||||
[
|
||||
"display",
|
||||
"visibility",
|
||||
"float",
|
||||
"clear",
|
||||
"overflow",
|
||||
"overflow-x",
|
||||
"overflow-y",
|
||||
"-ms-overflow-x",
|
||||
"-ms-overflow-y",
|
||||
"clip",
|
||||
"zoom",
|
||||
"flex-direction",
|
||||
"flex-order",
|
||||
"flex-pack",
|
||||
"flex-align"
|
||||
],
|
||||
[
|
||||
"-webkit-box-sizing",
|
||||
"-moz-box-sizing",
|
||||
"box-sizing",
|
||||
"width",
|
||||
"min-width",
|
||||
"max-width",
|
||||
"height",
|
||||
"min-height",
|
||||
"max-height",
|
||||
"margin",
|
||||
"margin-top",
|
||||
"margin-right",
|
||||
"margin-bottom",
|
||||
"margin-left",
|
||||
"padding",
|
||||
"padding-top",
|
||||
"padding-right",
|
||||
"padding-bottom",
|
||||
"padding-left"
|
||||
],
|
||||
[
|
||||
"table-layout",
|
||||
"empty-cells",
|
||||
"caption-side",
|
||||
"border-spacing",
|
||||
"border-collapse",
|
||||
"list-style",
|
||||
"list-style-position",
|
||||
"list-style-type",
|
||||
"list-style-image"
|
||||
],
|
||||
[
|
||||
"content",
|
||||
"quotes",
|
||||
"counter-reset",
|
||||
"counter-increment",
|
||||
"resize",
|
||||
"cursor",
|
||||
"-webkit-user-select",
|
||||
"-moz-user-select",
|
||||
"-ms-user-select",
|
||||
"user-select",
|
||||
"nav-index",
|
||||
"nav-up",
|
||||
"nav-right",
|
||||
"nav-down",
|
||||
"nav-left",
|
||||
"-webkit-transition",
|
||||
"-moz-transition",
|
||||
"-ms-transition",
|
||||
"-o-transition",
|
||||
"transition",
|
||||
"-webkit-transition-delay",
|
||||
"-moz-transition-delay",
|
||||
"-ms-transition-delay",
|
||||
"-o-transition-delay",
|
||||
"transition-delay",
|
||||
"-webkit-transition-timing-function",
|
||||
"-moz-transition-timing-function",
|
||||
"-ms-transition-timing-function",
|
||||
"-o-transition-timing-function",
|
||||
"transition-timing-function",
|
||||
"-webkit-transition-duration",
|
||||
"-moz-transition-duration",
|
||||
"-ms-transition-duration",
|
||||
"-o-transition-duration",
|
||||
"transition-duration",
|
||||
"-webkit-transition-property",
|
||||
"-moz-transition-property",
|
||||
"-ms-transition-property",
|
||||
"-o-transition-property",
|
||||
"transition-property",
|
||||
"-webkit-transform",
|
||||
"-moz-transform",
|
||||
"-ms-transform",
|
||||
"-o-transform",
|
||||
"transform",
|
||||
"-webkit-transform-origin",
|
||||
"-moz-transform-origin",
|
||||
"-ms-transform-origin",
|
||||
"-o-transform-origin",
|
||||
"transform-origin",
|
||||
"-webkit-animation",
|
||||
"-moz-animation",
|
||||
"-ms-animation",
|
||||
"-o-animation",
|
||||
"animation",
|
||||
"-webkit-animation-name",
|
||||
"-moz-animation-name",
|
||||
"-ms-animation-name",
|
||||
"-o-animation-name",
|
||||
"animation-name",
|
||||
"-webkit-animation-duration",
|
||||
"-moz-animation-duration",
|
||||
"-ms-animation-duration",
|
||||
"-o-animation-duration",
|
||||
"animation-duration",
|
||||
"-webkit-animation-play-state",
|
||||
"-moz-animation-play-state",
|
||||
"-ms-animation-play-state",
|
||||
"-o-animation-play-state",
|
||||
"animation-play-state",
|
||||
"-webkit-animation-timing-function",
|
||||
"-moz-animation-timing-function",
|
||||
"-ms-animation-timing-function",
|
||||
"-o-animation-timing-function",
|
||||
"animation-timing-function",
|
||||
"-webkit-animation-delay",
|
||||
"-moz-animation-delay",
|
||||
"-ms-animation-delay",
|
||||
"-o-animation-delay",
|
||||
"animation-delay",
|
||||
"-webkit-animation-iteration-count",
|
||||
"-moz-animation-iteration-count",
|
||||
"-ms-animation-iteration-count",
|
||||
"-o-animation-iteration-count",
|
||||
"animation-iteration-count",
|
||||
"-webkit-animation-direction",
|
||||
"-moz-animation-direction",
|
||||
"-ms-animation-direction",
|
||||
"-o-animation-direction",
|
||||
"animation-direction",
|
||||
"text-align",
|
||||
"-webkit-text-align-last",
|
||||
"-moz-text-align-last",
|
||||
"-ms-text-align-last",
|
||||
"text-align-last",
|
||||
"vertical-align",
|
||||
"white-space",
|
||||
"text-decoration",
|
||||
"text-emphasis",
|
||||
"text-emphasis-color",
|
||||
"text-emphasis-style",
|
||||
"text-emphasis-position",
|
||||
"text-indent",
|
||||
"-ms-text-justify",
|
||||
"text-justify",
|
||||
"letter-spacing",
|
||||
"word-spacing",
|
||||
"-ms-writing-mode",
|
||||
"text-outline",
|
||||
"text-transform",
|
||||
"text-wrap",
|
||||
"text-overflow",
|
||||
"-ms-text-overflow",
|
||||
"text-overflow-ellipsis",
|
||||
"text-overflow-mode",
|
||||
"-ms-word-wrap",
|
||||
"word-wrap",
|
||||
"word-break",
|
||||
"-ms-word-break",
|
||||
"-moz-tab-size",
|
||||
"-o-tab-size",
|
||||
"tab-size",
|
||||
"-webkit-hyphens",
|
||||
"-moz-hyphens",
|
||||
"hyphens",
|
||||
"pointer-events"
|
||||
],
|
||||
[
|
||||
"opacity",
|
||||
"filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
|
||||
"-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha",
|
||||
"-ms-interpolation-mode",
|
||||
"color",
|
||||
"border",
|
||||
"border-width",
|
||||
"border-style",
|
||||
"border-color",
|
||||
"border-top",
|
||||
"border-top-width",
|
||||
"border-top-style",
|
||||
"border-top-color",
|
||||
"border-right",
|
||||
"border-right-width",
|
||||
"border-right-style",
|
||||
"border-right-color",
|
||||
"border-bottom",
|
||||
"border-bottom-width",
|
||||
"border-bottom-style",
|
||||
"border-bottom-color",
|
||||
"border-left",
|
||||
"border-left-width",
|
||||
"border-left-style",
|
||||
"border-left-color",
|
||||
"-webkit-border-radius",
|
||||
"-moz-border-radius",
|
||||
"border-radius",
|
||||
"-webkit-border-top-left-radius",
|
||||
"-moz-border-radius-topleft",
|
||||
"border-top-left-radius",
|
||||
"-webkit-border-top-right-radius",
|
||||
"-moz-border-radius-topright",
|
||||
"border-top-right-radius",
|
||||
"-webkit-border-bottom-right-radius",
|
||||
"-moz-border-radius-bottomright",
|
||||
"border-bottom-right-radius",
|
||||
"-webkit-border-bottom-left-radius",
|
||||
"-moz-border-radius-bottomleft",
|
||||
"border-bottom-left-radius",
|
||||
"-webkit-border-image",
|
||||
"-moz-border-image",
|
||||
"-o-border-image",
|
||||
"border-image",
|
||||
"-webkit-border-image-source",
|
||||
"-moz-border-image-source",
|
||||
"-o-border-image-source",
|
||||
"border-image-source",
|
||||
"-webkit-border-image-slice",
|
||||
"-moz-border-image-slice",
|
||||
"-o-border-image-slice",
|
||||
"border-image-slice",
|
||||
"-webkit-border-image-width",
|
||||
"-moz-border-image-width",
|
||||
"-o-border-image-width",
|
||||
"border-image-width",
|
||||
"-webkit-border-image-outset",
|
||||
"-moz-border-image-outset",
|
||||
"-o-border-image-outset",
|
||||
"border-image-outset",
|
||||
"-webkit-border-image-repeat",
|
||||
"-moz-border-image-repeat",
|
||||
"-o-border-image-repeat",
|
||||
"border-image-repeat",
|
||||
"outline",
|
||||
"outline-width",
|
||||
"outline-style",
|
||||
"outline-color",
|
||||
"outline-offset",
|
||||
"background",
|
||||
"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
|
||||
"background-color",
|
||||
"background-image",
|
||||
"background-repeat",
|
||||
"background-attachment",
|
||||
"background-position",
|
||||
"background-position-x",
|
||||
"-ms-background-position-x",
|
||||
"background-position-y",
|
||||
"-ms-background-position-y",
|
||||
"-webkit-background-clip",
|
||||
"-moz-background-clip",
|
||||
"background-clip",
|
||||
"background-origin",
|
||||
"-webkit-background-size",
|
||||
"-moz-background-size",
|
||||
"-o-background-size",
|
||||
"background-size",
|
||||
"box-decoration-break",
|
||||
"-webkit-box-shadow",
|
||||
"-moz-box-shadow",
|
||||
"box-shadow",
|
||||
"filter:progid:DXImageTransform.Microsoft.gradient",
|
||||
"-ms-filter:\\'progid:DXImageTransform.Microsoft.gradient",
|
||||
"text-shadow"
|
||||
]
|
||||
]
|
||||
}
|
||||
@@ -1,9 +1,6 @@
|
||||
module.exports = function(grunt) {
|
||||
'use strict';
|
||||
|
||||
// Load Grunt tasks from NPM packages
|
||||
require('load-grunt-tasks')(grunt);
|
||||
|
||||
// Project configuration.
|
||||
grunt.initConfig({
|
||||
pkg: grunt.file.readJSON( 'package.json' ),
|
||||
@@ -21,11 +18,19 @@ module.exports = function(grunt) {
|
||||
sass: {
|
||||
dist: {
|
||||
files: {
|
||||
'assets/styles/dist/main.css': 'assets/styles/src/main.scss',
|
||||
'assets/styles/dist/main.ie8.css': 'assets/styles/src/main.ie8.scss'
|
||||
'assets/styles/dist/main.css': 'assets/styles/src/main.scss'
|
||||
}
|
||||
}
|
||||
},
|
||||
csscomb: {
|
||||
build: {
|
||||
expand: true,
|
||||
cwd: 'assets/styles/src/',
|
||||
src: ['**/*.scss'],
|
||||
dest: 'assets/styles/src/'
|
||||
}
|
||||
},
|
||||
|
||||
autoprefixer: {
|
||||
build: {
|
||||
options: {
|
||||
@@ -85,7 +90,19 @@ module.exports = function(grunt) {
|
||||
}
|
||||
});
|
||||
|
||||
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||
//grunt.loadNpmTasks('grunt-contrib-sass');
|
||||
grunt.loadNpmTasks('grunt-sass');
|
||||
grunt.loadNpmTasks('grunt-notify');
|
||||
grunt.loadNpmTasks('grunt-autoprefixer');
|
||||
grunt.loadNpmTasks('grunt-contrib-concat');
|
||||
grunt.loadNpmTasks('grunt-contrib-uglify');
|
||||
grunt.loadNpmTasks('grunt-csscomb');
|
||||
|
||||
|
||||
grunt.registerTask('default', ['watch']);
|
||||
grunt.registerTask('build', ['uglify']);
|
||||
grunt.registerTask('c', ['csscomb']);
|
||||
grunt.registerTask('s', ['sass']);
|
||||
|
||||
};
|
||||
|
||||
28
project-x/assets/styles/src/_import.scss
vendored
28
project-x/assets/styles/src/_import.scss
vendored
@@ -2,21 +2,19 @@
|
||||
Imports
|
||||
========================================================================== */
|
||||
@import
|
||||
'settings'
|
||||
"settings"
|
||||
|
||||
, 'vendors/jacket'
|
||||
, "vendors/jacket"
|
||||
|
||||
, 'tools/functions'
|
||||
, 'tools/mixins'
|
||||
, "base/base"
|
||||
, "base/fonts"
|
||||
, "base/forms"
|
||||
, "base/grid"
|
||||
|
||||
, 'generic/helpers'
|
||||
, 'generic/trumps'
|
||||
|
||||
, 'base/normalize'
|
||||
, 'base/fonts'
|
||||
, 'base/base'
|
||||
, 'base/headings'
|
||||
, 'base/grid'
|
||||
, 'base/forms'
|
||||
|
||||
;
|
||||
, "tools/functions"
|
||||
, "tools/mixins"
|
||||
|
||||
, "generic/helpers"
|
||||
, "generic/normalize"
|
||||
, "generic/trumps"
|
||||
;
|
||||
@@ -7,16 +7,14 @@
|
||||
$font-size: 16px;
|
||||
$line-height: 1.4;
|
||||
$font-family: sans-serif;
|
||||
$color: #222;
|
||||
|
||||
$heading-1: 32px; // .alpha
|
||||
$heading-2: 24px; // .beta
|
||||
$heading-3: 19px; // .gamma
|
||||
$heading-4: 16px; // .delta
|
||||
$heading-5: 13px; // .epsilon
|
||||
$heading-6: 11px; // .zeta
|
||||
$color: #222222;
|
||||
$heading-n1: 32px; // .alpha
|
||||
$heading-n2: 24px; // .beta
|
||||
$heading-n3: 19px; // .gamma
|
||||
$heading-n4: 16px; // .delta
|
||||
$heading-n5: 13px; // .epsilon
|
||||
$heading-n6: 11px; // .zeta
|
||||
$heading-line-height: 1.2;
|
||||
|
||||
$milli-size: 10px !default;
|
||||
$micro-size: 8px !default;
|
||||
|
||||
@@ -24,37 +22,34 @@ $micro-size: 8px !default;
|
||||
/* Colour Palette
|
||||
========================================================================== */
|
||||
$black: #000000;
|
||||
$white: #ffffff;
|
||||
|
||||
$link: #1a0dab;
|
||||
$link-hover: darken(#1a0dab, 10%);
|
||||
$white: #FFFFFF;
|
||||
$link: #1A0DAB;
|
||||
$link-hover: darken(#1A0DAB, 10%);
|
||||
$body: #3D3D3D;
|
||||
|
||||
|
||||
/* Spacings
|
||||
========================================================================== */
|
||||
$margin-10: 10px;
|
||||
$margin-20: 20px;
|
||||
$margin-30: 30px;
|
||||
$margin-40: 40px;
|
||||
$margin-n10: 10px;
|
||||
$margin-n20: 20px;
|
||||
$margin-n30: 30px;
|
||||
$margin-n40: 40px;
|
||||
|
||||
|
||||
/* Z-index
|
||||
========================================================================== */
|
||||
$z-index-1: 50;
|
||||
$z-index-2: 150;
|
||||
$z-index-3: 250;
|
||||
$z-index-n1: 50;
|
||||
$z-index-n2: 150;
|
||||
$z-index-n3: 250;
|
||||
|
||||
/* Screen widths
|
||||
========================================================================== */
|
||||
$from-tablet: 768px;
|
||||
$to-tablet: $from-tablet - 1;
|
||||
|
||||
$from-desktop: 1024px;
|
||||
$to-desktop: $from-desktop - 1;
|
||||
|
||||
$from-laptop: 1280px;
|
||||
$to-laptop: $from-laptop - 1;
|
||||
|
||||
$from-wide: 1680px;
|
||||
$to-wide: $from-wide - 1;
|
||||
|
||||
|
||||
@@ -6,7 +6,12 @@
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: $font-family;
|
||||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
|
||||
box-sizing: border-box;
|
||||
|
||||
font-size : $font-size;
|
||||
font-family : $font-family;
|
||||
line-height : $line-height;
|
||||
@@ -14,26 +19,29 @@ html {
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
background: #B3D4FC;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
display: block;
|
||||
|
||||
height: 1px;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
|
||||
border: 0;
|
||||
border-top: 1px solid #CCCCCC;
|
||||
}
|
||||
|
||||
img, svg {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
max-width: 100%;
|
||||
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -46,5 +54,6 @@ a {
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@@ -5,13 +5,16 @@
|
||||
/* Input
|
||||
========================================================================== */
|
||||
.input {
|
||||
background-color: #ccc;
|
||||
width: 100%;
|
||||
background-color: #cccccc;
|
||||
display: block;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
width: 100%;
|
||||
|
||||
color: $black;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
outline: none;
|
||||
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
@@ -86,3 +89,4 @@
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -2,26 +2,30 @@
|
||||
Grid
|
||||
========================================================================== */
|
||||
.grid {
|
||||
position: relative;
|
||||
margin-left: -$margin-20;
|
||||
font-size: 0;
|
||||
|
||||
position: relative;
|
||||
|
||||
margin-left: -$margin-20;
|
||||
}
|
||||
|
||||
.grid--full {
|
||||
margin-left: 0;
|
||||
|
||||
.grid__item {
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.grid__item {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
vertical-align: top;
|
||||
padding-left: $margin-20;
|
||||
display: inline-block;
|
||||
|
||||
width: 100%;
|
||||
margin-bottom: $margin-20;
|
||||
padding-left: $margin-20;
|
||||
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.whole {
|
||||
|
||||
@@ -1,38 +1,44 @@
|
||||
/* ==========================================================================
|
||||
Headings
|
||||
========================================================================== */
|
||||
h1, .h1, .alpha{
|
||||
font-size: $heading-1;
|
||||
line-height: $heading-line-height;
|
||||
margin-top: 0;
|
||||
h1, .h1, .alpha {
|
||||
font-size: $heading-1;
|
||||
line-height: $heading-line-height;
|
||||
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h2, .h2, .beta{
|
||||
font-size: $heading-2;
|
||||
line-height: $heading-line-height;
|
||||
margin-top: 0;
|
||||
h2, .h2, .beta {
|
||||
font-size: $heading-2;
|
||||
line-height: $heading-line-height;
|
||||
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h3, .h3, .gamma{
|
||||
font-size: $heading-3;
|
||||
line-height: $heading-line-height;
|
||||
margin-top: 0;
|
||||
h3, .h3, .gamma {
|
||||
font-size: $heading-3;
|
||||
line-height: $heading-line-height;
|
||||
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h4, .h4, .delta{
|
||||
font-size: $heading-4;
|
||||
line-height: $heading-line-height;
|
||||
margin-top: 0;
|
||||
h4, .h4, .delta {
|
||||
font-size: $heading-4;
|
||||
line-height: $heading-line-height;
|
||||
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h5, .h5, .epsilon{
|
||||
font-size: $heading-5;
|
||||
line-height: $heading-line-height;
|
||||
margin-top: 0;
|
||||
h5, .h5, .epsilon {
|
||||
font-size: $heading-5;
|
||||
line-height: $heading-line-height;
|
||||
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h6, .h6, .zeta{
|
||||
font-size: $heading-6;
|
||||
line-height: $heading-line-height;
|
||||
margin-top: 0;
|
||||
h6, .h6, .zeta {
|
||||
font-size: $heading-6;
|
||||
line-height: $heading-line-height;
|
||||
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@@ -7,9 +7,10 @@
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
font-family: sans-serif; /* 1 */
|
||||
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -17,7 +18,7 @@ html {
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* HTML5 display definitions
|
||||
@@ -29,19 +30,8 @@ body {
|
||||
* Correct `block` display not defined for `main` in IE 11.
|
||||
*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -49,12 +39,10 @@ summary {
|
||||
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
audio, canvas, progress, video {
|
||||
display: inline-block; /* 1 */
|
||||
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -63,8 +51,9 @@ video {
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
display: none;
|
||||
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -72,9 +61,8 @@ audio:not([controls]) {
|
||||
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||
*/
|
||||
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
[hidden], template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Links
|
||||
@@ -85,16 +73,15 @@ template {
|
||||
*/
|
||||
|
||||
a {
|
||||
background: transparent;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* Improve readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
a:active, a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
@@ -105,16 +92,15 @@ a:hover {
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
b, strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -122,7 +108,7 @@ strong {
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -131,8 +117,9 @@ dfn {
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
font-size: 2em;
|
||||
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -140,8 +127,8 @@ h1 {
|
||||
*/
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
color: #000000;
|
||||
background: #FFFF00;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -149,27 +136,28 @@ mark {
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
sub, sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
|
||||
position: relative;
|
||||
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
@@ -180,7 +168,7 @@ sub {
|
||||
*/
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -188,7 +176,7 @@ img {
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
@@ -199,7 +187,7 @@ svg:not(:root) {
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
margin: 1em 40px;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -207,9 +195,9 @@ figure {
|
||||
*/
|
||||
|
||||
hr {
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -217,19 +205,16 @@ hr {
|
||||
*/
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address odd `em`-unit font size rendering in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
code, kbd, pre, samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
@@ -247,14 +232,12 @@ samp {
|
||||
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
margin: 0; /* 3 */
|
||||
button, input, optgroup, select, textarea {
|
||||
font: inherit; /* 2 */
|
||||
|
||||
margin: 0; /* 3 */
|
||||
|
||||
color: inherit; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -262,7 +245,7 @@ textarea {
|
||||
*/
|
||||
|
||||
button {
|
||||
overflow: visible;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -272,9 +255,8 @@ button {
|
||||
* Correct `select` style inheritance in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
button, select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -285,31 +267,29 @@ select {
|
||||
* `input` and others.
|
||||
*/
|
||||
|
||||
button,
|
||||
html input[type="button"], /* 1 */
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
cursor: pointer; /* 3 */
|
||||
button, html input[type="button"], /* 1 */
|
||||
input[type="reset"], input[type="submit"] {
|
||||
cursor: pointer; /* 3 */
|
||||
|
||||
-webkit-appearance: button; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
button[disabled], html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove inner padding and border in Firefox 4+.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
button::-moz-focus-inner, input::-moz-focus-inner {
|
||||
padding: 0;
|
||||
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -318,7 +298,7 @@ input::-moz-focus-inner {
|
||||
*/
|
||||
|
||||
input {
|
||||
line-height: normal;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -329,10 +309,9 @@ input {
|
||||
* 2. Remove excess padding in IE 8/9/10.
|
||||
*/
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
input[type="checkbox"], input[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -341,9 +320,8 @@ input[type="radio"] {
|
||||
* decrement button to change from `default` to `text`.
|
||||
*/
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -353,10 +331,11 @@ input[type="number"]::-webkit-outer-spin-button {
|
||||
*/
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box; /* 2 */
|
||||
box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box; /* 2 */
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -365,9 +344,8 @@ input[type="search"] {
|
||||
* padding (and `textfield` appearance).
|
||||
*/
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -375,9 +353,10 @@ input[type="search"]::-webkit-search-decoration {
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
|
||||
border: 1px solid #C0C0C0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -386,8 +365,9 @@ fieldset {
|
||||
*/
|
||||
|
||||
legend {
|
||||
border: 0; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
padding: 0; /* 2 */
|
||||
|
||||
border: 0; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -395,7 +375,7 @@ legend {
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -404,7 +384,7 @@ textarea {
|
||||
*/
|
||||
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Tables
|
||||
@@ -415,11 +395,10 @@ optgroup {
|
||||
*/
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
td, th {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@@ -1,29 +1,33 @@
|
||||
/* ==========================================================================
|
||||
Helpers
|
||||
========================================================================== */
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
.clearfix:before, .clearfix:after {
|
||||
display: table;
|
||||
|
||||
content: " ";
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.center-vertically {
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
height: 100%;
|
||||
|
||||
&:before {
|
||||
content : "";
|
||||
display : inline-block;
|
||||
height : 100%;
|
||||
vertical-align : middle;
|
||||
}
|
||||
text-align: center;
|
||||
|
||||
> * {
|
||||
display : inline-block;
|
||||
vertical-align : middle;
|
||||
}
|
||||
&:before {
|
||||
display: inline-block;
|
||||
|
||||
height: 100%;
|
||||
|
||||
content: "";
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
> * {
|
||||
display: inline-block;
|
||||
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -23,11 +23,13 @@
|
||||
|
||||
.is-visible {
|
||||
visibility: visible !important;
|
||||
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.is-hidden {
|
||||
visibility: hidden !important;
|
||||
|
||||
opacity: 0 !important;
|
||||
}
|
||||
|
||||
@@ -38,8 +40,8 @@
|
||||
*/
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden;
|
||||
display: none !important;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -47,14 +49,17 @@
|
||||
*/
|
||||
|
||||
.visuallyhidden {
|
||||
border: 0;
|
||||
clip: rect(0 0 0 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
position: absolute;
|
||||
|
||||
overflow: hidden;
|
||||
clip: rect(0 0 0 0);
|
||||
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -62,14 +67,15 @@
|
||||
* when navigated to via the keyboard: h5bp.com/p
|
||||
*/
|
||||
|
||||
.visuallyhidden.focusable:active,
|
||||
.visuallyhidden.focusable:focus {
|
||||
clip: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
position: static;
|
||||
width: auto;
|
||||
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
|
||||
position: static;
|
||||
|
||||
overflow: visible;
|
||||
clip: auto;
|
||||
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -77,5 +83,5 @@
|
||||
*/
|
||||
|
||||
.invisible {
|
||||
visibility: hidden;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
* ==========================================================================
|
||||
*
|
||||
*/
|
||||
$jacket : vanilla;
|
||||
$jacket: vanilla;
|
||||
|
||||
@import 'import';
|
||||
@import "import";
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
Functions
|
||||
========================================================================== */
|
||||
@function em($px, $base: $font-size) {
|
||||
@return ($px / $base) * 1em;
|
||||
@return ($px / $base) * 1em;
|
||||
}
|
||||
|
||||
@function rem($px, $base: $font-size) {
|
||||
@return ($px / $base) * 1rem;
|
||||
@return ($px / $base) * 1rem;
|
||||
}
|
||||
|
||||
@function span($fraction) {
|
||||
@return $fraction * 100%;
|
||||
@return $fraction * 100%;
|
||||
}
|
||||
|
||||
@@ -11,12 +11,13 @@
|
||||
"load-grunt-tasks": "0.6.0",
|
||||
"grunt-contrib-watch": "0.6.1",
|
||||
"grunt-contrib-sass": "0.8.1",
|
||||
"grunt-sass": "0.14.2",
|
||||
"grunt-sass": "^0.14.0",
|
||||
"grunt-notify": "0.3.1",
|
||||
"grunt-autoprefixer": "1.0.1",
|
||||
"grunt-contrib-concat": "0.5.0",
|
||||
"grunt-contrib-uglify": "0.6.0",
|
||||
"grunt-contrib-imagemin": "0.8.1",
|
||||
"grunt-csscomb": "3.0.0"
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user