diff --git a/package-lock.json b/package-lock.json index a770d2b724..5c292083bc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -778,7 +778,8 @@ "bootstrap": { "version": "3.3.7", "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.3.7.tgz", - "integrity": "sha1-WjiTlFSfIzMIdaOxUGVldPip63E=" + "integrity": "sha1-WjiTlFSfIzMIdaOxUGVldPip63E=", + "dev": true }, "bower": { "version": "1.8.4", @@ -5902,7 +5903,7 @@ "is-buffer": { "version": "1.1.6", "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz", - "integrity": "sha1-76ouqdqg16suoTqXsritUf776L4=", + "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==", "dev": true }, "is-builtin-module": { @@ -6636,7 +6637,7 @@ "jszip": { "version": "3.1.5", "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.1.5.tgz", - "integrity": "sha1-48KmxtcGrG5gMxQDbUPNQL7v3zc=", + "integrity": "sha512-5W8NUaFRFRqTOL7ZDDrx5qWHJyBXy6velVudIzQUSoqAAYqzSh2Z7/m0Rf1QbmQJccegD0r+YZxBjzqoBiEeJQ==", "dev": true, "requires": { "core-js": "~2.3.0", @@ -6967,9 +6968,9 @@ "dev": true }, "less": { - "version": "3.7.1", - "resolved": "https://registry.npmjs.org/less/-/less-3.7.1.tgz", - "integrity": "sha512-Cmf5XJlzNklkBC8eAa+Ef16AHUBAkApHNAw3x9Vmn84h2BvGrri5Id7kf6H1n6SN74Fc0WdHIRPlFMxsl0eJkA==", + "version": "3.8.0", + "resolved": "https://registry.npmjs.org/less/-/less-3.8.0.tgz", + "integrity": "sha512-746DPDyL+Wsjo7h/Z3t+A3Mg/mpDTaxW4puZyLhCQJjWJJvHggN735orjuCLIYgo7jKqv1zWLiQrxkuUOg5oGA==", "dev": true, "requires": { "errno": "^0.1.1", @@ -8153,7 +8154,7 @@ "normalize-package-data": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz", - "integrity": "sha1-EvlaMH1YNSB1oEkHuErIvpisAS8=", + "integrity": "sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw==", "dev": true, "requires": { "hosted-git-info": "^2.1.4", @@ -8566,7 +8567,7 @@ "pako": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.6.tgz", - "integrity": "sha1-AQEhG6pwxLykoPY/Igbpe3368lg=", + "integrity": "sha512-lQe48YPsMJAig+yngZ87Lus+NF+3mtu7DVOBu6b/gHO1YpKwIj5AWjZ/TOS7i46HD/UixzWb1zeWDZfGZ3iYcg==", "dev": true }, "parallel-transform": { @@ -10327,7 +10328,7 @@ "spdx-correct": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.0.0.tgz", - "integrity": "sha1-BaW01xU6GVvJLDxCW2nzsqlSTII=", + "integrity": "sha512-N19o9z5cEyc8yQQPukRCZ9EUmb4HUpnrmaL/fxS2pBo2jbfcFRVuFZ/oFC+vZz0MNNk0h80iMn5/S6qGZOL5+g==", "dev": true, "requires": { "spdx-expression-parse": "^3.0.0", @@ -10337,13 +10338,13 @@ "spdx-exceptions": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.1.0.tgz", - "integrity": "sha1-LHrmEFbHFKW5ubKyr30xHvXHj+k=", + "integrity": "sha512-4K1NsmrlCU1JJgUrtgEeTVyfx8VaYea9J9LvARxhbHtVtohPs/gFGG5yy49beySjlIMhhXZ4QqujIZEfS4l6Cg==", "dev": true }, "spdx-expression-parse": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz", - "integrity": "sha1-meEZt6XaAOBUkcn6M4t5BII7QdA=", + "integrity": "sha512-Yg6D3XpRD4kkOmTpdgbUiEJFKghJH03fiC1OPll5h/0sO6neh2jqRDVHOQ4o/LMea0tgCkbMgea5ip/e+MkWyg==", "dev": true, "requires": { "spdx-exceptions": "^2.1.0", @@ -10353,7 +10354,7 @@ "spdx-license-ids": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.0.tgz", - "integrity": "sha1-enzShHDMbToc/m1miG9rxDDTrIc=", + "integrity": "sha512-2+EPwgbnmOIl8HjGBXXMd9NAu02vLjOO1nWw4kmeRDFyHn+M/ETfHxQUK0oXg8ctgVnl9t3rosNVsZ1jG61nDA==", "dev": true }, "split": { @@ -11222,7 +11223,7 @@ "validate-npm-package-license": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.3.tgz", - "integrity": "sha1-gWQ7y+8b3+zUYjeT3EZIlIupgzg=", + "integrity": "sha512-63ZOUnL4SIXj4L0NixR3L1lcjO38crAbgrTpl28t8jjrfuiOBL5Iygm+60qPs/KsZGzPNg6Smnc/oY16QTjF0g==", "dev": true, "requires": { "spdx-correct": "^3.0.0", diff --git a/package.json b/package.json index 9b7783c5b0..d9455350db 100644 --- a/package.json +++ b/package.json @@ -30,9 +30,6 @@ ], "author": "UI Grid Team", "license": "MIT", - "dependencies": { - "bootstrap": "~3.3.5" - }, "devDependencies": { "bower": "^1.8.2", "canonical-path": "0.0.2", @@ -73,6 +70,7 @@ "karma-requirejs": "~1.1.0", "karma-sauce-launcher": "^1.2.0", "karma-script-launcher": "~1.0.0", + "less": "^3.8.0", "load-grunt-config": "^0.19.2", "marked": "^0.3.19", "phantomjs-prebuilt": "^2.1.16", diff --git a/src/features/cellnav/less/cellNav.less b/src/features/cellnav/less/cellNav.less index b24eae2284..7d70af6fba 100644 --- a/src/features/cellnav/less/cellNav.less +++ b/src/features/cellnav/less/cellNav.less @@ -1,10 +1,4 @@ @import '../../../less/variables'; -@import (reference) '../../../less/bootstrap/bootstrap'; - -// .ui-grid-cell-contents:focus { -// outline: 0; -// background-color: @focusedCell; -// } .ui-grid-cell-focus { outline: 0; @@ -13,12 +7,17 @@ .ui-grid-focuser { position: absolute; - left: 0px; - top: 0px; + left: 0; + top: 0; z-index: -1; width:100%; height:100%; - #ui-grid-twbs > .form-control-focus(); + &:focus { + border-color: #66afe9; + outline: 0; + -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); + box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); + } } .ui-grid-offscreen{ diff --git a/src/features/pagination/less/pagination.less b/src/features/pagination/less/pagination.less index 10836c93a8..f8fba3684e 100644 --- a/src/features/pagination/less/pagination.less +++ b/src/features/pagination/less/pagination.less @@ -1,6 +1,10 @@ @import "../../../less/variables"; @import "../../../less/elements"; -@import (reference) "../../../less/bootstrap/bootstrap"; + +@btnColor: #eee; +@btnBgColor: #dadada; +@btnBorderHoverColor: #adadad; +@btnActiveColor: #8c8c8c; .ui-grid-pager-panel { display: flex; @@ -36,17 +40,118 @@ button { height: 25px; min-width: 26px; - #ui-grid-twbs > .btn; - #ui-grid-twbs > .button-variant(@paginationButtonColor, @paginationButtonBackgroundColor, @paginationButtonBorderColor); + display: inline-block; + margin-bottom: 0; + font-weight: normal; + text-align: center; + vertical-align: middle; + touch-action: manipulation; + cursor: pointer; + background: #f3f3f3; + border: 1px solid #ccc; + white-space: nowrap; + padding: 6px 12px; + font-size: 14px; + line-height: 1.42857143; + border-radius: 4px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + color: @btnColor; + + &:hover { + border-color: @btnBorderHoverColor; + text-decoration: none; + } + + &:focus { + border-color: @btnActiveColor; + text-decoration: none; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; + } + + &:active { + border-color: @btnBorderHoverColor; + outline: 0; + -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); + box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); + &:focus { + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; + } + &:hover, + &:focus { + background-color: #c8c8c8; + border-color: @btnActiveColor; + } + } + + &:hover, &:focus, &:active { + color: @btnColor; + background: @btnBgColor; + } + + &[disabled] { + cursor: not-allowed; + opacity: 0.65; + filter: alpha(opacity=65); + -webkit-box-shadow: none; + box-shadow: none; + &:hover, + &:focus { + background-color: #f3f3f3; + border-color: #ccc; + } + } } input { - #ui-grid-twbs > .form-control(); - #ui-grid-twbs > .input-sm (); display: inline; height: 26px; width: 50px; vertical-align: top; + color: #555555; + background: #fff; + border: 1px solid #ccc; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 3px; + + &:focus { + border-color: #66afe9; + outline: 0; + -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); + box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); + } + &[disabled], + &[readonly], + &::-moz-placeholder { + opacity: 1; + } + &::-moz-placeholder, + &:-ms-input-placeholder, + &::-webkit-input-placeholder { + color: #999; + } + &::-ms-expand { + border: 0; + background-color: transparent; + } + &[disabled], + &[readonly] { + background-color: #eeeeee; + } + &[disabled] { + cursor: not-allowed; + } } .ui-grid-pager-max-pages-number { @@ -124,12 +229,50 @@ padding: 5px 10px; select { - #ui-grid-twbs > .form-control; - #ui-grid-twbs > .input-sm (); + color: #555555; + background: #fff; + border: 1px solid #ccc; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 3px; height: 25px; width: 67px; display: inline; vertical-align: middle; + + &:focus { + border-color: #66afe9; + outline: 0; + -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); + box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); + } + &[disabled], + &[readonly], + &::-moz-placeholder { + opacity: 1; + } + &::-moz-placeholder, + &:-ms-input-placeholder, + &::-webkit-input-placeholder { + color: #999; + } + &::-ms-expand { + border: 0; + background-color: transparent; + } + &[disabled], + &[readonly] { + background-color: #eeeeee; + } + &[disabled] { + cursor: not-allowed; + } } .ui-grid-pager-row-count-label { diff --git a/src/less/bootstrap/bootstrap.less b/src/less/bootstrap/bootstrap.less deleted file mode 100755 index 947e417f4b..0000000000 --- a/src/less/bootstrap/bootstrap.less +++ /dev/null @@ -1,78 +0,0 @@ -/*! - * Bootstrap v3.3.5 (http://getbootstrap.com) - * Copyright 2011-2015 Twitter, Inc. - * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) - */ - -/****** NOTE: IMPORTANT INFORMATION ABOUT USING THIS FILE *********\ - * If you are importing this file then use `@import (reference) '..../bootstrap'` - * ENSURE that you use the (refrerence) - * WHY? Because otherwise you will import the entire contents of less bootstrap - * - * How does this work? - * All of the bootstrap less elements are namespaced under `#ui-grid-twbs` - * This prevents the CSS generated using this file from conflicting with a project's - * import of bootstrap. - * - * XXX: Why are so many of these imports commented out? - * There are several issues with the `extend` function in less. - * Using extend, even within an import that only has a reference will import that - * css element. This causes bloat in the distributed css files. - * Related Issues: - * https://github.com/less/less.js/issues/1968 - * https://github.com/less/less.js/issues/1851 - * - * If you comment in one of these files you may get much more than css then you want. - * Only do this sparingly. - */ -#ui-grid-twbs { - // Core variables and mixins - @import (reference) "@{bootstrapDirectory}/less/variables.less"; - @import (reference) "@{bootstrapDirectory}/less/mixins.less"; - - // Reset and dependencies - @import (reference) "@{bootstrapDirectory}/less/normalize.less"; - @import (reference) "@{bootstrapDirectory}/less/print.less"; - @import (reference) "@{bootstrapDirectory}/less/glyphicons.less"; - - // Core CSS - @import (reference) "@{bootstrapDirectory}/less/scaffolding.less"; - @import (reference) "@{bootstrapDirectory}/less/code.less"; - @import (reference) "@{bootstrapDirectory}/less/tables.less"; - @import (reference) "@{bootstrapDirectory}/less/forms.less"; - @import (reference) "@{bootstrapDirectory}/less/buttons.less"; - //@import (reference) "@{bootstrapDirectory}/less/type.less"; - //@import (reference) "@{bootstrapDirectory}/less/grid.less"; - - // Components - @import (reference) "@{bootstrapDirectory}/less/component-animations.less"; - @import (reference) "@{bootstrapDirectory}/less/dropdowns.less"; - @import (reference) "@{bootstrapDirectory}/less/button-groups.less"; - @import (reference) "@{bootstrapDirectory}/less/input-groups.less"; - @import (reference) "@{bootstrapDirectory}/less/breadcrumbs.less"; - @import (reference) "@{bootstrapDirectory}/less/pagination.less"; - @import (reference) "@{bootstrapDirectory}/less/labels.less"; - @import (reference) "@{bootstrapDirectory}/less/badges.less"; - @import (reference) "@{bootstrapDirectory}/less/jumbotron.less"; - @import (reference) "@{bootstrapDirectory}/less/alerts.less"; - @import (reference) "@{bootstrapDirectory}/less/progress-bars.less"; - @import (reference) "@{bootstrapDirectory}/less/media.less"; - @import (reference) "@{bootstrapDirectory}/less/list-group.less"; - @import (reference) "@{bootstrapDirectory}/less/responsive-embed.less"; - @import (reference) "@{bootstrapDirectory}/less/wells.less"; - @import (reference) "@{bootstrapDirectory}/less/close.less"; - //@import (reference) "@{bootstrapDirectory}/less/navs.less"; - //@import (reference) "@{bootstrapDirectory}/less/navbar.less"; - //@import (reference) "@{bootstrapDirectory}/less/pager.less"; - //@import (reference) "@{bootstrapDirectory}/less/thumbnails.less"; - //@import (reference) "@{bootstrapDirectory}/less/panels.less"; - - // Components w/ JavaScript - @import (reference) "@{bootstrapDirectory}/less/tooltip.less"; - //@import (reference) "@{bootstrapDirectory}/less/modals.less"; - //@import (reference) "@{bootstrapDirectory}/less/popovers.less"; - - // Utility classes - @import (reference) "@{bootstrapDirectory}/less/utilities.less"; - //@import (reference) "@{bootstrapDirectory}/less/responsive-utilities.less"; -} diff --git a/src/less/main.less b/src/less/main.less index d4e83951b9..1badc9bc12 100644 --- a/src/less/main.less +++ b/src/less/main.less @@ -1,4 +1,3 @@ -@import (once, reference) 'bootstrap/bootstrap'; @import 'grid'; @import 'header'; @import 'body'; diff --git a/src/less/variables.less b/src/less/variables.less index 4e54b02630..7b0632df8a 100644 --- a/src/less/variables.less +++ b/src/less/variables.less @@ -3,8 +3,6 @@ /*-- VARIABLES (DO NOT REMOVE THESE COMMENTS) --*/ -@bootstrapDirectory: "../../../node_modules/bootstrap"; - /** * @section Grid styles */