diff options
73 files changed, 1197 insertions, 902 deletions
diff --git a/Gruntfile.js b/Gruntfile.js index dff1fadb9e..8b282a20b9 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -218,24 +218,26 @@ module.exports = function (grunt) { } }, - csslint: { + stylelint: { options: { - csslintrc: 'less/.csslintrc' + configFile: 'grunt/.stylelintrc', + formatter: 'string', + ignoreDisables: false, + failOnError: true, + outputFile: '', + reportNeedlessDisables: false, + syntax: '' }, dist: [ - 'dist/css/bootstrap.css', - 'dist/css/bootstrap-theme.css' + 'less/**/*.less' + ], + docs: [ + 'docs/assets/less/**/*.less' ], examples: [ 'docs/examples/**/*.css' - ], - docs: { - options: { - ids: false, - 'overqualified-elements': false - }, - src: 'docs/assets/css/src/docs.css' - } + ] + }, cssmin: { @@ -464,7 +466,7 @@ module.exports = function (grunt) { if (runSubset('core') && // Skip core tests if this is a Savage build process.env.TRAVIS_REPO_SLUG !== 'twbs-savage/bootstrap') { - testSubtasks = testSubtasks.concat(['dist-css', 'dist-js', 'csslint:dist', 'test-js', 'docs']); + testSubtasks = testSubtasks.concat(['dist-css', 'dist-js', 'stylelint:dist', 'test-js', 'docs']); } // Skip HTML validation if running a different subset of the test suite if (runSubset('validate-html') && @@ -515,7 +517,7 @@ module.exports = function (grunt) { // Docs task. grunt.registerTask('docs-css', ['autoprefixer:docs', 'autoprefixer:examples', 'csscomb:docs', 'csscomb:examples', 'cssmin:minifyDocs']); - grunt.registerTask('lint-docs-css', ['csslint:docs', 'csslint:examples']); + grunt.registerTask('lint-docs-css', ['stylelint:docs', 'stylelint:examples']); grunt.registerTask('docs-js', ['uglify:docsJs', 'uglify:customize']); grunt.registerTask('lint-docs-js', ['jshint:assets', 'jscs:assets']); grunt.registerTask('docs', ['docs-css', 'lint-docs-css', 'docs-js', 'lint-docs-js', 'clean:docs', 'copy:docs', 'build-glyphicons-data', 'build-customizer']); diff --git a/docs/assets/less/ads.less b/docs/assets/less/ads.less index 168a01fc61..9e64da5209 100644 --- a/docs/assets/less/ads.less +++ b/docs/assets/less/ads.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-id, declaration-no-important */ + #carbonads { display: block; padding: 15px 15px 15px 160px; diff --git a/docs/assets/less/algolia.less b/docs/assets/less/algolia.less index b6484f04fb..7cab593397 100644 --- a/docs/assets/less/algolia.less +++ b/docs/assets/less/algolia.less @@ -1,3 +1,5 @@ +/* stylelint-disable declaration-no-important, selector-attribute-quotes */ + // Docsearch overrides // // `!important` indicates overridden properties. @@ -12,8 +14,9 @@ padding: 10px 0 !important; background-color: #fff; background-clip: padding-box; - border: 1px solid rgba(0,0,0,.1); - box-shadow: 0 8px 15px rgba(0,0,0,.175); + border: 1px solid #ddd; + border: 1px solid rgba(0, 0, 0, .1); + box-shadow: 0 8px 15px rgba(0, 0, 0, .175); @media min-width(@screen-sm-min) { width: 175%; @@ -79,7 +82,7 @@ .algolia-docsearch-suggestion--category-header { padding-top: 10px !important; margin-top: 10px !important; - border-top: 1px solid rgba(0,0,0,.1); + border-top: 1px solid #eee; } } @@ -100,7 +103,7 @@ padding: 0 15px 8px !important; margin-top: -4px; font-size: 13px !important; - font-weight: normal; + font-weight: 400; line-height: 1.25 !important; } @@ -112,7 +115,7 @@ font-size: 10px !important; line-height: 1 !important; color: #767676 !important; - border-top: 1px solid rgba(0,0,0,.1); + border-top: 1px solid #eee; } .algolia-docsearch-footer--logo { @@ -125,14 +128,14 @@ .algolia-docsearch-suggestion--highlight { color: #5f2dab; - background-color: rgba(154, 132, 187, .12); + background-color: #eee; } .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { - box-shadow: inset 0 -2px 0 0 rgba(95,45,171,.5) !important; + box-shadow: inset 0 -2px 0 0 rgba(95, 45, 171, .5) !important; } .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content { - background-color: rgba(208,189,236,.15) !important; + background-color: #e5e5e5 !important; } } diff --git a/docs/assets/less/anchor.less b/docs/assets/less/anchor.less index b7718a8377..3054ec8c01 100644 --- a/docs/assets/less/anchor.less +++ b/docs/assets/less/anchor.less @@ -1,3 +1,5 @@ +/* stylelint-disable property-no-vendor-prefix */ + .anchorjs-link { color: inherit; } @@ -11,8 +13,8 @@ *:hover > .anchorjs-link { opacity: .75; -webkit-transition: color .16s linear; - -o-transition: color .16s linear; - transition: color .16s linear; + -o-transition: color .16s linear; + transition: color .16s linear; } *:hover > .anchorjs-link:hover, diff --git a/docs/assets/less/customizer.less b/docs/assets/less/customizer.less index c36fbc15f0..a87fca971e 100644 --- a/docs/assets/less/customizer.less +++ b/docs/assets/less/customizer.less @@ -1,3 +1,5 @@ +/* stylelint-disable property-no-vendor-prefix, selector-max-id */ + .bs-customizer .toggle { float: right; margin-top: 25px; @@ -36,7 +38,7 @@ // For the variables, use regular weight #less-section label { - font-weight: normal; + font-weight: 400; } // Downloads @@ -55,8 +57,8 @@ color: #fff; background-color: #d9534f; border-bottom: 1px solid #b94441; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25); - box-shadow: inset 0 1px 0 rgba(255,255,255,.25); + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); } .bs-customizer-alert .close { margin-top: -4px; @@ -73,8 +75,8 @@ color: #fff; background-color: #a83c3a; border-color: #973634; - -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1); - box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1); + -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); + box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); } .bs-dropzone { @@ -97,7 +99,7 @@ } .bs-dropzone .lead { margin-bottom: 10px; - font-weight: normal; + font-weight: 400; color: #333; } #import-manual-trigger { diff --git a/docs/assets/less/docs.less b/docs/assets/less/docs.less index 8bf588ade8..4ef7a7d3d3 100644 --- a/docs/assets/less/docs.less +++ b/docs/assets/less/docs.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-type, selector-no-qualifying-type, declaration-no-important */ + /*! * Bootstrap Docs (http://getbootstrap.com) * Copyright 2011-2017 Twitter, Inc. @@ -51,7 +53,7 @@ body { // Keep code small in tables on account of limited space .table code { font-size: 13px; - font-weight: normal; + font-weight: 400; } // Inline code within headings retain the heading's background-color @@ -106,7 +108,7 @@ h1[id] { .v4-tease { display: block; padding: 15px 20px; - font-weight: bold; + font-weight: 700; color: #fff; text-align: center; background-color: #0275d8; @@ -119,7 +121,7 @@ h1[id] { /* Nullify ill-advised printing of hrefs; see #18711 */ @media print { - a[href]:after { + a[href]::after { content: "" !important; } } diff --git a/docs/assets/less/examples.less b/docs/assets/less/examples.less index 6407cc97b6..8d92ac52df 100644 --- a/docs/assets/less/examples.less +++ b/docs/assets/less/examples.less @@ -1,3 +1,5 @@ +/* stylelint-disable property-no-vendor-prefix, selector-max-id, selector-no-qualifying-type */ + // Grid examples // // Highlight the grid columns within the docs so folks can see their padding, @@ -10,9 +12,9 @@ padding-top: 10px; padding-bottom: 10px; background-color: #eee; - background-color: rgba(86,61,124,.15); + background-color: rgba(86, 61, 124, .15); border: 1px solid #ddd; - border: 1px solid rgba(86,61,124,.2); + border: 1px solid rgba(86, 61, 124, .2); } // Examples @@ -27,16 +29,16 @@ border-color: #e5e5e5 #eee #eee; border-style: solid; border-width: 1px 0; - -webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05); - box-shadow: inset 0 3px 6px rgba(0,0,0,.05); + -webkit-box-shadow: inset 0 3px 6px rgba(0, 0, 0, .05); + box-shadow: inset 0 3px 6px rgba(0, 0, 0, .05); } // Echo out a label for the example -.bs-example:after { +.bs-example::after { position: absolute; top: 15px; left: 15px; font-size: 12px; - font-weight: bold; + font-weight: 700; color: #959595; text-transform: uppercase; letter-spacing: 1px; @@ -65,7 +67,7 @@ border-width: 1px; border-radius: 4px 4px 0 0; -webkit-box-shadow: none; - box-shadow: none; + box-shadow: none; } .bs-example + .highlight, .bs-example + .zero-clipboard + .highlight { @@ -156,9 +158,11 @@ } // Forms -.bs-example-control-sizing select, -.bs-example-control-sizing input[type="text"] + input[type="text"] { - margin-top: 10px; +.bs-example-control-sizing { + select, + input[type="text"] + input[type="text"] { + margin-top: 10px; + } } .bs-example-form .input-group { margin-bottom: 10px; @@ -195,7 +199,7 @@ .bs-navbar-top-example { padding-bottom: 45px; } -.bs-navbar-top-example:after { +.bs-navbar-top-example::after { top: auto; bottom: 15px; } @@ -311,10 +315,10 @@ // Pseudo :focus state for showing how it looks in the docs #focusedInput { - border-color: rgb(204,204,204); // Restate unfocused value to make CSSLint happy that there's a pre-CSS3 fallback - border-color: rgba(82,168,236,.8); + border-color: rgb(204, 204, 204); // Restate unfocused value to make CSSLint happy that there's a pre-CSS3 fallback + border-color: rgba(82, 168, 236, .8); outline: 0; outline: thin dotted \9; // IE6-9 - -webkit-box-shadow: 0 0 8px rgba(82,168,236,.6); - box-shadow: 0 0 8px rgba(82,168,236,.6); + -webkit-box-shadow: 0 0 8px rgba(82, 168, 236, .6); + box-shadow: 0 0 8px rgba(82, 168, 236, .6); } diff --git a/docs/assets/less/featurettes.less b/docs/assets/less/featurettes.less index 7df3e94d54..ec939c7b06 100644 --- a/docs/assets/less/featurettes.less +++ b/docs/assets/less/featurettes.less @@ -16,7 +16,7 @@ .bs-docs-featurette-title { margin-bottom: 5px; font-size: 30px; - font-weight: normal; + font-weight: 400; color: #333; } .half-rule { @@ -25,7 +25,7 @@ } .bs-docs-featurette h3 { margin-bottom: 5px; - font-weight: normal; + font-weight: 400; color: #333; } .bs-docs-featurette-img { diff --git a/docs/assets/less/ie10-viewport-bug-workaround.less b/docs/assets/less/ie10-viewport-bug-workaround.less index 6ac824f93f..a09b8d9ff8 100644 --- a/docs/assets/less/ie10-viewport-bug-workaround.less +++ b/docs/assets/less/ie10-viewport-bug-workaround.less @@ -1,3 +1,5 @@ +/* stylelint-disable at-rule-no-vendor-prefix */ + /*! * IE10 viewport hack for Surface/desktop Windows 8 bug * Copyright 2014-2015 Twitter, Inc. diff --git a/docs/assets/less/masthead.less b/docs/assets/less/masthead.less index 20c9a2671d..284fdece70 100644 --- a/docs/assets/less/masthead.less +++ b/docs/assets/less/masthead.less @@ -1,17 +1,19 @@ +/* stylelint-disable value-no-vendor-prefix, function-name-case */ + .bs-docs-masthead, .bs-docs-header { position: relative; padding: 30px 0; color: #cdbfe3; text-align: center; - text-shadow: 0 1px 0 rgba(0,0,0,.1); + text-shadow: 0 1px 0 rgba(0, 0, 0, .1); background-color: #6f5499; background-image: -webkit-gradient(linear, left top, left bottom, from(#563d7c), to(#6f5499)); background-image: -webkit-linear-gradient(top, #563d7c 0%, #6f5499 100%); - background-image: -o-linear-gradient(top, #563d7c 0%, #6f5499 100%); - background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0); + background-image: -o-linear-gradient(top, #563d7c 0%, #6f5499 100%); + background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%); background-repeat: repeat-x; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#563d7c", endColorstr="#6F5499", GradientType=0); } // Masthead (headings and download button) diff --git a/docs/assets/less/responsive-tests.less b/docs/assets/less/responsive-tests.less index bf9d002d2b..784fc6c46b 100644 --- a/docs/assets/less/responsive-tests.less +++ b/docs/assets/less/responsive-tests.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type, declaration-no-important */ + // Responsive (scrollable) doc tables .table-responsive .highlight pre { white-space: normal; @@ -7,11 +9,11 @@ .bs-table th small, .responsive-utilities th small { display: block; - font-weight: normal; + font-weight: 400; color: #999; } .responsive-utilities tbody th { - font-weight: normal; + font-weight: 400; } .responsive-utilities td { text-align: center; @@ -36,7 +38,7 @@ display: block; padding: 15px 10px; font-size: 14px; - font-weight: bold; + font-weight: 700; line-height: 1.1; text-align: center; border-radius: 4px; diff --git a/docs/assets/less/sidebar.less b/docs/assets/less/sidebar.less index 5e9705257b..fe36cd57d7 100644 --- a/docs/assets/less/sidebar.less +++ b/docs/assets/less/sidebar.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-compound-selectors */ + // By default it's not affixed in mobile views, so undo that .bs-docs-sidebar.affix { position: static; @@ -39,7 +41,7 @@ .bs-docs-sidebar .nav > .active:hover > a, .bs-docs-sidebar .nav > .active:focus > a { padding-left: 18px; - font-weight: bold; + font-weight: 700; color: #563d7c; background-color: transparent; border-left: 2px solid #563d7c; @@ -55,7 +57,7 @@ padding-bottom: 1px; padding-left: 30px; font-size: 12px; - font-weight: normal; + font-weight: 400; } .bs-docs-sidebar .nav .nav > li > a:hover, .bs-docs-sidebar .nav .nav > li > a:focus { diff --git a/docs/assets/less/skip-link.less b/docs/assets/less/skip-link.less index 174a64fe08..a64f3319ae 100644 --- a/docs/assets/less/skip-link.less +++ b/docs/assets/less/skip-link.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-id */ + #skippy { display: block; padding: 1em; diff --git a/docs/assets/less/syntax.less b/docs/assets/less/syntax.less index ab8cc60342..a43045fe91 100644 --- a/docs/assets/less/syntax.less +++ b/docs/assets/less/syntax.less @@ -1,64 +1,65 @@ -.hll { background-color: #ffffcc } +/* stylelint-disable declaration-block-single-line-max-declarations */ + +.hll { background-color: #ffc; } .c { color: #999; } -.err { color: #AA0000; background-color: #FFAAAA } -.k { color: #006699; } -.o { color: #555555 } +.err { color: #a00; background-color: #faa; } +.k { color: #069; } +.o { color: #555; } .cm { color: #999; } -.cp { color: #009999 } +.cp { color: #099; } .c1 { color: #999; } .cs { color: #999; } -.gd { background-color: #FFCCCC; border: 1px solid #CC0000 } -.ge { font-style: italic } -.gr { color: #FF0000 } -.gh { color: #003300; } -.gi { background-color: #CCFFCC; border: 1px solid #00CC00 } -.go { color: #AAAAAA } -.gp { color: #000099; } -.gs { } -.gu { color: #003300; } -.gt { color: #99CC66 } -.kc { color: #006699; } -.kd { color: #006699; } -.kn { color: #006699; } -.kp { color: #006699 } -.kr { color: #006699; } -.kt { color: #007788; } -.m { color: #FF6600 } -.s { color: #d44950 } -.na { color: #4f9fcf } -.nb { color: #336666 } -.nc { color: #00AA88; } -.no { color: #336600 } -.nd { color: #9999FF } -.ni { color: #999999; } -.ne { color: #CC0000; } -.nf { color: #CC00FF } -.nl { color: #9999FF } -.nn { color: #00CCFF; } +.gd { background-color: #fcc; border: 1px solid #c00; } +.ge { font-style: italic; } +.gr { color: #f00; } +.gh { color: #030; } +.gi { background-color: #cfc; border: 1px solid #0c0; } +.go { color: #aaa; } +.gp { color: #009; } +.gu { color: #030; } +.gt { color: #9c6; } +.kc { color: #069; } +.kd { color: #069; } +.kn { color: #069; } +.kp { color: #069; } +.kr { color: #069; } +.kt { color: #078; } +.m { color: #f60; } +.s { color: #d44950; } +.na { color: #4f9fcf; } +.nb { color: #366; } +.nc { color: #0a8; } +.no { color: #360; } +.nd { color: #99f; } +.ni { color: #999; } +.ne { color: #c00; } +.nf { color: #c0f; } +.nl { color: #99f; } +.nn { color: #0cf; } .nt { color: #2f6f9f; } -.nv { color: #003333 } -.ow { color: #000000; } -.w { color: #bbbbbb } -.mf { color: #FF6600 } -.mh { color: #FF6600 } -.mi { color: #FF6600 } -.mo { color: #FF6600 } -.sb { color: #CC3300 } -.sc { color: #CC3300 } -.sd { color: #CC3300; font-style: italic } -.s2 { color: #CC3300 } -.se { color: #CC3300; } -.sh { color: #CC3300 } -.si { color: #AA0000 } -.sx { color: #CC3300 } -.sr { color: #33AAAA } -.s1 { color: #CC3300 } -.ss { color: #FFCC33 } -.bp { color: #336666 } -.vc { color: #003333 } -.vg { color: #003333 } -.vi { color: #003333 } -.il { color: #FF6600 } +.nv { color: #033; } +.ow { color: #000; } +.w { color: #bbb; } +.mf { color: #f60; } +.mh { color: #f60; } +.mi { color: #f60; } +.mo { color: #f60; } +.sb { color: #c30; } +.sc { color: #c30; } +.sd { font-style: italic; color: #c30; } +.s2 { color: #c30; } +.se { color: #c30; } +.sh { color: #c30; } +.si { color: #a00; } +.sx { color: #c30; } +.sr { color: #3aa; } +.s1 { color: #c30; } +.ss { color: #fc3; } +.bp { color: #366; } +.vc { color: #033; } +.vg { color: #033; } +.vi { color: #033; } +.il { color: #f60; } .css .o, .css .o + .nt, diff --git a/docs/assets/less/zero-clipboard.less b/docs/assets/less/zero-clipboard.less index 13cfb149b2..688c8de770 100644 --- a/docs/assets/less/zero-clipboard.less +++ b/docs/assets/less/zero-clipboard.less @@ -14,7 +14,7 @@ cursor: pointer; background-color: #fff; border: 1px solid #e1e1e8; - border-radius: 0 4px 0 4px; + border-radius: 0 4px; } .btn-clipboard-hover { color: #fff; diff --git a/grunt/.stylelintrc b/grunt/.stylelintrc new file mode 100644 index 0000000000..cb57941210 --- /dev/null +++ b/grunt/.stylelintrc @@ -0,0 +1,247 @@ +{ + "extends": ["stylelint-config-standard"], + "plugins": [ + "stylelint-order" + ], + "rules": { + "at-rule-empty-line-before": [null, + "except": ["first-nested"] + ], + "at-rule-name-space-after": "always", + "at-rule-no-vendor-prefix": true, + "at-rule-semicolon-space-before": "never", + "block-closing-brace-empty-line-before": null, + "block-closing-brace-newline-after": null, + "block-opening-brace-space-before": null, + "color-named": "never", + "declaration-block-semicolon-newline-after": "always-multi-line", + "declaration-block-semicolon-newline-before": "never-multi-line", + "declaration-block-semicolon-space-after": "always-single-line", + "declaration-empty-line-before": null, + "declaration-no-important": true, + "font-family-name-quotes": "always-where-recommended", + "font-weight-notation": "numeric", + "function-url-no-scheme-relative": true, + "function-url-quotes": "always", + "length-zero-no-unit": true, + "max-empty-lines": 2, + "max-line-length": null, + "media-feature-name-no-vendor-prefix": true, + "media-feature-parentheses-space-inside": "never", + "media-feature-range-operator-space-after": "always", + "media-feature-range-operator-space-before": "never", + "no-descending-specificity": null, + "no-duplicate-selectors": true, + "number-leading-zero": "never", + "order/properties-order": [ + "position", + "top", + "right", + "bottom", + "left", + "z-index", + "box-sizing", + "display", + "flex", + "flex-align", + "flex-basis", + "flex-direction", + "flex-wrap", + "flex-flow", + "flex-grow", + "flex-order", + "flex-pack", + "align-items", + "align-self", + "justify-content", + "order", + "float", + "width", + "min-width", + "max-width", + "height", + "min-height", + "max-height", + "padding", + "padding-top", + "padding-right", + "padding-bottom", + "padding-left", + "margin", + "margin-top", + "margin-right", + "margin-bottom", + "margin-left", + "overflow", + "overflow-x", + "overflow-y", + "-webkit-overflow-scrolling", + "-ms-overflow-x", + "-ms-overflow-y", + "-ms-overflow-style", + "clip", + "clear", + "font", + "font-family", + "font-size", + "font-style", + "font-weight", + "font-variant", + "font-size-adjust", + "font-stretch", + "font-effect", + "font-emphasize", + "font-emphasize-position", + "font-emphasize-style", + "font-smooth", + "hyphens", + "line-height", + "color", + "text-align", + "text-align-last", + "text-emphasis", + "text-emphasis-color", + "text-emphasis-style", + "text-emphasis-position", + "text-decoration", + "text-indent", + "text-justify", + "text-outline", + "-ms-text-overflow", + "text-overflow", + "text-overflow-ellipsis", + "text-overflow-mode", + "text-shadow", + "text-transform", + "text-wrap", + "-webkit-text-size-adjust", + "-ms-text-size-adjust", + "letter-spacing", + "-ms-word-break", + "word-break", + "word-spacing", + "-ms-word-wrap", + "word-wrap", + "overflow-wrap", + "tab-size", + "white-space", + "vertical-align", + "list-style", + "list-style-position", + "list-style-type", + "list-style-image", + "pointer-events", + "-ms-touch-action", + "touch-action", + "cursor", + "visibility", + "zoom", + "table-layout", + "empty-cells", + "caption-side", + "border-spacing", + "border-collapse", + "content", + "quotes", + "counter-reset", + "counter-increment", + "resize", + "user-select", + "nav-index", + "nav-up", + "nav-right", + "nav-down", + "nav-left", + "background", + "background-color", + "background-image", + "background-repeat", + "background-attachment", + "background-position", + "background-position-x", + "background-position-y", + "background-clip", + "background-origin", + "background-size", + "filter", + "border", + "border-color", + "border-style", + "border-width", + "border-top", + "border-top-color", + "border-top-style", + "border-top-width", + "border-right", + "border-right-color", + "border-right-style", + "border-right-width", + "border-bottom", + "border-bottom-color", + "border-bottom-style", + "border-bottom-width", + "border-left", + "border-left-color", + "border-left-style", + "border-left-width", + "border-radius", + "border-top-left-radius", + "border-top-right-radius", + "border-bottom-right-radius", + "border-bottom-left-radius", + "border-image", + "border-image-source", + "border-image-slice", + "border-image-width", + "border-image-outset", + "border-image-repeat", + "outline", + "outline-width", + "outline-style", + "outline-color", + "outline-offset", + "box-shadow", + "opacity", + "-ms-interpolation-mode", + "transition", + "transition-delay", + "transition-timing-function", + "transition-duration", + "transition-property", + "transform", + "transform-origin", + "animation", + "animation-name", + "animation-duration", + "animation-play-state", + "animation-timing-function", + "animation-delay", + "animation-iteration-count", + "animation-direction" + ], + "property-no-vendor-prefix": true, + "rule-empty-line-before": null, + "selector-attribute-quotes": "always", + "selector-list-comma-newline-after": "always", + "selector-list-comma-newline-before": "never-multi-line", + "selector-list-comma-space-after": "always-single-line", + "selector-list-comma-space-before": "never-single-line", + "selector-max-attribute": 2, + "selector-max-class": 4, + "selector-max-combinators": 4, + "selector-max-compound-selectors": 4, + "selector-max-empty-lines": 1, + "selector-max-id": 0, + "selector-max-specificity": null, + "selector-max-type": 2, + "selector-max-universal": 1, + "selector-no-qualifying-type": true, + "selector-no-vendor-prefix": true, + "string-quotes": "double", + "value-keyword-case": "lower", + "value-list-comma-newline-after": "never-multi-line", + "value-list-comma-newline-before": "never-multi-line", + "value-list-comma-space-after": "always", + "value-no-vendor-prefix": true + } +} diff --git a/less/.csslintrc b/less/.csslintrc deleted file mode 100644 index 005b86236c..0000000000 --- a/less/.csslintrc +++ /dev/null @@ -1,19 +0,0 @@ -{ - "adjoining-classes": false, - "box-sizing": false, - "box-model": false, - "compatible-vendor-prefixes": false, - "floats": false, - "font-sizes": false, - "gradients": false, - "important": false, - "known-properties": false, - "outline-none": false, - "qualified-headings": false, - "regex-selectors": false, - "shorthand": false, - "text-indent": false, - "unique-headings": false, - "universal-selector": false, - "unqualified-attributes": false -} diff --git a/less/alerts.less b/less/alerts.less index c4199db927..3101fec270 100644 --- a/less/alerts.less +++ b/less/alerts.less @@ -15,8 +15,7 @@ // Headings for larger alerts h4 { margin-top: 0; - // Specified for the h4 to prevent conflicts of changing @headings-color - color: inherit; + color: inherit; // Specified for the h4 to prevent conflicts of changing @headings-color } // Provide class for links that match alerts diff --git a/less/badges.less b/less/badges.less index 6ee16dca41..be7f8d0cc6 100644 --- a/less/badges.less +++ b/less/badges.less @@ -10,11 +10,11 @@ padding: 3px 7px; font-size: @font-size-small; font-weight: @badge-font-weight; - color: @badge-color; line-height: @badge-line-height; - vertical-align: middle; - white-space: nowrap; + color: @badge-color; text-align: center; + white-space: nowrap; + vertical-align: middle; background-color: @badge-bg; border-radius: @badge-border-radius; diff --git a/less/breadcrumbs.less b/less/breadcrumbs.less index cb01d503fb..f21d0d89db 100644 --- a/less/breadcrumbs.less +++ b/less/breadcrumbs.less @@ -13,10 +13,10 @@ > li { display: inline-block; - + li:before { - content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space + + li::before { padding: 0 5px; color: @breadcrumb-color; + content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space } } diff --git a/less/button-groups.less b/less/button-groups.less index 16db0c6135..6c2b6f7c67 100644 --- a/less/button-groups.less +++ b/less/button-groups.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type */ + // // Button groups // -------------------------------------------------- @@ -103,18 +105,18 @@ // Give the line between buttons some depth .btn-group > .btn + .dropdown-toggle { - padding-left: 8px; padding-right: 8px; + padding-left: 8px; } .btn-group > .btn-lg + .dropdown-toggle { - padding-left: 12px; padding-right: 12px; + padding-left: 12px; } // The clickable button for toggling the menu // Remove the gradient and set the same inset shadow as the :active state .btn-group.open .dropdown-toggle { - .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + .box-shadow(inset 0 3px 5px rgba(0, 0, 0, .125)); // Show no shadow for `.btn-link` since it has no other button styles. &.btn-link { @@ -205,8 +207,8 @@ border-collapse: separate; > .btn, > .btn-group { - float: none; display: table-cell; + float: none; width: 1%; } > .btn-group .btn { @@ -237,7 +239,7 @@ input[type="radio"], input[type="checkbox"] { position: absolute; - clip: rect(0,0,0,0); + clip: rect(0, 0, 0, 0); pointer-events: none; } } diff --git a/less/buttons.less b/less/buttons.less index 9cbb8f416f..2e1166a101 100644 --- a/less/buttons.less +++ b/less/buttons.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type */ + // // Buttons // -------------------------------------------------- @@ -11,12 +13,12 @@ margin-bottom: 0; // For input.btn font-weight: @btn-font-weight; text-align: center; + white-space: nowrap; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 border: 1px solid transparent; - white-space: nowrap; .button-size(@padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base; @btn-border-radius-base); .user-select(none); @@ -38,9 +40,9 @@ &:active, &.active { - outline: 0; background-image: none; - .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + outline: 0; + .box-shadow(inset 0 3px 5px rgba(0, 0, 0, .125)); } &.disabled, @@ -92,8 +94,8 @@ // Make a button look and behave like a link .btn-link { + font-weight: 400; color: @link-color; - font-weight: normal; border-radius: 0; &, diff --git a/less/carousel.less b/less/carousel.less index 252011e9e2..699d67b20c 100644 --- a/less/carousel.less +++ b/less/carousel.less @@ -1,3 +1,5 @@ +/* stylelint-disable media-feature-name-no-unknown */ + // // Carousel // -------------------------------------------------- @@ -10,12 +12,12 @@ .carousel-inner { position: relative; - overflow: hidden; width: 100%; + overflow: hidden; > .item { - display: none; position: relative; + display: none; .transition(.6s ease-in-out left); // Account for jankitude on images @@ -27,8 +29,8 @@ // WebKit CSS3 transforms for supported devices @media all and (transform-3d), (-webkit-transform-3d) { - .transition-transform(~'0.6s ease-in-out'); - .backface-visibility(~'hidden'); + .transition-transform(~"0.6s ease-in-out"); + .backface-visibility(~"hidden"); .perspective(1000px); &.next, @@ -93,34 +95,34 @@ .carousel-control { position: absolute; top: 0; - left: 0; bottom: 0; + left: 0; width: @carousel-control-width; - .opacity(@carousel-control-opacity); font-size: @carousel-control-font-size; color: @carousel-control-color; text-align: center; text-shadow: @carousel-text-shadow; background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug + .opacity(@carousel-control-opacity); // We can't have this transition here because WebKit cancels the carousel // animation if you trip this while in the middle of another animation. // Set gradients for backgrounds &.left { - #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001)); + #gradient > .horizontal(@start-color: rgba(0, 0, 0, .5); @end-color: rgba(0, 0, 0, .0001)); } &.right { - left: auto; right: 0; - #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5)); + left: auto; + #gradient > .horizontal(@start-color: rgba(0, 0, 0, .0001); @end-color: rgba(0, 0, 0, .5)); } // Hover/focus state &:hover, &:focus { - outline: 0; color: @carousel-control-color; text-decoration: none; + outline: 0; .opacity(.9); } @@ -131,9 +133,9 @@ .glyphicon-chevron-right { position: absolute; top: 50%; - margin-top: -10px; z-index: 5; display: inline-block; + margin-top: -10px; } .icon-prev, .glyphicon-chevron-left { @@ -147,21 +149,20 @@ } .icon-prev, .icon-next { - width: 20px; + width: 20px; height: 20px; - line-height: 1; font-family: serif; + line-height: 1; } - .icon-prev { - &:before { - content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) + &::before { + content: "\2039";// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) } } .icon-next { - &:before { - content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) + &::before { + content: "\203a";// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) } } } @@ -177,21 +178,18 @@ left: 50%; z-index: 15; width: 60%; - margin-left: -30%; padding-left: 0; - list-style: none; + margin-left: -30%; text-align: center; + list-style: none; li { display: inline-block; - width: 10px; + width: 10px; height: 10px; margin: 1px; text-indent: -999px; - border: 1px solid @carousel-indicator-border-color; - border-radius: 10px; cursor: pointer; - // IE8-9 hack for event handling // // Internet Explorer 8-9 does not support clicks on elements without a set @@ -202,12 +200,16 @@ // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we // set alpha transparency for the best results possible. background-color: #000 \9; // IE8 - background-color: rgba(0,0,0,0); // IE9 + background-color: rgba(0, 0, 0, 0); // IE9 + + border: 1px solid @carousel-indicator-border-color; + border-radius: 10px; } + .active { - margin: 0; - width: 12px; + width: 12px; height: 12px; + margin: 0; background-color: @carousel-indicator-active-bg; } } @@ -217,15 +219,16 @@ // Hidden by default for smaller viewports .carousel-caption { position: absolute; - left: 15%; right: 15%; bottom: 20px; + left: 15%; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: @carousel-caption-color; text-align: center; text-shadow: @carousel-text-shadow; + & .btn { text-shadow: none; // No shadow for button elements in carousel-caption } @@ -258,8 +261,8 @@ // Show and left align the captions .carousel-caption { - left: 20%; right: 20%; + left: 20%; padding-bottom: 30px; } diff --git a/less/close.less b/less/close.less index 6d5bfe087a..a1f2affe2e 100644 --- a/less/close.less +++ b/less/close.less @@ -1,3 +1,5 @@ +/* stylelint-disable property-no-vendor-prefix */ + // // Close icons // -------------------------------------------------- diff --git a/less/code.less b/less/code.less index a08b4d48c4..4e07976d54 100644 --- a/less/code.less +++ b/less/code.less @@ -27,12 +27,12 @@ kbd { color: @kbd-color; background-color: @kbd-bg; border-radius: @border-radius-small; - box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); + box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25); kbd { padding: 0; font-size: 100%; - font-weight: bold; + font-weight: 700; box-shadow: none; } } @@ -44,9 +44,9 @@ pre { margin: 0 0 (@line-height-computed / 2); font-size: (@font-size-base - 1); // 14px to 13px line-height: @line-height-base; + color: @pre-color; word-break: break-all; word-wrap: break-word; - color: @pre-color; background-color: @pre-bg; border: 1px solid @pre-border-color; border-radius: @border-radius-base; diff --git a/less/component-animations.less b/less/component-animations.less index 0bcee910ac..711e1e2d93 100644 --- a/less/component-animations.less +++ b/less/component-animations.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type */ + // // Component animations // -------------------------------------------------- @@ -10,6 +12,7 @@ .fade { opacity: 0; .transition(opacity .15s linear); + &.in { opacity: 1; } diff --git a/less/dropdowns.less b/less/dropdowns.less index f6876c1a9b..542c00461a 100644 --- a/less/dropdowns.less +++ b/less/dropdowns.less @@ -10,10 +10,10 @@ height: 0; margin-left: 2px; vertical-align: middle; - border-top: @caret-width-base dashed; - border-top: @caret-width-base solid ~"\9"; // IE8 + border-top: @caret-width-base dashed; + border-top: @caret-width-base solid ~"\9"; // IE8 border-right: @caret-width-base solid transparent; - border-left: @caret-width-base solid transparent; + border-left: @caret-width-base solid transparent; } // The dropdown wrapper (div) @@ -38,15 +38,15 @@ min-width: 160px; padding: 5px 0; margin: 2px 0 0; // override default ul - list-style: none; font-size: @font-size-base; text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) + list-style: none; background-color: @dropdown-bg; + background-clip: padding-box; border: 1px solid @dropdown-fallback-border; // IE8 fallback border: 1px solid @dropdown-border; border-radius: @border-radius-base; - .box-shadow(0 6px 12px rgba(0,0,0,.175)); - background-clip: padding-box; + .box-shadow(0 6px 12px rgba(0, 0, 0, .175)); // Aligns the dropdown menu to right // @@ -66,20 +66,17 @@ display: block; padding: 3px 20px; clear: both; - font-weight: normal; + font-weight: 400; line-height: @line-height-base; color: @dropdown-link-color; white-space: nowrap; // prevent links from randomly breaking onto new lines - } -} -// Hover/Focus state -.dropdown-menu > li > a { - &:hover, - &:focus { - text-decoration: none; - color: @dropdown-link-hover-color; - background-color: @dropdown-link-hover-bg; + &:hover, + &:focus { + color: @dropdown-link-hover-color; + text-decoration: none; + background-color: @dropdown-link-hover-bg; + } } } @@ -90,8 +87,8 @@ &:focus { color: @dropdown-link-active-color; text-decoration: none; - outline: 0; background-color: @dropdown-link-active-bg; + outline: 0; } } @@ -110,10 +107,10 @@ &:hover, &:focus { text-decoration: none; + cursor: @cursor-disabled; background-color: transparent; background-image: none; // Remove CSS gradient .reset-filter(); - cursor: @cursor-disabled; } } @@ -135,8 +132,8 @@ // Add extra class to `.dropdown-menu` to flip the alignment of the dropdown // menu with the parent. .dropdown-menu-right { - left: auto; // Reset the default from `.dropdown-menu` right: 0; + left: auto; // Reset the default from `.dropdown-menu` } // With v3, we enabled auto-flipping if you have a dropdown within a right // aligned nav component. To enable the undoing of that, we provide an override @@ -145,8 +142,8 @@ // This is only for left-aligning a dropdown menu within a `.navbar-right` or // `.pull-right` nav component. .dropdown-menu-left { - left: 0; right: auto; + left: 0; } // Dropdown section headers @@ -162,10 +159,10 @@ // Backdrop to catch body clicks on mobile, etc. .dropdown-backdrop { position: fixed; - left: 0; + top: 0; right: 0; bottom: 0; - top: 0; + left: 0; z-index: (@zindex-dropdown - 10); } @@ -184,10 +181,10 @@ .navbar-fixed-bottom .dropdown { // Reverse the caret .caret { + content: ""; border-top: 0; border-bottom: @caret-width-base dashed; border-bottom: @caret-width-base solid ~"\9"; // IE8 - content: ""; } // Different positioning for bottom up menu .dropdown-menu { diff --git a/less/forms.less b/less/forms.less index 9377d3846b..abad9d08da 100644 --- a/less/forms.less +++ b/less/forms.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type, property-no-vendor-prefix, media-feature-name-no-vendor-prefix, indentation */ + // // Forms // -------------------------------------------------- @@ -8,13 +10,13 @@ // Restyle and baseline non-control form elements. fieldset { - padding: 0; - margin: 0; - border: 0; // Chrome and Firefox set a `min-width: min-content;` on fieldsets, // so we reset that to ensure it behaves more like a standard block element. // See https://github.com/twbs/bootstrap/issues/12359. min-width: 0; + padding: 0; + margin: 0; + border: 0; } legend { @@ -33,7 +35,7 @@ label { display: inline-block; max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141) margin-bottom: 5px; - font-weight: bold; + font-weight: 700; } @@ -43,9 +45,17 @@ label { // is required to ensure optimum display with or without those classes to better // address browser inconsistencies. -// Override content-box in Normalize (* isn't specific enough) input[type="search"] { + // Override content-box in Normalize (* isn't specific enough) .box-sizing(border-box); + + // Search inputs in iOS + // + // This overrides the extra rounded corners on search inputs in iOS so that our + // `.form-control` class can properly style them. Note that this cannot simply + // be added to `.form-control` as it's not specific enough. For details, see + // https://github.com/twbs/bootstrap/issues/11586. + -webkit-appearance: none; } // Position radios and checkboxes better @@ -54,6 +64,16 @@ input[type="checkbox"] { margin: 4px 0 0; margin-top: 1px \9; // IE8-9 line-height: normal; + + // Apply same disabled cursor tweak as for inputs + // Some special care is needed because <label>s don't inherit their parent's `cursor`. + // + // Note: Neither radios nor checkboxes can be readonly. + &[disabled], + &.disabled, + fieldset[disabled] & { + cursor: @cursor-disabled; + } } input[type="file"] { @@ -123,7 +143,7 @@ output { background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 border: 1px solid @input-border; border-radius: @input-border-radius; // Note: This has no effect on <select>s in some browsers, due to the limited stylability of <select>s in CSS. - .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); + .box-shadow(inset 0 1px 1px rgba(0, 0, 0, .075)); .transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s"); // Customize the `:focus` state to imitate native WebKit styles. @@ -134,8 +154,8 @@ output { // Unstyle the caret on `<select>`s in IE10+. &::-ms-expand { - border: 0; background-color: transparent; + border: 0; } // Disabled and read-only inputs @@ -162,18 +182,6 @@ output { } -// Search inputs in iOS -// -// This overrides the extra rounded corners on search inputs in iOS so that our -// `.form-control` class can properly style them. Note that this cannot simply -// be added to `.form-control` as it's not specific enough. For details, see -// https://github.com/twbs/bootstrap/issues/11586. - -input[type="search"] { - -webkit-appearance: none; -} - - // Special styles for iOS temporal inputs // // In Mobile Safari, setting `display: block` on temporal inputs causes the @@ -226,11 +234,19 @@ input[type="search"] { margin-top: 10px; margin-bottom: 10px; + // These are used on elements with <label> descendants + &.disabled, + fieldset[disabled] & { + label { + cursor: @cursor-disabled; + } + } + label { min-height: @line-height-computed; // Ensure the input doesn't jump when there is no text padding-left: 20px; margin-bottom: 0; - font-weight: normal; + font-weight: 400; cursor: pointer; } } @@ -239,8 +255,8 @@ input[type="search"] { .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] { position: absolute; - margin-left: -20px; margin-top: 4px \9; + margin-left: -20px; } .radio + .radio, @@ -255,45 +271,20 @@ input[type="search"] { display: inline-block; padding-left: 20px; margin-bottom: 0; + font-weight: 400; vertical-align: middle; - font-weight: normal; cursor: pointer; -} -.radio-inline + .radio-inline, -.checkbox-inline + .checkbox-inline { - margin-top: 0; - margin-left: 10px; // space out consecutive inline controls -} -// Apply same disabled cursor tweak as for inputs -// Some special care is needed because <label>s don't inherit their parent's `cursor`. -// -// Note: Neither radios nor checkboxes can be readonly. -input[type="radio"], -input[type="checkbox"] { - &[disabled], + // These are used directly on <label>s &.disabled, fieldset[disabled] & { cursor: @cursor-disabled; } } -// These classes are used directly on <label>s -.radio-inline, -.checkbox-inline { - &.disabled, - fieldset[disabled] & { - cursor: @cursor-disabled; - } -} -// These classes are used on elements with <label> descendants -.radio, -.checkbox { - &.disabled, - fieldset[disabled] & { - label { - cursor: @cursor-disabled; - } - } +.radio-inline + .radio-inline, +.checkbox-inline + .checkbox-inline { + margin-top: 0; + margin-left: 10px; // space out consecutive inline controls } @@ -303,17 +294,17 @@ input[type="checkbox"] { // a horizontal form layout. .form-control-static { + min-height: (@line-height-computed + @font-size-base); // Size it appropriately next to real form controls padding-top: (@padding-base-vertical + 1); padding-bottom: (@padding-base-vertical + 1); // Remove default margin from `p` margin-bottom: 0; - min-height: (@line-height-computed + @font-size-base); &.input-lg, &.input-sm { - padding-left: 0; padding-right: 0; + padding-left: 0; } } @@ -556,9 +547,9 @@ input[type="checkbox"] { .checkbox, .radio-inline, .checkbox-inline { + padding-top: (@padding-base-vertical + 1); // Default padding plus a border margin-top: 0; margin-bottom: 0; - padding-top: (@padding-base-vertical + 1); // Default padding plus a border } // Account for padding we're adding to ensure the alignment and of help text // and other content below items @@ -576,9 +567,9 @@ input[type="checkbox"] { // labels on narrow viewports stack the same as a default form example. @media (min-width: @screen-sm-min) { .control-label { - text-align: right; - margin-bottom: 0; padding-top: (@padding-base-vertical + 1); // Default padding plus a border + margin-bottom: 0; + text-align: right; } } diff --git a/less/glyphicons.less b/less/glyphicons.less index 7bc5852d2c..266aaecdee 100644 --- a/less/glyphicons.less +++ b/less/glyphicons.less @@ -1,3 +1,5 @@ +/* stylelint-disable value-list-comma-newline-after, value-list-comma-space-after, indentation, declaration-colon-newline-after */ + // // Glyphicons for Bootstrap // @@ -9,13 +11,13 @@ // Import the fonts @font-face { - font-family: 'Glyphicons Halflings'; - src: url('@{icon-font-path}@{icon-font-name}.eot'); - src: url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype'), - url('@{icon-font-path}@{icon-font-name}.woff2') format('woff2'), - url('@{icon-font-path}@{icon-font-name}.woff') format('woff'), - url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype'), - url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg'); + font-family: "Glyphicons Halflings"; + src: url("@{icon-font-path}@{icon-font-name}.eot"); + src: url("@{icon-font-path}@{icon-font-name}.eot?#iefix") format("embedded-opentype"), + url("@{icon-font-path}@{icon-font-name}.woff2") format("woff2"), + url("@{icon-font-path}@{icon-font-name}.woff") format("woff"), + url("@{icon-font-path}@{icon-font-name}.ttf") format("truetype"), + url("@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}") format("svg"); } // Catchall baseclass @@ -23,283 +25,283 @@ position: relative; top: 1px; display: inline-block; - font-family: 'Glyphicons Halflings'; + font-family: "Glyphicons Halflings"; font-style: normal; - font-weight: normal; + font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } // Individual icons -.glyphicon-asterisk { &:before { content: "\002a"; } } -.glyphicon-plus { &:before { content: "\002b"; } } +.glyphicon-asterisk { &::before { content: "\002a"; } } +.glyphicon-plus { &::before { content: "\002b"; } } .glyphicon-euro, -.glyphicon-eur { &:before { content: "\20ac"; } } -.glyphicon-minus { &:before { content: "\2212"; } } -.glyphicon-cloud { &:before { content: "\2601"; } } -.glyphicon-envelope { &:before { content: "\2709"; } } -.glyphicon-pencil { &:before { content: "\270f"; } } -.glyphicon-glass { &:before { content: "\e001"; } } -.glyphicon-music { &:before { content: "\e002"; } } -.glyphicon-search { &:before { content: "\e003"; } } -.glyphicon-heart { &:before { content: "\e005"; } } -.glyphicon-star { &:before { content: "\e006"; } } -.glyphicon-star-empty { &:before { content: "\e007"; } } -.glyphicon-user { &:before { content: "\e008"; } } -.glyphicon-film { &:before { content: "\e009"; } } -.glyphicon-th-large { &:before { content: "\e010"; } } -.glyphicon-th { &:before { content: "\e011"; } } -.glyphicon-th-list { &:before { content: "\e012"; } } -.glyphicon-ok { &:before { content: "\e013"; } } -.glyphicon-remove { &:before { content: "\e014"; } } -.glyphicon-zoom-in { &:before { content: "\e015"; } } -.glyphicon-zoom-out { &:before { content: "\e016"; } } -.glyphicon-off { &:before { content: "\e017"; } } -.glyphicon-signal { &:before { content: "\e018"; } } -.glyphicon-cog { &:before { content: "\e019"; } } -.glyphicon-trash { &:before { content: "\e020"; } } -.glyphicon-home { &:before { content: "\e021"; } } -.glyphicon-file { &:before { content: "\e022"; } } -.glyphicon-time { &:before { content: "\e023"; } } -.glyphicon-road { &:before { content: "\e024"; } } -.glyphicon-download-alt { &:before { content: "\e025"; } } -.glyphicon-download { &:before { content: "\e026"; } } -.glyphicon-upload { &:before { content: "\e027"; } } -.glyphicon-inbox { &:before { content: "\e028"; } } -.glyphicon-play-circle { &:before { content: "\e029"; } } -.glyphicon-repeat { &:before { content: "\e030"; } } -.glyphicon-refresh { &:before { content: "\e031"; } } -.glyphicon-list-alt { &:before { content: "\e032"; } } -.glyphicon-lock { &:before { content: "\e033"; } } -.glyphicon-flag { &:before { content: "\e034"; } } -.glyphicon-headphones { &:before { content: "\e035"; } } -.glyphicon-volume-off { &:before { content: "\e036"; } } -.glyphicon-volume-down { &:before { content: "\e037"; } } -.glyphicon-volume-up { &:before { content: "\e038"; } } -.glyphicon-qrcode { &:before { content: "\e039"; } } -.glyphicon-barcode { &:before { content: "\e040"; } } -.glyphicon-tag { &:before { content: "\e041"; } } -.glyphicon-tags { &:before { content: "\e042"; } } -.glyphicon-book { &:before { content: "\e043"; } } -.glyphicon-bookmark { &:before { content: "\e044"; } } -.glyphicon-print { &:before { content: "\e045"; } } -.glyphicon-camera { &:before { content: "\e046"; } } -.glyphicon-font { &:before { content: "\e047"; } } -.glyphicon-bold { &:before { content: "\e048"; } } -.glyphicon-italic { &:before { content: "\e049"; } } -.glyphicon-text-height { &:before { content: "\e050"; } } -.glyphicon-text-width { &:before { content: "\e051"; } } -.glyphicon-align-left { &:before { content: "\e052"; } } -.glyphicon-align-center { &:before { content: "\e053"; } } -.glyphicon-align-right { &:before { content: "\e054"; } } -.glyphicon-align-justify { &:before { content: "\e055"; } } -.glyphicon-list { &:before { content: "\e056"; } } -.glyphicon-indent-left { &:before { content: "\e057"; } } -.glyphicon-indent-right { &:before { content: "\e058"; } } -.glyphicon-facetime-video { &:before { content: "\e059"; } } -.glyphicon-picture { &:before { content: "\e060"; } } -.glyphicon-map-marker { &:before { content: "\e062"; } } -.glyphicon-adjust { &:before { content: "\e063"; } } -.glyphicon-tint { &:before { content: "\e064"; } } -.glyphicon-edit { &:before { content: "\e065"; } } -.glyphicon-share { &:before { content: "\e066"; } } -.glyphicon-check { &:before { content: "\e067"; } } -.glyphicon-move { &:before { content: "\e068"; } } -.glyphicon-step-backward { &:before { content: "\e069"; } } -.glyphicon-fast-backward { &:before { content: "\e070"; } } -.glyphicon-backward { &:before { content: "\e071"; } } -.glyphicon-play { &:before { content: "\e072"; } } -.glyphicon-pause { &:before { content: "\e073"; } } -.glyphicon-stop { &:before { content: "\e074"; } } -.glyphicon-forward { &:before { content: "\e075"; } } -.glyphicon-fast-forward { &:before { content: "\e076"; } } -.glyphicon-step-forward { &:before { content: "\e077"; } } -.glyphicon-eject { &:before { content: "\e078"; } } -.glyphicon-chevron-left { &:before { content: "\e079"; } } -.glyphicon-chevron-right { &:before { content: "\e080"; } } -.glyphicon-plus-sign { &:before { content: "\e081"; } } -.glyphicon-minus-sign { &:before { content: "\e082"; } } -.glyphicon-remove-sign { &:before { content: "\e083"; } } -.glyphicon-ok-sign { &:before { content: "\e084"; } } -.glyphicon-question-sign { &:before { content: "\e085"; } } -.glyphicon-info-sign { &:before { content: "\e086"; } } -.glyphicon-screenshot { &:before { content: "\e087"; } } -.glyphicon-remove-circle { &:before { content: "\e088"; } } -.glyphicon-ok-circle { &:before { content: "\e089"; } } -.glyphicon-ban-circle { &:before { content: "\e090"; } } -.glyphicon-arrow-left { &:before { content: "\e091"; } } -.glyphicon-arrow-right { &:before { content: "\e092"; } } -.glyphicon-arrow-up { &:before { content: "\e093"; } } -.glyphicon-arrow-down { &:before { content: "\e094"; } } -.glyphicon-share-alt { &:before { content: "\e095"; } } -.glyphicon-resize-full { &:before { content: "\e096"; } } -.glyphicon-resize-small { &:before { content: "\e097"; } } -.glyphicon-exclamation-sign { &:before { content: "\e101"; } } -.glyphicon-gift { &:before { content: "\e102"; } } -.glyphicon-leaf { &:before { content: "\e103"; } } -.glyphicon-fire { &:before { content: "\e104"; } } -.glyphicon-eye-open { &:before { content: "\e105"; } } -.glyphicon-eye-close { &:before { content: "\e106"; } } -.glyphicon-warning-sign { &:before { content: "\e107"; } } -.glyphicon-plane { &:before { content: "\e108"; } } -.glyphicon-calendar { &:before { content: "\e109"; } } -.glyphicon-random { &:before { content: "\e110"; } } -.glyphicon-comment { &:before { content: "\e111"; } } -.glyphicon-magnet { &:before { content: "\e112"; } } -.glyphicon-chevron-up { &:before { content: "\e113"; } } -.glyphicon-chevron-down { &:before { content: "\e114"; } } -.glyphicon-retweet { &:before { content: "\e115"; } } -.glyphicon-shopping-cart { &:before { content: "\e116"; } } -.glyphicon-folder-close { &:before { content: "\e117"; } } -.glyphicon-folder-open { &:before { content: "\e118"; } } -.glyphicon-resize-vertical { &:before { content: "\e119"; } } -.glyphicon-resize-horizontal { &:before { content: "\e120"; } } -.glyphicon-hdd { &:before { content: "\e121"; } } -.glyphicon-bullhorn { &:before { content: "\e122"; } } -.glyphicon-bell { &:before { content: "\e123"; } } -.glyphicon-certificate { &:before { content: "\e124"; } } -.glyphicon-thumbs-up { &:before { content: "\e125"; } } -.glyphicon-thumbs-down { &:before { content: "\e126"; } } -.glyphicon-hand-right { &:before { content: "\e127"; } } -.glyphicon-hand-left { &:before { content: "\e128"; } } -.glyphicon-hand-up { &:before { content: "\e129"; } } -.glyphicon-hand-down { &:before { content: "\e130"; } } -.glyphicon-circle-arrow-right { &:before { content: "\e131"; } } -.glyphicon-circle-arrow-left { &:before { content: "\e132"; } } -.glyphicon-circle-arrow-up { &:before { content: "\e133"; } } -.glyphicon-circle-arrow-down { &:before { content: "\e134"; } } -.glyphicon-globe { &:before { content: "\e135"; } } -.glyphicon-wrench { &:before { content: "\e136"; } } -.glyphicon-tasks { &:before { content: "\e137"; } } -.glyphicon-filter { &:before { content: "\e138"; } } -.glyphicon-briefcase { &:before { content: "\e139"; } } -.glyphicon-fullscreen { &:before { content: "\e140"; } } -.glyphicon-dashboard { &:before { content: "\e141"; } } -.glyphicon-paperclip { &:before { content: "\e142"; } } -.glyphicon-heart-empty { &:before { content: "\e143"; } } -.glyphicon-link { &:before { content: "\e144"; } } -.glyphicon-phone { &:before { content: "\e145"; } } -.glyphicon-pushpin { &:before { content: "\e146"; } } -.glyphicon-usd { &:before { content: "\e148"; } } -.glyphicon-gbp { &:before { content: "\e149"; } } -.glyphicon-sort { &:before { content: "\e150"; } } -.glyphicon-sort-by-alphabet { &:before { content: "\e151"; } } -.glyphicon-sort-by-alphabet-alt { &:before { content: "\e152"; } } -.glyphicon-sort-by-order { &:before { content: "\e153"; } } -.glyphicon-sort-by-order-alt { &:before { content: "\e154"; } } -.glyphicon-sort-by-attributes { &:before { content: "\e155"; } } -.glyphicon-sort-by-attributes-alt { &:before { content: "\e156"; } } -.glyphicon-unchecked { &:before { content: "\e157"; } } -.glyphicon-expand { &:before { content: "\e158"; } } -.glyphicon-collapse-down { &:before { content: "\e159"; } } -.glyphicon-collapse-up { &:before { content: "\e160"; } } -.glyphicon-log-in { &:before { content: "\e161"; } } -.glyphicon-flash { &:before { content: "\e162"; } } -.glyphicon-log-out { &:before { content: "\e163"; } } -.glyphicon-new-window { &:before { content: "\e164"; } } -.glyphicon-record { &:before { content: "\e165"; } } -.glyphicon-save { &:before { content: "\e166"; } } -.glyphicon-open { &:before { content: "\e167"; } } -.glyphicon-saved { &:before { content: "\e168"; } } -.glyphicon-import { &:before { content: "\e169"; } } -.glyphicon-export { &:before { content: "\e170"; } } -.glyphicon-send { &:before { content: "\e171"; } } -.glyphicon-floppy-disk { &:before { content: "\e172"; } } -.glyphicon-floppy-saved { &:before { content: "\e173"; } } -.glyphicon-floppy-remove { &:before { content: "\e174"; } } -.glyphicon-floppy-save { &:before { content: "\e175"; } } -.glyphicon-floppy-open { &:before { content: "\e176"; } } -.glyphicon-credit-card { &:before { content: "\e177"; } } -.glyphicon-transfer { &:before { content: "\e178"; } } -.glyphicon-cutlery { &:before { content: "\e179"; } } -.glyphicon-header { &:before { content: "\e180"; } } -.glyphicon-compressed { &:before { content: "\e181"; } } -.glyphicon-earphone { &:before { content: "\e182"; } } -.glyphicon-phone-alt { &:before { content: "\e183"; } } -.glyphicon-tower { &:before { content: "\e184"; } } -.glyphicon-stats { &:before { content: "\e185"; } } -.glyphicon-sd-video { &:before { content: "\e186"; } } -.glyphicon-hd-video { &:before { content: "\e187"; } } -.glyphicon-subtitles { &:before { content: "\e188"; } } -.glyphicon-sound-stereo { &:before { content: "\e189"; } } -.glyphicon-sound-dolby { &:before { content: "\e190"; } } -.glyphicon-sound-5-1 { &:before { content: "\e191"; } } -.glyphicon-sound-6-1 { &:before { content: "\e192"; } } -.glyphicon-sound-7-1 { &:before { content: "\e193"; } } -.glyphicon-copyright-mark { &:before { content: "\e194"; } } -.glyphicon-registration-mark { &:before { content: "\e195"; } } -.glyphicon-cloud-download { &:before { content: "\e197"; } } -.glyphicon-cloud-upload { &:before { content: "\e198"; } } -.glyphicon-tree-conifer { &:before { content: "\e199"; } } -.glyphicon-tree-deciduous { &:before { content: "\e200"; } } -.glyphicon-cd { &:before { content: "\e201"; } } -.glyphicon-save-file { &:before { content: "\e202"; } } -.glyphicon-open-file { &:before { content: "\e203"; } } -.glyphicon-level-up { &:before { content: "\e204"; } } -.glyphicon-copy { &:before { content: "\e205"; } } -.glyphicon-paste { &:before { content: "\e206"; } } +.glyphicon-eur { &::before { content: "\20ac"; } } +.glyphicon-minus { &::before { content: "\2212"; } } +.glyphicon-cloud { &::before { content: "\2601"; } } +.glyphicon-envelope { &::before { content: "\2709"; } } +.glyphicon-pencil { &::before { content: "\270f"; } } +.glyphicon-glass { &::before { content: "\e001"; } } +.glyphicon-music { &::before { content: "\e002"; } } +.glyphicon-search { &::before { content: "\e003"; } } +.glyphicon-heart { &::before { content: "\e005"; } } +.glyphicon-star { &::before { content: "\e006"; } } +.glyphicon-star-empty { &::before { content: "\e007"; } } +.glyphicon-user { &::before { content: "\e008"; } } +.glyphicon-film { &::before { content: "\e009"; } } +.glyphicon-th-large { &::before { content: "\e010"; } } +.glyphicon-th { &::before { content: "\e011"; } } +.glyphicon-th-list { &::before { content: "\e012"; } } +.glyphicon-ok { &::before { content: "\e013"; } } +.glyphicon-remove { &::before { content: "\e014"; } } +.glyphicon-zoom-in { &::before { content: "\e015"; } } +.glyphicon-zoom-out { &::before { content: "\e016"; } } +.glyphicon-off { &::before { content: "\e017"; } } +.glyphicon-signal { &::before { content: "\e018"; } } +.glyphicon-cog { &::before { content: "\e019"; } } +.glyphicon-trash { &::before { content: "\e020"; } } +.glyphicon-home { &::before { content: "\e021"; } } +.glyphicon-file { &::before { content: "\e022"; } } +.glyphicon-time { &::before { content: "\e023"; } } +.glyphicon-road { &::before { content: "\e024"; } } +.glyphicon-download-alt { &::before { content: "\e025"; } } +.glyphicon-download { &::before { content: "\e026"; } } +.glyphicon-upload { &::before { content: "\e027"; } } +.glyphicon-inbox { &::before { content: "\e028"; } } +.glyphicon-play-circle { &::before { content: "\e029"; } } +.glyphicon-repeat { &::before { content: "\e030"; } } +.glyphicon-refresh { &::before { content: "\e031"; } } +.glyphicon-list-alt { &::before { content: "\e032"; } } +.glyphicon-lock { &::before { content: "\e033"; } } +.glyphicon-flag { &::before { content: "\e034"; } } +.glyphicon-headphones { &::before { content: "\e035"; } } +.glyphicon-volume-off { &::before { content: "\e036"; } } +.glyphicon-volume-down { &::before { content: "\e037"; } } +.glyphicon-volume-up { &::before { content: "\e038"; } } +.glyphicon-qrcode { &::before { content: "\e039"; } } +.glyphicon-barcode { &::before { content: "\e040"; } } +.glyphicon-tag { &::before { content: "\e041"; } } +.glyphicon-tags { &::before { content: "\e042"; } } +.glyphicon-book { &::before { content: "\e043"; } } +.glyphicon-bookmark { &::before { content: "\e044"; } } +.glyphicon-print { &::before { content: "\e045"; } } +.glyphicon-camera { &::before { content: "\e046"; } } +.glyphicon-font { &::before { content: "\e047"; } } +.glyphicon-bold { &::before { content: "\e048"; } } +.glyphicon-italic { &::before { content: "\e049"; } } +.glyphicon-text-height { &::before { content: "\e050"; } } +.glyphicon-text-width { &::before { content: "\e051"; } } +.glyphicon-align-left { &::before { content: "\e052"; } } +.glyphicon-align-center { &::before { content: "\e053"; } } +.glyphicon-align-right { &::before { content: "\e054"; } } +.glyphicon-align-justify { &::before { content: "\e055"; } } +.glyphicon-list { &::before { content: "\e056"; } } +.glyphicon-indent-left { &::before { content: "\e057"; } } +.glyphicon-indent-right { &::before { content: "\e058"; } } +.glyphicon-facetime-video { &::before { content: "\e059"; } } +.glyphicon-picture { &::before { content: "\e060"; } } +.glyphicon-map-marker { &::before { content: "\e062"; } } +.glyphicon-adjust { &::before { content: "\e063"; } } +.glyphicon-tint { &::before { content: "\e064"; } } +.glyphicon-edit { &::before { content: "\e065"; } } +.glyphicon-share { &::before { content: "\e066"; } } +.glyphicon-check { &::before { content: "\e067"; } } +.glyphicon-move { &::before { content: "\e068"; } } +.glyphicon-step-backward { &::before { content: "\e069"; } } +.glyphicon-fast-backward { &::before { content: "\e070"; } } +.glyphicon-backward { &::before { content: "\e071"; } } +.glyphicon-play { &::before { content: "\e072"; } } +.glyphicon-pause { &::before { content: "\e073"; } } +.glyphicon-stop { &::before { content: "\e074"; } } +.glyphicon-forward { &::before { content: "\e075"; } } +.glyphicon-fast-forward { &::before { content: "\e076"; } } +.glyphicon-step-forward { &::before { content: "\e077"; } } +.glyphicon-eject { &::before { content: "\e078"; } } +.glyphicon-chevron-left { &::before { content: "\e079"; } } +.glyphicon-chevron-right { &::before { content: "\e080"; } } +.glyphicon-plus-sign { &::before { content: "\e081"; } } +.glyphicon-minus-sign { &::before { content: "\e082"; } } +.glyphicon-remove-sign { &::before { content: "\e083"; } } +.glyphicon-ok-sign { &::before { content: "\e084"; } } +.glyphicon-question-sign { &::before { content: "\e085"; } } +.glyphicon-info-sign { &::before { content: "\e086"; } } +.glyphicon-screenshot { &::before { content: "\e087"; } } +.glyphicon-remove-circle { &::before { content: "\e088"; } } +.glyphicon-ok-circle { &::before { content: "\e089"; } } +.glyphicon-ban-circle { &::before { content: "\e090"; } } +.glyphicon-arrow-left { &::before { content: "\e091"; } } +.glyphicon-arrow-right { &::before { content: "\e092"; } } +.glyphicon-arrow-up { &::before { content: "\e093"; } } +.glyphicon-arrow-down { &::before { content: "\e094"; } } +.glyphicon-share-alt { &::before { content: "\e095"; } } +.glyphicon-resize-full { &::before { content: "\e096"; } } +.glyphicon-resize-small { &::before { content: "\e097"; } } +.glyphicon-exclamation-sign { &::before { content: "\e101"; } } +.glyphicon-gift { &::before { content: "\e102"; } } +.glyphicon-leaf { &::before { content: "\e103"; } } +.glyphicon-fire { &::before { content: "\e104"; } } +.glyphicon-eye-open { &::before { content: "\e105"; } } +.glyphicon-eye-close { &::before { content: "\e106"; } } +.glyphicon-warning-sign { &::before { content: "\e107"; } } +.glyphicon-plane { &::before { content: "\e108"; } } +.glyphicon-calendar { &::before { content: "\e109"; } } +.glyphicon-random { &::before { content: "\e110"; } } +.glyphicon-comment { &::before { content: "\e111"; } } +.glyphicon-magnet { &::before { content: "\e112"; } } +.glyphicon-chevron-up { &::before { content: "\e113"; } } +.glyphicon-chevron-down { &::before { content: "\e114"; } } +.glyphicon-retweet { &::before { content: "\e115"; } } +.glyphicon-shopping-cart { &::before { content: "\e116"; } } +.glyphicon-folder-close { &::before { content: "\e117"; } } +.glyphicon-folder-open { &::before { content: "\e118"; } } +.glyphicon-resize-vertical { &::before { content: "\e119"; } } +.glyphicon-resize-horizontal { &::before { content: "\e120"; } } +.glyphicon-hdd { &::before { content: "\e121"; } } +.glyphicon-bullhorn { &::before { content: "\e122"; } } +.glyphicon-bell { &::before { content: "\e123"; } } +.glyphicon-certificate { &::before { content: "\e124"; } } +.glyphicon-thumbs-up { &::before { content: "\e125"; } } +.glyphicon-thumbs-down { &::before { content: "\e126"; } } +.glyphicon-hand-right { &::before { content: "\e127"; } } +.glyphicon-hand-left { &::before { content: "\e128"; } } +.glyphicon-hand-up { &::before { content: "\e129"; } } +.glyphicon-hand-down { &::before { content: "\e130"; } } +.glyphicon-circle-arrow-right { &::before { content: "\e131"; } } +.glyphicon-circle-arrow-left { &::before { content: "\e132"; } } +.glyphicon-circle-arrow-up { &::before { content: "\e133"; } } +.glyphicon-circle-arrow-down { &::before { content: "\e134"; } } +.glyphicon-globe { &::before { content: "\e135"; } } +.glyphicon-wrench { &::before { content: "\e136"; } } +.glyphicon-tasks { &::before { content: "\e137"; } } +.glyphicon-filter { &::before { content: "\e138"; } } +.glyphicon-briefcase { &::before { content: "\e139"; } } +.glyphicon-fullscreen { &::before { content: "\e140"; } } +.glyphicon-dashboard { &::before { content: "\e141"; } } +.glyphicon-paperclip { &::before { content: "\e142"; } } +.glyphicon-heart-empty { &::before { content: "\e143"; } } +.glyphicon-link { &::before { content: "\e144"; } } +.glyphicon-phone { &::before { content: "\e145"; } } +.glyphicon-pushpin { &::before { content: "\e146"; } } +.glyphicon-usd { &::before { content: "\e148"; } } +.glyphicon-gbp { &::before { content: "\e149"; } } +.glyphicon-sort { &::before { content: "\e150"; } } +.glyphicon-sort-by-alphabet { &::before { content: "\e151"; } } +.glyphicon-sort-by-alphabet-alt { &::before { content: "\e152"; } } +.glyphicon-sort-by-order { &::before { content: "\e153"; } } +.glyphicon-sort-by-order-alt { &::before { content: "\e154"; } } +.glyphicon-sort-by-attributes { &::before { content: "\e155"; } } +.glyphicon-sort-by-attributes-alt { &::before { content: "\e156"; } } +.glyphicon-unchecked { &::before { content: "\e157"; } } +.glyphicon-expand { &::before { content: "\e158"; } } +.glyphicon-collapse-down { &::before { content: "\e159"; } } +.glyphicon-collapse-up { &::before { content: "\e160"; } } +.glyphicon-log-in { &::before { content: "\e161"; } } +.glyphicon-flash { &::before { content: "\e162"; } } +.glyphicon-log-out { &::before { content: "\e163"; } } +.glyphicon-new-window { &::before { content: "\e164"; } } +.glyphicon-record { &::before { content: "\e165"; } } +.glyphicon-save { &::before { content: "\e166"; } } +.glyphicon-open { &::before { content: "\e167"; } } +.glyphicon-saved { &::before { content: "\e168"; } } +.glyphicon-import { &::before { content: "\e169"; } } +.glyphicon-export { &::before { content: "\e170"; } } +.glyphicon-send { &::before { content: "\e171"; } } +.glyphicon-floppy-disk { &::before { content: "\e172"; } } +.glyphicon-floppy-saved { &::before { content: "\e173"; } } +.glyphicon-floppy-remove { &::before { content: "\e174"; } } +.glyphicon-floppy-save { &::before { content: "\e175"; } } +.glyphicon-floppy-open { &::before { content: "\e176"; } } +.glyphicon-credit-card { &::before { content: "\e177"; } } +.glyphicon-transfer { &::before { content: "\e178"; } } +.glyphicon-cutlery { &::before { content: "\e179"; } } +.glyphicon-header { &::before { content: "\e180"; } } +.glyphicon-compressed { &::before { content: "\e181"; } } +.glyphicon-earphone { &::before { content: "\e182"; } } +.glyphicon-phone-alt { &::before { content: "\e183"; } } +.glyphicon-tower { &::before { content: "\e184"; } } +.glyphicon-stats { &::before { content: "\e185"; } } +.glyphicon-sd-video { &::before { content: "\e186"; } } +.glyphicon-hd-video { &::before { content: "\e187"; } } +.glyphicon-subtitles { &::before { content: "\e188"; } } +.glyphicon-sound-stereo { &::before { content: "\e189"; } } +.glyphicon-sound-dolby { &::before { content: "\e190"; } } +.glyphicon-sound-5-1 { &::before { content: "\e191"; } } +.glyphicon-sound-6-1 { &::before { content: "\e192"; } } +.glyphicon-sound-7-1 { &::before { content: "\e193"; } } +.glyphicon-copyright-mark { &::before { content: "\e194"; } } +.glyphicon-registration-mark { &::before { content: "\e195"; } } +.glyphicon-cloud-download { &::before { content: "\e197"; } } +.glyphicon-cloud-upload { &::before { content: "\e198"; } } +.glyphicon-tree-conifer { &::before { content: "\e199"; } } +.glyphicon-tree-deciduous { &::before { content: "\e200"; } } +.glyphicon-cd { &::before { content: "\e201"; } } +.glyphicon-save-file { &::before { content: "\e202"; } } +.glyphicon-open-file { &::before { content: "\e203"; } } +.glyphicon-level-up { &::before { content: "\e204"; } } +.glyphicon-copy { &::before { content: "\e205"; } } +.glyphicon-paste { &::before { content: "\e206"; } } // The following 2 Glyphicons are omitted for the time being because // they currently use Unicode codepoints that are outside the // Basic Multilingual Plane (BMP). Older buggy versions of WebKit can't handle // non-BMP codepoints in CSS string escapes, and thus can't display these two icons. // Notably, the bug affects some older versions of the Android Browser. // More info: https://github.com/twbs/bootstrap/issues/10106 -// .glyphicon-door { &:before { content: "\1f6aa"; } } -// .glyphicon-key { &:before { content: "\1f511"; } } -.glyphicon-alert { &:before { content: "\e209"; } } -.glyphicon-equalizer { &:before { content: "\e210"; } } -.glyphicon-king { &:before { content: "\e211"; } } -.glyphicon-queen { &:before { content: "\e212"; } } -.glyphicon-pawn { &:before { content: "\e213"; } } -.glyphicon-bishop { &:before { content: "\e214"; } } -.glyphicon-knight { &:before { content: "\e215"; } } -.glyphicon-baby-formula { &:before { content: "\e216"; } } -.glyphicon-tent { &:before { content: "\26fa"; } } -.glyphicon-blackboard { &:before { content: "\e218"; } } -.glyphicon-bed { &:before { content: "\e219"; } } -.glyphicon-apple { &:before { content: "\f8ff"; } } -.glyphicon-erase { &:before { content: "\e221"; } } -.glyphicon-hourglass { &:before { content: "\231b"; } } -.glyphicon-lamp { &:before { content: "\e223"; } } -.glyphicon-duplicate { &:before { content: "\e224"; } } -.glyphicon-piggy-bank { &:before { content: "\e225"; } } -.glyphicon-scissors { &:before { content: "\e226"; } } -.glyphicon-bitcoin { &:before { content: "\e227"; } } -.glyphicon-btc { &:before { content: "\e227"; } } -.glyphicon-xbt { &:before { content: "\e227"; } } -.glyphicon-yen { &:before { content: "\00a5"; } } -.glyphicon-jpy { &:before { content: "\00a5"; } } -.glyphicon-ruble { &:before { content: "\20bd"; } } -.glyphicon-rub { &:before { content: "\20bd"; } } -.glyphicon-scale { &:before { content: "\e230"; } } -.glyphicon-ice-lolly { &:before { content: "\e231"; } } -.glyphicon-ice-lolly-tasted { &:before { content: "\e232"; } } -.glyphicon-education { &:before { content: "\e233"; } } -.glyphicon-option-horizontal { &:before { content: "\e234"; } } -.glyphicon-option-vertical { &:before { content: "\e235"; } } -.glyphicon-menu-hamburger { &:before { content: "\e236"; } } -.glyphicon-modal-window { &:before { content: "\e237"; } } -.glyphicon-oil { &:before { content: "\e238"; } } -.glyphicon-grain { &:before { content: "\e239"; } } -.glyphicon-sunglasses { &:before { content: "\e240"; } } -.glyphicon-text-size { &:before { content: "\e241"; } } -.glyphicon-text-color { &:before { content: "\e242"; } } -.glyphicon-text-background { &:before { content: "\e243"; } } -.glyphicon-object-align-top { &:before { content: "\e244"; } } -.glyphicon-object-align-bottom { &:before { content: "\e245"; } } -.glyphicon-object-align-horizontal{ &:before { content: "\e246"; } } -.glyphicon-object-align-left { &:before { content: "\e247"; } } -.glyphicon-object-align-vertical { &:before { content: "\e248"; } } -.glyphicon-object-align-right { &:before { content: "\e249"; } } -.glyphicon-triangle-right { &:before { content: "\e250"; } } -.glyphicon-triangle-left { &:before { content: "\e251"; } } -.glyphicon-triangle-bottom { &:before { content: "\e252"; } } -.glyphicon-triangle-top { &:before { content: "\e253"; } } -.glyphicon-console { &:before { content: "\e254"; } } -.glyphicon-superscript { &:before { content: "\e255"; } } -.glyphicon-subscript { &:before { content: "\e256"; } } -.glyphicon-menu-left { &:before { content: "\e257"; } } -.glyphicon-menu-right { &:before { content: "\e258"; } } -.glyphicon-menu-down { &:before { content: "\e259"; } } -.glyphicon-menu-up { &:before { content: "\e260"; } } +// .glyphicon-door { &::before { content: "\1f6aa"; } } +// .glyphicon-key { &::before { content: "\1f511"; } } +.glyphicon-alert { &::before { content: "\e209"; } } +.glyphicon-equalizer { &::before { content: "\e210"; } } +.glyphicon-king { &::before { content: "\e211"; } } +.glyphicon-queen { &::before { content: "\e212"; } } +.glyphicon-pawn { &::before { content: "\e213"; } } +.glyphicon-bishop { &::before { content: "\e214"; } } +.glyphicon-knight { &::before { content: "\e215"; } } +.glyphicon-baby-formula { &::before { content: "\e216"; } } +.glyphicon-tent { &::before { content: "\26fa"; } } +.glyphicon-blackboard { &::before { content: "\e218"; } } +.glyphicon-bed { &::before { content: "\e219"; } } +.glyphicon-apple { &::before { content: "\f8ff"; } } +.glyphicon-erase { &::before { content: "\e221"; } } +.glyphicon-hourglass { &::before { content: "\231b"; } } +.glyphicon-lamp { &::before { content: "\e223"; } } +.glyphicon-duplicate { &::before { content: "\e224"; } } +.glyphicon-piggy-bank { &::before { content: "\e225"; } } +.glyphicon-scissors { &::before { content: "\e226"; } } +.glyphicon-bitcoin { &::before { content: "\e227"; } } +.glyphicon-btc { &::before { content: "\e227"; } } +.glyphicon-xbt { &::before { content: "\e227"; } } +.glyphicon-yen { &::before { content: "\00a5"; } } +.glyphicon-jpy { &::before { content: "\00a5"; } } +.glyphicon-ruble { &::before { content: "\20bd"; } } +.glyphicon-rub { &::before { content: "\20bd"; } } +.glyphicon-scale { &::before { content: "\e230"; } } +.glyphicon-ice-lolly { &::before { content: "\e231"; } } +.glyphicon-ice-lolly-tasted { &::before { content: "\e232"; } } +.glyphicon-education { &::before { content: "\e233"; } } +.glyphicon-option-horizontal { &::before { content: "\e234"; } } +.glyphicon-option-vertical { &::before { content: "\e235"; } } +.glyphicon-menu-hamburger { &::before { content: "\e236"; } } +.glyphicon-modal-window { &::before { content: "\e237"; } } +.glyphicon-oil { &::before { content: "\e238"; } } +.glyphicon-grain { &::before { content: "\e239"; } } +.glyphicon-sunglasses { &::before { content: "\e240"; } } +.glyphicon-text-size { &::before { content: "\e241"; } } +.glyphicon-text-color { &::before { content: "\e242"; } } +.glyphicon-text-background { &::before { content: "\e243"; } } +.glyphicon-object-align-top { &::before { content: "\e244"; } } +.glyphicon-object-align-bottom { &::before { content: "\e245"; } } +.glyphicon-object-align-horizontal{ &::before { content: "\e246"; } } +.glyphicon-object-align-left { &::before { content: "\e247"; } } +.glyphicon-object-align-vertical { &::before { content: "\e248"; } } +.glyphicon-object-align-right { &::before { content: "\e249"; } } +.glyphicon-triangle-right { &::before { content: "\e250"; } } +.glyphicon-triangle-left { &::before { content: "\e251"; } } +.glyphicon-triangle-bottom { &::before { content: "\e252"; } } +.glyphicon-triangle-top { &::before { content: "\e253"; } } +.glyphicon-console { &::before { content: "\e254"; } } +.glyphicon-superscript { &::before { content: "\e255"; } } +.glyphicon-subscript { &::before { content: "\e256"; } } +.glyphicon-menu-left { &::before { content: "\e257"; } } +.glyphicon-menu-right { &::before { content: "\e258"; } } +.glyphicon-menu-down { &::before { content: "\e259"; } } +.glyphicon-menu-up { &::before { content: "\e260"; } } diff --git a/less/grid.less b/less/grid.less index e94d659487..574f462f51 100644 --- a/less/grid.less +++ b/less/grid.less @@ -45,8 +45,8 @@ margin-left: 0; [class*="col-"] { - padding-left: 0; padding-right: 0; + padding-left: 0; } } diff --git a/less/input-groups.less b/less/input-groups.less index d0763db7ff..b385cf5056 100644 --- a/less/input-groups.less +++ b/less/input-groups.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type */ + // // Input groups // -------------------------------------------------- @@ -12,8 +14,8 @@ // Undo padding and float of grid classes &[class*="col-"] { float: none; - padding-left: 0; padding-right: 0; + padding-left: 0; } .form-control { @@ -77,7 +79,7 @@ .input-group-addon { padding: @padding-base-vertical @padding-base-horizontal; font-size: @font-size-base; - font-weight: normal; + font-weight: 400; line-height: 1; color: @input-color; text-align: center; diff --git a/less/jumbotron.less b/less/jumbotron.less index 1d9b515b38..cdf96baed6 100644 --- a/less/jumbotron.less +++ b/less/jumbotron.less @@ -4,7 +4,7 @@ .jumbotron { - padding-top: @jumbotron-padding; + padding-top: @jumbotron-padding; padding-bottom: @jumbotron-padding; margin-bottom: @jumbotron-padding; color: @jumbotron-color; @@ -27,9 +27,9 @@ .container &, .container-fluid & { - border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container - padding-left: (@grid-gutter-width / 2); padding-right: (@grid-gutter-width / 2); + padding-left: (@grid-gutter-width / 2); + border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container } .container { @@ -37,13 +37,13 @@ } @media screen and (min-width: @screen-sm-min) { - padding-top: (@jumbotron-padding * 1.6); + padding-top: (@jumbotron-padding * 1.6); padding-bottom: (@jumbotron-padding * 1.6); .container &, .container-fluid & { - padding-left: (@jumbotron-padding * 2); padding-right: (@jumbotron-padding * 2); + padding-left: (@jumbotron-padding * 2); } h1, diff --git a/less/labels.less b/less/labels.less index 9a5a27006a..cf0d48df3c 100644 --- a/less/labels.less +++ b/less/labels.less @@ -6,7 +6,7 @@ display: inline; padding: .2em .6em .3em; font-size: 75%; - font-weight: bold; + font-weight: 700; line-height: 1; color: @label-color; text-align: center; diff --git a/less/list-group.less b/less/list-group.less index 216b91230a..a167f3e704 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type */ + // // List groups // -------------------------------------------------- @@ -9,8 +11,8 @@ .list-group { // No need to set list-style: none; since .list-group-item is block level - margin-bottom: 20px; padding-left: 0; // reset padding because ul and ol + margin-bottom: 20px; } @@ -35,44 +37,14 @@ margin-bottom: 0; .border-bottom-radius(@list-group-border-radius); } -} - - -// Interactive list items -// -// Use anchor or button elements instead of `li`s or `div`s to create interactive items. -// Includes an extra `.active` modifier class for showing selected items. - -a.list-group-item, -button.list-group-item { - color: @list-group-link-color; - - .list-group-item-heading { - color: @list-group-link-heading-color; - } - - // Hover state - &:hover, - &:focus { - text-decoration: none; - color: @list-group-link-hover-color; - background-color: @list-group-hover-bg; - } -} - -button.list-group-item { - width: 100%; - text-align: left; -} -.list-group-item { // Disabled state &.disabled, &.disabled:hover, &.disabled:focus { - background-color: @list-group-disabled-bg; color: @list-group-disabled-color; cursor: @cursor-disabled; + background-color: @list-group-disabled-bg; // Force color to inherit for custom content .list-group-item-heading { @@ -105,6 +77,34 @@ button.list-group-item { } +// Interactive list items +// +// Use anchor or button elements instead of `li`s or `div`s to create interactive items. +// Includes an extra `.active` modifier class for showing selected items. + +a.list-group-item, +button.list-group-item { + color: @list-group-link-color; + + .list-group-item-heading { + color: @list-group-link-heading-color; + } + + // Hover state + &:hover, + &:focus { + color: @list-group-link-hover-color; + text-decoration: none; + background-color: @list-group-hover-bg; + } +} + +button.list-group-item { + width: 100%; + text-align: left; +} + + // Contextual variants // // Add modifier classes to change text and background color on individual items. diff --git a/less/media.less b/less/media.less index 8c835e861e..e4ae44573e 100644 --- a/less/media.less +++ b/less/media.less @@ -9,8 +9,8 @@ .media, .media-body { - zoom: 1; overflow: hidden; + zoom: 1; } .media-body { diff --git a/less/mixins/alerts.less b/less/mixins/alerts.less index 396196f438..b27cc5d27b 100644 --- a/less/mixins/alerts.less +++ b/less/mixins/alerts.less @@ -1,13 +1,14 @@ // Alerts .alert-variant(@background; @border; @text-color) { + color: @text-color; background-color: @background; border-color: @border; - color: @text-color; hr { border-top-color: darken(@border, 5%); } + .alert-link { color: darken(@text-color, 10%); } diff --git a/less/mixins/border-radius.less b/less/mixins/border-radius.less index ca05dbf457..da7ea10e55 100644 --- a/less/mixins/border-radius.less +++ b/less/mixins/border-radius.less @@ -1,18 +1,18 @@ // Single side border-radius .border-top-radius(@radius) { + border-top-left-radius: @radius; border-top-right-radius: @radius; - border-top-left-radius: @radius; } .border-right-radius(@radius) { + border-top-right-radius: @radius; border-bottom-right-radius: @radius; - border-top-right-radius: @radius; } .border-bottom-radius(@radius) { border-bottom-right-radius: @radius; - border-bottom-left-radius: @radius; + border-bottom-left-radius: @radius; } .border-left-radius(@radius) { + border-top-left-radius: @radius; border-bottom-left-radius: @radius; - border-top-left-radius: @radius; } diff --git a/less/mixins/buttons.less b/less/mixins/buttons.less index b294d8c210..42d3c512ab 100644 --- a/less/mixins/buttons.less +++ b/less/mixins/buttons.less @@ -12,33 +12,29 @@ &.focus { color: @color; background-color: darken(@background, 10%); - border-color: darken(@border, 25%); + border-color: darken(@border, 25%); } &:hover { color: @color; background-color: darken(@background, 10%); - border-color: darken(@border, 12%); + border-color: darken(@border, 12%); } &:active, &.active, .open > .dropdown-toggle& { color: @color; background-color: darken(@background, 10%); - border-color: darken(@border, 12%); + background-image: none; + border-color: darken(@border, 12%); &:hover, &:focus, &.focus { color: @color; background-color: darken(@background, 17%); - border-color: darken(@border, 25%); + border-color: darken(@border, 25%); } } - &:active, - &.active, - .open > .dropdown-toggle& { - background-image: none; - } &.disabled, &[disabled], fieldset[disabled] & { @@ -46,7 +42,7 @@ &:focus, &.focus { background-color: @background; - border-color: @border; + border-color: @border; } } diff --git a/less/mixins/center-block.less b/less/mixins/center-block.less index d18d6de9ed..627cfa3895 100644 --- a/less/mixins/center-block.less +++ b/less/mixins/center-block.less @@ -2,6 +2,6 @@ .center-block() { display: block; - margin-left: auto; margin-right: auto; + margin-left: auto; } diff --git a/less/mixins/clearfix.less b/less/mixins/clearfix.less index 3f7a3820c1..9affdcab26 100644 --- a/less/mixins/clearfix.less +++ b/less/mixins/clearfix.less @@ -6,17 +6,17 @@ // Otherwise it causes space to appear at the top and bottom of elements // that are clearfixed. // 2. The use of `table` rather than `block` is only necessary if using -// `:before` to contain the top-margins of child elements. +// `::before` to contain the top-margins of child elements. // // Source: http://nicolasgallagher.com/micro-clearfix-hack/ .clearfix() { - &:before, - &:after { - content: " "; // 1 + &::before, + &::after { display: table; // 2 + content: " "; // 1 } - &:after { + &::after { clear: both; } } diff --git a/less/mixins/forms.less b/less/mixins/forms.less index 6f55ed9670..173dc99a0c 100644 --- a/less/mixins/forms.less +++ b/less/mixins/forms.less @@ -20,18 +20,18 @@ // Set the border and box shadow on specific inputs to match .form-control { border-color: @border-color; - .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work + .box-shadow(inset 0 1px 1px rgba(0, 0, 0, .075)); // Redeclare so transitions work &:focus { border-color: darken(@border-color, 10%); - @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%); + @shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px lighten(@border-color, 20%); .box-shadow(@shadow); } } // Set validation states also for addons .input-group-addon { color: @text-color; - border-color: @border-color; background-color: @background-color; + border-color: @border-color; } // Optional feedback icon .form-control-feedback { @@ -57,7 +57,7 @@ &:focus { border-color: @color; outline: 0; - .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}"); + .box-shadow(~"inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px @{color-rgba}"); } } diff --git a/less/mixins/gradients.less b/less/mixins/gradients.less index 0b88a89cc5..b055083797 100644 --- a/less/mixins/gradients.less +++ b/less/mixins/gradients.less @@ -1,4 +1,4 @@ -// Gradients +/* stylelint-disable value-no-vendor-prefix */ #gradient { @@ -11,7 +11,7 @@ background-image: -o-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Opera 12 background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ background-repeat: repeat-x; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", argb(@start-color), argb(@end-color))); // IE9 and down } // Vertical gradient, from top to bottom @@ -23,35 +23,35 @@ background-image: -o-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Opera 12 background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ background-repeat: repeat-x; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", argb(@start-color), argb(@end-color))); // IE9 and down } .directional(@start-color: #555; @end-color: #333; @deg: 45deg) { - background-repeat: repeat-x; background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+ background-image: -o-linear-gradient(@deg, @start-color, @end-color); // Opera 12 background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ + background-repeat: repeat-x; } .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); background-image: -o-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color); background-repeat: no-repeat; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", argb(@start-color), argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback } .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color); background-image: -o-linear-gradient(@start-color, @mid-color @color-stop, @end-color); background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color); background-repeat: no-repeat; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", argb(@start-color), argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback } .radial(@inner-color: #555; @outer-color: #333) { background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color); background-image: radial-gradient(circle, @inner-color, @outer-color); background-repeat: no-repeat; } - .striped(@color: rgba(255,255,255,.15); @angle: 45deg) { + .striped(@color: rgba(255, 255, 255, .15); @angle: 45deg) { background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); background-image: -o-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); diff --git a/less/mixins/grid-framework.less b/less/mixins/grid-framework.less index 8c23eed24e..0c73c88b9c 100644 --- a/less/mixins/grid-framework.less +++ b/less/mixins/grid-framework.less @@ -19,8 +19,8 @@ // Prevent columns from collapsing when empty min-height: 1px; // Inner gutter via padding - padding-left: ceil((@grid-gutter-width / 2)); padding-right: floor((@grid-gutter-width / 2)); + padding-left: ceil((@grid-gutter-width / 2)); } } .col(1); // kickstart it diff --git a/less/mixins/grid.less b/less/mixins/grid.less index df496d0b3c..a9554a4207 100644 --- a/less/mixins/grid.less +++ b/less/mixins/grid.less @@ -4,17 +4,17 @@ // Centered container element .container-fixed(@gutter: @grid-gutter-width) { + padding-right: ceil((@gutter / 2)); + padding-left: floor((@gutter / 2)); margin-right: auto; margin-left: auto; - padding-left: floor((@gutter / 2)); - padding-right: ceil((@gutter / 2)); &:extend(.clearfix all); } // Creates a wrapper for a series of columns .make-row(@gutter: @grid-gutter-width) { - margin-left: ceil((@gutter / -2)); margin-right: floor((@gutter / -2)); + margin-left: ceil((@gutter / -2)); &:extend(.clearfix all); } @@ -24,8 +24,8 @@ float: left; width: percentage((@columns / @grid-columns)); min-height: 1px; - padding-left: (@gutter / 2); padding-right: (@gutter / 2); + padding-left: (@gutter / 2); } .make-xs-column-offset(@columns) { margin-left: percentage((@columns / @grid-columns)); @@ -41,8 +41,8 @@ .make-sm-column(@columns; @gutter: @grid-gutter-width) { position: relative; min-height: 1px; - padding-left: (@gutter / 2); padding-right: (@gutter / 2); + padding-left: (@gutter / 2); @media (min-width: @screen-sm-min) { float: left; @@ -69,8 +69,8 @@ .make-md-column(@columns; @gutter: @grid-gutter-width) { position: relative; min-height: 1px; - padding-left: (@gutter / 2); padding-right: (@gutter / 2); + padding-left: (@gutter / 2); @media (min-width: @screen-md-min) { float: left; @@ -97,8 +97,8 @@ .make-lg-column(@columns; @gutter: @grid-gutter-width) { position: relative; min-height: 1px; - padding-left: (@gutter / 2); padding-right: (@gutter / 2); + padding-left: (@gutter / 2); @media (min-width: @screen-lg-min) { float: left; diff --git a/less/mixins/hide-text.less b/less/mixins/hide-text.less index 2bb84a3b44..ca7e6c5325 100644 --- a/less/mixins/hide-text.less +++ b/less/mixins/hide-text.less @@ -1,3 +1,5 @@ +/* stylelint-disable font-family-name-quotes */ + // CSS image replacement // // Heads up! v3 launched with only `.hide-text()`, but per our pattern for diff --git a/less/mixins/image.less b/less/mixins/image.less index f233cb3e19..e10b041776 100644 --- a/less/mixins/image.less +++ b/less/mixins/image.less @@ -1,7 +1,4 @@ -// Image Mixins -// - Responsive image -// - Retina image - +/* stylelint-disable media-feature-name-no-vendor-prefix, media-feature-parentheses-space-inside, media-feature-name-no-unknown, indentation, at-rule-name-space-after */ // Responsive image // @@ -22,11 +19,11 @@ @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) { + 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) { background-image: url("@{file-2x}"); background-size: @width-1x @height-1x; } diff --git a/less/mixins/opacity.less b/less/mixins/opacity.less index 33ed25ce67..32cf411fcd 100644 --- a/less/mixins/opacity.less +++ b/less/mixins/opacity.less @@ -1,8 +1,7 @@ // Opacity .opacity(@opacity) { - opacity: @opacity; - // IE8 filter - @opacity-ie: (@opacity * 100); + @opacity-ie: (@opacity * 100); // IE8 filter filter: ~"alpha(opacity=@{opacity-ie})"; + opacity: @opacity; } diff --git a/less/mixins/reset-text.less b/less/mixins/reset-text.less index 58dd4d19b4..a8754bd156 100644 --- a/less/mixins/reset-text.less +++ b/less/mixins/reset-text.less @@ -2,17 +2,17 @@ font-family: @font-family-base; // We deliberately do NOT reset font-size. font-style: normal; - font-weight: normal; - letter-spacing: normal; - line-break: auto; + font-weight: 400; line-height: @line-height-base; + line-break: auto; text-align: left; // Fallback for where `start` is not supported text-align: start; text-decoration: none; text-shadow: none; text-transform: none; - white-space: normal; + letter-spacing: normal; word-break: normal; word-spacing: normal; word-wrap: normal; + white-space: normal; } diff --git a/less/mixins/resize.less b/less/mixins/resize.less index 3acd3afdba..c8513289a0 100644 --- a/less/mixins/resize.less +++ b/less/mixins/resize.less @@ -1,6 +1,6 @@ // Resize anything .resizable(@direction) { - resize: @direction; // Options: horizontal, vertical, both overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible` + resize: @direction; // Options: horizontal, vertical, both } diff --git a/less/mixins/responsive-visibility.less b/less/mixins/responsive-visibility.less index ecf1e979fd..15896dff53 100644 --- a/less/mixins/responsive-visibility.less +++ b/less/mixins/responsive-visibility.less @@ -1,7 +1,5 @@ -// Responsive utilities +/* stylelint-disable declaration-no-important */ -// -// More easily include all the states for responsive-utilities.less. .responsive-visibility() { display: block !important; table& { display: table !important; } diff --git a/less/mixins/vendor-prefixes.less b/less/mixins/vendor-prefixes.less index 2b5e74b99e..865b86402b 100644 --- a/less/mixins/vendor-prefixes.less +++ b/less/mixins/vendor-prefixes.less @@ -1,3 +1,5 @@ +/* stylelint-disable indentation, property-no-vendor-prefix, selector-no-vendor-prefix */ + // Vendor Prefixes // // All vendor mixins are deprecated as of v3.2.0 due to the introduction of @@ -89,12 +91,12 @@ // Optional hyphenation .hyphens(@mode: auto) { - word-wrap: break-word; -webkit-hyphens: @mode; -moz-hyphens: @mode; -ms-hyphens: @mode; // IE10+ -o-hyphens: @mode; hyphens: @mode; + word-wrap: break-word; } // Placeholder text diff --git a/less/modals.less b/less/modals.less index 767ce36ba3..0e516e51af 100644 --- a/less/modals.less +++ b/less/modals.less @@ -14,14 +14,14 @@ // Container that the modal scrolls within .modal { - display: none; - overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: @zindex-modal; + display: none; + overflow: hidden; -webkit-overflow-scrolling: touch; // Prevent Chrome on Windows from adding a focus outline. For details, see @@ -51,11 +51,11 @@ .modal-content { position: relative; background-color: @modal-content-bg; + background-clip: padding-box; border: 1px solid @modal-content-fallback-border-color; //old browsers fallback (ie8 etc) border: 1px solid @modal-content-border-color; border-radius: @border-radius-large; - .box-shadow(0 3px 9px rgba(0,0,0,.5)); - background-clip: padding-box; + .box-shadow(0 3px 9px rgba(0, 0, 0, .5)); // Remove focus outline from opened modal outline: 0; } @@ -108,8 +108,8 @@ // Properly space out buttons .btn + .btn { - margin-left: 5px; margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs + margin-left: 5px; } // but override that for button groups .btn-group .btn + .btn { @@ -138,7 +138,7 @@ margin: 30px auto; } .modal-content { - .box-shadow(0 5px 15px rgba(0,0,0,.5)); + .box-shadow(0 5px 15px rgba(0, 0, 0, .5)); } // Modal sizes diff --git a/less/navbar.less b/less/navbar.less index 6d751bb9ce..a1ac604723 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-type, selector-max-compound-selectors, selector-max-combinators, selector-max-class, declaration-no-important, selector-no-qualifying-type, no-duplicate-selectors */ + // // Navbars // -------------------------------------------------- @@ -48,11 +50,11 @@ // content for the user's viewport. .navbar-collapse { - overflow-x: visible; padding-right: @navbar-padding-horizontal; - padding-left: @navbar-padding-horizontal; + padding-left: @navbar-padding-horizontal; + overflow-x: visible; border-top: 1px solid transparent; - box-shadow: inset 0 1px 0 rgba(255,255,255,.1); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); &:extend(.clearfix all); -webkit-overflow-scrolling: touch; @@ -81,8 +83,8 @@ .navbar-fixed-top &, .navbar-static-top &, .navbar-fixed-bottom & { - padding-left: 0; padding-right: 0; + padding-left: 0; } } } @@ -108,11 +110,11 @@ > .navbar-header, > .navbar-collapse { margin-right: -@navbar-padding-horizontal; - margin-left: -@navbar-padding-horizontal; + margin-left: -@navbar-padding-horizontal; @media (min-width: @grid-float-breakpoint) { margin-right: 0; - margin-left: 0; + margin-left: 0; } } } @@ -162,10 +164,10 @@ .navbar-brand { float: left; + height: @navbar-height; padding: @navbar-padding-vertical @navbar-padding-horizontal; font-size: @font-size-large; line-height: @line-height-computed; - height: @navbar-height; &:hover, &:focus { @@ -193,8 +195,8 @@ .navbar-toggle { position: relative; float: right; - margin-right: @navbar-padding-horizontal; padding: 9px 10px; + margin-right: @navbar-padding-horizontal; .navbar-vertical-align(34px); background-color: transparent; background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 @@ -233,7 +235,7 @@ margin: (@navbar-padding-vertical / 2) -@navbar-padding-horizontal; > li > a { - padding-top: 10px; + padding-top: 10px; padding-bottom: 10px; line-height: @line-height-computed; } @@ -270,7 +272,7 @@ > li { float: left; > a { - padding-top: @navbar-padding-vertical; + padding-top: @navbar-padding-vertical; padding-bottom: @navbar-padding-vertical; } } @@ -284,12 +286,12 @@ // our navbars. .navbar-form { - margin-left: -@navbar-padding-horizontal; - margin-right: -@navbar-padding-horizontal; padding: 10px @navbar-padding-horizontal; + margin-right: -@navbar-padding-horizontal; + margin-left: -@navbar-padding-horizontal; border-top: 1px solid transparent; border-bottom: 1px solid transparent; - @shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1); + @shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1); .box-shadow(@shadow); // Mixin behavior for optimum display @@ -311,11 +313,11 @@ // Undo 100% width for pull classes @media (min-width: @grid-float-breakpoint) { width: auto; - border: 0; - margin-left: 0; - margin-right: 0; padding-top: 0; padding-bottom: 0; + margin-right: 0; + margin-left: 0; + border: 0; .box-shadow(none); } } @@ -361,8 +363,8 @@ @media (min-width: @grid-float-breakpoint) { float: left; - margin-left: @navbar-padding-horizontal; margin-right: @navbar-padding-horizontal; + margin-left: @navbar-padding-horizontal; } } @@ -460,8 +462,8 @@ &, &:hover, &:focus { - background-color: @navbar-default-link-active-bg; color: @navbar-default-link-active-color; + background-color: @navbar-default-link-active-bg; } } @@ -594,8 +596,8 @@ &, &:hover, &:focus { - background-color: @navbar-inverse-link-active-bg; color: @navbar-inverse-link-active-color; + background-color: @navbar-inverse-link-active-bg; } } diff --git a/less/navs.less b/less/navs.less index a3d11b1362..5a6d0587a7 100644 --- a/less/navs.less +++ b/less/navs.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type, selector-max-type */ + // // Navs // -------------------------------------------------- @@ -7,8 +9,8 @@ // -------------------------------------------------- .nav { - margin-bottom: 0; padding-left: 0; // Override default ul/ol + margin-bottom: 0; list-style: none; &:extend(.clearfix all); @@ -35,8 +37,8 @@ &:focus { color: @nav-disabled-link-hover-color; text-decoration: none; - background-color: transparent; cursor: @cursor-disabled; + background-color: transparent; } } } @@ -97,10 +99,10 @@ &:hover, &:focus { color: @nav-tabs-active-link-hover-color; + cursor: default; background-color: @nav-tabs-active-link-hover-bg; border: 1px solid @nav-tabs-active-link-hover-border-color; border-bottom-color: transparent; - cursor: default; } } } @@ -163,8 +165,8 @@ > li { float: none; > a { - text-align: center; margin-bottom: 5px; + text-align: center; } } diff --git a/less/normalize.less b/less/normalize.less index 9dddf73ad2..2a85b23937 100644 --- a/less/normalize.less +++ b/less/normalize.less @@ -1,3 +1,5 @@ +/* stylelint-disable */ + /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ // diff --git a/less/pager.less b/less/pager.less index 41abaaadc5..e77ba55095 100644 --- a/less/pager.less +++ b/less/pager.less @@ -6,8 +6,8 @@ .pager { padding-left: 0; margin: @line-height-computed 0; - list-style: none; text-align: center; + list-style: none; &:extend(.clearfix all); li { display: inline; @@ -47,8 +47,8 @@ > a:focus, > span { color: @pager-disabled-color; - background-color: @pager-bg; cursor: @cursor-disabled; + background-color: @pager-bg; } } } diff --git a/less/pagination.less b/less/pagination.less index 31f77aae4e..23b67cb263 100644 --- a/less/pagination.less +++ b/less/pagination.less @@ -14,12 +14,20 @@ position: relative; float: left; // Collapse white-space padding: @padding-base-vertical @padding-base-horizontal; + margin-left: -1px; line-height: @line-height-base; - text-decoration: none; color: @pagination-color; + text-decoration: none; background-color: @pagination-bg; border: 1px solid @pagination-border; - margin-left: -1px; + + &:hover, + &:focus { + z-index: 2; + color: @pagination-hover-color; + background-color: @pagination-hover-bg; + border-color: @pagination-hover-border; + } } &:first-child { > a, @@ -36,17 +44,6 @@ } } - > li > a, - > li > span { - &:hover, - &:focus { - z-index: 2; - color: @pagination-hover-color; - background-color: @pagination-hover-bg; - border-color: @pagination-hover-border; - } - } - > .active > a, > .active > span { &, @@ -54,9 +51,9 @@ &:focus { z-index: 3; color: @pagination-active-color; + cursor: default; background-color: @pagination-active-bg; border-color: @pagination-active-border; - cursor: default; } } @@ -68,9 +65,9 @@ > a:hover, > a:focus { color: @pagination-disabled-color; + cursor: @cursor-disabled; background-color: @pagination-disabled-bg; border-color: @pagination-disabled-border; - cursor: @cursor-disabled; } } } diff --git a/less/panels.less b/less/panels.less index 65aa3a83f3..58ee399155 100644 --- a/less/panels.less +++ b/less/panels.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-type, selector-max-compound-selectors, selector-max-combinators, no-duplicate-selectors */ + // // Panels // -------------------------------------------------- @@ -9,7 +11,7 @@ background-color: @panel-bg; border: 1px solid transparent; border-radius: @panel-border-radius; - .box-shadow(0 1px 1px rgba(0,0,0,.05)); + .box-shadow(0 1px 1px rgba(0, 0, 0, .05)); } // Panel contents @@ -113,8 +115,8 @@ margin-bottom: 0; caption { - padding-left: @panel-body-padding; padding-right: @panel-body-padding; + padding-left: @panel-body-padding; } } // Add border top radius for first one @@ -147,8 +149,8 @@ > tbody:last-child, > tfoot:last-child { > tr:last-child { - border-bottom-left-radius: (@panel-border-radius - 1); border-bottom-right-radius: (@panel-border-radius - 1); + border-bottom-left-radius: (@panel-border-radius - 1); td:first-child, th:first-child { @@ -208,8 +210,8 @@ } } > .table-responsive { - border: 0; margin-bottom: 0; + border: 0; } } diff --git a/less/popovers.less b/less/popovers.less index 3a62a6455a..6b24750825 100644 --- a/less/popovers.less +++ b/less/popovers.less @@ -1,3 +1,5 @@ +/* stylelint-disable no-duplicate-selectors */ + // // Popovers // -------------------------------------------------- @@ -15,24 +17,44 @@ // So reset our font and text properties to avoid inheriting weird values. .reset-text(); font-size: @font-size-base; - background-color: @popover-bg; background-clip: padding-box; border: 1px solid @popover-fallback-border-color; border: 1px solid @popover-border-color; border-radius: @border-radius-large; - .box-shadow(0 5px 10px rgba(0,0,0,.2)); + .box-shadow(0 5px 10px rgba(0, 0, 0, .2)); // Offset the popover to account for the popover arrow - &.top { margin-top: -@popover-arrow-width; } - &.right { margin-left: @popover-arrow-width; } - &.bottom { margin-top: @popover-arrow-width; } - &.left { margin-left: -@popover-arrow-width; } + &.top { margin-top: -@popover-arrow-width; } + &.right { margin-left: @popover-arrow-width; } + &.bottom { margin-top: @popover-arrow-width; } + &.left { margin-left: -@popover-arrow-width; } + + // Arrows + // .arrow is outer, .arrow::after is inner + > .arrow { + border-width: @popover-arrow-outer-width; + + &, + &::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + + &::after { + content: ""; + border-width: @popover-arrow-width; + } + } } .popover-title { - margin: 0; // reset heading margin padding: 8px 14px; + margin: 0; // reset heading margin font-size: @font-size-base; background-color: @popover-title-bg; border-bottom: 1px solid darken(@popover-title-bg, 5%); @@ -43,71 +65,48 @@ padding: 9px 14px; } -// Arrows -// -// .arrow is outer, .arrow:after is inner - -.popover > .arrow { - &, - &:after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid; - } -} -.popover > .arrow { - border-width: @popover-arrow-outer-width; -} -.popover > .arrow:after { - border-width: @popover-arrow-width; - content: ""; -} - .popover { &.top > .arrow { + bottom: -@popover-arrow-outer-width; left: 50%; margin-left: -@popover-arrow-outer-width; - border-bottom-width: 0; border-top-color: @popover-arrow-outer-fallback-color; // IE8 fallback border-top-color: @popover-arrow-outer-color; - bottom: -@popover-arrow-outer-width; - &:after { - content: " "; + border-bottom-width: 0; + &::after { bottom: 1px; margin-left: -@popover-arrow-width; - border-bottom-width: 0; + content: " "; border-top-color: @popover-arrow-color; + border-bottom-width: 0; } } &.right > .arrow { top: 50%; left: -@popover-arrow-outer-width; margin-top: -@popover-arrow-outer-width; - border-left-width: 0; border-right-color: @popover-arrow-outer-fallback-color; // IE8 fallback border-right-color: @popover-arrow-outer-color; - &:after { - content: " "; - left: 1px; + border-left-width: 0; + &::after { bottom: -@popover-arrow-width; - border-left-width: 0; + left: 1px; + content: " "; border-right-color: @popover-arrow-color; + border-left-width: 0; } } &.bottom > .arrow { + top: -@popover-arrow-outer-width; left: 50%; margin-left: -@popover-arrow-outer-width; border-top-width: 0; border-bottom-color: @popover-arrow-outer-fallback-color; // IE8 fallback border-bottom-color: @popover-arrow-outer-color; - top: -@popover-arrow-outer-width; - &:after { - content: " "; + &::after { top: 1px; margin-left: -@popover-arrow-width; + content: " "; border-top-width: 0; border-bottom-color: @popover-arrow-color; } @@ -120,12 +119,12 @@ border-right-width: 0; border-left-color: @popover-arrow-outer-fallback-color; // IE8 fallback border-left-color: @popover-arrow-outer-color; - &:after { - content: " "; + &::after { right: 1px; + bottom: -@popover-arrow-width; + content: " "; border-right-width: 0; border-left-color: @popover-arrow-color; - bottom: -@popover-arrow-width; } } } diff --git a/less/print.less b/less/print.less index 66e54ab489..7785fd8f1c 100644 --- a/less/print.less +++ b/less/print.less @@ -1,3 +1,5 @@ +/* stylelint-disable declaration-no-important, selector-no-qualifying-type */ + /*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */ // ========================================================================== @@ -6,96 +8,94 @@ // ========================================================================== @media print { - *, - *:before, - *:after { - background: transparent !important; - color: #000 !important; // Black prints faster: h5bp.com/s - box-shadow: none !important; - text-shadow: none !important; - } - - a, - a:visited { - text-decoration: underline; - } - - a[href]:after { - content: " (" attr(href) ")"; - } - - abbr[title]:after { - content: " (" attr(title) ")"; - } - - // Don't show links that are fragment identifiers, - // or use the `javascript:` pseudo protocol - a[href^="#"]:after, - a[href^="javascript:"]:after { - content: ""; - } - - pre, - blockquote { - border: 1px solid #999; - page-break-inside: avoid; - } - - thead { - display: table-header-group; // h5bp.com/t - } - - tr, - img { - page-break-inside: avoid; - } - - img { - max-width: 100% !important; - } - - p, - h2, - h3 { - orphans: 3; - widows: 3; - } - - h2, - h3 { - page-break-after: avoid; - } - - // Bootstrap specific changes start - - // Bootstrap components - .navbar { - display: none; - } - .btn, - .dropup > .btn { - > .caret { - border-top-color: #000 !important; - } - } - .label { - border: 1px solid #000; - } - - .table { - border-collapse: collapse !important; - - td, - th { - background-color: #fff !important; - } - } - .table-bordered { - th, - td { - border: 1px solid #ddd !important; - } - } - - // Bootstrap specific changes end + *, + *::before, + *::after { + color: #000 !important; // Black prints faster: h5bp.com/s + text-shadow: none !important; + background: transparent !important; + box-shadow: none !important; + } + + a, + a:visited { + text-decoration: underline; + } + + a[href]::after { + content: " (" attr(href) ")"; + } + + abbr[title]::after { + content: " (" attr(title) ")"; + } + + // Don't show links that are fragment identifiers, + // or use the `javascript:` pseudo protocol + a[href^="#"]::after, + a[href^="javascript:"]::after { + content: ""; + } + + pre, + blockquote { + border: 1px solid #999; + page-break-inside: avoid; + } + + thead { + display: table-header-group; // h5bp.com/t + } + + tr, + img { + page-break-inside: avoid; + } + + img { + max-width: 100% !important; + } + + p, + h2, + h3 { + orphans: 3; + widows: 3; + } + + h2, + h3 { + page-break-after: avoid; + } + + // Bootstrap specific changes start + + // Bootstrap components + .navbar { + display: none; + } + .btn, + .dropup > .btn { + > .caret { + border-top-color: #000 !important; + } + } + .label { + border: 1px solid #000; + } + + .table { + border-collapse: collapse !important; + + td, + th { + background-color: #fff !important; + } + } + .table-bordered { + th, + td { + border: 1px solid #ddd !important; + } + } } diff --git a/less/progress-bars.less b/less/progress-bars.less index 8868a1feef..9443eb09bb 100644 --- a/less/progress-bars.less +++ b/less/progress-bars.less @@ -1,3 +1,5 @@ +/* stylelint-disable at-rule-no-vendor-prefix */ + // // Progress bars // -------------------------------------------------- @@ -24,12 +26,12 @@ // Outer container .progress { - overflow: hidden; height: @line-height-computed; margin-bottom: @line-height-computed; + overflow: hidden; background-color: @progress-bg; border-radius: @progress-border-radius; - .box-shadow(inset 0 1px 2px rgba(0,0,0,.1)); + .box-shadow(inset 0 1px 2px rgba(0, 0, 0, .1)); } // Bar of progress @@ -42,7 +44,7 @@ color: @progress-bar-color; text-align: center; background-color: @progress-bar-bg; - .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15)); + .box-shadow(inset 0 -1px 0 rgba(0, 0, 0, .15)); .transition(width .6s ease); } diff --git a/less/responsive-embed.less b/less/responsive-embed.less index 080a5118fe..5a0e0b8860 100644 --- a/less/responsive-embed.less +++ b/less/responsive-embed.less @@ -16,10 +16,10 @@ video { position: absolute; top: 0; - left: 0; bottom: 0; - height: 100%; + left: 0; width: 100%; + height: 100%; border: 0; } } diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index b1db31d7bf..b7aa1f3828 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -1,3 +1,5 @@ +/* stylelint-disable declaration-no-important, at-rule-no-vendor-prefix */ + // // Responsive: Utility classes // -------------------------------------------------- diff --git a/less/scaffolding.less b/less/scaffolding.less index 64a29c6a5e..157fa4258c 100644 --- a/less/scaffolding.less +++ b/less/scaffolding.less @@ -11,8 +11,8 @@ * { .box-sizing(border-box); } -*:before, -*:after { +*::before, +*::after { .box-sizing(border-box); } @@ -21,7 +21,7 @@ html { font-size: 10px; - -webkit-tap-highlight-color: rgba(0,0,0,0); + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { @@ -111,7 +111,7 @@ img { // Horizontal rules hr { - margin-top: @line-height-computed; + margin-top: @line-height-computed; margin-bottom: @line-height-computed; border: 0; border-top: 1px solid @hr-border; @@ -126,10 +126,10 @@ hr { position: absolute; width: 1px; height: 1px; - margin: -1px; padding: 0; + margin: -1px; overflow: hidden; - clip: rect(0,0,0,0); + clip: rect(0, 0, 0, 0); border: 0; } diff --git a/less/tables.less b/less/tables.less index 2242c03686..842d5e65c2 100644 --- a/less/tables.less +++ b/less/tables.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-max-type, selector-max-compound-selectors, selector-no-qualifying-type */ + // // Tables // -------------------------------------------------- @@ -5,13 +7,34 @@ table { background-color: @table-bg; + + // Table cell sizing + // + // Reset default table behavior + + col[class*="col-"] { + position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) + display: table-column; + float: none; + } + + td, + th { + &[class*="col-"] { + position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) + display: table-cell; + float: none; + } + } } + caption { padding-top: @table-cell-padding; padding-bottom: @table-cell-padding; color: @text-muted; text-align: left; } + th { text-align: left; } @@ -128,27 +151,6 @@ th { } -// Table cell sizing -// -// Reset default table behavior - -table col[class*="col-"] { - position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) - float: none; - display: table-column; -} -table { - td, - th { - &[class*="col-"] { - position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623) - float: none; - display: table-cell; - } - } -} - - // Table backgrounds // // Exact selectors below required to override `.table-striped` and prevent @@ -169,12 +171,12 @@ table { // will display normally. .table-responsive { + min-height: .01%; // Workaround for IE9 bug (see https://github.com/twbs/bootstrap/issues/14837) overflow-x: auto; - min-height: 0.01%; // Workaround for IE9 bug (see https://github.com/twbs/bootstrap/issues/14837) @media screen and (max-width: @screen-xs-max) { width: 100%; - margin-bottom: (@line-height-computed * 0.75); + margin-bottom: (@line-height-computed * .75); overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; border: 1px solid @table-border-color; diff --git a/less/theme.less b/less/theme.less index 905fa0e07e..23c878f803 100644 --- a/less/theme.less +++ b/less/theme.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type, selector-max-compound-selectors */ + /*! * Bootstrap v3.4.0 (http://getbootstrap.com) * Copyright 2011-2016 Twitter, Inc. @@ -23,14 +25,14 @@ .btn-info, .btn-warning, .btn-danger { - text-shadow: 0 -1px 0 rgba(0,0,0,.2); - @shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075); + text-shadow: 0 -1px 0 rgba(0, 0, 0, .2); + @shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); .box-shadow(@shadow); // Reset the shadow &:active, &.active { - .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + .box-shadow(inset 0 3px 5px rgba(0, 0, 0, .125)); } &.disabled, @@ -88,7 +90,11 @@ } // Apply the mixin to the buttons -.btn-default { .btn-styles(@btn-default-bg); text-shadow: 0 1px 0 #fff; border-color: #ccc; } +.btn-default { + .btn-styles(@btn-default-bg); + text-shadow: 0 1px 0 #fff; + border-color: #ccc; +} .btn-primary { .btn-styles(@btn-primary-bg); } .btn-success { .btn-styles(@btn-success-bg); } .btn-info { .btn-styles(@btn-info-bg); } @@ -102,7 +108,7 @@ .thumbnail, .img-thumbnail { - .box-shadow(0 1px 2px rgba(0,0,0,.075)); + .box-shadow(0 1px 2px rgba(0, 0, 0, .075)); } @@ -132,18 +138,18 @@ #gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg); .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered border-radius: @navbar-border-radius; - @shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075); + @shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); .box-shadow(@shadow); .navbar-nav > .open > a, .navbar-nav > .active > a { #gradient > .vertical(@start-color: darken(@navbar-default-link-active-bg, 5%); @end-color: darken(@navbar-default-link-active-bg, 2%)); - .box-shadow(inset 0 3px 9px rgba(0,0,0,.075)); + .box-shadow(inset 0 3px 9px rgba(0, 0, 0, .075)); } } .navbar-brand, .navbar-nav > li > a { - text-shadow: 0 1px 0 rgba(255,255,255,.25); + text-shadow: 0 1px 0 rgba(255, 255, 255, .25); } // Inverted navbar @@ -154,12 +160,12 @@ .navbar-nav > .open > a, .navbar-nav > .active > a { #gradient > .vertical(@start-color: @navbar-inverse-link-active-bg; @end-color: lighten(@navbar-inverse-link-active-bg, 2.5%)); - .box-shadow(inset 0 3px 9px rgba(0,0,0,.25)); + .box-shadow(inset 0 3px 9px rgba(0, 0, 0, .25)); } .navbar-brand, .navbar-nav > li > a { - text-shadow: 0 -1px 0 rgba(0,0,0,.25); + text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); } } @@ -189,8 +195,8 @@ // Common styles .alert { - text-shadow: 0 1px 0 rgba(255,255,255,.2); - @shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.05); + text-shadow: 0 1px 0 rgba(255, 255, 255, .2); + @shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); .box-shadow(@shadow); } @@ -241,7 +247,7 @@ .list-group { border-radius: @border-radius-base; - .box-shadow(0 1px 2px rgba(0,0,0,.075)); + .box-shadow(0 1px 2px rgba(0, 0, 0, .075)); } .list-group-item.active, .list-group-item.active:hover, @@ -262,7 +268,7 @@ // Common styles .panel { - .box-shadow(0 1px 2px rgba(0,0,0,.05)); + .box-shadow(0 1px 2px rgba(0, 0, 0, .05)); } // Mixin for generating new styles @@ -286,6 +292,6 @@ .well { #gradient > .vertical(@start-color: darken(@well-bg, 5%); @end-color: @well-bg); border-color: darken(@well-bg, 10%); - @shadow: inset 0 1px 3px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1); + @shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); .box-shadow(@shadow); } diff --git a/less/thumbnails.less b/less/thumbnails.less index 0713e67d00..25fd4e613a 100644 --- a/less/thumbnails.less +++ b/less/thumbnails.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-no-qualifying-type */ + // // Thumbnails // -------------------------------------------------- @@ -17,8 +19,8 @@ > img, a > img { &:extend(.img-responsive); - margin-left: auto; margin-right: auto; + margin-left: auto; } // Add a hover state for linked versions only diff --git a/less/tooltip.less b/less/tooltip.less index b48d63e07a..0906835e80 100644 --- a/less/tooltip.less +++ b/less/tooltip.less @@ -1,3 +1,5 @@ +/* stylelint-disable no-duplicate-selectors */ + // // Tooltips // -------------------------------------------------- @@ -15,11 +17,23 @@ .opacity(0); - &.in { .opacity(@tooltip-opacity); } - &.top { margin-top: -3px; padding: @tooltip-arrow-width 0; } - &.right { margin-left: 3px; padding: 0 @tooltip-arrow-width; } - &.bottom { margin-top: 3px; padding: @tooltip-arrow-width 0; } - &.left { margin-left: -3px; padding: 0 @tooltip-arrow-width; } + &.in { .opacity(@tooltip-opacity); } + &.top { + padding: @tooltip-arrow-width 0; + margin-top: -3px; + } + &.right { + padding: 0 @tooltip-arrow-width; + margin-left: 3px; + } + &.bottom { + padding: @tooltip-arrow-width 0; + margin-top: 3px; + } + &.left { + padding: 0 @tooltip-arrow-width; + margin-left: -3px; + } } // Wrapper for the tooltip content @@ -50,8 +64,8 @@ border-top-color: @tooltip-arrow-color; } &.top-left .tooltip-arrow { - bottom: 0; right: @tooltip-arrow-width; + bottom: 0; margin-bottom: -@tooltip-arrow-width; border-width: @tooltip-arrow-width @tooltip-arrow-width 0; border-top-color: @tooltip-arrow-color; diff --git a/less/type.less b/less/type.less index 01a41f1d02..7ab4dd2e06 100644 --- a/less/type.less +++ b/less/type.less @@ -1,3 +1,5 @@ +/* stylelint-disable selector-list-comma-newline-after, selector-no-qualifying-type */ + // // Typography // -------------------------------------------------- @@ -15,7 +17,7 @@ h1, h2, h3, h4, h5, h6, small, .small { - font-weight: normal; + font-weight: 400; line-height: 1; color: @headings-small-color; } @@ -82,8 +84,8 @@ small, mark, .mark { - background-color: @state-warning-bg; padding: .2em; + background-color: @state-warning-bg; } // Alignment @@ -180,8 +182,8 @@ ol { > li { display: inline-block; - padding-left: 5px; padding-right: 5px; + padding-left: 5px; } } @@ -195,7 +197,7 @@ dd { line-height: @line-height-base; } dt { - font-weight: bold; + font-weight: 700; } dd { margin-left: 0; // Undo browser default @@ -259,8 +261,8 @@ blockquote { line-height: @line-height-base; color: @blockquote-small-color; - &:before { - content: '\2014 \00A0'; // em dash, nbsp + &::before { + content: "\2014 \00A0"; // em dash, nbsp } } } @@ -272,17 +274,17 @@ blockquote { blockquote.pull-right { padding-right: 15px; padding-left: 0; + text-align: right; border-right: 5px solid @blockquote-border-color; border-left: 0; - text-align: right; // Account for citation footer, small, .small { - &:before { content: ''; } - &:after { - content: '\00A0 \2014'; // nbsp, em dash + &::before { content: ""; } + &::after { + content: "\00A0 \2014"; // nbsp, em dash } } } diff --git a/less/utilities.less b/less/utilities.less index 7a8ca27a8f..4700655851 100644 --- a/less/utilities.less +++ b/less/utilities.less @@ -1,3 +1,5 @@ +/* stylelint-disable declaration-no-important */ + // // Utility classes // -------------------------------------------------- diff --git a/less/variables.less b/less/variables.less index 4225865e3c..3b27f45d4c 100644 --- a/less/variables.less +++ b/less/variables.less @@ -1,3 +1,5 @@ +/* stylelint-disable value-keyword-case */ + // // Variables // -------------------------------------------------- @@ -50,14 +52,14 @@ @font-size-base: 14px; @font-size-large: ceil((@font-size-base * 1.25)); // ~18px -@font-size-small: ceil((@font-size-base * 0.85)); // ~12px +@font-size-small: ceil((@font-size-base * .85)); // ~12px @font-size-h1: floor((@font-size-base * 2.6)); // ~36px @font-size-h2: floor((@font-size-base * 2.15)); // ~30px @font-size-h3: ceil((@font-size-base * 1.7)); // ~24px @font-size-h4: ceil((@font-size-base * 1.25)); // ~18px @font-size-h5: @font-size-base; -@font-size-h6: ceil((@font-size-base * 0.85)); // ~12px +@font-size-h6: ceil((@font-size-base * .85)); // ~12px //** Unit-less `line-height` for use in components like buttons. @line-height-base: 1.428571429; // 20/14 @@ -234,7 +236,7 @@ //** Background for the dropdown menu. @dropdown-bg: #fff; //** Dropdown menu `border-color`. -@dropdown-border: rgba(0,0,0,.15); +@dropdown-border: rgba(0, 0, 0, .15); //** Dropdown menu `border-color` **for IE8**. @dropdown-fallback-border: #ccc; //** Divider color for between dropdown items. @@ -540,7 +542,7 @@ //** Popover maximum width @popover-max-width: 276px; //** Popover border color -@popover-border-color: rgba(0,0,0,.2); +@popover-border-color: rgba(0, 0, 0, .2); //** Popover fallback border color @popover-fallback-border-color: #ccc; @@ -598,7 +600,7 @@ //** Background color of modal content area @modal-content-bg: #fff; //** Modal content border color -@modal-content-border-color: rgba(0,0,0,.2); +@modal-content-border-color: rgba(0, 0, 0, .2); //** Modal content border color **for IE8** @modal-content-fallback-border-color: #999; @@ -803,7 +805,7 @@ // //## -@carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6); +@carousel-text-shadow: 0 1px 2px rgba(0, 0, 0, .6); @carousel-control-color: #fff; @carousel-control-width: 15%; diff --git a/less/wells.less b/less/wells.less index 15d072b0cd..9f5bdaa383 100644 --- a/less/wells.less +++ b/less/wells.less @@ -11,10 +11,10 @@ background-color: @well-bg; border: 1px solid @well-border; border-radius: @border-radius-base; - .box-shadow(inset 0 1px 1px rgba(0,0,0,.05)); + .box-shadow(inset 0 1px 1px rgba(0, 0, 0, .05)); blockquote { border-color: #ddd; - border-color: rgba(0,0,0,.15); + border-color: rgba(0, 0, 0, .15); } } diff --git a/package.json b/package.json index 1d674de6af..7a1705f538 100644 --- a/package.json +++ b/package.json @@ -39,7 +39,6 @@ "grunt-contrib-concat": "~1.0.0", "grunt-contrib-connect": "~1.0.0", "grunt-contrib-copy": "~1.0.0", - "grunt-contrib-csslint": "~1.0.0", "grunt-contrib-cssmin": "~1.0.0", "grunt-contrib-htmlmin": "~1.5.0", "grunt-contrib-jshint": "~1.0.0", @@ -54,10 +53,14 @@ "grunt-jekyll": "~0.4.4", "grunt-jscs": "~3.0.1", "grunt-saucelabs": "~9.0.0", + "grunt-stylelint": "^0.9.0", "load-grunt-tasks": "~3.5.0", "markdown-it": "^7.0.0", "shelljs": "^0.7.0", "shx": "^0.1.2", + "stylelint": "^8.2.0", + "stylelint-config-standard": "^17.0.0", + "stylelint-order": "^0.7.0", "time-grunt": "^1.3.0" }, "engines": { |