diff --git a/package.json b/package.json index 3c52c3aad0..cf9566ec6b 100644 --- a/package.json +++ b/package.json @@ -23,8 +23,9 @@ "eslint-plugin-react": "3.0.0", "exists-file": "1.0.2", "expect": "1.20.1", - "extract-text-webpack-plugin": "2.0.0-rc.3", + "extract-text-webpack-plugin": "2.1.0", "file-loader": "0.8.5", + "glob": "7.1.1", "html-webpack-plugin": "2.17.0", "istanbul-instrumenter-loader": "2.0.0", "jsdoc": "^3.4.3", diff --git a/prod-webpack.config.js b/prod-webpack.config.js index 5e238fd16e..713c080e56 100644 --- a/prod-webpack.config.js +++ b/prod-webpack.config.js @@ -4,7 +4,7 @@ var LoaderOptionsPlugin = require("webpack/lib/LoaderOptionsPlugin"); var ParallelUglifyPlugin = require("webpack-parallel-uglify-plugin"); var DefinePlugin = require("webpack/lib/DefinePlugin"); var NormalModuleReplacementPlugin = require("webpack/lib/NormalModuleReplacementPlugin"); - +const extractThemesPlugin = require('./themes.js').extractThemesPlugin; var assign = require('object-assign'); assign(webpackConfig.entry, require('./examples.js')); @@ -30,7 +30,8 @@ webpackConfig.plugins = [ compress: {warnings: false}, mangle: true } - }) + }), + extractThemesPlugin ]; webpackConfig.devtool = undefined; diff --git a/themes.js b/themes.js new file mode 100644 index 0000000000..ac04f327c1 --- /dev/null +++ b/themes.js @@ -0,0 +1,23 @@ +const ExtractTextPlugin = require('extract-text-webpack-plugin'); +var path = require("path"); +const glob = require('glob'); +const extractThemesPlugin = new ExtractTextPlugin({ + filename: '[name].css', + disable: process.env.NODE_ENV === "development" +}); + + +const themeEntries = () => { + const globPath = path.join(__dirname, "web", "client", "themes", "*"); + var files = glob.sync(globPath); + return files.reduce((res, curr) => { + var finalRes = res || {}; + finalRes["themes/" + path.basename(curr, path.extname(curr))] = `${curr}/theme.less`; + return finalRes; + }, {}); + +}(); +module.exports = { + themeEntries, + extractThemesPlugin +}; diff --git a/web/client/actions/__tests__/theme-test.js b/web/client/actions/__tests__/theme-test.js new file mode 100644 index 0000000000..0a350ac8e4 --- /dev/null +++ b/web/client/actions/__tests__/theme-test.js @@ -0,0 +1,26 @@ +/** + * Copyright 2017, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +var expect = require('expect'); +var { + THEME_SELECTED, + selectTheme +} = require('../theme'); + +describe('Test theme related actions', () => { + it('test theme selection action', () => { + let theme = {id: "newtheme"}; + let e = selectTheme(theme); + + expect(e).toExist(); + expect(e.type).toBe(THEME_SELECTED); + expect(e.theme).toExist(); + expect(e.theme).toBe(theme); + + }); +}); diff --git a/web/client/actions/theme.js b/web/client/actions/theme.js new file mode 100644 index 0000000000..75a0c755fc --- /dev/null +++ b/web/client/actions/theme.js @@ -0,0 +1,20 @@ +/** + * Copyright 2017, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ +const THEME_SELECTED = 'THEME_SELECTED'; + + +function selectTheme(theme) { + return { + type: THEME_SELECTED, + theme + }; +} +module.exports = { + THEME_SELECTED, + selectTheme +}; diff --git a/web/client/components/TOC/DefaultLayer.jsx b/web/client/components/TOC/DefaultLayer.jsx index 22e85ea6fa..5270fab7ec 100644 --- a/web/client/components/TOC/DefaultLayer.jsx +++ b/web/client/components/TOC/DefaultLayer.jsx @@ -145,7 +145,7 @@ var DefaultLayer = React.createClass({ + style={{"float": "right", cursor: "pointer"}}/> ); } if (this.props.activateLegendTool) { diff --git a/web/client/components/TOC/fragments/SettingsModal.jsx b/web/client/components/TOC/fragments/SettingsModal.jsx index 28c80fdd3f..f5c6ecc3ce 100644 --- a/web/client/components/TOC/fragments/SettingsModal.jsx +++ b/web/client/components/TOC/fragments/SettingsModal.jsx @@ -66,8 +66,7 @@ const SettingsModal = React.createClass({ position: "absolute", // overflow: "auto", top: "100px", - left: "calc(50% - 150px)", - backgroundColor: "white" + left: "calc(50% - 150px)" }, panelClassName: "toolbar-panel", includeCloseButton: true, diff --git a/web/client/components/TOC/fragments/VisibilityCheck.jsx b/web/client/components/TOC/fragments/VisibilityCheck.jsx index 6dd4a2ef08..bb6db3520a 100644 --- a/web/client/components/TOC/fragments/VisibilityCheck.jsx +++ b/web/client/components/TOC/fragments/VisibilityCheck.jsx @@ -23,7 +23,7 @@ const VisibilityCheck = React.createClass({ }, getDefaultProps() { return { - style: {left: "-3px"}, + style: {}, checkType: "glyph", glyphChecked: "eye-open", tooltip: "toc.toggleLayerVisibility", diff --git a/web/client/components/TOC/fragments/css/grouptitle.css b/web/client/components/TOC/fragments/css/grouptitle.css index a3951fc413..89dca3d2e0 100644 --- a/web/client/components/TOC/fragments/css/grouptitle.css +++ b/web/client/components/TOC/fragments/css/grouptitle.css @@ -5,7 +5,4 @@ } .toc-default-group .visibility-check{ float: left; - margin-right: 2px; - margin-top: 5px; - margin-left: 2px; } diff --git a/web/client/components/TOC/fragments/css/visibilitycheck.css b/web/client/components/TOC/fragments/css/visibilitycheck.css index b5fa9623c4..a01a1ace2e 100644 --- a/web/client/components/TOC/fragments/css/visibilitycheck.css +++ b/web/client/components/TOC/fragments/css/visibilitycheck.css @@ -8,9 +8,6 @@ input[type="checkbox"].visibility-check,input[type="radio"].visibility-check { .visibility-check.glyphicon { float: left; overflow: hidden; - margin-left: 5px; - margin-right: 5px; - margin-top: 5px; } button.clayer_removal_button.btn.btn-default { border: transparent; diff --git a/web/client/components/TOC/fragments/settings/WMSStyle.jsx b/web/client/components/TOC/fragments/settings/WMSStyle.jsx index 237528e6e4..2018f584b6 100644 --- a/web/client/components/TOC/fragments/settings/WMSStyle.jsx +++ b/web/client/components/TOC/fragments/settings/WMSStyle.jsx @@ -78,7 +78,7 @@ const WMSStyle = React.createClass({
{this.renderLegend()} {this.renderError()} - +
); }, diff --git a/web/client/components/data/featuregrid/featuregrid.css b/web/client/components/data/featuregrid/featuregrid.css index 8482c1a4d8..94fb5bb410 100644 --- a/web/client/components/data/featuregrid/featuregrid.css +++ b/web/client/components/data/featuregrid/featuregrid.css @@ -1,20 +1,6 @@ -.ag-fresh .ag-header, .ag-fresh .ag-tool-panel-container { - background: #078AA3; - color: white; - font-family: Raleway; -} -.ag-fresh .ag-tool-panel-container .ag-list-selection{ - color: black; -} .ag-fresh .ag-paging-button { - color: #078aa3; - background-color: #ffffff; - border: #078aa3 1px solid; padding: 5px; } -.ag-fresh .ag-paging-page-summary-panel { - color: #078aa3; -} .featuregrid-tools { position: absolute; right: 0; diff --git a/web/client/components/data/identify/css/identify.css b/web/client/components/data/identify/css/identify.css index 419f1175f3..20d8784bd7 100644 --- a/web/client/components/data/identify/css/identify.css +++ b/web/client/components/data/identify/css/identify.css @@ -17,7 +17,6 @@ } #mapstore-getfeatureinfo .swipeable-view .panel-heading { - background-color: white; border: none; height: 60px; padding: 0; diff --git a/web/client/components/data/query/queryform.css b/web/client/components/data/query/queryform.css index 583adf5451..c09382a4d4 100644 --- a/web/client/components/data/query/queryform.css +++ b/web/client/components/data/query/queryform.css @@ -14,10 +14,6 @@ float: left; } -#mapstore-drawermenu #toc-query-container { - background-color: #f7f7f7; -} - /*****************************/ /* END - TOC *****************/ /*****************************/ @@ -41,35 +37,16 @@ border: none; } -#mapstore-drawermenu #query-form-panel .glyphicon { - font-size: 22px; -} - #query-form-panel .btn-default { background-color: transparent; border-radius: 0; - color: #078aa3; - border-color: #078aa3; -} - -#query-form-panel .btn-default:hover { - background-color: #dedede; } #query-form-panel input.form-control { height: 32px; - border: 1px solid #dedede; -} - -#query-form-panel button:disabled { - color: #ffffff; - background-color: #abc8cd; - border-color: transparent; } #query-form-panel button:disabled { - color: #ffffff; - background-color: #abc8cd; border-color: transparent; } @@ -88,32 +65,17 @@ } #query-form-panel .filter-buttons { - background-color: #f7f7f7; border: none; margin-left: 4px; } -#query-form-panel .filter-buttons:hover { - background-color: #dedede; -} - #query-form-panel .remove-filter-button { - height: 32px; - width: 32px; padding: 0; margin: 2px; border: none; float: right; } -#mapstore-drawermenu #query-form-panel .remove-filter-button .glyphicon { - font-size: 32px; -} - -#mapstore-drawermenu #query-form-panel .remove-filter-button span { - line-height: 32px; -} - #query-form-panel .close { display: none; } @@ -123,7 +85,6 @@ } #query-form-panel input { - border: 1px solid #dedede; border-radius: 4px; padding: 0 4px 0 8px; } @@ -143,17 +104,13 @@ #query-form-panel .query-toolbar { padding: 0; - height: 50px; - /*border-bottom: 2px dotted #dedede;*/ overflow: hidden; - background-color: #ffffff; } #query-form-panel #query-toolbar-title { float: left; font-size: 20px; margin: 11px 11px 11px 20px; - color: #078aa3; } #query-form-panel .queryFormToolbar { @@ -170,30 +127,16 @@ /* BODY QUERY ****************/ /*****************************/ -#query-form-panel .querypanel { - background-color: #f7f7f7; -} - #query-form-panel .querypanel .panel-heading { border: none; - color: #333333; text-decoration: underline; padding-left: 11px; background-color: transparent; font-weight: bold; } -#query-form-panel .querypanel .panel-heading span { - font-size: 14px; -} - -#query-form-panel .querypanel .panel-heading .panel-title:hover { - color: #777777; -} - #query-form-panel .query-content > .container-fluid { margin: 4px 0 4px 0; - border-top: 1px dashed #dedede; } #query-form-panel .filter-field-row > div { @@ -225,16 +168,9 @@ #query-form-panel .querypanel > .query-filter-container { margin: 0 30px 20px 20px; background-color: transparent; - border-bottom: 1px solid #dedede; padding-bottom: 10px; } -#mapstore-drawermenu #query-form-panel .querypanel > .query-filter-container { - margin-right: 60px; - margin-left: 10px; -} - -/* nested groups */ #query-form-panel .panel .panel .panel { margin-left: 10px; } @@ -243,23 +179,9 @@ -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); -moz-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); - background-color: #ffffff; margin-bottom: 20px; } -#query-form-panel .panel .panel .filter-group-panel button { - background-color: #ffffff; -} - -#query-form-panel .panel .panel .filter-group-panel button:hover { - background-color: #dedede; -} -/* end - nested groups */ - -#query-form-panel hr { - border-top: 1px dashed #dedede; -} - #query-form-panel h5 { font-family: Georgia, serif; font-style: italic; @@ -286,7 +208,6 @@ /*****************************/ #query-form-panel div.details-panel { - background-color: #ffffff; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); -moz-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); @@ -302,7 +223,6 @@ #query-form-panel .details-panel .detail-title span { text-decoration: none; - line-height: 32px; font-weight: normal; } @@ -310,17 +230,12 @@ float: right; border: none; margin-top: 8px; - background-color: #ffffff; } #query-form-panel .details-panel button.remove-filter-button { margin-top: 0; } -#query-form-panel .details-panel button.remove-filter-button:hover { - background-color: #dedede; -} - #query-form-panel .details-panel button.remove-filter-button span { cursor: pointer; } diff --git a/web/client/components/help/help.css b/web/client/components/help/help.css index cb3f132d47..83cc05e13e 100644 --- a/web/client/components/help/help.css +++ b/web/client/components/help/help.css @@ -50,8 +50,6 @@ #helpbadge-scaleBox { left: 0 !important; - background-color: #078aa3; - color: #ffffff; } #mapstore-navbar #helpbadge-search-help { @@ -59,6 +57,4 @@ left: -10px; bottom: -8px; z-index: 1; - background-color: #078aa3; - color: #ffffff; } diff --git a/web/client/components/manager/users/GroupCard.jsx b/web/client/components/manager/users/GroupCard.jsx index 642d6ec54b..b97f2e8e84 100644 --- a/web/client/components/manager/users/GroupCard.jsx +++ b/web/client/components/manager/users/GroupCard.jsx @@ -28,7 +28,6 @@ const GroupCard = React.createClass({ getDefaultProps() { return { style: { - background: "#F7F4ED", position: "relative", backgroundSize: "cover", backgroundPosition: "center", @@ -41,8 +40,8 @@ const GroupCard = React.createClass({ return (
{this.props.group.enabled ? - : - } + : + }
); }, renderAvatar() { diff --git a/web/client/components/manager/users/UserCard.jsx b/web/client/components/manager/users/UserCard.jsx index 51cb62fbb3..dc2cafb4fa 100644 --- a/web/client/components/manager/users/UserCard.jsx +++ b/web/client/components/manager/users/UserCard.jsx @@ -28,7 +28,6 @@ const UserCard = React.createClass({ getDefaultProps() { return { style: { - background: "#F7F4ED", position: "relative", backgroundSize: "cover", backgroundPosition: "center", @@ -43,8 +42,8 @@ const UserCard = React.createClass({ return (
{this.props.user.enabled ? - : - } + : + }
); }, renderGroups() { diff --git a/web/client/components/manager/users/style/userdialog.css b/web/client/components/manager/users/style/userdialog.css index 152d2c6295..1d865b9123 100644 --- a/web/client/components/manager/users/style/userdialog.css +++ b/web/client/components/manager/users/style/userdialog.css @@ -1,5 +1,4 @@ .user-edit-dialog, .group-edit-dialog{ - background: white; z-index: 1000; } diff --git a/web/client/components/map/leaflet/ScaleBar.jsx b/web/client/components/map/leaflet/ScaleBar.jsx index c8f656f713..a94515c40d 100644 --- a/web/client/components/map/leaflet/ScaleBar.jsx +++ b/web/client/components/map/leaflet/ScaleBar.jsx @@ -32,12 +32,6 @@ var ScaleBar = React.createClass({ this.scalebar = L.control.scale(this.props); if (this.props.map) { this.scalebar.addTo(this.props.map); - let scaleDom = document.getElementsByClassName('leaflet-control-scale-line').item(0); - if (scaleDom) { - scaleDom.style.backgroundColor = 'rgba(7, 138, 163, 1)'; - scaleDom.style.color = 'white'; - scaleDom.style.borderColor = 'black'; - } } }, render() { diff --git a/web/client/components/map/openlayers/ScaleBar.jsx b/web/client/components/map/openlayers/ScaleBar.jsx index 2898197f34..0b1dd8ccf3 100644 --- a/web/client/components/map/openlayers/ScaleBar.jsx +++ b/web/client/components/map/openlayers/ScaleBar.jsx @@ -28,12 +28,6 @@ var ScaleBar = React.createClass({ this.scalebar = new ol.control.ScaleLine(this.props); if (this.props.map) { this.props.map.addControl(this.scalebar); - let scaleDom = document.getElementsByClassName('ol-scale-line').item(0); - if (scaleDom) { - scaleDom.style.backgroundColor = 'rgba(7, 138, 163, 1)'; - scaleDom.style.color = 'white'; - scaleDom.style.borderColor = 'black'; - } } }, render() { diff --git a/web/client/components/mapcontrols/Snapshot/SnapshotPanel.jsx b/web/client/components/mapcontrols/Snapshot/SnapshotPanel.jsx index 320e47a77d..668344538c 100644 --- a/web/client/components/mapcontrols/Snapshot/SnapshotPanel.jsx +++ b/web/client/components/mapcontrols/Snapshot/SnapshotPanel.jsx @@ -111,7 +111,7 @@ let SnapshotPanel = React.createClass({ renderButton(enabled) { return (); }, renderError() { diff --git a/web/client/components/mapcontrols/search/SearchBar.jsx b/web/client/components/mapcontrols/search/SearchBar.jsx index 58044d0426..3e7ba314d7 100644 --- a/web/client/components/mapcontrols/search/SearchBar.jsx +++ b/web/client/components/mapcontrols/search/SearchBar.jsx @@ -142,14 +142,13 @@ let SearchBar = React.createClass({ if (this.props.loading) { addonAfter = [, addonAfter]; + right: "16px", + top: "12px" + }} spinnerName="pulse" noFadeIn/>, addonAfter]; } if (this.props.error) { let tooltip = {this.props.error && this.props.error.message || null}; - addonAfter.push(); + addonAfter.push(); } return {addonAfter}; }, diff --git a/web/client/components/mapcontrols/search/searchbar.css b/web/client/components/mapcontrols/search/searchbar.css index 46aa6f1e15..1cb9b7c488 100644 --- a/web/client/components/mapcontrols/search/searchbar.css +++ b/web/client/components/mapcontrols/search/searchbar.css @@ -13,14 +13,14 @@ box-shadow: 2px 2px 4px #A7A7A7; border-radius: 4px; } -.searchclear { +/*.searchclear { top:0; bottom:0; height:14px; margin:auto; font-size:14px; cursor:pointer; -} +}*/ .search-result-list{ position: absolute; top: 50px; diff --git a/web/client/components/misc/style/gridcard.css b/web/client/components/misc/style/gridcard.css index ff332ce6c4..e699cc7e52 100644 --- a/web/client/components/misc/style/gridcard.css +++ b/web/client/components/misc/style/gridcard.css @@ -27,13 +27,3 @@ .gridcard-tools .spinner div:before{ background-color: white } - -.gridcard-button { - height: 30px; - width: 30px; -} -.gridcard-button span.glyphicon { - font-size: 30px; - margin-top: -6px; - margin-left: -12px; -} diff --git a/web/client/components/tutorial/style/tutorial.css b/web/client/components/tutorial/style/tutorial.css index 49524017d4..ff64927841 100644 --- a/web/client/components/tutorial/style/tutorial.css +++ b/web/client/components/tutorial/style/tutorial.css @@ -10,14 +10,6 @@ box-shadow: 0 0 0 9999px rgba(0,0,0,.75), 0 0 15px rgba(0,0,0,.75); } -.joyride-tooltip__button--primary { - background-color: #078aa3; -} - -.joyride-tooltip__button--primary:active, .joyride-tooltip__button--primary:focus, .joyride-tooltip__button--primary:hover { - background-color: #078aa3; -} - .joyride-tooltip__button--secondary{ color: #888; } diff --git a/web/client/examples/api/index.html b/web/client/examples/api/index.html index 85cd2dcf28..32a56f689e 100644 --- a/web/client/examples/api/index.html +++ b/web/client/examples/api/index.html @@ -9,9 +9,7 @@ - - - + diff --git a/web/client/examples/plugins/assets/css/plugins.css b/web/client/examples/plugins/assets/css/plugins.css index 2332f90ebe..182ee734db 100644 --- a/web/client/examples/plugins/assets/css/plugins.css +++ b/web/client/examples/plugins/assets/css/plugins.css @@ -10,7 +10,7 @@ html, body, #container, #map { } #plugins-list button { display: inline-block; - margin-right: 10px; + margin: 2px 10px 0 0; } #plugins-list li .form-group:nth-child(2) { display: inline-block; diff --git a/web/client/examples/plugins/index.html b/web/client/examples/plugins/index.html index a22f49c5b0..5a0f959c6d 100644 --- a/web/client/examples/plugins/index.html +++ b/web/client/examples/plugins/index.html @@ -9,9 +9,7 @@ - - - + diff --git a/web/client/index.html b/web/client/index.html index afa7e4987b..44b5c7b66b 100644 --- a/web/client/index.html +++ b/web/client/index.html @@ -10,9 +10,7 @@ - - - + diff --git a/web/client/localConfig.json b/web/client/localConfig.json index d5f9bd6201..a793b97950 100644 --- a/web/client/localConfig.json +++ b/web/client/localConfig.json @@ -284,7 +284,7 @@ "className": "navbar shadow navbar-home" } }, "ManagerMenu", "Login", "Language", "Attribution"], - "maps": ["Header", "Fork", "MapSearch", "HomeDescription", "MapType", "CreateNewMap", "Maps", "Examples", "Footer"], + "maps": ["Header", "Fork", "MapSearch", "HomeDescription", "MapType", "ThemeSwitcher", "CreateNewMap", "Maps", "Examples", "Footer"], "manager": ["Header", "Redirect", "Manager", "Home", "UserManager", "GroupManager", "Footer"] } } diff --git a/web/client/plugins/ThemeSwitcher.jsx b/web/client/plugins/ThemeSwitcher.jsx new file mode 100644 index 0000000000..833f2cf3c4 --- /dev/null +++ b/web/client/plugins/ThemeSwitcher.jsx @@ -0,0 +1,70 @@ +/** + * Copyright 2017, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ +const React = require('react'); +const {connect} = require('react-redux'); +const Message = require('../components/I18N/Message'); +const {FormGroup, FormControl, Label} = require('react-bootstrap'); +const {selectTheme} = require('../actions/theme'); +const ThemeSwitcher = React.createClass({ + propTypes: { + themes: React.PropTypes.array, + selectedTheme: React.PropTypes.object, + defaultSelectedTheme: React.PropTypes.string, + onThemeSelected: React.PropTypes.func + }, + getDefaultProps() { + return { + onThemeSelected: () => {}, + themes: [{ + id: "default" + }, { + id: "console" + }, { + id: "wasabi" + }, { + id: "dark" + }, { + id: "geosolutions" + }], + defaultSelectedTheme: "default" + }; + }, + + onChangeTheme(themeId) { + let theme = this.props.themes.reduce((prev, curr) => curr.id === themeId ? curr : prev); + let link = document.getElementById('theme_stylesheet'); + if (link) { + let basePath = link.href && link.href.substring(0, link.href.lastIndexOf("/")); + link.setAttribute('href', basePath + "/" + theme.id + ".css"); + } + this.props.onThemeSelected(theme); + }, + render() { + return ( + + this.onChangeTheme(e.target.value)}> + {this.props.themes.map( (t) => )} + + ); + } +}); + +const ThemeSwitcherPlugin = connect((s) => ({ + selectedTheme: s && s.theme && s.theme.selectedTheme +}), { + onThemeSelected: selectTheme +})(ThemeSwitcher); + +module.exports = { + ThemeSwitcherPlugin: ThemeSwitcherPlugin, + reducers: { + theme: require('../reducers/theme') + } +}; diff --git a/web/client/plugins/drawer/Menu.jsx b/web/client/plugins/drawer/Menu.jsx index 220a2d1402..2e86091919 100644 --- a/web/client/plugins/drawer/Menu.jsx +++ b/web/client/plugins/drawer/Menu.jsx @@ -78,14 +78,14 @@ var Menu = React.createClass({ renderContent() { const header = this.props.single ? (
- +
{this.renderButtons()}
) : (
{this.props.title} - +
); return (
{header} diff --git a/web/client/plugins/drawer/drawer.css b/web/client/plugins/drawer/drawer.css index 21ac55ef0d..190d2f5713 100644 --- a/web/client/plugins/drawer/drawer.css +++ b/web/client/plugins/drawer/drawer.css @@ -45,11 +45,6 @@ margin-top: 10px; } - -#mapstore-drawermenu .nav-menu { - background: rgba(255,255,255,1); -} - #mapstore-drawermenu .panel { border: none; box-shadow: none; @@ -65,7 +60,6 @@ div.nav-menu { .nav-menu .navHeader { height: 50px; - background-color: rgba(255, 255, 255, 0.75); } .nav-menu > .nav-content .navHeader .title{ font-size: 16px; @@ -75,7 +69,6 @@ div.nav-menu { } .nav-content .section { margin-bottom: 2px; - background-color: rgba(255, 255, 255, 0.5); } .nav-content .section .sectionHeader{ padding: 5px; @@ -102,7 +95,6 @@ div.nav-menu { transition: max-height .3s ease; box-shadow: inset 0px 0px 10px rgba(0,0,0,.5); - background: rgba(255,255,255,.4); padding: 5px; } diff --git a/web/client/plugins/manager/GroupManager.jsx b/web/client/plugins/manager/GroupManager.jsx index 2fc2efc9a1..9ff4c7df8a 100644 --- a/web/client/plugins/manager/GroupManager.jsx +++ b/web/client/plugins/manager/GroupManager.jsx @@ -65,7 +65,7 @@ const GroupManager = React.createClass({

diff --git a/web/client/plugins/manager/Manager.jsx b/web/client/plugins/manager/Manager.jsx index 0132f471cc..1762adabd3 100644 --- a/web/client/plugins/manager/Manager.jsx +++ b/web/client/plugins/manager/Manager.jsx @@ -50,7 +50,7 @@ const Manager = React.createClass({ this.context.router.push("/manager/" + tool.id); }}> {this.renderToolIcon(tool)} - {tool.msgId ? : tool.title || tool.id} +  {tool.msgId ? : tool.title || tool.id} )); }, renderPlugin() { diff --git a/web/client/plugins/manager/UserManager.jsx b/web/client/plugins/manager/UserManager.jsx index 9a1f1d7cce..bf1a89a29a 100644 --- a/web/client/plugins/manager/UserManager.jsx +++ b/web/client/plugins/manager/UserManager.jsx @@ -64,7 +64,7 @@ const UserManager = React.createClass({ limit={this.props.limit} />

- +
diff --git a/web/client/plugins/manager/style/manager.css b/web/client/plugins/manager/style/manager.css index 4eb489f12e..0a3f26a540 100644 --- a/web/client/plugins/manager/style/manager.css +++ b/web/client/plugins/manager/style/manager.css @@ -6,7 +6,6 @@ } .Manager-Container .Manager-Tools-Nav .glyphicon { - font-size: 25px; vertical-align: middle; } diff --git a/web/client/plugins/maploading/maploading.css b/web/client/plugins/maploading/maploading.css index e19e1fa1bf..3010c0d89e 100644 --- a/web/client/plugins/maploading/maploading.css +++ b/web/client/plugins/maploading/maploading.css @@ -28,19 +28,9 @@ box-shadow: none; } - -.ms2-loading { - background-color: #078aa3 !important; - border-bottom: 2px solid #5C9FB4 !important; -} - .ms2-loading .sk-circle-wrapper { - width: 30px; - height: 30px; - margin-left: 10px !important; - margin-top: 10px !important; -} - -.ms2-loading .sk-circle-wrapper .sk-circle:before { - background-color: white !important; -} + width: 30px; + height: 30px; + margin-left: 10px !important; + margin-top: 10px !important; + } diff --git a/web/client/plugins/omnibar/omnibar.css b/web/client/plugins/omnibar/omnibar.css index 5d70ae61a6..255f690705 100644 --- a/web/client/plugins/omnibar/omnibar.css +++ b/web/client/plugins/omnibar/omnibar.css @@ -39,12 +39,6 @@ padding-top: 0; } -.navbar-dx .dropdown-header { - background-color: #286090; - color: white; -} - - @media (min-width: 1200px) { .navbar-dx .search-wrap { width: 500px; diff --git a/web/client/plugins/print/print.css b/web/client/plugins/print/print.css index 9fba4d368b..08a55f313e 100644 --- a/web/client/plugins/print/print.css +++ b/web/client/plugins/print/print.css @@ -152,7 +152,6 @@ #mapstore-print-panel .panel-body { padding: 10px; - border: solid 1px #078AA3; } #mapstore-print-panel .form-control { diff --git a/web/client/product/assets/css/maps.css b/web/client/product/assets/css/maps.css index 5ed60de014..6807b7179c 100644 --- a/web/client/product/assets/css/maps.css +++ b/web/client/product/assets/css/maps.css @@ -22,8 +22,7 @@ #mapstore-navbar #mapstore-langselector { float: right; - margin-top: 10px; - margin-bottom: 5px; + margin-top: 8px; margin-right: 10px; width: auto; } diff --git a/web/client/product/components/home/MailingLists.jsx b/web/client/product/components/home/MailingLists.jsx index e429a2b994..406b04c92c 100644 --- a/web/client/product/components/home/MailingLists.jsx +++ b/web/client/product/components/home/MailingLists.jsx @@ -27,7 +27,7 @@ var MailingLists = React.createClass({ - +
@@ -56,7 +56,7 @@ var MailingLists = React.createClass({
- +
@@ -85,7 +85,7 @@ var MailingLists = React.createClass({
- +
diff --git a/web/client/product/plugins.js b/web/client/product/plugins.js index 9dfc8bd3eb..f2bcb7bf4a 100644 --- a/web/client/product/plugins.js +++ b/web/client/product/plugins.js @@ -61,7 +61,8 @@ module.exports = { CreateNewMapPlugin: require('../plugins/CreateNewMap'), QueryPanelPlugin: require('../plugins/QueryPanel'), FeatureGridPlugin: require('../plugins/FeatureGrid'), - TutorialPlugin: require('../plugins/Tutorial') + TutorialPlugin: require('../plugins/Tutorial'), + ThemeSwitchePluginr: require('../plugins/ThemeSwitcher') }, requires: { ReactSwipe: require('react-swipeable-views').default, diff --git a/web/client/reducers/__tests__/theme-test.js b/web/client/reducers/__tests__/theme-test.js new file mode 100644 index 0000000000..750bb8a01d --- /dev/null +++ b/web/client/reducers/__tests__/theme-test.js @@ -0,0 +1,22 @@ + +/** + * Copyright 2017, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ +const expect = require('expect'); + +const theme = require('../theme'); +const {selectTheme} = require('../../actions/theme'); + + +describe('Test the theme reducer', () => { + it('should maange the THEME_SELECTED action', () => { + var state = theme({}, selectTheme({id: "default"})); + expect(state.selectedTheme).toExist(); + expect(state.selectedTheme.id).toBe("default"); + }); + +}); diff --git a/web/client/reducers/theme.js b/web/client/reducers/theme.js new file mode 100644 index 0000000000..6d128e7d7c --- /dev/null +++ b/web/client/reducers/theme.js @@ -0,0 +1,23 @@ +/** + * Copyright 2016, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. + */ + +const {THEME_SELECTED} = require('../actions/theme'); +const assign = require('object-assign'); + +function controls(state = {}, action) { + switch (action.type) { + case THEME_SELECTED: + return assign({}, state, { + selectedTheme: action.theme + }); + default: + return state; + } +} + +module.exports = controls; diff --git a/web/client/themes/console/theme.less b/web/client/themes/console/theme.less new file mode 100644 index 0000000000..a2127ee51a --- /dev/null +++ b/web/client/themes/console/theme.less @@ -0,0 +1,6 @@ + +@import "../default/icons.less"; +@import "../default/bootstrap-theme.less"; +@import "../default/ms2-theme.less"; +@import "../default/variables.less"; +@import "variables.less"; diff --git a/web/client/themes/console/variables.less b/web/client/themes/console/variables.less new file mode 100644 index 0000000000..aee7e6d66d --- /dev/null +++ b/web/client/themes/console/variables.less @@ -0,0 +1,22 @@ + +@ms2-color-background: #0a0b30; + +@ms2-color-text-primary: #ffffff; +@ms2-color-text: #f2f2f2; + +@ms2-color-disabled: #aea79f; +@ms2-color-text-disabled: #eeeeee; + +@ms2-color-primary: #E95420; +@ms2-color-info: #7e64a5; +@ms2-color-success: #8ae234; +@ms2-color-warning: #ffd700; +@ms2-color-danger: #bb384b; + +@ms2-color-shade: #555555; +@ms2-color-shade-darker: darken(@ms2-color-shade, 10%); +@ms2-color-shade-dark: darken(@ms2-color-shade, 5%); +@ms2-color-shade-light: lighten(@ms2-color-shade, 5%); +@ms2-color-shade-lighter: lighten(@ms2-color-shade, 10%); + +@font-family-base: monospace; diff --git a/web/client/themes/dark/theme.less b/web/client/themes/dark/theme.less new file mode 100644 index 0000000000..868600e7a8 --- /dev/null +++ b/web/client/themes/dark/theme.less @@ -0,0 +1,5 @@ +@import "../default/icons.less"; +@import "../default/bootstrap-theme.less"; +@import "../default/ms2-theme.less"; +@import "../default/variables.less"; +@import "variables.less"; diff --git a/web/client/themes/dark/variables.less b/web/client/themes/dark/variables.less new file mode 100644 index 0000000000..20af0fcbf4 --- /dev/null +++ b/web/client/themes/dark/variables.less @@ -0,0 +1,20 @@ + +@ms2-color-background: #111111; + +@ms2-color-text-primary: #333333; +@ms2-color-text: #b29600; + +@ms2-color-disabled: #555555; +@ms2-color-text-disabled: #aaaaaa; + +@ms2-color-primary: #998100; +@ms2-color-info: #7e64a5; +@ms2-color-success: #4abdac; +@ms2-color-warning: #ffd700; +@ms2-color-danger: #bb384b; + +@ms2-color-shade: #333333; +@ms2-color-shade-darker: darken(@ms2-color-shade, 5%); +@ms2-color-shade-dark: darken(@ms2-color-shade, 2%); +@ms2-color-shade-light: lighten(@ms2-color-shade, 2%); +@ms2-color-shade-lighter: lighten(@ms2-color-shade, 5%); diff --git a/web/client/themes/default/bootstrap-theme.less b/web/client/themes/default/bootstrap-theme.less new file mode 100644 index 0000000000..d6812f14d3 --- /dev/null +++ b/web/client/themes/default/bootstrap-theme.less @@ -0,0 +1,4977 @@ +html,body { + font-family: @font-family-base; + -ms-text-size-adjust: 100%; + -webkit-text-size-adjust: 100%; + margin: 0; + height:100%; + width:100%; +} + +.shadow{ + -webkit-box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); + -moz-box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); + box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); +} + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +nav, +section, +summary { + display: block; +} +audio, +canvas, +progress, +video { + display: inline-block; + vertical-align: baseline; +} +audio:not([controls]) { + display: none; + height: 0; +} +[hidden], +template { + display: none; +} +a { + background: transparent; +} +a:active, +a:hover { + outline: 0; +} +abbr[title] { + border-bottom: 1px dotted; +} +b, +strong { + font-weight: bold; +} +dfn { + font-style: italic; +} +h1 { + font-size: @font-size-h1; + margin: 0.67em 0; +} +mark { + background: @ms2-color-primary; + color: @ms2-color-background; +} +small { + font-size: 80%; +} +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +sup { + top: -0.5em; +} +sub { + bottom: -0.25em; +} +img { + border: 0; +} +svg:not(:root) { + overflow: hidden; +} +figure { + margin: 1em 40px; +} +hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; +} +pre { + overflow: auto; +} +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} +button, +input, +optgroup, +select, +textarea { + color: inherit; + font: inherit; + margin: 0; + padding:0; +} + +:focus { + outline-color: transparent; + outline-style: none; +} + +button { + overflow: visible; +} + +button, +select { + text-transform: none; +} +button, +html input[type="button"], +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; + cursor: pointer; +} +button[disabled], +html input[disabled] { + cursor: default; +} +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} +input { + line-height: normal; +} +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; + padding: 0; +} +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} +input[type="search"] { + -webkit-appearance: textfield; + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box; + box-sizing: content-box; +} +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} +fieldset { + border: 1px solid @ms2-color-shade; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} +legend { + border: 0; + padding: 0; +} +textarea { + overflow: auto; +} +optgroup { + font-weight: bold; +} +table { + border-collapse: collapse; + border-spacing: 0; +} +td, +th { + padding: 0; +} +@media print { + * { + text-shadow: none !important; + color: @ms2-color-text !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) ")"; + } + a[href^="javascript:"]:after, + a[href^="#"]:after { + content: ""; + } + pre, + blockquote { + border: 1px solid @ms2-color-shade; + page-break-inside: avoid; + } + thead { + display: table-header-group; + } + tr, + img { + page-break-inside: avoid; + } + img { + max-width: 100% !important; + } + p, + h2, + h3 { + orphans: 3; + widows: 3; + } + h2, + h3 { + page-break-after: avoid; + } + select { + background: @ms2-color-background !important; + } + .navbar { + display: none; + } + .table td, + .table th { + background-color: @ms2-color-background !important; + } + .btn > .caret, + .dropup > .btn > .caret { + border-top-color: @ms2-color-shade-darker !important; + } + .label { + border: 1px solid @ms2-color-shade-darker; + } + .table { + border-collapse: collapse !important; + } + .table-bordered th, + .table-bordered td { + border: 1px solid @ms2-color-shade !important; + } +} +* { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +*:before, +*:after { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +html { + font-size: 62.5%; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); +} +body { + font-size: @font-size-base; + line-height: 1.428571429; + color: @ms2-color-text; + background-color: @ms2-color-background; +} +input, +button, +select, +textarea { + font-family: inherit; + font-size: inherit; + line-height: inherit; +} +a { + color: @ms2-color-primary; + text-decoration: none; +} +a:hover, +a:focus { + color: @ms2-color-primary-hover; + text-decoration: underline; +} +a:focus { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} +figure { + margin: 0; +} +img { + vertical-align: middle; +} +.img-responsive, +.thumbnail > img, +.thumbnail a > img, + +.img-rounded { + border-radius: 0px; +} +.img-thumbnail { + line-height: 1.428571429; + background-color: @ms2-color-background; + border: 1px solid @ms2-color-shade-light; + border-radius: 0px; + -webkit-transition: all 0.2s ease-in-out; + transition: all 0.2s ease-in-out; + display: inline-block; + max-width: 100%; + height: auto; +} +.img-circle { + border-radius: 50%; +} +hr { + margin-top: 20px; + margin-bottom: 20px; + border: 0; + border-top: 1px solid @ms2-color-shade-lighter; +} +.sr-only { + position: absolute; + width: 1px; + height: 1px; + margin: -1px; + padding: 0; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + font-weight: 500; + line-height: 1.1; + color: inherit; +} +h1 small, +h2 small, +h3 small, +h4 small, +h5 small, +h6 small, +.h1 small, +.h2 small, +.h3 small, +.h4 small, +.h5 small, +.h6 small, +h1 .small, +h2 .small, +h3 .small, +h4 .small, +h5 .small, +h6 .small, +.h1 .small, +.h2 .small, +.h3 .small, +.h4 .small, +.h5 .small, +.h6 .small { + font-weight: normal; + line-height: 1; + color: @ms2-color-text; +} +h1, +.h1, +h2, +.h2, +h3, +.h3 { + margin-top: 20px; + margin-bottom: 10px; +} +h1 small, +.h1 small, +h2 small, +.h2 small, +h3 small, +.h3 small, +h1 .small, +.h1 .small, +h2 .small, +.h2 .small, +h3 .small, +.h3 .small { + font-size: 65%; +} +h4, +.h4, +h5, +.h5, +h6, +.h6 { + margin-top: 10px; + margin-bottom: 10px; +} +h4 small, +.h4 small, +h5 small, +.h5 small, +h6 small, +.h6 small, +h4 .small, +.h4 .small, +h5 .small, +.h5 .small, +h6 .small, +.h6 .small { + font-size: 75%; +} +h1, +.h1 { + font-size: @font-size-h1; +} +h2, +.h2 { + font-size: @font-size-h2; +} +h3, +.h3 { + font-size: @font-size-h3; +} +h4, +.h4 { + font-size: @font-size-h4; +} +h5, +.h5 { + font-size: @font-size-h5; +} +h6, +.h6 { + font-size: @font-size-h6; +} +p { + margin: 0 0 10px; +} +.lead { + margin-bottom: 20px; + font-size: 16px; + font-weight: 200; + line-height: 1.4; +} +@media (min-width: 768px) { + .lead { + font-size: 21px; + } +} +small, +.small { + font-size: 85%; +} +cite { + font-style: normal; +} +.text-left { + text-align: left; +} +.text-right { + text-align: right; +} +.text-center { + text-align: center; +} +.text-justify { + text-align: justify; +} +.text-muted { + color: @ms2-color-disabled; +} +.text-primary { + color: @ms2-color-primary; +} +a.text-primary:hover { + color: @ms2-color-primary-hover; +} +.text-success { + color: @ms2-color-success; +} +a.text-success:hover { + color: @ms2-color-success-hover; +} +.text-info { + color: @ms2-color-info; +} +a.text-info:hover { + color: @ms2-color-info-hover; +} +.text-warning { + color: @ms2-color-warning; +} +a.text-warning:hover { + color: @ms2-color-warning-hover; +} +.text-danger { + color: @ms2-color-danger; +} +a.text-danger:hover { + color: @ms2-color-danger-hover; +} +.bg-primary { + color: @ms2-color-text-primary; + background-color: @ms2-color-primary; +} +a.bg-primary:hover { + background-color: @ms2-color-primary-hover; +} +.bg-success { + background-color: @ms2-color-success; + color: @ms2-color-text-primary; +} +a.bg-success:hover { + background-color: @ms2-color-success-hover; +} +.bg-info { + background-color: @ms2-color-info; + color: @ms2-color-text-primary; +} +a.bg-info:hover { + background-color: @ms2-color-info-hover; +} +.bg-warning { + background-color: @ms2-color-warning; + color: @ms2-color-text-primary; +} +a.bg-warning:hover { + background-color: @ms2-color-warning-hover; +} +.bg-danger { + background-color: @ms2-color-danger; + color: @ms2-color-text-primary; +} +a.bg-danger:hover { + background-color: @ms2-color-danger-hover; +} +.page-header { + padding-bottom: 9px; + margin: 40px 0 20px; + border-bottom: 1px solid @ms2-color-shade-lighter; +} +ul, +ol { + margin-top: 0; + margin-bottom: 0; +} +ul ul, +ol ul, +ul ol, +ol ol { + margin-bottom: 0; +} +.list-unstyled { + padding-left: 0; + list-style: none; +} +.list-inline { + padding-left: 0; + list-style: none; +} +.list-inline > li { + display: inline-block; + padding-left: 5px; + padding-right: 5px; +} +.list-inline > li:first-child { + padding-left: 0; +} +dl { + margin-top: 0; + margin-bottom: 20px; +} +dt, +dd { + line-height: 1.428571429; +} +dt { + font-weight: bold; +} +dd { + margin-left: 0; +} +@media (min-width: 768px) { + .dl-horizontal dt { + float: left; + width: 160px; + clear: left; + text-align: right; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .dl-horizontal dd { + margin-left: 180px; + } +} +abbr[title], +abbr[data-original-title] { + cursor: help; + border-bottom: 1px dotted @ms2-color-shade-light; +} +.initialism { + font-size: 90%; + text-transform: uppercase; +} +blockquote { + padding: 10px 20px; + margin: 0 0 20px; + font-size: 17.5px; + border-left: 5px solid @ms2-color-shade-lighter; +} +blockquote p:last-child, +blockquote ul:last-child, +blockquote ol:last-child { + margin-bottom: 0; +} +blockquote footer, +blockquote small, +blockquote .small { + display: block; + font-size: 80%; + line-height: 1.428571429; + color: @ms2-color-text; +} +blockquote footer:before, +blockquote small:before, +blockquote .small:before { + content: '\2014 \00A0'; +} +.blockquote-reverse, +blockquote.pull-right { + padding-right: 15px; + padding-left: 0; + border-right: 5px solid @ms2-color-shade-lighter; + border-left: 0; + text-align: right; +} +.blockquote-reverse footer:before, +blockquote.pull-right footer:before, +.blockquote-reverse small:before, +blockquote.pull-right small:before, +.blockquote-reverse .small:before, +blockquote.pull-right .small:before { + content: ''; +} +.blockquote-reverse footer:after, +blockquote.pull-right footer:after, +.blockquote-reverse small:after, +blockquote.pull-right small:after, +.blockquote-reverse .small:after, +blockquote.pull-right .small:after { + content: '\00A0 \2014'; +} +blockquote:before, +blockquote:after { + content: ""; +} +address { + margin-bottom: 20px; + font-style: normal; + line-height: 1.428571429; +} +code, +kbd, +pre, +samp { + font-family: Monaco; +} +code { + padding: 2px 4px; + font-size: 90%; + color: @ms2-color-code; + background-color: @ms2-color-shade-lighter; + white-space: nowrap; + border-radius: 0; +} +kbd { + padding: 2px 4px; + font-size: 90%; + color: @ms2-color-text-primary; + background-color: @ms2-color-shade-dark; + border-radius: 0 ; + box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); +} +pre { + display: block; + padding: 9.5px; + margin: 0 0 10px; + font-size: 13px; + line-height: 1.428571429; + word-break: break-all; + word-wrap: break-word; + color: @ms2-color-text; + background-color: @ms2-color-shade-lighter; + border: 1px solid @ms2-color-shade-light; + border-radius: 0; +} +pre code { + padding: 0; + font-size: inherit; + color: inherit; + white-space: pre-wrap; + background-color: transparent; + border-radius: 0; +} +.pre-scrollable { + max-height: 340px; + overflow-y: scroll; +} +.container { + margin-right: auto; + margin-left: auto; + padding-left: 15px; + padding-right: 15px; +} + +@media (min-width: 768px) { + .container { + width: 750px; + } +} +@media (min-width: 992px) { + .container { + width: 970px; + } +} +@media (min-width: 1200px) { + .container { + width: 1170px; + } +} +.container-fluid { + margin-right: auto; + margin-left: auto; + padding-left: 15px; + padding-right: 15px; +} +.row { + margin-left: -15px; + margin-right: -15px; +} +.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { + position: relative; + min-height: 1px; + padding-left: 15px; + padding-right: 15px; +} +.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { + float: left; +} +.col-xs-12 { + width: 100%; +} +.col-xs-11 { + width: 91.66666666666666%; +} +.col-xs-10 { + width: 83.33333333333334%; +} +.col-xs-9 { + width: 75%; +} +.col-xs-8 { + width: 66.66666666666666%; +} +.col-xs-7 { + width: 58.333333333333336%; +} +.col-xs-6 { + width: 50%; +} +.col-xs-5 { + width: 41.66666666666667%; +} +.col-xs-4 { + width: 33.33333333333333%; +} +.col-xs-3 { + width: 25%; +} +.col-xs-2 { + width: 16.666666666666664%; +} +.col-xs-1 { + width: 8.333333333333332%; +} +.col-xs-pull-12 { + right: 100%; +} +.col-xs-pull-11 { + right: 91.66666666666666%; +} +.col-xs-pull-10 { + right: 83.33333333333334%; +} +.col-xs-pull-9 { + right: 75%; +} +.col-xs-pull-8 { + right: 66.66666666666666%; +} +.col-xs-pull-7 { + right: 58.333333333333336%; +} +.col-xs-pull-6 { + right: 50%; +} +.col-xs-pull-5 { + right: 41.66666666666667%; +} +.col-xs-pull-4 { + right: 33.33333333333333%; +} +.col-xs-pull-3 { + right: 25%; +} +.col-xs-pull-2 { + right: 16.666666666666664%; +} +.col-xs-pull-1 { + right: 8.333333333333332%; +} +.col-xs-pull-0 { + right: 0%; +} +.col-xs-push-12 { + left: 100%; +} +.col-xs-push-11 { + left: 91.66666666666666%; +} +.col-xs-push-10 { + left: 83.33333333333334%; +} +.col-xs-push-9 { + left: 75%; +} +.col-xs-push-8 { + left: 66.66666666666666%; +} +.col-xs-push-7 { + left: 58.333333333333336%; +} +.col-xs-push-6 { + left: 50%; +} +.col-xs-push-5 { + left: 41.66666666666667%; +} +.col-xs-push-4 { + left: 33.33333333333333%; +} +.col-xs-push-3 { + left: 25%; +} +.col-xs-push-2 { + left: 16.666666666666664%; +} +.col-xs-push-1 { + left: 8.333333333333332%; +} +.col-xs-push-0 { + left: 0%; +} +.col-xs-offset-12 { + margin-left: 100%; +} +.col-xs-offset-11 { + margin-left: 91.66666666666666%; +} +.col-xs-offset-10 { + margin-left: 83.33333333333334%; +} +.col-xs-offset-9 { + margin-left: 75%; +} +.col-xs-offset-8 { + margin-left: 66.66666666666666%; +} +.col-xs-offset-7 { + margin-left: 58.333333333333336%; +} +.col-xs-offset-6 { + margin-left: 50%; +} +.col-xs-offset-5 { + margin-left: 41.66666666666667%; +} +.col-xs-offset-4 { + margin-left: 33.33333333333333%; +} +.col-xs-offset-3 { + margin-left: 25%; +} +.col-xs-offset-2 { + margin-left: 16.666666666666664%; +} +.col-xs-offset-1 { + margin-left: 8.333333333333332%; +} +.col-xs-offset-0 { + margin-left: 0%; +} + +@media (min-width: 768px) { + + .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { + float: left; + } + .col-sm-12 { + width: 100%; + } + .col-sm-11 { + width: 91.66666666666666%; + } + .col-sm-10 { + width: 83.33333333333334%; + } + .col-sm-9 { + width: 75%; + } + .col-sm-8 { + width: 66.66666666666666%; + } + .col-sm-7 { + width: 58.333333333333336%; + } + .col-sm-6 { + width: 50%; + } + .col-sm-5 { + width: 41.66666666666667%; + } + .col-sm-4 { + width: 33.33333333333333%; + } + .col-sm-3 { + width: 25%; + } + .col-sm-2 { + width: 16.666666666666664%; + } + .col-sm-1 { + width: 8.333333333333332%; + } + .col-sm-pull-12 { + right: 100%; + } + .col-sm-pull-11 { + right: 91.66666666666666%; + } + .col-sm-pull-10 { + right: 83.33333333333334%; + } + .col-sm-pull-9 { + right: 75%; + } + .col-sm-pull-8 { + right: 66.66666666666666%; + } + .col-sm-pull-7 { + right: 58.333333333333336%; + } + .col-sm-pull-6 { + right: 50%; + } + .col-sm-pull-5 { + right: 41.66666666666667%; + } + .col-sm-pull-4 { + right: 33.33333333333333%; + } + .col-sm-pull-3 { + right: 25%; + } + .col-sm-pull-2 { + right: 16.666666666666664%; + } + .col-sm-pull-1 { + right: 8.333333333333332%; + } + .col-sm-pull-0 { + right: 0%; + } + .col-sm-push-12 { + left: 100%; + } + .col-sm-push-11 { + left: 91.66666666666666%; + } + .col-sm-push-10 { + left: 83.33333333333334%; + } + .col-sm-push-9 { + left: 75%; + } + .col-sm-push-8 { + left: 66.66666666666666%; + } + .col-sm-push-7 { + left: 58.333333333333336%; + } + .col-sm-push-6 { + left: 50%; + } + .col-sm-push-5 { + left: 41.66666666666667%; + } + .col-sm-push-4 { + left: 33.33333333333333%; + } + .col-sm-push-3 { + left: 25%; + } + .col-sm-push-2 { + left: 16.666666666666664%; + } + .col-sm-push-1 { + left: 8.333333333333332%; + } + .col-sm-push-0 { + left: 0%; + } + .col-sm-offset-12 { + margin-left: 100%; + } + .col-sm-offset-11 { + margin-left: 91.66666666666666%; + } + .col-sm-offset-10 { + margin-left: 83.33333333333334%; + } + .col-sm-offset-9 { + margin-left: 75%; + } + .col-sm-offset-8 { + margin-left: 66.66666666666666%; + } + .col-sm-offset-7 { + margin-left: 58.333333333333336%; + } + .col-sm-offset-6 { + margin-left: 50%; + } + .col-sm-offset-5 { + margin-left: 41.66666666666667%; + } + .col-sm-offset-4 { + margin-left: 33.33333333333333%; + } + .col-sm-offset-3 { + margin-left: 25%; + } + .col-sm-offset-2 { + margin-left: 16.666666666666664%; + } + .col-sm-offset-1 { + margin-left: 8.333333333333332%; + } + .col-sm-offset-0 { + margin-left: 0%; + } +} +@media (min-width: 992px) { + .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { + float: left; + } + .col-md-12 { + width: 100%; + } + .col-md-11 { + width: 91.66666666666666%; + } + .col-md-10 { + width: 83.33333333333334%; + } + .col-md-9 { + width: 75%; + } + .col-md-8 { + width: 66.66666666666666%; + } + .col-md-7 { + width: 58.333333333333336%; + } + .col-md-6 { + width: 50%; + } + .col-md-5 { + width: 41.66666666666667%; + } + .col-md-4 { + width: 33.33333333333333%; + } + .col-md-3 { + width: 25%; + } + .col-md-2 { + width: 16.666666666666664%; + } + .col-md-1 { + width: 8.333333333333332%; + } + .col-md-pull-12 { + right: 100%; + } + .col-md-pull-11 { + right: 91.66666666666666%; + } + .col-md-pull-10 { + right: 83.33333333333334%; + } + .col-md-pull-9 { + right: 75%; + } + .col-md-pull-8 { + right: 66.66666666666666%; + } + .col-md-pull-7 { + right: 58.333333333333336%; + } + .col-md-pull-6 { + right: 50%; + } + .col-md-pull-5 { + right: 41.66666666666667%; + } + .col-md-pull-4 { + right: 33.33333333333333%; + } + .col-md-pull-3 { + right: 25%; + } + .col-md-pull-2 { + right: 16.666666666666664%; + } + .col-md-pull-1 { + right: 8.333333333333332%; + } + .col-md-pull-0 { + right: 0%; + } + .col-md-push-12 { + left: 100%; + } + .col-md-push-11 { + left: 91.66666666666666%; + } + .col-md-push-10 { + left: 83.33333333333334%; + } + .col-md-push-9 { + left: 75%; + } + .col-md-push-8 { + left: 66.66666666666666%; + } + .col-md-push-7 { + left: 58.333333333333336%; + } + .col-md-push-6 { + left: 50%; + } + .col-md-push-5 { + left: 41.66666666666667%; + } + .col-md-push-4 { + left: 33.33333333333333%; + } + .col-md-push-3 { + left: 25%; + } + .col-md-push-2 { + left: 16.666666666666664%; + } + .col-md-push-1 { + left: 8.333333333333332%; + } + .col-md-push-0 { + left: 0%; + } + .col-md-offset-12 { + margin-left: 100%; + } + .col-md-offset-11 { + margin-left: 91.66666666666666%; + } + .col-md-offset-10 { + margin-left: 83.33333333333334%; + } + .col-md-offset-9 { + margin-left: 75%; + } + .col-md-offset-8 { + margin-left: 66.66666666666666%; + } + .col-md-offset-7 { + margin-left: 58.333333333333336%; + } + .col-md-offset-6 { + margin-left: 50%; + } + .col-md-offset-5 { + margin-left: 41.66666666666667%; + } + .col-md-offset-4 { + margin-left: 33.33333333333333%; + } + .col-md-offset-3 { + margin-left: 25%; + } + .col-md-offset-2 { + margin-left: 16.666666666666664%; + } + .col-md-offset-1 { + margin-left: 8.333333333333332%; + } + .col-md-offset-0 { + margin-left: 0%; + } +} +@media (min-width: 1200px) { + .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { + float: left; + } + .col-lg-12 { + width: 100%; + } + .col-lg-11 { + width: 91.66666666666666%; + } + .col-lg-10 { + width: 83.33333333333334%; + } + .col-lg-9 { + width: 75%; + } + .col-lg-8 { + width: 66.66666666666666%; + } + .col-lg-7 { + width: 58.333333333333336%; + } + .col-lg-6 { + width: 50%; + } + .col-lg-5 { + width: 41.66666666666667%; + } + .col-lg-4 { + width: 33.33333333333333%; + } + .col-lg-3 { + width: 25%; + } + .col-lg-2 { + width: 16.666666666666664%; + } + .col-lg-1 { + width: 8.333333333333332%; + } + .col-lg-pull-12 { + right: 100%; + } + .col-lg-pull-11 { + right: 91.66666666666666%; + } + .col-lg-pull-10 { + right: 83.33333333333334%; + } + .col-lg-pull-9 { + right: 75%; + } + .col-lg-pull-8 { + right: 66.66666666666666%; + } + .col-lg-pull-7 { + right: 58.333333333333336%; + } + .col-lg-pull-6 { + right: 50%; + } + .col-lg-pull-5 { + right: 41.66666666666667%; + } + .col-lg-pull-4 { + right: 33.33333333333333%; + } + .col-lg-pull-3 { + right: 25%; + } + .col-lg-pull-2 { + right: 16.666666666666664%; + } + .col-lg-pull-1 { + right: 8.333333333333332%; + } + .col-lg-pull-0 { + right: 0%; + } + .col-lg-push-12 { + left: 100%; + } + .col-lg-push-11 { + left: 91.66666666666666%; + } + .col-lg-push-10 { + left: 83.33333333333334%; + } + .col-lg-push-9 { + left: 75%; + } + .col-lg-push-8 { + left: 66.66666666666666%; + } + .col-lg-push-7 { + left: 58.333333333333336%; + } + .col-lg-push-6 { + left: 50%; + } + .col-lg-push-5 { + left: 41.66666666666667%; + } + .col-lg-push-4 { + left: 33.33333333333333%; + } + .col-lg-push-3 { + left: 25%; + } + .col-lg-push-2 { + left: 16.666666666666664%; + } + .col-lg-push-1 { + left: 8.333333333333332%; + } + .col-lg-push-0 { + left: 0%; + } + .col-lg-offset-12 { + margin-left: 100%; + } + .col-lg-offset-11 { + margin-left: 91.66666666666666%; + } + .col-lg-offset-10 { + margin-left: 83.33333333333334%; + } + .col-lg-offset-9 { + margin-left: 75%; + } + .col-lg-offset-8 { + margin-left: 66.66666666666666%; + } + .col-lg-offset-7 { + margin-left: 58.333333333333336%; + } + .col-lg-offset-6 { + margin-left: 50%; + } + .col-lg-offset-5 { + margin-left: 41.66666666666667%; + } + .col-lg-offset-4 { + margin-left: 33.33333333333333%; + } + .col-lg-offset-3 { + margin-left: 25%; + } + .col-lg-offset-2 { + margin-left: 16.666666666666664%; + } + .col-lg-offset-1 { + margin-left: 8.333333333333332%; + } + .col-lg-offset-0 { + margin-left: 0%; + } +} +table { + max-width: 100%; + background-color: transparent; +} +th { + text-align: left; +} +.table { + width: 100%; + margin-bottom: 20px; +} +.table > thead > tr > th, +.table > tbody > tr > th, +.table > tfoot > tr > th, +.table > thead > tr > td, +.table > tbody > tr > td, +.table > tfoot > tr > td { + padding: 8px; + line-height: 1.428571429; + vertical-align: top; + border-top: 1px solid @ms2-color-shade-light; +} +.table > thead > tr > th { + vertical-align: bottom; + border-bottom: 2px solid @ms2-color-shade-light; +} +.table > caption + thead > tr:first-child > th, +.table > colgroup + thead > tr:first-child > th, +.table > thead:first-child > tr:first-child > th, +.table > caption + thead > tr:first-child > td, +.table > colgroup + thead > tr:first-child > td, +.table > thead:first-child > tr:first-child > td { + border-top: 0; +} +.table > tbody + tbody { + border-top: 2px solid @ms2-color-shade-light; +} +.table .table { + background-color: @ms2-color-background; +} +.table-condensed > thead > tr > th, +.table-condensed > tbody > tr > th, +.table-condensed > tfoot > tr > th, +.table-condensed > thead > tr > td, +.table-condensed > tbody > tr > td, +.table-condensed > tfoot > tr > td { + padding: 5px; +} +.table-bordered { + border: 1px solid @ms2-color-shade-light; +} +.table-bordered > thead > tr > th, +.table-bordered > tbody > tr > th, +.table-bordered > tfoot > tr > th, +.table-bordered > thead > tr > td, +.table-bordered > tbody > tr > td, +.table-bordered > tfoot > tr > td { + border: 1px solid @ms2-color-shade-light; +} +.table-bordered > thead > tr > th, +.table-bordered > thead > tr > td { + border-bottom-width: 2px; +} +.table-striped > tbody > tr:nth-child(odd) > td, +.table-striped > tbody > tr:nth-child(odd) > th { + background-color: darken(@ms2-color-background, 2%); +} +.table-hover > tbody > tr:hover > td, +.table-hover > tbody > tr:hover > th { + background-color: @ms2-color-shade-lighter; +} +table col[class*="col-"] { + position: static; + float: none; + display: table-column; +} +table td[class*="col-"], +table th[class*="col-"] { + position: static; + float: none; + display: table-cell; +} +.table > thead > tr > td.active, +.table > tbody > tr > td.active, +.table > tfoot > tr > td.active, +.table > thead > tr > th.active, +.table > tbody > tr > th.active, +.table > tfoot > tr > th.active, +.table > thead > tr.active > td, +.table > tbody > tr.active > td, +.table > tfoot > tr.active > td, +.table > thead > tr.active > th, +.table > tbody > tr.active > th, +.table > tfoot > tr.active > th { + background-color: @ms2-color-shade-lighter; +} +.table-hover > tbody > tr > td.active:hover, +.table-hover > tbody > tr > th.active:hover, +.table-hover > tbody > tr.active:hover > td, +.table-hover > tbody > tr.active:hover > th { + background-color: @ms2-color-shade-lighter; +} +.table > thead > tr > td.success, +.table > tbody > tr > td.success, +.table > tfoot > tr > td.success, +.table > thead > tr > th.success, +.table > tbody > tr > th.success, +.table > tfoot > tr > th.success, +.table > thead > tr.success > td, +.table > tbody > tr.success > td, +.table > tfoot > tr.success > td, +.table > thead > tr.success > th, +.table > tbody > tr.success > th, +.table > tfoot > tr.success > th { + background-color: @ms2-color-shade-lighter; +} +.table-hover > tbody > tr > td.success:hover, +.table-hover > tbody > tr > th.success:hover, +.table-hover > tbody > tr.success:hover > td, +.table-hover > tbody > tr.success:hover > th { + background-color: @ms2-color-shade-lighter; +} +.table > thead > tr > td.info, +.table > tbody > tr > td.info, +.table > tfoot > tr > td.info, +.table > thead > tr > th.info, +.table > tbody > tr > th.info, +.table > tfoot > tr > th.info, +.table > thead > tr.info > td, +.table > tbody > tr.info > td, +.table > tfoot > tr.info > td, +.table > thead > tr.info > th, +.table > tbody > tr.info > th, +.table > tfoot > tr.info > th { + background-color: @ms2-color-shade-lighter; +} +.table-hover > tbody > tr > td.info:hover, +.table-hover > tbody > tr > th.info:hover, +.table-hover > tbody > tr.info:hover > td, +.table-hover > tbody > tr.info:hover > th { + background-color: @ms2-color-shade-lighter; +} +.table > thead > tr > td.warning, +.table > tbody > tr > td.warning, +.table > tfoot > tr > td.warning, +.table > thead > tr > th.warning, +.table > tbody > tr > th.warning, +.table > tfoot > tr > th.warning, +.table > thead > tr.warning > td, +.table > tbody > tr.warning > td, +.table > tfoot > tr.warning > td, +.table > thead > tr.warning > th, +.table > tbody > tr.warning > th, +.table > tfoot > tr.warning > th { + background-color: @ms2-color-shade-lighter; +} +.table-hover > tbody > tr > td.warning:hover, +.table-hover > tbody > tr > th.warning:hover, +.table-hover > tbody > tr.warning:hover > td, +.table-hover > tbody > tr.warning:hover > th { + background-color: @ms2-color-shade-lighter; +} +.table > thead > tr > td.danger, +.table > tbody > tr > td.danger, +.table > tfoot > tr > td.danger, +.table > thead > tr > th.danger, +.table > tbody > tr > th.danger, +.table > tfoot > tr > th.danger, +.table > thead > tr.danger > td, +.table > tbody > tr.danger > td, +.table > tfoot > tr.danger > td, +.table > thead > tr.danger > th, +.table > tbody > tr.danger > th, +.table > tfoot > tr.danger > th { + background-color: @ms2-color-shade-lighter; +} +.table-hover > tbody > tr > td.danger:hover, +.table-hover > tbody > tr > th.danger:hover, +.table-hover > tbody > tr.danger:hover > td, +.table-hover > tbody > tr.danger:hover > th { + background-color: @ms2-color-shade-lighter; +} +@media (max-width: 767px) { + .table-responsive { + width: 100%; + margin-bottom: 15px; + overflow-y: hidden; + overflow-x: scroll; + -ms-overflow-style: -ms-autohiding-scrollbar; + border: 1px solid @ms2-color-shade-lighter; + -webkit-overflow-scrolling: touch; + } + .table-responsive > .table { + margin-bottom: 0; + } + .table-responsive > .table > thead > tr > th, + .table-responsive > .table > tbody > tr > th, + .table-responsive > .table > tfoot > tr > th, + .table-responsive > .table > thead > tr > td, + .table-responsive > .table > tbody > tr > td, + .table-responsive > .table > tfoot > tr > td { + white-space: nowrap; + } + .table-responsive > .table-bordered { + border: 0; + } + .table-responsive > .table-bordered > thead > tr > th:first-child, + .table-responsive > .table-bordered > tbody > tr > th:first-child, + .table-responsive > .table-bordered > tfoot > tr > th:first-child, + .table-responsive > .table-bordered > thead > tr > td:first-child, + .table-responsive > .table-bordered > tbody > tr > td:first-child, + .table-responsive > .table-bordered > tfoot > tr > td:first-child { + border-left: 0; + } + .table-responsive > .table-bordered > thead > tr > th:last-child, + .table-responsive > .table-bordered > tbody > tr > th:last-child, + .table-responsive > .table-bordered > tfoot > tr > th:last-child, + .table-responsive > .table-bordered > thead > tr > td:last-child, + .table-responsive > .table-bordered > tbody > tr > td:last-child, + .table-responsive > .table-bordered > tfoot > tr > td:last-child { + border-right: 0; + } + .table-responsive > .table-bordered > tbody > tr:last-child > th, + .table-responsive > .table-bordered > tfoot > tr:last-child > th, + .table-responsive > .table-bordered > tbody > tr:last-child > td, + .table-responsive > .table-bordered > tfoot > tr:last-child > td { + border-bottom: 0; + } +} +fieldset { + padding: 0; + margin: 0; + border: 0; + min-width: 0; +} +legend { + display: block; + width: 100%; + padding: 0; + margin-bottom: 20px; + font-size: 21px; + line-height: inherit; + color: @ms2-color-text; + border: 0; + border-bottom: 1px solid @ms2-color-shade-lighter; +} +label { + display: inline-block; +} + +input[type="search"] { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +input[type="radio"], +input[type="checkbox"] { + margin: 4px 0 0; + margin-top: 1px \9; + /* IE8-9 */ + + line-height: normal; +} +input[type="file"] { + display: block; +} +input[type="range"] { + display: block; + width: 100%; +} +select[multiple], +select[size] { + height: auto; +} +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} +output { + display: block; + padding-top: 1; + font-size: @font-size-base; + line-height: 1.428571429; + color: @ms2-color-text; +} +.form-control { + display: block; + width: 100%; + height: @square-btn-size; + padding: 0 22px 0 12px; + font-size: @font-size-base; + line-height: 1.428571429; + color: @ms2-color-text; + background-color: @ms2-color-background; + background-image: none; + border-radius: 0; + border: @ms2-color-background; +} +.form-control:focus { + border: @ms2-color-background; + outline: 0; + +} +.form-control::-moz-placeholder { + color: @ms2-color-text-placeholder; + opacity: 1; +} +.form-control:-ms-input-placeholder { + color: @ms2-color-text-placeholder; +} +.form-control::-webkit-input-placeholder { + color: @ms2-color-text-placeholder; +} + +.form-control[disabled], +.form-control[readonly], +fieldset[disabled] .form-control { + cursor: not-allowed; + background-color: @ms2-color-background; + opacity: 1; +} +textarea.form-control { + height: auto; +} +input[type="search"] { + -webkit-appearance: none; +} +input[type="date"] { + line-height: 22px; +} +.form-group { + margin-bottom: 15px; +} +.radio, +.checkbox { + display: block; + min-height: 20px; + margin-top: 10px; + margin-bottom: 10px; + padding-left: 20px; +} +.radio label, +.checkbox label { + display: inline; + font-weight: normal; + cursor: pointer; +} +.radio input[type="radio"], +.radio-inline input[type="radio"], +.checkbox input[type="checkbox"], +.checkbox-inline input[type="checkbox"] { + float: left; + margin-left: -20px; +} +.radio + .radio, +.checkbox + .checkbox { + margin-top: -5px; +} +.radio-inline, +.checkbox-inline { + display: inline-block; + padding-left: 20px; + margin-bottom: 0; + vertical-align: middle; + font-weight: normal; + cursor: pointer; +} +.radio-inline + .radio-inline, +.checkbox-inline + .checkbox-inline { + margin-top: 0; + margin-left: 10px; +} +input[type="radio"][disabled], +input[type="checkbox"][disabled], +.radio[disabled], +.radio-inline[disabled], +.checkbox[disabled], +.checkbox-inline[disabled], +fieldset[disabled] input[type="radio"], +fieldset[disabled] input[type="checkbox"], +fieldset[disabled] .radio, +fieldset[disabled] .radio-inline, +fieldset[disabled] .checkbox, +fieldset[disabled] .checkbox-inline { + cursor: not-allowed; +} +.input-sm { + height: 30px; + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 0; +} +select.input-sm { + height: 30px; + line-height: 30px; +} +textarea.input-sm, +select[multiple].input-sm { + height: auto; +} +.input-lg { + height: 45px; + padding: 10px 16px; + font-size: 18px; + line-height: 1.33; + border-radius: 0; +} +select.input-lg { + height: 45px; + line-height: 45px; +} +textarea.input-lg, +select[multiple].input-lg { + height: auto; +} +.has-feedback { + position: relative; +} +.has-feedback .form-control { + padding-right: 27.5px; +} +.has-feedback .form-control-feedback { + position: absolute; + top: 25px; + right: 0; + display: block; + width: 22px; + height: 22px; + line-height: 22px; + text-align: center; +} +.has-success .help-block, +.has-success .control-label, +.has-success .radio, +.has-success .checkbox, +.has-success .radio-inline, +.has-success .checkbox-inline { + color: @ms2-color-success; +} +.has-success .form-control { + border-color: @ms2-color-success; + -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); +} +.has-success .form-control:focus { + border-color: @ms2-color-success-hover; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px @ms2-color-success; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px @ms2-color-success; +} +.has-success .input-group-addon { + color: @ms2-color-success; + border-color: @ms2-color-success; + background-color: @ms2-color-success-hover; +} +.has-success .form-control-feedback { + color: @ms2-color-success; +} +.has-warning .help-block, +.has-warning .control-label, +.has-warning .radio, +.has-warning .checkbox, +.has-warning .radio-inline, +.has-warning .checkbox-inline { + color: @ms2-color-warning; +} +.has-warning .form-control { + border-color: @ms2-color-warning; + -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); +} +.has-warning .form-control:focus { + border-color: @ms2-color-warning-hover; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px @ms2-color-warning; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px @ms2-color-warning; +} +.has-warning .input-group-addon { + color: @ms2-color-warning; + border-color: @ms2-color-warning; + background-color: @ms2-color-warning-light; +} +.has-warning .form-control-feedback { + color: @ms2-color-warning; +} +.has-error .help-block, +.has-error .control-label, +.has-error .radio, +.has-error .checkbox, +.has-error .radio-inline, +.has-error .checkbox-inline { + color: @ms2-color-danger; +} +.has-error .form-control { + border-color: @ms2-color-danger; + -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); +} +.has-error .form-control:focus { + border-color: @ms2-color-danger-hover; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px @ms2-color-danger; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px @ms2-color-danger; +} +.has-error .input-group-addon { + color: @ms2-color-danger; + border-color: @ms2-color-danger; + background-color: @ms2-color-warning-light; +} +.has-error .form-control-feedback { + color: @ms2-color-danger; +} +.form-control-static { + margin-bottom: 0; +} +.help-block { + display: block; + margin-top: 5px; + margin-bottom: 10px; + color: @ms2-color-text; +} +@media (min-width: 768px) { + .form-inline .form-group { + display: inline-block; + margin-bottom: 0; + vertical-align: middle; + } + .form-inline .form-control { + display: inline-block; + width: auto; + vertical-align: middle; + } + .form-inline .input-group > .form-control { + width: 100%; + } + .form-inline .control-label { + margin-bottom: 0; + vertical-align: middle; + } + .form-inline .radio, + .form-inline .checkbox { + display: inline-block; + margin-top: 0; + margin-bottom: 0; + padding-left: 0; + vertical-align: middle; + } + .form-inline .radio input[type="radio"], + .form-inline .checkbox input[type="checkbox"] { + float: none; + margin-left: 0; + } + .form-inline .has-feedback .form-control-feedback { + top: 0; + } +} +.form-horizontal .control-label, +.form-horizontal .radio, +.form-horizontal .checkbox, +.form-horizontal .radio-inline, +.form-horizontal .checkbox-inline { + margin-top: 0; + margin-bottom: 0; + padding-top: 1; +} +.form-horizontal .radio, +.form-horizontal .checkbox { + min-height: 21px; +} +.form-horizontal .form-group { + margin-left: -15px; + margin-right: -15px; +} +.form-horizontal .form-control-static { + padding-top: 1; +} +@media (min-width: 768px) { + .form-horizontal .control-label { + text-align: right; + } +} +.form-horizontal .has-feedback .form-control-feedback { + top: 0; + right: 15px; +} +.btn { + display: inline-block; + margin-bottom: 0; + font-weight: @btn-font-weight; + padding: 6px 12px; + text-align: center; + vertical-align: middle; + cursor: pointer; + background-image: none; + white-space: nowrap; + font-size: @font-size-base; + border-radius: 0px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + transition: all 0.2s ease-in; + -webkit-transition:all 0.2s ease-in; + -moz-transition:all 0.2s ease-in; + -o-transition:all 0.2s ease-in; +} + +.btn:focus { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} + +.btn:hover, +.btn:focus { + color: @ms2-color-text-primary; + text-decoration: none; +} +.btn:active, +.btn.active { + outline: 0; + background-image: none; + -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); +} + +.btn.disabled, +.btn[disabled], +fieldset[disabled] .btn { + cursor: not-allowed; + pointer-events: none; + opacity: 1; + filter: alpha(opacity=100); + -webkit-box-shadow: none; + box-shadow: none; +} + +.btn-default { + color: @ms2-color-primary ; + background-color: @ms2-color-background !important; + border:@ms2-color-primary 1px solid; +} + +.btn-default:hover, +.btn-default:focus, +.btn-default:active, +.btn-default.active, +.open .dropdown-toggle.btn-default { + color: lighten(@ms2-color-primary-hover, 5%); + border-color:@ms2-color-primary-hover; +} +.btn-default:active, +.btn-default.active, +.open .dropdown-toggle.btn-default { + background-image: none; +} +.btn-default.disabled, +.btn-default[disabled], +fieldset[disabled] .btn-default, +.btn-default.disabled:hover, +.btn-default[disabled]:hover, +fieldset[disabled] .btn-default:hover, +.btn-default.disabled:focus, +.btn-default[disabled]:focus, +fieldset[disabled] .btn-default:focus, +.btn-default.disabled:active, +.btn-default[disabled]:active, +fieldset[disabled] .btn-default:active, +.btn-default.disabled.active, +.btn-default[disabled].active, +fieldset[disabled] .btn-default.active { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled; + border-color: none; +} +.btn-default .badge { + color: @ms2-color-primary; + background-color: @ms2-color-background; +} +.btn-primary { + color: @ms2-color-text-primary; + background-color: @ms2-color-primary; + border:none; +} + +.btn-primary:hover, +.btn-primary:focus, +.btn-primary:active, +.btn-primary.active, +.open .dropdown-toggle.btn-primary { + color: @ms2-color-text-primary; + background-color:@ms2-color-primary-hover; +} +.btn-primary:active, +.btn-primary.active, +.open .dropdown-toggle.btn-primary { + background-image: none; +} +.btn-primary.disabled, +.btn-primary[disabled], +fieldset[disabled] .btn-primary, +.btn-primary.disabled:hover, +.btn-primary[disabled]:hover, +fieldset[disabled] .btn-primary:hover, +.btn-primary.disabled:focus, +.btn-primary[disabled]:focus, +fieldset[disabled] .btn-primary:focus, +.btn-primary.disabled:active, +.btn-primary[disabled]:active, +fieldset[disabled] .btn-primary:active, +.btn-primary.disabled.active, +.btn-primary[disabled].active, +fieldset[disabled] .btn-primary.active { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled; +} +.btn-primary .badge { + color: @ms2-color-primary; + background-color: @ms2-color-background; +} +.btn-success { + color: @ms2-color-text-primary; + background-color: @ms2-color-success; + border: none; +} +.btn-success:hover, +.btn-success:focus, +.btn-success:active, +.btn-success.active, +.open .dropdown-toggle.btn-success { + color: @ms2-color-text-primary; + background-color: @ms2-color-success-hover; +} +.btn-success:active, +.btn-success.active, +.open .dropdown-toggle.btn-success { + background-image: none; +} +.btn-success.disabled, +.btn-success[disabled], +fieldset[disabled] .btn-success, +.btn-success.disabled:hover, +.btn-success[disabled]:hover, +fieldset[disabled] .btn-success:hover, +.btn-success.disabled:focus, +.btn-success[disabled]:focus, +fieldset[disabled] .btn-success:focus, +.btn-success.disabled:active, +.btn-success[disabled]:active, +fieldset[disabled] .btn-success:active, +.btn-success.disabled.active, +.btn-success[disabled].active, +fieldset[disabled] .btn-success.active { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled; +} +.btn-success .badge { + color: @ms2-color-success; + background-color: @ms2-color-background; +} +.btn-info { + color: @ms2-color-text-primary; + background-color: @ms2-color-info; + border: none; + +} +.btn-info:hover, +.btn-info:focus, +.btn-info:active, +.btn-info.active, +.open .dropdown-toggle.btn-info { + color: @ms2-color-text-primary; + background-color: @ms2-color-info-hover; + +} +.btn-info:active, +.btn-info.active, +.open .dropdown-toggle.btn-info { + background-image: none; +} +.btn-info.disabled, +.btn-info[disabled], +fieldset[disabled] .btn-info, +.btn-info.disabled:hover, +.btn-info[disabled]:hover, +fieldset[disabled] .btn-info:hover, +.btn-info.disabled:focus, +.btn-info[disabled]:focus, +fieldset[disabled] .btn-info:focus, +.btn-info.disabled:active, +.btn-info[disabled]:active, +fieldset[disabled] .btn-info:active, +.btn-info.disabled.active, +.btn-info[disabled].active, +fieldset[disabled] .btn-info.active { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled; +} +.btn-info .badge { + color: @ms2-color-info; + background-color: @ms2-color-background; +} +.btn-warning { + color: @ms2-color-text-primary; + background-color: @ms2-color-warning; + border: none; +} +.btn-warning:hover, +.btn-warning:focus, +.btn-warning:active, +.btn-warning.active, +.open .dropdown-toggle.btn-warning { + color: @ms2-color-text-primary; + background-color: @ms2-color-warning-hover; +} +.btn-warning:active, +.btn-warning.active, +.open .dropdown-toggle.btn-warning { + background-image: none; +} +.btn-warning.disabled, +.btn-warning[disabled], +fieldset[disabled] .btn-warning, +.btn-warning.disabled:hover, +.btn-warning[disabled]:hover, +fieldset[disabled] .btn-warning:hover, +.btn-warning.disabled:focus, +.btn-warning[disabled]:focus, +fieldset[disabled] .btn-warning:focus, +.btn-warning.disabled:active, +.btn-warning[disabled]:active, +fieldset[disabled] .btn-warning:active, +.btn-warning.disabled.active, +.btn-warning[disabled].active, +fieldset[disabled] .btn-warning.active { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled; + border: none; +} +.btn-warning .badge { + color: @ms2-color-warning; + background-color: @ms2-color-background; +} +.btn-danger { + color: @ms2-color-text-primary; + background-color: @ms2-color-danger; + border: none; +} + +.btn-danger:hover, +.btn-danger:focus, +.btn-danger:active, +.btn-danger.active, +.open .dropdown-toggle.btn-danger { + color: @ms2-color-text-primary; + background-color: @ms2-color-danger-hover; +} +.btn-danger:active, +.btn-danger.active, +.open .dropdown-toggle.btn-danger { + background-image: none; +} +.btn-danger.disabled, +.btn-danger[disabled], +fieldset[disabled] .btn-danger, +.btn-danger.disabled:hover, +.btn-danger[disabled]:hover, +fieldset[disabled] .btn-danger:hover, +.btn-danger.disabled:focus, +.btn-danger[disabled]:focus, +fieldset[disabled] .btn-danger:focus, +.btn-danger.disabled:active, +.btn-danger[disabled]:active, +fieldset[disabled] .btn-danger:active, +.btn-danger.disabled.active, +.btn-danger[disabled].active, +fieldset[disabled] .btn-danger.active { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled; + border: none; +} +.btn-danger .badge { + color: @ms2-color-danger; + background-color: @ms2-color-background; +} +.btn-link { + color: @ms2-color-primary; + font-weight: @btn-font-weight; + cursor: pointer; +} +.btn-link, +.btn-link:active, +.btn-link[disabled], +fieldset[disabled] .btn-link { + background-color: transparent; + -webkit-box-shadow: none; + box-shadow: none; +} +.btn-link, +.btn-link:hover, +.btn-link:focus, +.btn-link:active { + border-color: transparent; +} +.btn-link:hover, +.btn-link:focus { + color: @ms2-color-primary-hover; + text-decoration: underline; + background-color: transparent; +} + +.btn-link[disabled]:hover, +fieldset[disabled] .btn-link:hover, +.btn-link[disabled]:focus, +fieldset[disabled] .btn-link:focus { + color: @ms2-color-text; + text-decoration: none; +} +.btn-lg, +.btn-group-lg > .btn { + font-size: @font-size-large; + padding: 10px 15px +} + +.btn-md, +.btn-group-md > .btn { + padding: 6px 12px; + font-size: @font-size-large; + +} + +.btn-sm, +.btn-group-sm > .btn { + padding: 6px 12px; + font-size: @font-size-small; +} +.btn-xs, +.btn-group-xs > .btn { + padding: 5px 5px; + font-size: @font-size-small; +} + +.btn-block { + display: block; + width: 100%; + padding-left: 0; + padding-right: 0; +} +.btn-block + .btn-block { + margin-top: 5px; +} +input[type="submit"].btn-block, +input[type="reset"].btn-block, +input[type="button"].btn-block { + width: 100%; +} +.fade { + opacity: 0; + -webkit-transition: opacity 0.15s linear; + transition: opacity 0.15s linear; +} +.fade.in { + opacity: 1; +} +.collapse { + display: none; +} +.collapse.in { + display: block; +} +.collapsing { + position: relative; + height: 0; + overflow: hidden; + -webkit-transition: height 0.35s ease; + transition: height 0.35s ease; +} + +.glyphicon { + display: inline-block; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + top: 0; +} + +/* btn with icon */ +.btn .glyphicon{ + float: left; + margin-top: 0; + font-size: @font-size-base; +} + +.btn-lg .glyphicon{ + font-size: ceil(@font-size-large * 1); + margin-right: 5px; +} + +.btn-md .glyphicon{ + font-size: ceil(@font-size-large * 1); + margin-right: 5px; +} + +.btn-sm .glyphicon{ + font-size: ceil(@font-size-small * 1); + /*margin-right: 5px;*/ +} + +.btn-xs .glyphicon{ + font-size: ceil(@font-size-small * 1); +} + +.caret { + display: inline-block; + width: 0; + height: 0; + margin-left: 2px; + vertical-align: middle; + border-top: 4px solid; + border-right: 4px solid transparent; + border-left: 4px solid transparent; +} +.dropdown { + position: relative; +} + +.dropdown-toggle:focus { + outline: 0; +} +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + z-index: 1000; + display: none; + float: left; + min-width: 160px; + padding: 0; + margin: 2px 0 0; + list-style: none; + font-size: @font-size-base; + background-color: @ms2-color-background; + border-radius: 0; + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + background-clip: padding-box; +} + +.dropdown-menu ul li { + margin-bottom: 1px solid @ms2-color-shade-lighter; +} + +.dropdown-menu.pull-right { + right: 0; + left: auto; +} +.dropdown-menu .divider { + height: 1px; + overflow: hidden; + border-top: 1px solid @ms2-color-shade-lighter; + margin: 6px 12px; +} +.dropdown-menu > li > a { + display: block; + padding: 10px 15px; + clear: both; + font-weight: normal; + line-height: 1.428571429; + color: @ms2-color-text; + white-space: nowrap; + -webkit-transition:all 0.2s ease-in; + -moz-transition:all 0.2s ease-in; + -o-transition:all 0.2s ease-in; +} +.dropdown-menu > li > a:hover, +.dropdown-menu > li > a:focus { + text-decoration: none; + background-color: @ms2-color-shade-lighter; +} +.dropdown-menu > .active > a, +.dropdown-menu > .active > a:hover, +.dropdown-menu > .active > a:focus { + color: @ms2-color-text; + text-decoration: none; + outline: 0; + background-color: @ms2-color-primary; +} +.dropdown-menu > .disabled > a, +.dropdown-menu > .disabled > a:hover, +.dropdown-menu > .disabled > a:focus { + color: @ms2-color-text; +} +.dropdown-menu > .disabled > a:hover, +.dropdown-menu > .disabled > a:focus { + text-decoration: none; + background-color: transparent; + background-image: none; + filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); + cursor: not-allowed; +} +.open > .dropdown-menu { + display: block; +} +.open > a { + outline: 0; +} +.dropdown-menu-right { + left: auto; + right: 0; +} +.dropdown-menu-left { + left: 0; + right: auto; +} +.dropdown-header { + display: block; + padding: 3px 16px; + font-size: @font-size-small; + line-height: 1.428571429; + background-color: @ms2-color-primary-hover; + color: @ms2-color-text; +} +.dropdown-backdrop { + position: fixed; + left: 0; + right: 0; + bottom: 0; + top: 0; + z-index: 990; +} +.pull-right > .dropdown-menu { + right: 0; + left: auto; +} +.dropup .caret, +.navbar-fixed-bottom .dropdown .caret { + border-top: 0; + border-bottom: 4px solid; + content: ""; +} +.dropup .dropdown-menu, +.navbar-fixed-bottom .dropdown .dropdown-menu { + top: auto; + bottom: 100%; + margin-bottom: 1px; +} +@media (min-width: 768px) { + .navbar-right .dropdown-menu { + left: auto; + right: 0; + } + .navbar-right .dropdown-menu-left { + left: 0; + right: auto; + } +} +.btn-group, +.btn-group-vertical { + position: relative; + display: inline-block; + vertical-align: middle; +} +.btn-group-vertical { + width:@square-btn-size; +} +.btn-group > .btn, +.btn-group-vertical > .btn { + position: relative; + float: left; +} +.btn-group > .btn:hover, +.btn-group-vertical > .btn:hover, +.btn-group > .btn:focus, +.btn-group-vertical > .btn:focus, +.btn-group > .btn:active, +.btn-group-vertical > .btn:active, +.btn-group > .btn.active, +.btn-group-vertical > .btn.active { + z-index: 2; +} +.btn-group > .btn:focus, +.btn-group-vertical > .btn:focus { + outline: none; +} +.btn-group .btn + .btn, +.btn-group .btn + .btn-group, +.btn-group .btn-group + .btn, +.btn-group .btn-group + .btn-group { + margin-left: -1px; +} +.btn-toolbar { + margin-left: -5px; +} +.btn-toolbar .btn-group, +.btn-toolbar .input-group { + float: left; +} +.btn-toolbar > .btn, +.btn-toolbar > .btn-group, +.btn-toolbar > .input-group { + margin-left: 5px; +} +.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { + border-radius: 0; +} +.btn-group > .btn:first-child { + margin-left: 0; +} +.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) { + border-bottom-right-radius: 0; + border-top-right-radius: 0; +} +.btn-group > .btn:last-child:not(:first-child), +.btn-group > .dropdown-toggle:not(:first-child) { + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} +.btn-group > .btn-group { + float: left; +} +.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group > .btn-group:first-child > .btn:last-child, +.btn-group > .btn-group:first-child > .dropdown-toggle { + border-bottom-right-radius: 0; + border-top-right-radius: 0; +} +.btn-group > .btn-group:last-child > .btn:first-child { + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} +.btn-group .dropdown-toggle:active, +.btn-group.open .dropdown-toggle { + outline: 0; +} +.btn-group > .btn + .dropdown-toggle { + padding-left: 8px; + padding-right: 8px; +} +.btn-group > .btn-lg + .dropdown-toggle { + padding-left: 12px; + padding-right: 12px; +} +.btn-group.open .dropdown-toggle { + -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); +} +.btn-group.open .dropdown-toggle.btn-link { + -webkit-box-shadow: none; + box-shadow: none; +} +.btn .caret { + margin-left: 0; +} +.btn-lg .caret { + border-width: 5px 5px 0; + border-bottom-width: 0; +} +.dropup .btn-lg .caret { + border-width: 0 5px 5px; +} +.btn-group-vertical > .btn, +.btn-group-vertical > .btn-group, +.btn-group-vertical > .btn-group > .btn { + display: block; + float: none; + width: 100%; + max-width: 100%; +} +.btn-group-vertical > .btn-group > .btn { + float: none; +} +.btn-group-vertical > .btn + .btn, +.btn-group-vertical > .btn + .btn-group, +.btn-group-vertical > .btn-group + .btn, +.btn-group-vertical > .btn-group + .btn-group { + margin-top: -1px; + margin-left: 0; +} +.btn-group-vertical > .btn:not(:first-child):not(:last-child) { + border-radius: 0; +} +.btn-group-vertical > .btn:first-child:not(:last-child) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group-vertical > .btn:last-child:not(:first-child) { + border-bottom-left-radius: 0; + border-top-right-radius: 0; + border-top-left-radius: 0; +} +.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child, +.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { + border-top-right-radius: 0; + border-top-left-radius: 0; +} +.btn-group-justified { + display: table; + width: 100%; + table-layout: fixed; + border-collapse: separate; +} +.btn-group-justified > .btn, +.btn-group-justified > .btn-group { + float: none; + display: table-cell; + width: 1%; +} +.btn-group-justified > .btn-group .btn { + width: 100%; +} +[data-toggle="buttons"] > .btn > input[type="radio"], +[data-toggle="buttons"] > .btn > input[type="checkbox"] { + display: none; +} +.input-group { + position: relative; + display: table; + border-collapse: separate; +} +.input-group[class*="col-"] { + float: none; + padding-left: 0; + padding-right: 0; +} +.input-group .form-control { + float: left; + width: 100%; + margin-bottom: 0; +} +.input-group-lg > .form-control, +.input-group-lg > .input-group-addon, +.input-group-lg > .input-group-btn > .btn { + height: 45px; + padding: 10px 16px; + font-size: 18px; + line-height: 1.33; + border-radius: 0; +} +select.input-group-lg > .form-control, +select.input-group-lg > .input-group-addon, +select.input-group-lg > .input-group-btn > .btn { + height: 45px; + line-height: 45px; +} +textarea.input-group-lg > .form-control, +textarea.input-group-lg > .input-group-addon, +textarea.input-group-lg > .input-group-btn > .btn, +select[multiple].input-group-lg > .form-control, +select[multiple].input-group-lg > .input-group-addon, +select[multiple].input-group-lg > .input-group-btn > .btn { + height: auto; +} +.input-group-sm > .form-control, +.input-group-sm > .input-group-addon, +.input-group-sm > .input-group-btn > .btn { + height: 30px; + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 0; +} +select.input-group-sm > .form-control, +select.input-group-sm > .input-group-addon, +select.input-group-sm > .input-group-btn > .btn { + height: 30px; + line-height: 30px; +} +textarea.input-group-sm > .form-control, +textarea.input-group-sm > .input-group-addon, +textarea.input-group-sm > .input-group-btn > .btn, +select[multiple].input-group-sm > .form-control, +select[multiple].input-group-sm > .input-group-addon, +select[multiple].input-group-sm > .input-group-btn > .btn { + height: auto; +} +.input-group-addon, +.input-group-btn, +.input-group .form-control { + display: table-cell; +} +.input-group-addon:not(:first-child):not(:last-child), +.input-group-btn:not(:first-child):not(:last-child), +.input-group .form-control:not(:first-child):not(:last-child) { + border-radius: 0; +} +.input-group-addon, +.input-group-btn { + width: 1%; + white-space: nowrap; + vertical-align: middle; +} +.input-group-addon { + padding: 0 0px; + font-size: @font-size-base; + font-weight: normal; + line-height: 1; + color: @ms2-color-text; + text-align: center; +} +.input-group-addon.input-sm { + padding: 5px 10px; + font-size: 12px; +} +.input-group-addon.input-lg { + padding: 10px 16px; + font-size: 18px; + border-radius: 0; +} +.input-group-addon input[type="radio"], +.input-group-addon input[type="checkbox"] { + margin-top: 0; +} +.input-group .form-control:first-child, +.input-group-addon:first-child, +.input-group-btn:first-child > .btn, +.input-group-btn:first-child > .btn-group > .btn, +.input-group-btn:first-child > .dropdown-toggle, +.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle), +.input-group-btn:last-child > .btn-group:not(:last-child) > .btn { + border-bottom-right-radius: 0; + border-top-right-radius: 0; +} +.input-group-addon:first-child { + border-right: 0; +} +.input-group .form-control:last-child, +.input-group-addon:last-child, +.input-group-btn:last-child > .btn, +.input-group-btn:last-child > .btn-group > .btn, +.input-group-btn:last-child > .dropdown-toggle, +.input-group-btn:first-child > .btn:not(:first-child), +.input-group-btn:first-child > .btn-group:not(:first-child) > .btn { + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} +.input-group-addon:last-child { + border-left: 0; +} +.input-group-btn { + position: relative; + font-size: 0; + white-space: nowrap; +} +.input-group-btn > .btn { + position: relative; +} +.input-group-btn > .btn + .btn { + margin-left: -1px; +} +.input-group-btn > .btn:hover, +.input-group-btn > .btn:focus, +.input-group-btn > .btn:active { + z-index: 2; +} +.input-group-btn:first-child > .btn, +.input-group-btn:first-child > .btn-group { + margin-right: -1px; +} +.input-group-btn:last-child > .btn, +.input-group-btn:last-child > .btn-group { + margin-left: -1px; +} +.nav { + margin-bottom: 0; + padding-left: 0; + list-style: none; +} +.nav > li { + position: relative; + display: block; +} + +.nav > li > a { + position: relative; + display: block; + padding: 10px 15px; +} +.nav > li > a:hover, +.nav > li > a:focus { + text-decoration: none; + background-color: @ms2-color-shade-lighter; +} +.nav > li.disabled > a { + color: @ms2-color-text; +} +.nav > li.disabled > a:hover, +.nav > li.disabled > a:focus { + color: @ms2-color-text; + text-decoration: none; + background-color: transparent; + cursor: not-allowed; +} +.nav .open > a, +.nav .open > a:hover, +.nav .open > a:focus { + background-color: @ms2-color-shade-lighter; + border-color: @ms2-color-primary; +} +.nav .nav-divider { + height: 1px; + overflow: hidden; + border-top: 1px solid @ms2-color-shade-lighter; + margin: 6px 12px; +} +.nav > li > a > img { + max-width: none; +} +.nav-tabs { + border-bottom: 1px solid @ms2-color-shade-lighter; +} +.nav-tabs > li { + float: left; + margin-bottom: -1px; +} +.nav-tabs > li > a { + margin-right: 2px; + line-height: 1.428571429; + border: 1px solid transparent; + border-radius: 0; +} +.nav-tabs > li > a:hover { + border-color: @ms2-color-shade-lighter; +} +.nav-tabs > li.active > a, +.nav-tabs > li.active > a:hover, +.nav-tabs > li.active > a:focus { + color: @ms2-color-text; + background-color: @ms2-color-background; + border: 1px solid @ms2-color-shade-lighter; + border-bottom-color: transparent; + cursor: default; +} +.nav-tabs.nav-justified { + width: 100%; + border-bottom: 0; +} +.nav-tabs.nav-justified > li { + float: none; +} +.nav-tabs.nav-justified > li > a { + text-align: center; + margin-bottom: 5px; +} +.nav-tabs.nav-justified > .dropdown .dropdown-menu { + top: auto; + left: auto; +} +@media (min-width: 768px) { + .nav-tabs.nav-justified > li { + display: table-cell; + width: 1%; + } + .nav-tabs.nav-justified > li > a { + margin-bottom: 0; + } +} +.nav-tabs.nav-justified > li > a { + margin-right: 0; + border-radius: 0; +} +.nav-tabs.nav-justified > .active > a, +.nav-tabs.nav-justified > .active > a:hover, +.nav-tabs.nav-justified > .active > a:focus { + border: 1px solid @ms2-color-shade-lighter; +} +@media (min-width: 768px) { + .nav-tabs.nav-justified > li > a { + border-bottom: 1px solid @ms2-color-shade-lighter; + border-radius: 0; + } + .nav-tabs.nav-justified > .active > a, + .nav-tabs.nav-justified > .active > a:hover, + .nav-tabs.nav-justified > .active > a:focus { + border-bottom-color: @ms2-color-background; + } +} +.nav-pills > li { + float: left; +} +.nav-pills > li > a { + border-radius: 0; +} +.nav-pills > li + li { + margin-left: 2px; +} +.nav-pills > li.active > a, +.nav-pills > li.active > a:hover, +.nav-pills > li.active > a:focus { + color: @ms2-color-background; + background-color: @ms2-color-primary; +} +.nav-stacked > li { + float: none; +} +.nav-stacked > li + li { + margin-top: 2px; + margin-left: 0; +} +.nav-justified { + width: 100%; +} +.nav-justified > li { + float: none; +} +.nav-justified > li > a { + text-align: center; + margin-bottom: 5px; +} +.nav-justified > .dropdown .dropdown-menu { + top: auto; + left: auto; +} +@media (min-width: 768px) { + .nav-justified > li { + display: table-cell; + width: 1%; + } + .nav-justified > li > a { + margin-bottom: 0; + } +} +.nav-tabs-justified { + border-bottom: 0; +} +.nav-tabs-justified > li > a { + margin-right: 0; + border-radius: 0; +} +.nav-tabs-justified > .active > a, +.nav-tabs-justified > .active > a:hover, +.nav-tabs-justified > .active > a:focus { + border: 1px solid @ms2-color-shade-lighter; +} +@media (min-width: 768px) { + .nav-tabs-justified > li > a { + border-bottom: 1px solid @ms2-color-shade-lighter; + border-radius: 0 0 0 0; + } + .nav-tabs-justified > .active > a, + .nav-tabs-justified > .active > a:hover, + .nav-tabs-justified > .active > a:focus { + border-bottom-color: @ms2-color-background; + } +} +.tab-content > .tab-pane { + display: none; +} +.tab-content > .active { + display: block; +} +.nav-tabs .dropdown-menu { + margin-top: -1px; + border-top-right-radius: 0; + border-top-left-radius: 0; +} +.navbar { + position: relative; + min-height: @square-btn-size; +} +@media (min-width: 768px) { + .navbar { + border-radius: 0; + } +} +@media (min-width: 768px) { + .navbar-header { + float: left; + } +} + +.navbar-collapse { + max-height: 340px; + overflow-x: visible; + padding-right: 15px; + padding-left: 15px; + border-top: 1px solid transparent; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + -webkit-overflow-scrolling: touch; +} +.navbar-collapse.in { + overflow-y: auto; +} +@media (min-width: 768px) { + .navbar-collapse { + width: auto; + border-top: 0; + box-shadow: none; + } + .navbar-collapse.collapse { + display: block !important; + height: auto !important; + padding-bottom: 0; + overflow: visible !important; + } + .navbar-collapse.in { + overflow-y: visible; + } + .navbar-fixed-top .navbar-collapse, + .navbar-static-top .navbar-collapse, + .navbar-fixed-bottom .navbar-collapse { + padding-left: 0; + padding-right: 0; + } +} +.container > .navbar-header, +.container-fluid > .navbar-header, +.container > .navbar-collapse, +.container-fluid > .navbar-collapse { + margin-right: -15px; + margin-left: -15px; +} +@media (min-width: 768px) { + .container > .navbar-header, + .container-fluid > .navbar-header, + .container > .navbar-collapse, + .container-fluid > .navbar-collapse { + margin-right: 0; + margin-left: 0; + } +} +.navbar-static-top { + z-index: 1000; + border-width: 0 0 1px; +} +@media (min-width: 768px) { + .navbar-static-top { + border-radius: 0; + } +} +.navbar-fixed-top, +.navbar-fixed-bottom { + position: fixed; + right: 0; + left: 0; + z-index: 1030; +} +@media (min-width: 768px) { + .navbar-fixed-top, + .navbar-fixed-bottom { + border-radius: 0; + } +} +.navbar-fixed-top { + top: 0; + border-width: 0 0 1px; +} +.navbar-fixed-bottom { + bottom: 0; + margin-bottom: 0; + border-width: 1px 0 0; +} +.navbar-brand { + float: left; + padding: 18px 15px; + font-size: @font-size-base; + line-height: 20px; + height: @square-btn-size; +} +.navbar-brand:hover, +.navbar-brand:focus { + text-decoration: none; +} + +@media (min-width: 768px) { + .navbar > .container .navbar-brand, + .navbar > .container-fluid .navbar-brand { + margin-left: -15px; + } +} +.navbar-toggle { + position: relative; + float: right; + margin-right: 15px; + padding: 9px 10px; + margin-top: 8px; + margin-bottom: 8px; + background-color: transparent; + background-image: none; + border: 1px solid transparent; + border-radius: 0; +} +.navbar-toggle:focus { + outline: none; +} +.navbar-toggle .icon-bar { + display: block; + width: 22px; + height: 2px; + border-radius: 1px; +} +.navbar-toggle .icon-bar + .icon-bar { + margin-top: 4px; +} +@media (min-width: 768px) { + .navbar-toggle { + display: none; + } +} +.navbar-nav { + margin: 7px -15px; +} +.navbar-nav > li > a { + padding: 18px; + line-height: 20px; +} +@media (max-width: 767px) { + .navbar-nav .open .dropdown-menu { + position: static; + float: none; + width: auto; + margin-top: 0; + background-color: transparent; + border: 0; + box-shadow: none; + } + .navbar-nav .open .dropdown-menu > li > a, + .navbar-nav .open .dropdown-menu .dropdown-header { + padding: 5px 15px 5px 25px; + } + .navbar-nav .open .dropdown-menu > li > a { + line-height: 20px; + } + .navbar-nav .open .dropdown-menu > li > a:hover, + .navbar-nav .open .dropdown-menu > li > a:focus { + background-image: none; + } +} +@media (min-width: 768px) { + .navbar-nav { + float: left; + margin: 0; + } + .navbar-nav > li { + float: left; + } + .navbar-nav > li > a { + padding-top: ; + padding-bottom: ; + } + .navbar-nav.navbar-right:last-child { + margin-right: -15px; + } +} +@media (min-width: 768px) { + .navbar-left { + float: left !important; + } + .navbar-right { + float: right !important; + } +} +.navbar-form { + margin-left: -15px; + margin-right: -15px; + padding: 10px 15px; + border-top: 1px solid transparent; + border-bottom: 1px solid transparent; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); + margin-top: 14px; + margin-bottom: 14px; +} +@media (min-width: 768px) { + .navbar-form .form-group { + display: inline-block; + margin-bottom: 0; + vertical-align: middle; + } + .navbar-form .form-control { + display: inline-block; + width: auto; + vertical-align: middle; + } + .navbar-form .input-group > .form-control { + width: 100%; + } + .navbar-form .control-label { + margin-bottom: 0; + vertical-align: middle; + } + .navbar-form .radio, + .navbar-form .checkbox { + display: inline-block; + margin-top: 0; + margin-bottom: 0; + padding-left: 0; + vertical-align: middle; + } + .navbar-form .radio input[type="radio"], + .navbar-form .checkbox input[type="checkbox"] { + float: none; + margin-left: 0; + } + .navbar-form .has-feedback .form-control-feedback { + top: 0; + } +} +@media (max-width: 767px) { + .navbar-form .form-group { + margin-bottom: 5px; + } +} +@media (min-width: 768px) { + .navbar-form { + width: auto; + border: 0; + margin-left: 0; + margin-right: 0; + padding-top: 0; + padding-bottom: 0; + -webkit-box-shadow: none; + box-shadow: none; + } + .navbar-form.navbar-right:last-child { + margin-right: -15px; + } +} +.navbar-nav > li > .dropdown-menu { + margin-top: 0; + border-top-right-radius: 0; + border-top-left-radius: 0; +} +.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.navbar-btn { + margin-top: 14px; + margin-bottom: 14px; +} +.navbar-btn.btn-sm { + margin-top: 10px; + margin-bottom: 10px; +} +.navbar-btn.btn-xs { + margin-top: 14px; + margin-bottom: 14px; +} +.navbar-text { + margin-top: 15px; + margin-bottom: 15px; +} +@media (min-width: 768px) { + .navbar-text { + float: left; + margin-left: 15px; + margin-right: 15px; + } + .navbar-text.navbar-right:last-child { + margin-right: 0; + } +} +.navbar-default { + background-color: @ms2-color-background; + border-color: gray-light; +} +.navbar-default .navbar-brand { + color: @ms2-color-text; +} +.navbar-default .navbar-brand:hover, +.navbar-default .navbar-brand:focus { + color: @ms2-color-text; + background-color: transparent; +} +.navbar-default .navbar-text { + color: @ms2-color-primary; +} +.navbar-default .navbar-nav > li > a { + color: @ms2-color-primary; + background-color: @ms2-color-background; +} +.navbar-default .navbar-nav > li > a:hover, +.navbar-default .navbar-nav > li > a:focus { + color: @ms2-color-primary; + background-color: @ms2-color-shade-lighter; +} + +.navbar-default .navbar-nav > .active > a, +.navbar-default .navbar-nav > .active > a:hover, +.navbar-default .navbar-nav > .active > a:focus { + color: @ms2-color-primary; + background-color: @ms2-color-shade-lighter; +} +.navbar-default .navbar-nav > .disabled > a, +.navbar-default .navbar-nav > .disabled > a:hover, +.navbar-default .navbar-nav > .disabled > a:focus { + color: @ms2-color-text; + background-color: transparent; +} +.navbar-default .navbar-toggle { + border-color: ; +} +.navbar-default .navbar-toggle:hover, +.navbar-default .navbar-toggle:focus { + background-color:; +} +.navbar-default .navbar-toggle .icon-bar { + background-color: @ms2-color-primary; +} +.navbar-default .navbar-collapse, +.navbar-default .navbar-form { + border-color: @ms2-color-shade-lighter; +} +.navbar-default .navbar-nav > .open > a, +.navbar-default .navbar-nav > .open > a:hover, +.navbar-default .navbar-nav > .open > a:focus { + background-color: @ms2-color-shade-lighter; +} + +@media (max-width: 767px) { +.dropdown li .dropdown-menu.open{ +} + + .navbar-default .navbar-nav .open .dropdown-menu > li > a { + color: @ms2-color-text; + } + .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, + .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { + color: @ms2-color-text; + background-color: @ms2-color-shade-lighter; + } + .navbar-default .navbar-nav .open .dropdown-menu > .active > a, + .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, + .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { + background-color: @ms2-color-shade-lighter; + } + .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, + .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, + .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { + color: @ms2-color-text; + + background-color: transparent; + } + + .navbar-default .navbar-nav > .open > a, +.navbar-default .navbar-nav > .open > a:hover, +.navbar-default .navbar-nav > .open > a:focus { + color: @ms2-color-primary; + right:0px; +} + +} +.navbar-default .navbar-link { + color: @ms2-color-text; +} +.navbar-default .navbar-link:hover { + color: @ms2-color-text; +} + + + + +.navbar-inverse { + background-color: @ms2-color-primary; + border-color: @ms2-color-primary-light; +} +.navbar-inverse .navbar-brand { + color: @ms2-color-text-primary; +} +.navbar-inverse .navbar-brand:hover, +.navbar-inverse .navbar-brand:focus { + color: @ms2-color-text-primary; + background-color: transparent; +} +.navbar-inverse .navbar-text { + color: @ms2-color-text; +} +.navbar-inverse .navbar-nav > li > a { + color: @ms2-color-text-primary; +} +.navbar-inverse .navbar-nav > li > a:hover, +.navbar-inverse .navbar-nav > li > a:focus { + color: @ms2-color-text-primary; + background-color: @ms2-color-primary-hover; +} +.navbar-inverse .navbar-nav > .active > a, +.navbar-inverse .navbar-nav > .active > a:hover, +.navbar-inverse .navbar-nav > .active > a:focus { + color: @ms2-color-text-primary; + background-color: @ms2-color-primary-hover; +} +.navbar-inverse .navbar-nav > .disabled > a, +.navbar-inverse .navbar-nav > .disabled > a:hover, +.navbar-inverse .navbar-nav > .disabled > a:focus { + color: @ms2-color-text; + background-color: transparent; +} +.navbar-inverse .navbar-toggle { + border-color: none; +} +.navbar-inverse .navbar-toggle:hover, +.navbar-inverse .navbar-toggle:focus { + background-color: @ms2-color-primary; +} +.navbar-inverse .navbar-toggle .icon-bar { + background-color: @ms2-color-background; +} +.navbar-inverse .navbar-collapse, +.navbar-inverse .navbar-form { + border-color: @ms2-color-primary-hover; +} +.navbar-inverse .navbar-nav > .open > a, +.navbar-inverse .navbar-nav > .open > a:hover, +.navbar-inverse .navbar-nav > .open > a:focus { + background-color: @ms2-color-primary-hover; + color: @ms2-color-text-primary; +} +@media (max-width: 767px) { + .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header { + border-color: @ms2-color-primary-hover; + } + .navbar-inverse .navbar-nav .open .dropdown-menu .divider { + background-color: @ms2-color-primary-hover; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > li > a { + color: @ms2-color-text-primary; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, + .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus { + color: @ms2-color-text-primary; + background-color: @ms2-color-primary-hover; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, + .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, + .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus { + color: @ms2-color-text-primary; + background-color: @ms2-color-primary; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, + .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, + .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus { + color: @ms2-color-text; + background-color: transparent; + } +} +.navbar-inverse .navbar-link { + color: @ms2-color-text; +} +.navbar-inverse .navbar-link:hover { + color: @ms2-color-text-primary; +} +.breadcrumb { + padding: 6px padding-base-horizontal; + margin-bottom: 20px; + list-style: none; + background-color: @ms2-color-shade-lighter; + border-radius: 0px; + border: 1px solid @ms2-color-primary-light; +} +.breadcrumb > li { + display: inline-block; +} +.breadcrumb > li + li:before { + content: "/\00a0"; + padding: 0 5px; + color: @ms2-color-text; +} +.breadcrumb > .active { + color: @ms2-color-text; +} +.pagination { + display: inline-block; + padding-left: 0; + margin: 20px 0; + border-radius: 0; +} +.pagination > li { + display: inline; +} +.pagination > li > a, +.pagination > li > span { + position: relative; + float: left; + padding:12px; + line-height: 1.428571429; + text-decoration: none; + color: @ms2-color-primary; + background-color: @ms2-color-background; + border: 1px solid @ms2-color-shade-lighter; + margin-left: -1px; +} +.pagination > li:first-child > a, +.pagination > li:first-child > span { + margin-left: 0; + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} +.pagination > li:last-child > a, +.pagination > li:last-child > span { + border-bottom-right-radius: 0; + border-top-right-radius: 0; +} +.pagination > li > a:hover, +.pagination > li > span:hover, +.pagination > li > a:focus, +.pagination > li > span:focus { + color: @ms2-color-text; + background-color: @ms2-color-shade-lighter; + border-color: @ms2-color-shade-lighter; +} +.pagination > .active > a, +.pagination > .active > span, +.pagination > .active > a:hover, +.pagination > .active > span:hover, +.pagination > .active > a:focus, +.pagination > .active > span:focus { + z-index: 2; + color: @ms2-color-text-primary; + background-color: @ms2-color-primary; + border-color: @ms2-color-primary; + cursor: default; +} +.pagination > .disabled > span, +.pagination > .disabled > span:hover, +.pagination > .disabled > span:focus, +.pagination > .disabled > a, +.pagination > .disabled > a:hover, +.pagination > .disabled > a:focus { + color: @ms2-color-text; + background-color: @ms2-color-background; + border-color: @ms2-color-shade-lighter; + cursor: not-allowed; +} +.pagination-lg > li > a, +.pagination-lg > li > span { + padding: 10px 16px; + font-size: 18px; +} +.pagination-lg > li:first-child > a, +.pagination-lg > li:first-child > span { + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} +.pagination-lg > li:last-child > a, +.pagination-lg > li:last-child > span { + border-bottom-right-radius: 0; + border-top-right-radius: 0; +} +.pagination-sm > li > a, +.pagination-sm > li > span { + padding: 5px 10px; + font-size: 12px; +} +.pagination-sm > li:first-child > a, +.pagination-sm > li:first-child > span { + border-bottom-left-radius: ; + border-top-left-radius: ; +} +.pagination-sm > li:last-child > a, +.pagination-sm > li:last-child > span { + border-bottom-right-radius: ; + border-top-right-radius: ; +} +.pager { + padding-left: 0; + margin: 20px 0; + list-style: none; + text-align: center; +} +.pager li { + display: inline; +} +.pager li > a, +.pager li > span { + display: inline-block; + padding: 6px 12px; + border: 1px solid @ms2-color-primary; + border-radius: 0px; +} +.pager li > a:hover, +.pager li > a:focus { + text-decoration: none; + border-color: @ms2-color-primary-hover; +} + +.pager .next > a, +.pager .next > span { + float: right; +} +.pager .previous > a, +.pager .previous > span { + float: left; +} +.pager .disabled > a, +.pager .disabled > a:hover, +.pager .disabled > a:focus, +.pager .disabled > span { + color: @ms2-color-text; + background-color: @ms2-color-background; + cursor: not-allowed; +} +.label { + display: inline; + padding: .2em .6em .3em; + font-size: 75%; + line-height: 1; + color: @ms2-color-text-primary; + text-align: center; + white-space: nowrap; + vertical-align: baseline; + border-radius: 0px; +} +.label[href]:hover, +.label[href]:focus { + color: @ms2-color-text-primary; + text-decoration: none; + cursor: pointer; +} +.label:empty { + display: none; +} +.btn .label { + position: relative; + top: -1px; +} +.label-default { + color: @ms2-color-text; + background-color: @ms2-color-info; +} +.label-default[href]:hover, +.label-default[href]:focus { + background-color: @ms2-color-shade-dark; +} +.label-primary { + background-color: @ms2-color-primary; +} +.label-primary[href]:hover, +.label-primary[href]:focus { + background-color: @ms2-color-primary-hover; +} +.label-success { + background-color: @ms2-color-success; +} +.label-success[href]:hover, +.label-success[href]:focus { + background-color: @ms2-color-success-hover; +} +.label-info { + background-color: @ms2-color-info; +} +.label-info[href]:hover, +.label-info[href]:focus { + background-color: @ms2-color-info-hover; +} +.label-warning { + background-color: @ms2-color-warning; +} +.label-warning[href]:hover, +.label-warning[href]:focus { + background-color: @ms2-color-warning-hover; +} +.label-danger { + background-color: @ms2-color-danger; +} +.label-danger[href]:hover, +.label-danger[href]:focus { + background-color: @ms2-color-danger-hover; +} +.badge { + display: inline-block; + min-width: 10px; + padding: 3px 7px; + font-size: 12px; + font-weight: bold; + color: @ms2-color-text-primary; + line-height: 1; + vertical-align: baseline; + white-space: nowrap; + text-align: center; + background-color: @ms2-color-shade-light; +} +.badge:empty { + display: none; +} +.btn .badge { + position: relative; + top: -1px; +} +.btn-xs .badge { + top: 0; + padding: 1px 5px; +} +a.badge:hover, +a.badge:focus { + color: @ms2-color-text-primary; + text-decoration: none; + cursor: pointer; +} +a.list-group-item.active > .badge, +.nav-pills > .active > a > .badge { + color: @ms2-color-primary; + background-color: @ms2-color-background; +} +.nav-pills > li > a > .badge { + margin-left: 3px; +} +.jumbotron { + padding: 30px; + margin-bottom: 30px; + color: inherit; + background-color: @ms2-color-shade-lighter; +} +.jumbotron h1, +.jumbotron .h1 { + color: inherit; +} +.jumbotron p { + margin-bottom: 15px; + font-size: 21px; + font-weight: 200; +} +.container .jumbotron { + border-radius: 0; +} +.jumbotron .container { + max-width: 100%; +} +@media screen and (min-width: 768px) { + .jumbotron { + padding-top: 48px; + padding-bottom: 48px; + } + .container .jumbotron { + padding-left: 60px; + padding-right: 60px; + } + .jumbotron h1, + .jumbotron .h1 { + font-size: 63px; + } +} +.thumbnail { + display: block; + padding: 4px; + margin-bottom: 20px; + line-height: 1.428571429; + background-color: @ms2-color-background; + border: 1px solid @ms2-color-shade-lighter; + border-radius: 0px; + -webkit-transition: all 0.2s ease-in-out; + transition: all 0.2s ease-in-out; +} +.thumbnail > img, +.thumbnail a > img { + margin-left: auto; + margin-right: auto; +} +a.thumbnail:hover, +a.thumbnail:focus, +a.thumbnail.active { + border-color: @ms2-color-primary; +} +.thumbnail .caption { + padding: 9px; + color: @ms2-color-text; +} +.alert { + padding: 15px; + margin-bottom: 20px; + border: 1px solid transparent; + border-radius: 0px; +} +.alert h4 { + margin-top: 0; + color: inherit; +} +.alert .alert-link { + font-weight: bold; +} +.alert > p, +.alert > ul { + margin-bottom: 0; +} +.alert > p + p { + margin-top: 5px; +} +.alert-dismissable { + padding-right: 35px; +} +.alert-dismissable .close { + position: relative; + top: -2px; + right: -21px; + color: inherit; +} + + +.alert-success { + background-color: @ms2-color-success-hover; + border-color: @ms2-color-success-hover; + color: @ms2-color-success; +} +.alert-success hr { + border-top-color: @ms2-color-success-hover; +} +.alert-success .alert-link { + color: @ms2-color-success; +} + + +.alert-info { + background-color: @ms2-color-info-light; + border-color: @ms2-color-info-hover; + color: @ms2-color-info; +} +.alert-info hr { + border-top-color: @ms2-color-info-light; +} +.alert-info .alert-link { + color: @ms2-color-info; +} + + +.alert-warning { + background-color: @ms2-color-warning-light; + border-color: @ms2-color-warning-hover; + color: @ms2-color-warning; +} +.alert-warning hr { + border-top-color: @ms2-color-warning-light; +} +.alert-warning .alert-link { + color: @ms2-color-warning; +} + + +.alert-danger { + background-color: @ms2-color-danger-light; + border-color: @ms2-color-danger-hover; + color: @ms2-color-danger; +} +.alert-danger hr { + border-top-color: @ms2-color-danger-light; +} +.alert-danger .alert-link { + color: @ms2-color-danger; +} + +@-webkit-keyframes progress-bar-stripes { + from { + background-position: 40px 0; + } + to { + background-position: 0 0; + } +} +@keyframes progress-bar-stripes { + from { + background-position: 40px 0; + } + to { + background-position: 0 0; + } +} +.progress { + overflow: hidden; + height: 20px; + margin-bottom: 20px; + background-color: @ms2-color-shade-lighter; + border-radius: 0px; + -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); +} +.progress-bar { + float: left; + width: 0%; + height: 100%; + font-size: 12px; + line-height: 20px; + color: @ms2-color-text-primary; + text-align: center; + background-color: @ms2-color-primary; + -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); + box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); + -webkit-transition: width 0.6s ease; + transition: width 0.6s ease; +} +.progress-striped .progress-bar { + background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + background-size: 40px 40px; +} +.progress.active .progress-bar { + -webkit-animation: progress-bar-stripes 2s linear infinite; + animation: progress-bar-stripes 2s linear infinite; +} +.progress-bar-success { + background-color: @ms2-color-success; +} +.progress-striped .progress-bar-success { + background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); +} +.progress-bar-info { + background-color: @ms2-color-info; +} +.progress-striped .progress-bar-info { + background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); +} +.progress-bar-warning { + background-color: @ms2-color-warning; +} +.progress-striped .progress-bar-warning { + background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); +} +.progress-bar-danger { + background-color: @ms2-color-danger; +} +.progress-striped .progress-bar-danger { + background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); +} +.media, +.media-body { + overflow: hidden; + zoom: 1; +} +.media, +.media .media { + margin-top: 15px; +} +.media:first-child { + margin-top: 0; +} +.media-object { + display: block; +} +.media-heading { + margin: 0 0 5px; +} +.media > .pull-left { + margin-right: 10px; +} +.media > .pull-right { + margin-left: 10px; +} +.media-list { + padding-left: 0; + list-style: none; +} +.list-group { + margin-bottom:; + padding-left: ; + border-radius:; +} + +.list-group ul { + list-style: none; + padding: 0; +} + +.list-group-item { + position: relative; + display: block; + padding: 10px 15px; + margin-bottom: 0; + background-color: @ms2-color-background; + border-radius: 0; +} + +.list-group-item:first-child { + border-top-right-radius: 0; + border-top-left-radius: 0; +} +.list-group-item:last-child { + margin-bottom: 0; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.list-group-item > .badge { + float: right; +} +.list-group-item > .badge + .badge { + margin-right: 5px; +} +a.list-group-item { + color: @ms2-color-text; + transition: all 0.2s ease-in; + -webkit-transition:all 0.2s ease-in; + -moz-transition:all 0.2s ease-in; + -o-transition:all 0.2s ease-in; + +} +a.list-group-item .list-group-item-heading { + color: @ms2-color-text; +} +a.list-group-item:hover, +a.list-group-item:focus { + text-decoration: none; + background-color: @ms2-color-shade-lighter; +} +a.list-group-item.active, +a.list-group-item.active:hover, +a.list-group-item.active:focus { + z-index: 2; + color: @ms2-color-text-primary; + background-color: @ms2-color-primary; + border-color: @ms2-color-primary; +} +a.list-group-item.active .list-group-item-heading, +a.list-group-item.active:hover .list-group-item-heading, +a.list-group-item.active:focus .list-group-item-heading { + color: inherit; +} +a.list-group-item.active .list-group-item-text, +a.list-group-item.active:hover .list-group-item-text, +a.list-group-item.active:focus .list-group-item-text { + color: @ms2-color-primary-light; +} + + +.list-group-item-success { + color: @ms2-color-success-hover; +} +a.list-group-item-success { + color: @ms2-color-success-hover; +} +a.list-group-item-success .list-group-item-heading { + color: inherit; +} +a.list-group-item-success:hover, +a.list-group-item-success:focus { + color: @ms2-color-success; + background-color:@ms2-color-success-hover; +} +a.list-group-item-success.active, +a.list-group-item-success.active:hover, +a.list-group-item-success.active:focus { + color: @ms2-color-success; + background-color: @ms2-color-success-hover; +} + + +.list-group-item-info { + color: @ms2-color-info-hover; +} +a.list-group-item-info { + color: @ms2-color-info-hover; +} +a.list-group-item-info .list-group-item-heading { + color: inherit; +} +a.list-group-item-info:hover, +a.list-group-item-info:focus { + color: @ms2-color-info; + background-color: @ms2-color-info-light; +} +a.list-group-item-info.active, +a.list-group-item-info.active:hover, +a.list-group-item-info.active:focus { + color: @ms2-color-info; + background-color: @ms2-color-info-light; +} + + +.list-group-item-warning { + color: @ms2-color-warning-hover; +} +a.list-group-item-warning { + color: @ms2-color-warning-hover; +} +a.list-group-item-warning .list-group-item-heading { + color: inherit; +} +a.list-group-item-warning:hover, +a.list-group-item-warning:focus { + color: @ms2-color-warning; + background-color: @ms2-color-warning-light; +} +a.list-group-item-warning.active, +a.list-group-item-warning.active:hover, +a.list-group-item-warning.active:focus { + color: @ms2-color-warning; + background-color: @ms2-color-warning-light; +} + + +.list-group-item-danger { + color: @ms2-color-danger-hover; +} +a.list-group-item-danger { + color: @ms2-color-danger-hover; +} +a.list-group-item-danger .list-group-item-heading { + color: inherit; +} +a.list-group-item-danger:hover, +a.list-group-item-danger:focus { + color: @ms2-color-danger; + background-color: @ms2-color-danger-light; +} +a.list-group-item-danger.active, +a.list-group-item-danger.active:hover, +a.list-group-item-danger.active:focus { + color: @ms2-color-danger; + background-color: @ms2-color-danger-light; +} + + +.list-group-item-heading { + margin-top: 0; + margin-bottom: 5px; +} +.list-group-item-text { + margin-bottom: 0; + line-height: 1.3; +} +.panel { + margin-bottom: 20px; + background-color: @ms2-color-background; + border: 1px solid transparent; + border-radius: 0; + -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); +} +.panel-body { + padding: 15px; +} +.panel-heading { + padding: 10px 15px; + border-bottom: 1px solid transparent; + border-top-right-radius: -1; + border-top-left-radius: -1; +} +.panel-heading > .dropdown .dropdown-toggle { + color: inherit; +} +.panel-title { + margin-top: 0; + margin-bottom: 0; + font-size: @font-size-base; + color: inherit; +} +.panel-title > a { + color: @ms2-color-text; +} +.panel-footer { + padding: 10px 15px; + background-color: @ms2-color-shade-lighter; + border-top: 1px solid @ms2-color-shade-light; + border-bottom-right-radius: -1; + border-bottom-left-radius: -1; +} +.panel > .list-group { + margin-bottom: 0; +} +.panel > .list-group .list-group-item { + border-width: 1px 0; + border-radius: 0px; +} +.panel > .list-group .list-group-item:first-child { + border-top: 0; +} +.panel > .list-group .list-group-item:last-child { + border-bottom: 0; +} +.panel > .list-group:first-child .list-group-item:first-child { + border-top-right-radius: -1; + border-top-left-radius: -1; +} +.panel > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: -1; + border-bottom-left-radius: -1; +} +.panel-heading + .list-group .list-group-item:first-child { + border-top-width: 0; +} +.panel > .table, +.panel > .table-responsive > .table { + margin-bottom: 0; +} +.panel > .table:first-child > thead:first-child > tr:first-child td:first-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child, +.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child, +.panel > .table:first-child > thead:first-child > tr:first-child th:first-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child, +.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child { + border-top-left-radius: -1; +} +.panel > .table:first-child > thead:first-child > tr:first-child td:last-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child, +.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child, +.panel > .table:first-child > thead:first-child > tr:first-child th:last-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child, +.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child { + border-top-right-radius: -1; +} +.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child, +.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child { + border-bottom-left-radius: -1; +} +.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child, +.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child { + border-bottom-right-radius: -1; +} +.panel > .panel-body + .table, +.panel > .panel-body + .table-responsive { + border-top: 1px solid @ms2-color-shade-lighter; +} +.panel > .table > tbody:first-child > tr:first-child th, +.panel > .table > tbody:first-child > tr:first-child td { + border-top: 0; +} +.panel > .table-bordered, +.panel > .table-responsive > .table-bordered { + border: 0; +} +.panel > .table-bordered > thead > tr > th:first-child, +.panel > .table-responsive > .table-bordered > thead > tr > th:first-child, +.panel > .table-bordered > tbody > tr > th:first-child, +.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child, +.panel > .table-bordered > tfoot > tr > th:first-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child, +.panel > .table-bordered > thead > tr > td:first-child, +.panel > .table-responsive > .table-bordered > thead > tr > td:first-child, +.panel > .table-bordered > tbody > tr > td:first-child, +.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child, +.panel > .table-bordered > tfoot > tr > td:first-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child { + border-left: 0; +} +.panel > .table-bordered > thead > tr > th:last-child, +.panel > .table-responsive > .table-bordered > thead > tr > th:last-child, +.panel > .table-bordered > tbody > tr > th:last-child, +.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child, +.panel > .table-bordered > tfoot > tr > th:last-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child, +.panel > .table-bordered > thead > tr > td:last-child, +.panel > .table-responsive > .table-bordered > thead > tr > td:last-child, +.panel > .table-bordered > tbody > tr > td:last-child, +.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child, +.panel > .table-bordered > tfoot > tr > td:last-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child { + border-right: 0; +} +.panel > .table-bordered > thead > tr:first-child > td, +.panel > .table-responsive > .table-bordered > thead > tr:first-child > td, +.panel > .table-bordered > tbody > tr:first-child > td, +.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td, +.panel > .table-bordered > thead > tr:first-child > th, +.panel > .table-responsive > .table-bordered > thead > tr:first-child > th, +.panel > .table-bordered > tbody > tr:first-child > th, +.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th { + border-bottom: 0; +} +.panel > .table-bordered > tbody > tr:last-child > td, +.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td, +.panel > .table-bordered > tfoot > tr:last-child > td, +.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td, +.panel > .table-bordered > tbody > tr:last-child > th, +.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th, +.panel > .table-bordered > tfoot > tr:last-child > th, +.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th { + border-bottom: 0; +} +.panel > .table-responsive { + border: 0; + margin-bottom: 0; +} +.panel-group { + margin-bottom: 20px; +} +.panel-group .panel { + margin-bottom: 0; + border-radius: 0px; + overflow: hidden; +} +.panel-group .panel + .panel { + margin-top: 5px; +} +.panel-group .panel-heading { + border-bottom: 0; +} +.panel-group .panel-heading + .panel-collapse .panel-body { + border-top: 1px solid @ms2-color-shade-light; +} +.panel-group .panel-footer { + border-top: 0; +} +.panel-group .panel-footer + .panel-collapse .panel-body { + border-bottom: 1px solid @ms2-color-shade-light; +} +.panel-default { + border-color: @ms2-color-shade-lighter; +} +.panel-default > .panel-heading { + color: @ms2-color-text-primary; + background-color: @ms2-color-shade-light; + border-color: @ms2-color-shade-lighter; +} +.panel-default > .panel-heading + .panel-collapse .panel-body { + border-top-color: @ms2-color-shade-light; +} +.panel-default > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: @ms2-color-shade-light; +} +.panel-primary { + border-color: @ms2-color-primary; +} +.panel-primary > .panel-heading { + color: @ms2-color-text-primary; + background-color:@ms2-color-primary; + border-color: @ms2-color-primary; +} +.panel-primary > .panel-heading + .panel-collapse .panel-body { + border-top-color: @ms2-color-primary; +} +.panel-primary > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: @ms2-color-primary; +} +.panel-success { + border-color: @ms2-color-success; +} +.panel-success > .panel-heading { + color: @ms2-color-text-primary; + background-color:@ms2-color-success; + border-color: @ms2-color-success; +} +.panel-success > .panel-heading + .panel-collapse .panel-body { + border-top-color: @ms2-color-success-hover; +} +.panel-success > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: @ms2-color-success-hover; +} +.panel-info { + border-color: @ms2-color-info; +} +.panel-info > .panel-heading { + color: @ms2-color-text-primary; + background-color:@ms2-color-info; + border-color: @ms2-color-info; +} +.panel-info > .panel-heading + .panel-collapse .panel-body { + border-top-color: @ms2-color-info-light; +} +.panel-info > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: @ms2-color-info-light; +} +.panel-warning { + border-color: @ms2-color-warning; +} +.panel-warning > .panel-heading { + color: @ms2-color-text-primary; + background-color:@ms2-color-warning; + border-color: @ms2-color-warning; +} +.panel-warning > .panel-heading + .panel-collapse .panel-body { + border-top-color: @ms2-color-warning-light; +} +.panel-warning > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: @ms2-color-warning-light; +} +.panel-danger { + border-color: @ms2-color-danger; +} +.panel-danger > .panel-heading { + color: @ms2-color-text-primary; + background-color:@ms2-color-danger; + border-color: @ms2-color-danger; +} +.panel-danger > .panel-heading + .panel-collapse .panel-body { + border-top-color: @ms2-color-danger-light; +} +.panel-danger > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: @ms2-color-danger-light; +} +.well { + min-height: 20px; + padding: 19px; + margin-bottom: 20px; + background-color: @ms2-color-shade-lighter; + border: 1px solid @ms2-color-shade; + border-radius: 0px; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); +} +.well blockquote { + border-color: @ms2-color-shade-lighter; + border-color: rgba(0, 0, 0, 0.15); +} +.well-lg { + padding: 24px; + border-radius: 0px; +} +.well-sm { + padding: 9px; + border-radius: 0px ; +} + +.close { + position:absolute; + right: 15px; + top: 10px; + background-color: @ms2-color-danger; + color: @ms2-color-text-primary; + border:none; + transition: all 0.2s ease-in; + -webkit-transition:all 0.2s ease-in; + -moz-transition:all 0.2s ease-in; + -o-transition:all 0.2s ease-in; +} + +.close:hover, +.close:focus { + text-decoration: none; + cursor: pointer; + color: @ms2-color-primary-light; +} + +button.close { + cursor: pointer; + background: transparent; + -webkit-appearance: none; +} +.modal-open { + overflow: hidden; +} + +.modal { + display: none; + overflow: auto; + overflow-y: auto; + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1050; + -webkit-overflow-scrolling: touch; + outline: 0; +} + +.modal.fade .modal-dialog { + -webkit-transform: translate(0, -25%); + -ms-transform: translate(0, -25%); + transform: translate(0, -25%); + -webkit-transition: -webkit-transform 0.3s ease-out; + -moz-transition: -moz-transform 0.3s ease-out; + -o-transition: -o-transform 0.3s ease-out; + transition: transform 0.3s ease-out; +} +.modal.in .modal-dialog { + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); +} +.modal-dialog { + position: relative; + width: auto; + margin:auto; + background-color: @ms2-color-background; +} +.modal-content { + position: relative; + background-color: @ms2-color-background; + border-radius: 0; + background-clip: padding-box; + outline: none; +} +.modal-backdrop { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1040; + background-color: @ms2-color-shade-darker; +} +.modal-backdrop.fade { + opacity: 0; + filter: alpha(opacity=0); +} +.modal-backdrop.in { + opacity: 0.5; + filter: alpha(opacity=50); +} +.modal-header { + background-color:@ms2-color-primary; + color: @ms2-color-text-primary; + padding:10px 15px; +} + +.modal-title { + margin: 0; + +} +.modal-body { + position: relative; +} +.modal-footer { + margin-top: 15px; + padding: 19px 20px 20px; + text-align: right; + border-top: 1px solid gray-light; + background-color:@ms2-color-background; +} +.modal-footer .btn + .btn { + margin-left: 5px; + margin-bottom: 0; +} +.modal-footer .btn-group .btn + .btn { + margin-left: -1px; +} +.modal-footer .btn-block + .btn-block { + margin-left: 0; +} + +.modal-dialog { + width: 290px; +} + +@media (min-width: 768px) { + .modal-dialog { + width: 290px; + margin: auto; + margin-top: 150px; + } + .modal-sm { + width: 300px; + } +} +@media (min-width: 992px) { + .modal-lg { + width: 900px; + } +} + +.popover { + position: absolute; + top: 0; + left: 0; + z-index: 1010; + display: none; + max-width: 276px; + padding: 1px; + text-align: left; + background-color: @ms2-color-background; + background-clip: padding-box; + border: 1px solid @ms2-color-shade-light; + border: 1px solid rgba(0, 0, 0, 0.2); + border-radius: 0; + -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); + box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); + white-space: normal; +} +.popover.top { + margin-top: -10px; +} +.popover.right { + margin-left: 10px; +} +.popover.bottom { + margin-top: 10px; +} +.popover.left { + margin-left: -10px; +} +.popover-title { + margin: 0; + padding: 8px 14px; + font-size: @font-size-base; + font-weight: normal; + line-height: 18px; + background-color: @ms2-color-shade-lighter; + border-bottom: 1px solid @ms2-color-shade-light; +} +.popover-content { + padding: 9px 14px; +} +.popover > .arrow, +.popover > .arrow:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.popover > .arrow { + border-width: 11px; +} +.popover > .arrow:after { + border-width: 10px; + content: ""; +} +.popover.top > .arrow { + left: 50%; + margin-left: -11px; + border-bottom-width: 0; + border-top-color: @ms2-color-shade-light; + border-top-color: rgba(0, 0, 0, 0.25); + bottom: -11px; +} +.popover.top > .arrow:after { + content: " "; + bottom: 1px; + margin-left: -10px; + border-bottom-width: 0; + border-top-color: @ms2-color-background; +} +.popover.right > .arrow { + top: 50%; + left: -11px; + margin-top: -11px; + border-left-width: 0; + border-right-color: @ms2-color-shade-light; + border-right-color: rgba(0, 0, 0, 0.25); +} +.popover.right > .arrow:after { + content: " "; + left: 1px; + bottom: -10px; + border-left-width: 0; + border-right-color: @ms2-color-background; +} +.popover.bottom > .arrow { + left: 50%; + margin-left: -11px; + border-top-width: 0; + border-bottom-color: @ms2-color-shade-light; + border-bottom-color: rgba(0, 0, 0, 0.25); + top: -11px; +} +.popover.bottom > .arrow:after { + content: " "; + top: 1px; + margin-left: -10px; + border-top-width: 0; + border-bottom-color: @ms2-color-background; +} +.popover.left > .arrow { + top: 50%; + right: -11px; + margin-top: -11px; + border-right-width: 0; + border-left-color: @ms2-color-shade-light; + border-left-color: rgba(0, 0, 0, 0.25); +} +.popover.left > .arrow:after { + content: " "; + right: 1px; + border-right-width: 0; + border-left-color: @ms2-color-background; + bottom: -10px; +} + +.clearfix:before, +.clearfix:after, +.container:before, +.container:after, +.container-fluid:before, +.container-fluid:after, +.row:before, +.row:after, +.form-horizontal .form-group:before, +.form-horizontal .form-group:after, +.btn-toolbar:before, +.btn-toolbar:after, +.btn-group-vertical > .btn-group:before, +.btn-group-vertical > .btn-group:after, +.nav:before, +.nav:after, +.navbar:before, +.navbar:after, +.navbar-header:before, +.navbar-header:after, +.navbar-collapse:before, +.navbar-collapse:after, +.pager:before, +.pager:after, +.panel-body:before, +.panel-body:after, +.modal-footer:before, +.modal-footer:after { + content: " "; + display: table; +} +.clearfix:after, +.container:after, +.container-fluid:after, +.row:after, +.form-horizontal .form-group:after, +.btn-toolbar:after, +.btn-group-vertical > .btn-group:after, +.nav:after, +.navbar:after, +.navbar-header:after, +.navbar-collapse:after, +.pager:after, +.panel-body:after, +.modal-footer:after { + clear: both; +} +.center-block { + display: block; + margin-left: auto; + margin-right: auto; +} +.pull-right { + float: right !important; +} +.pull-left { + float: left !important; +} +.hide { + display: none !important; +} +.show { + display: block !important; +} +.invisible { + visibility: hidden; +} +.text-hide { + font: 0/0 a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0; +} +.hidden { + display: none !important; + visibility: hidden !important; +} +.affix { + position: fixed; +} +@-ms-viewport { + width: device-width; +} +.visible-xs, +.visible-sm, +.visible-md, +.visible-lg { + display: none !important; +} +@media (max-width: 767px) { + .visible-xs { + display: block !important; + } + table.visible-xs { + display: table; + } + tr.visible-xs { + display: table-row !important; + } + th.visible-xs, + td.visible-xs { + display: table-cell !important; + } +} +@media (min-width: 768px) and (max-width: 991px) { + .visible-sm { + display: block !important; + } + table.visible-sm { + display: table; + } + tr.visible-sm { + display: table-row !important; + } + th.visible-sm, + td.visible-sm { + display: table-cell !important; + } +} +@media (min-width: 992px) and (max-width: 1199px) { + .visible-md { + display: block !important; + } + table.visible-md { + display: table; + } + tr.visible-md { + display: table-row !important; + } + th.visible-md, + td.visible-md { + display: table-cell !important; + } +} +@media (min-width: 1200px) { + .visible-lg { + display: block !important; + } + table.visible-lg { + display: table; + } + tr.visible-lg { + display: table-row !important; + } + th.visible-lg, + td.visible-lg { + display: table-cell !important; + } +} +@media (max-width: 767px) { + .hidden-xs { + display: none !important; + } +} +@media (min-width: 768px) and (max-width: 991px) { + .hidden-sm { + display: none !important; + } +} +@media (min-width: 992px) and (max-width: 1199px) { + .hidden-md { + display: none !important; + } +} +@media (min-width: 1200px) { + .hidden-lg { + display: none !important; + } +} +.visible-print { + display: none !important; +} +@media print { + .visible-print { + display: block !important; + } + table.visible-print { + display: table; + } + tr.visible-print { + display: table-row !important; + } + th.visible-print, + td.visible-print { + display: table-cell !important; + } +} +@media print { + .hidden-print { + display: none !important; + } +} diff --git a/web/client/themes/default/icons.less b/web/client/themes/default/icons.less new file mode 100644 index 0000000000..2452ef45a2 --- /dev/null +++ b/web/client/themes/default/icons.less @@ -0,0 +1,717 @@ +@charset "UTF-8"; + +@font-face { + font-family: "mapstore2"; + src:url("../default/icons/icons.eot"); + src:url("../default/icons/icons.eot?#iefix") format("embedded-opentype"), + url("../default/icons/icons.woff") format("woff"), + url("../default/icons/icons.ttf") format("truetype"), + url("../default/icons/icons.svg#mapstore2") format("svg"); + font-weight: normal; + font-style: normal; +} + +[data-icon]:before { + font-family: "mapstore2" !important; + content: attr(data-icon); + font-style: normal !important; + font-weight: normal !important; + font-variant: normal !important; + text-transform: none !important; + speak: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +[class^="glyphicon-"]:before, +[class*=" glyphicon-"]:before { + font-family: "mapstore2" !important; + font-style: normal !important; + font-weight: normal !important; + font-variant: normal !important; + text-transform: none !important; + speak: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.glyphicon-1-bearing:before { + content: "\006c"; +} +.glyphicon-1-bring-down:before { + content: "\006e"; +} +.glyphicon-1-bring-up:before { + content: "\006d"; +} +.glyphicon-1-close:before { + content: "\0055"; +} +.glyphicon-1-compass:before { + content: "\005c"; +} +.glyphicon-1-compass-alt:before { + content: "\005b"; +} +.glyphicon-1-drag:before { + content: "\0070"; +} +.glyphicon-1-group:before { + content: "\0045"; +} +.glyphicon-1-group-add:before { + content: "\0047"; +} +.glyphicon-1-group-cancel:before { + content: "\0048"; +} +.glyphicon-1-group-mod:before { + content: "\0046"; +} +.glyphicon-1-layer:before { + content: "\004e"; +} +.glyphicon-1-line:before { + content: "\004f"; +} +.glyphicon-1-map:before { + content: "\0049"; +} +.glyphicon-1-mark:before { + content: "\0050"; +} +.glyphicon-1-mark-alt:before { + content: "\0051"; +} +.glyphicon-1-measure-area:before { + content: "\0071"; +} +.glyphicon-1-measure-lenght:before { + content: "\0072"; +} +.glyphicon-1-measure-path:before { + content: "\0073"; +} +.glyphicon-menu-hamburger:before { + content: "\0052"; +} +.glyphicon-1-menu-manage:before { + content: "\0053"; +} +.glyphicon-option-horizontal:before { + content: "\e234"; +} +.glyphicon-1-pdf:before { + content: "\004a"; +} +.glyphicon-1-point:before { + content: "\0074"; +} +.glyphicon-1-poligon:before { + content: "\0075"; +} +.glyphicon-1-position-1:before { + content: "\0054"; +} +.glyphicon-1-screen-backward:before { + content: "\0059"; +} +.glyphicon-1-screen-forward:before { + content: "\005a"; +} +.glyphicon-1-social-fb:before { + content: "\0056"; +} +.glyphicon-1-social-tw:before { + content: "\0057"; +} +.glyphicon-1-stilo:before { + content: "\0058"; +} +.glyphicon-1-time-user:before { + content: "\0041"; +} +.glyphicon-1-user-add:before { + content: "\0042"; +} +.glyphicon-1-user-cancel:before { + content: "\0043"; +} +.glyphicon-1-user-mod:before { + content: "\0044"; +} +.glyphicon-1-ruler-alt-2:before { + content: "\0063"; +} +.glyphicon-1-ruler:before { + content: "\005f"; +} +.glyphicon-1-ruler-alt:before { + content: "\0060"; +} +.glyphicon-1-set-squadre:before { + content: "\0061"; +} +.glyphicon-1-compass-arrow:before { + content: "\005d"; +} +.glyphicon-1-raster:before { + content: "\005e"; +} +.glyphicon-1-vector:before { + content: "\007c"; +} +.glyphicon-1-vector-alt:before { + content: "\007d"; +} +.glyphicon-1-circle:before { + content: "\0068"; +} +.glyphicon-1-polygon:before { + content: "\0069"; +} +.glyphicon-1-line:before { + content: "\0067"; +} +.glyphicon-1-point:before { + content: "\0076"; +} +.glyphicon-1-circle-dashed:before { + content: "\0065"; +} +.glyphicon-1-polygon-dashed:before { + content: "\0066"; +} +.glyphicon-1-line-dashed:before { + content: "\006b"; +} +.glyphicon-1-point-dashed:before { + content: "\007b"; +} +.glyphicon-1-circle-add:before { + content: "\0077"; +} +.glyphicon-1-polygon-add:before { + content: "\0078"; +} +.glyphicon-1-line-add:before { + content: "\0079"; +} +.glyphicon-1-point-add:before { + content: "\007a"; +} +.glyphicon-align-center:before { + content: "\e053"; +} +.glyphicon-align-justify:before { + content: "\e055"; +} +.glyphicon-align-left:before { + content: "\e052"; +} +.glyphicon-align-right:before { + content: "\e054"; +} +.glyphicon-asterisk:before { + content: "\002a"; +} +.glyphicon-arrow-down:before { + content: "\e094"; +} +.glyphicon-arrow-left:before { + content: "\e091"; +} +.glyphicon-arrow-right:before { + content: "\e092"; +} +.glyphicon-arrow-up:before { + content: "\e093"; +} +.glyphicon-backward:before { + content: "\e071"; +} +.glyphicon-ban-circle:before { + content: "\e090"; +} +.glyphicon-barcode:before { + content: "\e040"; +} +.glyphicon-bold:before { + content: "\e048"; +} +.glyphicon-camera:before { + content: "\e046"; +} +.glyphicon-chevron-down:before { + content: "\e259"; +} +.glyphicon-chevron-left:before { + content: "\e257"; +} +.glyphicon-chevron-right:before { + content: "\e258"; +} +.glyphicon-chevron-up:before { + content: "\e260"; +} +.glyphicon-circle-arrow-down:before { + content: "\e134"; +} +.glyphicon-circle-arrow-left:before { + content: "\e132"; +} +.glyphicon-circle-arrow-right:before { + content: "\e131"; +} +.glyphicon-circle-arrow-up:before { + content: "\e133"; +} +.glyphicon-cloud:before { + content: "\2601"; +} +.glyphicon-cloud-download:before { + content: "\e197"; +} +.glyphicon-cloud-upload:before { + content: "\e198"; +} +.glyphicon-cog:before { + content: "\e019"; +} +.glyphicon-collapse-down:before { + content: "\e159"; +} +.glyphicon-collapse-up:before { + content: "\e160"; +} +.glyphicon-comment:before { + content: "\e111"; +} +.glyphicon-dashboard:before { + content: "\e141"; +} +.glyphicon-download:before { + content: "\e026"; +} +.glyphicon-download-alt:before { + content: "\e166"; +} +.glyphicon-edit:before { + content: "\e065"; +} +.glyphicon-envelope:before { + content: "\2709"; +} +.glyphicon-export:before { + content: "\e170"; +} +.glyphicon-fast-backward:before { + content: "\e070"; +} +.glyphicon-fast-forward:before { + content: "\e076"; +} +.glyphicon-file:before { + content: "\e022"; +} +.glyphicon-filter:before { + content: "\e138"; +} +.glyphicon-flag:before { + content: "\e034"; +} +.glyphicon-flash:before { + content: "\e162"; +} +.glyphicon-floppy-open:before { + content: "\e176"; +} +.glyphicon-floppy-remove:before { + content: "\e174"; +} +.glyphicon-floppy-save:before { + content: "\e175"; +} +.glyphicon-floppy-saved:before { + content: "\e173"; +} +.glyphicon-font:before { + content: "\e047"; +} +.glyphicon-forward:before { + content: "\e075"; +} +.glyphicon-1-full-screen:before { + content: "\e140"; +} +.glyphicon-globe:before { + content: "\e135"; +} +.glyphicon-hand-down:before { + content: "\e130"; +} +.glyphicon-hand-left:before { + content: "\e128"; +} +.glyphicon-hand-right:before { + content: "\e127"; +} +.glyphicon-hand-up:before { + content: "\e129"; +} +.glyphicon-hdd:before { + content: "\e121"; +} +.glyphicon-heart:before { + content: "\e005"; +} +.glyphicon-home:before { + content: "\e021"; +} +.glyphicon-import:before { + content: "\e169"; +} +.glyphicon-inbox:before { + content: "\e028"; +} +.glyphicon-info-sign:before { + content: "\e086"; +} +.glyphicon-italic:before { + content: "\e049"; +} +.glyphicon-leaf:before { + content: "\e103"; +} +.glyphicon-link:before { + content: "\e144"; +} +.glyphicon-list:before { + content: "\e012"; +} +.glyphicon-log-in:before { + content: "\e161"; +} +.glyphicon-log-out:before { + content: "\e163"; +} +.glyphicon-magnet:before { + content: "\e112"; +} +.glyphicon-map-marker:before { + content: "\e062"; +} +.glyphicon-minus:before { + content: "\2212"; +} +.glyphicon-minus-sign:before { + content: "\e082"; +} +.glyphicon-move:before { + content: "\e068"; +} +.glyphicon-new-window:before { + content: "\e164"; +} +.glyphicon-off:before { + content: "\e017"; +} +.glyphicon-ok:before { + content: "\e013"; +} +.glyphicon-ok-circle:before { + content: "\e089"; +} +.glyphicon-ok-sign:before { + content: "\e084"; +} +.glyphicon-open:before { + content: "\e167"; +} +.glyphicon-paperclip:before { + content: "\e142"; +} +.glyphicon-pause:before { + content: "\e073"; +} +.glyphicon-pencil:before { + content: "\270f"; +} +.glyphicon-phone:before { + content: "\e145"; +} +.glyphicon-picture:before { + content: "\e060"; +} +.glyphicon-plane:before { + content: "\e171"; +} +.glyphicon-play:before { + content: "\e072"; +} +.glyphicon-play-circle:before { + content: "\e029"; +} +.glyphicon-plus:before { + content: "\002b"; +} +.glyphicon-plus-sign:before { + content: "\e081"; +} +.glyphicon-print:before { + content: "\e045"; +} +.glyphicon-pushpin:before { + content: "\e146"; +} +.glyphicon-qrcode:before { + content: "\e039"; +} +.glyphicon-question-sign:before { + content: "\e085"; +} +.glyphicon-random:before { + content: "\e110"; +} +.glyphicon-record:before { + content: "\e165"; +} +.glyphicon-refresh:before { + content: "\e031"; +} +.glyphicon-remove:before { + content: "\e014"; +} +.glyphicon-remove-circle:before { + content: "\e088"; +} +.glyphicon-remove-sign:before { + content: "\e083"; +} +.glyphicon-repeat:before { + content: "\e030"; +} +.glyphicon-resize-full:before { + content: "\e096"; +} +.glyphicon-resize-horizontal:before { + content: "\e120"; +} +.glyphicon-resize-small:before { + content: "\e097"; +} +.glyphicon-resize-vertical:before { + content: "\e119"; +} +.glyphicon-retweet:before { + content: "\e115"; +} +.glyphicon-road:before { + content: "\e024"; +} +.glyphicon-save:before { + content: "\e166"; +} +.glyphicon-screenshot:before { + content: "\e087"; +} +.glyphicon-search:before { + content: "\e003"; +} +.glyphicon-send:before { + content: "\e171"; +} +.glyphicon-share:before { + content: "\004c"; +} +.glyphicon-share-alt:before { + content: "\004b"; +} +.glyphicon-shopping-cart:before { + content: "\e116"; +} +.glyphicon-signal:before { + content: "\e018"; +} +.glyphicon-sort:before { + content: "\e150"; +} +.glyphicon-sort-by-alphabet:before { + content: "\e151"; +} +.glyphicon-sort-by-alphabet-alt:before { + content: "\e152"; +} +.glyphicon-sort-by-attributes:before { + content: "\e155"; +} +.glyphicon-sort-by-attributes-alt:before { + content: "\e156"; +} +.glyphicon-star:before { + content: "\e006"; +} +.glyphicon-star-empty:before { + content: "\e007"; +} +.glyphicon-stats:before { + content: "\e185"; +} +.glyphicon-step-backward:before { + content: "\e069"; +} +.glyphicon-step-forward:before { + content: "\e077"; +} +.glyphicon-stop:before { + content: "\e074"; +} +.glyphicon-tag:before { + content: "\e041"; +} +.glyphicon-tags:before { + content: "\e042"; +} +.glyphicon-tasks:before { + content: "\e137"; +} +.glyphicon-text-height:before { + content: "\e050"; +} +.glyphicon-text-width:before { + content: "\e051"; +} +.glyphicon-th-list:before { + content: "\e012"; +} +.glyphicon-thumbs-down:before { + content: "\e126"; +} +.glyphicon-thumbs-up:before { + content: "\e125"; +} +.glyphicon-time:before { + content: "\e023"; +} +.glyphicon-tint:before { + content: "\e064"; +} +.glyphicon-transfer:before { + content: "\e178"; +} +.glyphicon-unchecked:before { + content: "\e157"; +} +.glyphicon-upload:before { + content: "\e027"; +} +.glyphicon-usd:before { + content: "\e148"; +} +.glyphicon-user:before { + content: "\e008"; +} +.glyphicon-warning-sign:before { + content: "\e107"; +} +.glyphicon-wrench:before { + content: "\e136"; +} +.glyphicon-zoom-in:before { + content: "\e015"; +} +.glyphicon-zoom-out:before { + content: "\e016"; +} +.glyphicon-trash:before { + content: "\e020"; +} +.glyphicon-saved:before { + content: "\e168"; +} +.glyphicon-1-catalog:before { + content: "\006a"; +} +.glyphicon-exclamation-sign:before { + content: "\e101"; +} +.glyphicon-expand:before { + content: "\e158"; +} +.glyphicon-lock:before { + content: "\e033"; +} +.glyphicon-list-alt:before { + content: "\e032"; +} +.glyphicon-check:before { + content: "\e067"; +} +.glyphicon-floppy-disk:before { + content: "\e172"; +} +.glyphicon-1-max-size:before { + content: "\004d"; +} +.glyphicon-adjust:before { + content: "\e063"; +} +.glyphicon-calendar:before { + content: "\e109"; +} +.glyphicon-folder-close:before { + content: "\e117"; +} +.glyphicon-folder-open:before { + content: "\e118"; +} +.glyphicon-text-background:before { + content: "\e243"; +} +.glyphicon-scissors:before { + content: "\e226"; +} +.glyphicon-text-colour:before { + content: "\e242"; +} +.glyphicon-paste:before { + content: "\e206"; +} +.glyphicon-level-up:before { + content: "\e204"; +} +.glyphicon-hourglass:before { + content: "\e231b"; +} +.glyphicon-duplicate:before { + content: "\e224"; +} +.glyphicon-copy:before { + content: "\e205"; +} +.glyphicon-compressed:before { + content: "\e181"; +} +.glyphicon-bookmark:before { + content: "\e044"; +} +.glyphicon-book:before { + content: "\e043"; +} +.glyphicon-alert:before { + content: "\e209"; +} +.glyphicon-th:before { + content: "\e011"; +} +.glyphicon-th-large:before { + content: "\e010"; +} +.glyphicon-eye-open:before { + content: "\e105"; +} +.glyphicon-eye-close:before { + content: "\e106"; +} diff --git a/web/client/themes/default/icons/icons.eot b/web/client/themes/default/icons/icons.eot new file mode 100644 index 0000000000..c7ead8ba9c Binary files /dev/null and b/web/client/themes/default/icons/icons.eot differ diff --git a/web/client/themes/default/icons/icons.svg b/web/client/themes/default/icons/icons.svg new file mode 100644 index 0000000000..589ffa8059 --- /dev/null +++ b/web/client/themes/default/icons/icons.svg @@ -0,0 +1,1003 @@ + + + + +Created by FontForge 20161003 at Mon Feb 13 15:08:14 2017 + By www-data +Copyright (c) 2017 by Chef Studio. All rights reserved. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/web/client/themes/default/icons/icons.ttf b/web/client/themes/default/icons/icons.ttf new file mode 100644 index 0000000000..4041edc148 Binary files /dev/null and b/web/client/themes/default/icons/icons.ttf differ diff --git a/web/client/themes/default/icons/icons.woff b/web/client/themes/default/icons/icons.woff new file mode 100644 index 0000000000..6edf76bcb2 Binary files /dev/null and b/web/client/themes/default/icons/icons.woff differ diff --git a/web/client/themes/default/img/toggle.png b/web/client/themes/default/img/toggle.png new file mode 100644 index 0000000000..ce0edd8ff8 Binary files /dev/null and b/web/client/themes/default/img/toggle.png differ diff --git a/web/client/themes/default/img/toggle.svg b/web/client/themes/default/img/toggle.svg new file mode 100644 index 0000000000..75138bd163 --- /dev/null +++ b/web/client/themes/default/img/toggle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/web/client/themes/default/ms2-theme.less b/web/client/themes/default/ms2-theme.less new file mode 100644 index 0000000000..4407527b30 --- /dev/null +++ b/web/client/themes/default/ms2-theme.less @@ -0,0 +1,1010 @@ +button:focus { + outline: 0 !important; +} + +.shadow { + -webkit-box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); + -moz-box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); + box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); +} + +.shadow-soft { + -webkit-box-shadow: -1px 1px 5px 1px rgba(154,154,154,1); + -moz-box-shadow: -1px 1px 5px 1px rgba(154,154,154,1); + box-shadow: -1px 1px 5px 1px rgba(154,154,154,1); +} +/* dropdown-menu */ +.dropdown-menu .dropdown-header { + background-color: @ms2-color-primary; + color: @ms2-color-background; + padding: 15px; + font-weight: bold; +} + +.dropdown-menu .glyphicon { + font-size: @icon-size-md; + margin-right: 15px; + color: @ms2-color-primary; + vertical-align: middle; +} +/* navbar */ +.navbar-dx ul, +ol { + margin-bottom: 0; +} + +.navbar-dx .MapSearchBar .input-group, +.navbar-dx.shadow { + -webkit-box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); + -moz-box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); + box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); +} + +.navbar-dx ul, +ol { + margin-bottom: 0; +} + +.navbar .square-button { + height: @square-btn-size; + width: @square-btn-size; +} + +.nav-menu { + overflow-x: hidden; + overflow-y: hidden; +} + +.nav-content { + position: absolute; + top: 0; + bottom: 0; + width: 100%; + background-color: @ms2-color-background; +} + +.nav-body { + position: absolute; + top: @square-btn-size; + bottom: 0; + overflow: auto; + width: 100%; +} +/* button dividers */ +#mapstore-navbar-container .dropdown-toggle, +#mapstore-navbar-container .square-button { + border-left: 1px solid @ms2-color-info; +} +/* search */ +#mapstore-navbar .navbar-dx .MapSearchBar .input-group { + width: 500px; +} +/* remove default inbox bootstrap shadow on focus for the input */ +div.MapSearchBar .form-control:focus { + box-shadow: none; +} + +div.MapSearchBar .input-group-addon { + height: @square-btn-size; + width: @square-btn-size; + color: @ms2-color-primary; + background-color: @ms2-color-background; + border: 0; + border-radius: 0; + font-size: @icon-size; +} + +.MapSearchBar .input-group-addon .searchclear, +.MapSearchBar .input-group-addon .searcherror { + font-size: @icon-size-md; + margin-right: 4px; +} + +.MapSearchBar .input-group-addon .searcherror { + color: @ms2-color-danger; +} + +#mapstore-navbar .navbar-dx .search-result-list { + top: @square-btn-size + @padding-left-square; +} + +.navbar-dx .MapSearchBar .input-group, +.navbar-dx.shadow { + -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); + -moz-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); + box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); +} + +#mapstore-navbar #helpbadge-null { + position: absolute; + left: -10px; + bottom: -8px; + z-index: 1; +} +@media (max-width: 768px ) { + #mapstore-navbar .search-toggle { + display: inline-block; + } + + #mapstore-navbar .MapSearchBar { + width: 400px; + top: @square-btn-size; + left: auto; + } + + #mapstore-navbar .search-result-list { + top: 85px; + left: auto; + width: 400px; + } +} +/* Small devices (tablets, 768px and up) */ +@media (max-width: 768px ) { + #mapstore-navbar .search-toggle { + display: inline-block; + } + + #mapstore-navbar .navbar-dx .MapSearchBar { + position: fixed; + left: 1px; + right: 1px; + top: @square-btn-size; + width: auto; + } + + #mapstore-navbar .navbar-dx .MapSearchBar .input-group { + width: 100%; + } + + #mapstore-navbar .navbar-dx .search-result-list { + position: fixed; + left: 15px; + right: 15px; + top: 105px; + width: 95%; + } +} +/* Medium devices (desktops, 992px and up) */ +@media (min-width: 992px) { + #mapstore-navbar .MapSearchBar { + width: 500px; + right: auto; + } + + #mapstore-navbar .search-result-list { + width: 500px; + right: auto; + } +} +/* Large devices (large desktops, 1200px and up) */ +@media (min-width: 1200px) { + #mapstore-navbar .MapSearchBar { + width: 500px; + position: absolute; + } + + #mapstore-navbar .search-result-list { + width: 500px; + right: auto; + } +} + +#mapstore-navbar .form-group { + margin-bottom: 0; +} + +#mapstore-navbar .search-result-list { + background-color: @ms2-color-background; +} +/* dropdown */ +.navbar-dx .dropdown-menu .dropdown-header, +.navbar-home .dropdown-menu .dropdown-header { + background-color: @ms2-color-primary; +} + +.navbar-dx .dropdown-menu, +.navbar-home .dropdown-menu { + text-transform: uppercase; +} + +.navbar-dx .dropdown-menu li, +.navbar-home .dropdown-menu li { + border-bottom: 1px solid @ms2-color-background; +} + +.navbar-dx .dropdown-menu li a, +.navbar-home .dropdown-menu li a { + max-height: @square-btn-size; + color: @ms2-color-text; +} + +.navbar-dx .dropdown-menu li a span { + position: relative; +} + +.mapToolbar { + box-shadow: -1px 1px 5px 1px rgba(94,94,94,1); +} +/* button dividers */ +.mapToolbar.btn-group-vertical .btn { + border-bottom: 2px solid @ms2-color-info; +} +/* no divider for the last button */ +.mapToolbar.btn-group-vertical .btn:last-child { + border-bottom: 0; +} + +div#mapstore-globalspinner { + width: @square-btn-size !important; + height: @square-btn-size !important; +} +/* drawer menu */ +#mapstore-drawermenu .glyphicon { + font-size: @icon-size; +} + +#mapstore-drawermenu .navHeader > .glyphicon-1-close { + float: left; + display: block; + height: @square-btn-size; + width: @square-btn-size; + padding: @padding-left-square 0 0 @padding-left-square; +} + +#mapstore-drawermenu .navHeader .glyphicon-remove { + color: @ms2-color-primary; +} + +#mapstore-drawermenu .panel-default > .panel-heading { + color: @ms2-color-primary; + font-weight: bold; + background: transparent; +} +/* nav buttons */ +#mapstore-drawermenu .navButtons .btn.square-button { + font-size: @icon-size; +} + +#mapstore-drawermenu .navButtons .btn.square-button .glyphicon { + font-size: @icon-size; +} +/* toc */ +#mapstore-drawermenu #mapstore-layers .toc-group-title, +#mapstore-drawermenu #mapstore-layers .toc-title { + position: relative; +} +/* visibility check */ +#mapstore-drawermenu #mapstore-layers .glyphicon, +#mapstore-drawermenu #mapstore-layers .visibility-check.glyphicon { + font-size: @icon-size-md; + z-index: 2; +} + +#mapstore-drawermenu #mapstore-layers .visibility-check.glyphicon { + float: left; + font-size: @icon-size-md; + margin-top: 0; +} + +#mapstore-drawermenu #mapstore-layers .toc-default-group > .visibility-check.glyphicon.visibility-check { + color: @ms2-color-primary; + margin: 5px 8px 0 8px; + width: @icon-size-md; + font-size: @icon-size-md; +} +/* group */ +#mapstore-drawermenu #mapstore-layers .group-expanded, +.group-collapsed { + padding: 5px 0; + border-bottom: 1px solid @ms2-color-shade-lighter; +} + +#mapstore-drawermenu #mapstore-layers .toc-group-title { + background: transparent; +} + +#mapstore-drawermenu #mapstore-layers .toc-default-layer .glyphicon { + font-size: @icon-size-md; + margin: 0 4px 0; + color: @ms2-color-primary; + height: @icon-size-md; + width: @icon-size-md; + display: block; +} + +#mapstore-drawermenu #mapstore-layers .toc-group-title .glyphicon-folder-close, +#mapstore-drawermenu #mapstore-layers .toc-group-title .glyphicon-folder-open { + color: @ms2-color-primary; +} + +#mapstore-drawermenu #mapstore-layers .toc-default-group { + border-bottom: 1px solid @ms2-color-shade-lighter; + padding: 5px 0; +} + +#mapstore-drawermenu #mapstore-layers .toc-group-children { + margin-left: 24px; +} +/* layer */ +#mapstore-drawermenu #mapstore-layers .toc-default-layer { + padding: 10px 0; +} + +#mapstore-drawermenu #mapstore-layers .toc-layer-tool { + font-size: 22px; +} + +.toc-default-layer .toc-title { + max-width: 140px; +} + +.toc-default-layer .inline-spinner { + position: relative; + top: -7px; +} +/* measure panel */ +#measure-result-panel .option-text { + font-size: 14px; + text-transform: uppercase; + vertical-align: middle; +} + +#measure-result-panel .option-icon { + font-size: 32px; + text-transform: uppercase; + vertical-align: middle; +} + +#measure-result-panel .glyphicon { + margin-left: 0; + margin-top: 0; +} +/* various */ +.no-border { + border: none; +} + +.no-border:active, +.no-border:active:focus, +.no-border:focus, +.no-border:hover { + box-shadow: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + outline: none; +} + +#mapstore-getfeatureinfo .panel-body { + padding: 0; +} + +#mapstore-getfeatureinfo .panel-heading { + background-color: @ms2-color-background; +} +/* Leaflet minimap style */ +.leaflet-control-minimap { + border: solid @ms2-color-primary 4px !important; +} + +.leaflet-control-minimap a { + background-color: @ms2-color-primary !important; +} + +.leaflet-control-minimap-toggle-display { + background-image: url("../default/img/toggle.svg") !important; +} + +.leaflet-oldie .leaflet-control-minimap-toggle-display { + background-image: url("../default/img/toggle.png") !important; +} +/* OpenLayers minimap style */ +.ol-custom-overviewmap button { + background-color: @ms2-color-primary !important; +} + +.ol-custom-overviewmap .ol-control button:focus, +.ol-custom-overviewmap button:hover { + background-color: @ms2-color-primary !important; +} + +.ol-custom-overviewmap:not(.ol-collapsed) { + background: @ms2-color-primary !important; + border-radius: 3px !important; +} + +.ol-custom-overviewmap .ol-overviewmap-map { + height: 133px !important; +} + +.ol-custom-overviewmap { + margin-bottom: 3px; +} + +.btn-success { + background-color: @ms2-color-success !important; +} + +.btn-success:hover { + background-color: @ms2-color-success-hover !important; +} + +div.ol-scale-line.ol-unselectable { + border: 2px solid @ms2-color-shade-darker; + border-top: none; + line-height: 1.0; + border-radius: 0; + bottom: 5px; + left: auto; + right: 57px; + padding: 2px 5px 1px; + white-space: nowrap; + overflow: hidden; + -moz-box-sizing: content-box; + box-sizing: content-box; + font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; +} + +div.ol-scale-line-inner { + border: 0; + border-top: 0; + color: @ms2-color-background; + font-size: 11px; + text-align: left; + margin: 0; +} +/* dropzone image*/ +.dropzone.alert.alert-info { + cursor: pointer; +} + +.dropzone-thumbnail-container .alert { + overflow: hidden; + position: relative; + height: 180px; + margin: 0; + padding: 0; + border-color: @ms2-color-shade-lighter; +} + +.dropzone-thumbnail-container div.dropzone-content-image-added { + transition: all 0.2s ease-in; +} + +.dropzone .dropzone-content-image-added { + visibility: hidden; + padding-top: 40px; + color: @ms2-color-background; + text-shadow: @ms2-color-shade-darker 2px 2px 2px; + vertical-align: middle; + top: 0; + left: 0; + width: 100%; + height: 100%; + text-align: center; + position: absolute; + width: 100%; +} + +.dropzone:hover .dropzone-content-image-added { + visibility: visible; + transition: all 0.2s ease-in; + z-index: 2; + background: rgba(0,0,0,.7); + font-size: large; +} + +.dropzone .dropzone-content-image { + padding-top: 40px; + transition: all 0.2s ease-in; + font-size: normal; + text-align: center; +} + +.dropzone:hover .dropzone-content-image { + transition: all 0.2s ease-in; + font-size: large; +} + +.dropzone-thumbnail-container img { + width: 100%; + height: auto; +} + +.dropzone-remove { + top: 0; + right: 0; + z-index: 5; + position: absolute; + font-size: x-large; +} + +.dropzone:hover .dropzone-remove span { + color: @ms2-color-background; +} + +.dropzone-remove span { + color: transparent; +} + +.dropzone-remove span:hover { + color: @ms2-color-danger !important; +} + +.dropzone-errorBox { + margin-bottom: 10px; + padding: 15px; +} + +.modal-header button.close { + margin-top: -2px; + opacity: 1; + font-size: @font-size-base * 2; +} + +.draggable-header button.close { + margin-top: 0; + opacity: 1; + font-size: @font-size-base; +} + +.modal-header .login-panel-close { + margin-top: -2px !important; + opacity: 1 !important; + font-size: @font-size-base * 2 !important; +} + +.modal-header button.close:hover { + opacity: 0.5; + color: @ms2-color-background; +} + +.modal-header button.close:focus { + opacity: 0.5; + color: @ms2-color-background; +} + +.modal-body { + background-color: @ms2-color-background; +} + +.react-draggable .draggable-header { + cursor: move; +} +/*- icon in lists -*/ +.option-icon { + font-size: @font-size-base; + margin-right: @padding-left-square; + color: @ms2-color-primary; +} +/* btn with icon */ +.btn-primary.focus, +.btn-primary:focus, +.btn-primary:hover, +.open > .dropdown-toggle.btn-primary { + color: @ms2-color-background; + background-color: @ms2-color-primary-hover; + border-color: none; + /*remove active color */ +} + +.btn-primary.active, +.btn-primary:active, +.open > .dropdown-toggle.btn-primary { + background-color: @ms2-color-primary-active !important; +} + +.no-border { + border: none; +} + +.no-border:active, +.no-border:hover { + box-shadow: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; +} +/* square button */ +.square-button { + height: @square-btn-size; + width: @square-btn-size; + line-height: 1; + border-radius: 0; + padding: 0; + margin: 0; +} + +.square-button-md { + height: @square-btn-medium-size; + width: @square-btn-medium-size; + border-radius: 0; + line-height: 1; + padding: 0; + margin: 0; +} + +.square-button-sm { + height: @square-btn-small-size; + width: @square-btn-small-size; + border-radius: 0; + line-height: 1; + padding: 0; + margin: 0; +} + +.glyphicon { + font-family: inherit; +} + +.square-button .glyphicon { + font-size: @icon-size; + padding: 0 0 0 @padding-left-square; + margin: 0; +} + +.square-button-md .glyphicon { + font-size: @icon-size-md; + padding: 0 0 0 @padding-left-square-md; + margin: 0; +} + +.square-button-sm .glyphicon { + font-size: @icon-size-sm; + padding: 0 0 0 @padding-left-square-sm; + margin: 0; +} + +.list-group .list-group-item:not(:last-child) { + border-bottom: 1px solid @ms2-color-shade-lighter; +} + +.list-group list-group-item a:hover { + background-color: @ms2-color-shade-lighter; +} + +.list-group li:not(:last-child) { + border-bottom: 1px solid @ms2-color-shade-lighter; +} +/* btn groups */ +.button-group { + height: @square-btn-size; +} + +.button-group .btn:not(:last-child) { + border-right: 1px solid @ms2-color-primary-hover; +} + +.button-group-md { + height: @square-btn-medium-size; +} + +.button-group-md .btn:not(:last-child) { + border-right: 1px solid @ms2-color-primary-hover; +} + +.button-group-sm { + height: @square-btn-small-size; +} + +.button-group-sm .btn:not(:last-child) { + border-right: 1px solid @ms2-color-primary-hover; +} + +.button-group-vertical { + width: @square-btn-size; +} + +.button-group-vertical .btn:not(:last-child) { + border-bottom: 1px solid @ms2-color-primary-hover; + display: block; +} + +.button-group-vertical-md { + width: @square-btn-medium-size; +} + +.button-group-vertical-md .btn:not(:last-child) { + border-bottom: 1px solid @ms2-color-primary-hover; + display: block; +} + +.button-group-vertical-sm { + width: @square-btn-small-size; +} + +.button-group-vertical-sm .btn:not(:last-child) { + border-bottom: 1px solid @ms2-color-primary-hover; + display: block; +} + +.gridcard-tools { + height: @grid-btn-size !important; +} + +.gridcard-button { + height: @grid-btn-size; + width: @grid-btn-size; + padding: 0 0 0 @grid-btn-padding-left; +} + +.gridcard-button .glyphicon { + font-size: @grid-icon-size; + margin-top: -2px; /* remove after new icons */ +} + +#mapstore-layer-settings { + background-color: @ms2-color-background; +} + +.group-edit-dialog, +.user-edit-dialog { + background: @ms2-color-background; +} + +.user-status { + width: @grid-btn-size + @grid-btn-padding-left * 2; + text-align: center; +} + +.user-status .glyphicon { + font-size: @grid-icon-size; + padding: 0 0 @grid-btn-padding-left 0; +} + +.user-status .glyphicon-ok-sign { + color: @ms2-color-success; +} + +.user-status .glyphicon-minus-sign { + color: @ms2-color-danger; +} +/* query panel */ +#mapstore-drawermenu #toc-query-container { + background-color: darken(@ms2-color-background, 2%); +} + +#mapstore-drawermenu #query-form-panel .remove-filter-button .glyphicon { + font-size: @icon-size-sm; +} + +#mapstore-drawermenu #query-form-panel .remove-filter-button span { + line-height: @icon-size-sm; +} + +#query-form-panel .query-toolbar { + height: @square-btn-size; + background-color: @ms2-color-background; +} + +#query-form-panel button:disabled { + color: @ms2-color-text-disabled; + background-color: @ms2-color-disabled !important; +} + +#query-form-panel .panel .panel .filter-group-panel { + background-color: @ms2-color-background; +} + +#query-form-panel .panel .panel .filter-group-panel button { + background-color: @ms2-color-background; +} + +#query-form-panel div.details-panel { + background-color: @ms2-color-background; +} + +#mapstore-drawermenu #query-form-panel .querypanel > .query-filter-container { + margin-right: 60px; + margin-left: 10px; +} + +#query-form-panel .querypanel { + background-color: darken(@ms2-color-background, 2%); +} + +#query-form-panel .query-content > .container-fluid { + border-top: 1px dashed @ms2-color-shade-lighter; +} + +#query-form-panel .querypanel > .query-filter-container { + border-bottom: 1px solid @ms2-color-shade-lighter; +} + +#query-form-panel hr { + border-top: 1px dashed @ms2-color-shade-lighter; +} + +#mapstore-drawermenu #query-form-panel .glyphicon { + font-size: @icon-size-sm; +} + +#query-form-panel input.form-control { + border: 1px solid @ms2-color-shade-lighter; +} +/* select input */ +.rw-widget { + color: @ms2-color-primary !important; + background-color: @ms2-color-background !important; + border: 1px solid @ms2-color-shade-lighter !important; +} + +.rw-list-option:hover { + color: @ms2-color-background !important; + background-color: @ms2-color-primary !important; + border: none !important; +} + +.rw-state-focus { + color: @ms2-color-primary !important; + background-color: transparent !important; + border: 1px solid @ms2-color-primary !important; +} + +.rw-i { + color: @ms2-color-primary !important; +} + +.rw-input, +.rw-placeholder { + color: @ms2-color-text-placeholder !important; + background-color: @ms2-color-background !important; +} + +.rw-filter-input { + border: 1px solid @ms2-color-primary !important; +} + +.rw-select { + border-left: 1px solid @ms2-color-shade-lighter !important; +} + +.Select-placeholder { + background-color: @ms2-color-background; + border: 1px solid @ms2-color-shade-lighter; + color: @ms2-color-text-placeholder !important; +} + +.Select-control { + border: none !important; +} + +.Select-arrow { + border-color: @ms2-color-primary transparent transparent !important; +} + +.Select-menu-outer { + background-color: @ms2-color-background !important; + border: 1px solid @ms2-color-shade-lighter !important; +} + +.Select-option { + background-color: @ms2-color-background !important; + color: @ms2-color-text-placeholder !important; +} + +.Select-option:hover { + background-color: @ms2-color-primary !important; + color: @ms2-color-background !important; +} + +select.form-control { + border: 1px solid @ms2-color-shade-lighter; +} + +select.form-control option { + color: @ms2-color-text; + background-color: darken(@ms2-color-background, 5%); +} + +#mapstore-scalebox select { + background-color: #fff; + color: #222; + border: none; +} + +#mapstore-scalebox option { + background-color: #fff; + color: #222; +} + +/* help badge */ +#helpbadge-scaleBox { + background-color: @ms2-color-text-primary; + color: @ms2-color-primary; +} + +#mapstore-navbar #helpbadge-search-help { + background-color: @ms2-color-text-primary; + color: @ms2-color-primary; +} +/* tutorial */ +.group-thumb, +.user-thumb { + background-color: darken(@ms2-color-background, 4%); +} +/* tutorial */ +.joyride-tooltip__button--primary { + background-color: @ms2-color-primary !important; +} + +.joyride-tooltip__button--primary:active, +.joyride-tooltip__button--primary:focus, +.joyride-tooltip__button--primary:hover { + background-color: @ms2-color-primary !important; +} +/* loading circle */ +.ms2-loading { + background-color: @ms2-color-primary !important; + border-bottom: 2px solid @ms2-color-info !important; +} + +.ms2-loading .sk-circle-wrapper .sk-circle:before { + background-color: @ms2-color-text-primary !important; +} +/* scale bar */ +.leaflet-control-scale-line { + background-color: @ms2-color-primary; + color: @ms2-color-text-primary; +} + +.ol-scale-line { + background-color: @ms2-color-primary !important; + color: @ms2-color-text-primary !important; +} +/* feauture grid */ +.ag-fresh .ag-header, +.ag-fresh .ag-tool-panel-container { + background: @ms2-color-primary !important; + color: @ms2-color-text-primary; + font-family: @font-family-base; +} + +.ag-fresh .ag-tool-panel-container .ag-list-selection { + color: #000000; +} + +.ag-fresh .ag-paging-button { + color: @ms2-color-primary; + background-color: @ms2-color-background; + border: @ms2-color-primary 1px solid; +} + +.ag-fresh .ag-paging-page-summary-panel { + color: @ms2-color-primary; +} + +.ag-fresh .ag-paging-panel { + background-color: @ms2-color-background; +} + +.ag-fresh .ag-body { + background-color: @ms2-color-background !important; +} + +.ag-fresh .ag-body .ag-row-even { + background-color: @ms2-color-background !important; +} + +.ag-fresh .ag-body .ag-row-odd { + background-color: darken(@ms2-color-background,5%) !important; +} +/* card home */ +.map-thumb-description { + color: #000000; +} + +#mapstore-langselector button{ + padding: 6px 12px; +} + +#mapstore-print-panel .panel-body { + border: solid 1px @ms2-color-primary; +} + +.ms-footer { + border-top: solid 1px @ms2-color-primary !important; + color: @ms2-color-primary !important; +} + +#mapstore-navbar-container { + height: @square-btn-size; +} diff --git a/web/client/themes/default/theme.less b/web/client/themes/default/theme.less new file mode 100644 index 0000000000..7380c44c4d --- /dev/null +++ b/web/client/themes/default/theme.less @@ -0,0 +1,5 @@ +// For LESS file includes, +@import "icons.less"; +@import "bootstrap-theme.less"; +@import "ms2-theme.less"; +@import "variables.less"; diff --git a/web/client/themes/default/variables.less b/web/client/themes/default/variables.less new file mode 100644 index 0000000000..660b2d98b5 --- /dev/null +++ b/web/client/themes/default/variables.less @@ -0,0 +1,68 @@ + +@ms2-color-background: #ffffff; +@ms2-color-code: #c7254e; + +@ms2-color-text-primary: #ffffff; +@ms2-color-text-placeholder: #999999; +@ms2-color-text: #333333; + +@ms2-color-disabled: #5C9FB4; +@ms2-color-text-disabled: #ffffff; + +@ms2-color-primary: #078aa3; +@ms2-color-info: #5a9aab; +@ms2-color-success: #398439; +@ms2-color-warning: #ebbc35; +@ms2-color-danger: #bb4940; + +@ms2-color-primary-hover: lighten(@ms2-color-primary, 10%); +@ms2-color-info-hover: lighten(@ms2-color-info, 10%); +@ms2-color-success-hover: lighten(@ms2-color-success, 10%); +@ms2-color-warning-hover: lighten(@ms2-color-warning, 10%); +@ms2-color-danger-hover: lighten(@ms2-color-danger, 10%); + +@ms2-color-primary-light: lighten(@ms2-color-primary, 40%); +@ms2-color-info-light: lighten(@ms2-color-info, 40%); +@ms2-color-success-light: lighten(@ms2-color-success, 40%); +@ms2-color-warning-light: lighten(@ms2-color-warning, 40%); +@ms2-color-danger-light: lighten(@ms2-color-danger, 40%); + +@ms2-color-primary-active: darken(@ms2-color-primary, 20%); + +@ms2-color-shade: #555555; +@ms2-color-shade-darker: #222222; +@ms2-color-shade-dark: #333333; +@ms2-color-shade-light: #999999; +@ms2-color-shade-lighter: #eeeeee; + +@font-family-base: 'Raleway', sans-serif; +@font-size-base: 14px; +@font-size-large: ceil(@font-size-base * 1.25); +@font-size-small: ceil(@font-size-base * 0.85); +@font-size-h1: floor((@font-size-base * 1.9)); +@font-size-h2: floor((@font-size-base * 1.7)); +@font-size-h3: floor((@font-size-base * 1.5)); +@font-size-h4: floor((@font-size-base * 1.25)); +@font-size-h5: @font-size-base; +@font-size-h6: floor((@font-size-base * 0.85)); +@line-height-computed: floor(@font-size-base * 1.428571429); + +@btn-font-weight: normal; +@icon-margin-ratio: 2; +@icon-resize-ratio: 1.5; + +@icon-size: 26px; +@padding-left-square: floor(@icon-size/@icon-margin-ratio); +@square-btn-size: @padding-left-square * 2 + @icon-size; + +@icon-size-md: floor(@icon-size / @icon-resize-ratio); +@padding-left-square-md: floor(@icon-size-md / @icon-margin-ratio); +@square-btn-medium-size: @padding-left-square-md * 2 + @icon-size-md; + +@icon-size-sm: floor(@icon-size-md / @icon-resize-ratio); +@padding-left-square-sm: floor(@icon-size-sm / @icon-margin-ratio); +@square-btn-small-size: @padding-left-square-sm * 2 + @icon-size-sm; + +@grid-icon-size: 18px; +@grid-btn-padding-left: 6px; +@grid-btn-size: @grid-btn-padding-left * 2 + @grid-icon-size; diff --git a/web/client/themes/geosolutions/theme.less b/web/client/themes/geosolutions/theme.less new file mode 100644 index 0000000000..868600e7a8 --- /dev/null +++ b/web/client/themes/geosolutions/theme.less @@ -0,0 +1,5 @@ +@import "../default/icons.less"; +@import "../default/bootstrap-theme.less"; +@import "../default/ms2-theme.less"; +@import "../default/variables.less"; +@import "variables.less"; diff --git a/web/client/themes/geosolutions/variables.less b/web/client/themes/geosolutions/variables.less new file mode 100644 index 0000000000..6839b10086 --- /dev/null +++ b/web/client/themes/geosolutions/variables.less @@ -0,0 +1,23 @@ + +@ms2-color-background: #ffffff; + +@ms2-color-text-primary: #ffffff; +@ms2-color-text: #333333; + +@ms2-color-disabled: #eeeeee; +@ms2-color-text-disabled: #aaaaaa; + +@ms2-color-primary: #3ca9d6; +@ms2-color-info: #55ba58; +@ms2-color-success: #8ae234; +@ms2-color-warning: #ffd700; +@ms2-color-danger: #bb384b; + +@ms2-color-primary-hover: #62AE4A; +@ms2-color-primary-light: lighten(@ms2-color-primary-hover, 40%); + +@ms2-color-shade: #bbbbbb; +@ms2-color-shade-darker: darken(@ms2-color-shade, 10%); +@ms2-color-shade-dark: darken(@ms2-color-shade, 5%); +@ms2-color-shade-light: lighten(@ms2-color-shade, 5%); +@ms2-color-shade-lighter: lighten(@ms2-color-shade, 10%); diff --git a/web/client/themes/wasabi/theme.less b/web/client/themes/wasabi/theme.less new file mode 100644 index 0000000000..868600e7a8 --- /dev/null +++ b/web/client/themes/wasabi/theme.less @@ -0,0 +1,5 @@ +@import "../default/icons.less"; +@import "../default/bootstrap-theme.less"; +@import "../default/ms2-theme.less"; +@import "../default/variables.less"; +@import "variables.less"; diff --git a/web/client/themes/wasabi/variables.less b/web/client/themes/wasabi/variables.less new file mode 100644 index 0000000000..a123e11797 --- /dev/null +++ b/web/client/themes/wasabi/variables.less @@ -0,0 +1,20 @@ + +@ms2-color-background: #333333; + +@ms2-color-text-primary: #333333; +@ms2-color-text: #e99e9e; + +@ms2-color-disabled: #eeeeee; +@ms2-color-text-disabled: #aaaaaa; + +@ms2-color-primary: #8ae234; +@ms2-color-info: #7e64a5; +@ms2-color-success: #4abdac; +@ms2-color-warning: #ffd700; +@ms2-color-danger: #bb384b; + +@ms2-color-shade: #333333; +@ms2-color-shade-darker: darken(@ms2-color-shade, 10%); +@ms2-color-shade-dark: darken(@ms2-color-shade, 5%); +@ms2-color-shade-light: lighten(@ms2-color-shade, 5%); +@ms2-color-shade-lighter: lighten(@ms2-color-shade, 10%); diff --git a/web/client/translations/data.de-DE b/web/client/translations/data.de-DE index cc933496af..38ffd70ce0 100644 --- a/web/client/translations/data.de-DE +++ b/web/client/translations/data.de-DE @@ -122,6 +122,7 @@ "deleteMapMessage": "Möchtest du wirklich diese Karte löschen?", "editMapMetadata":"Bearbeite die Eigenschaften der Karte", "mapTypes_combo": "Wähle einen Karten-Viewer: ", + "theme_combo": "Thema wählen:", "maps_title": "Karten", "locales_combo": "Sprache:" }, diff --git a/web/client/translations/data.en-US b/web/client/translations/data.en-US index af2ae9aaf4..38e4b093f4 100644 --- a/web/client/translations/data.en-US +++ b/web/client/translations/data.en-US @@ -122,6 +122,7 @@ "deleteMapMessage": "Do you really want to delete this map?", "editMapMetadata":"Edit Map Properties", "mapTypes_combo": "Select Map Viewer: ", + "theme_combo": "Select Theme:", "maps_title": "Maps", "locales_combo": "Language:" }, diff --git a/web/client/translations/data.fr-FR b/web/client/translations/data.fr-FR index fb5948483d..f60e80f9e3 100644 --- a/web/client/translations/data.fr-FR +++ b/web/client/translations/data.fr-FR @@ -123,6 +123,7 @@ "deleteMapMessage": "Voulez-vous supprimer cette carte?", "editMapMetadata":"Modifier les propriétés de la carte", "mapTypes_combo": "Selectionner le viewer de carte: ", + "theme_combo": "Sélectionne un thème:", "maps_title": "Cartes", "locales_combo": "Langue:" }, diff --git a/web/client/translations/data.it-IT b/web/client/translations/data.it-IT index b8f2350e65..6015884853 100644 --- a/web/client/translations/data.it-IT +++ b/web/client/translations/data.it-IT @@ -122,6 +122,7 @@ "deleteMapMessage": "Vuoi eliminare questa mappa?", "editMapMetadata":"Modifica Proprietà", "mapTypes_combo": "Seleziona il visualizzatore di mappa:", + "theme_combo": "Seleziona Tema:", "maps_title": "Mappe", "locales_combo": "Lingua:" }, diff --git a/webpack.config.js b/webpack.config.js index aa71fc6ab0..bcdc5d7b87 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -3,13 +3,20 @@ var DefinePlugin = require("webpack/lib/DefinePlugin"); var LoaderOptionsPlugin = require("webpack/lib/LoaderOptionsPlugin"); var NormalModuleReplacementPlugin = require("webpack/lib/NormalModuleReplacementPlugin"); var NoEmitOnErrorsPlugin = require("webpack/lib/NoEmitOnErrorsPlugin"); - +const assign = require('object-assign'); +const themeEntries = require('./themes.js').themeEntries; +const extractThemesPlugin = require('./themes.js').extractThemesPlugin; module.exports = { - entry: { + entry: assign({ 'webpack-dev-server': 'webpack-dev-server/client?http://0.0.0.0:8081', // WebpackDevServer host and port 'webpack': 'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors "mapstore2": path.join(__dirname, "web", "client", "product", "app") - }, + }, themeEntries + /* { + "themes/default": path.join(__dirname, "web", "client", "themes", "default", "theme.less"), + "themes/dark": path.join(__dirname, "web", "client", "themes", "dark", "theme.less") + }*/ + ), output: { path: path.join(__dirname, "web", "client", "dist"), publicPath: "/dist/", @@ -27,7 +34,8 @@ module.exports = { new NormalModuleReplacementPlugin(/cesium$/, path.join(__dirname, "web", "client", "libs", "cesium")), new NormalModuleReplacementPlugin(/openlayers$/, path.join(__dirname, "web", "client", "libs", "openlayers")), new NormalModuleReplacementPlugin(/proj4$/, path.join(__dirname, "web", "client", "libs", "proj4")), - new NoEmitOnErrorsPlugin() + new NoEmitOnErrorsPlugin(), + extractThemesPlugin ], resolve: { extensions: [".js", ".jsx"] @@ -45,6 +53,7 @@ module.exports = { }, { test: /\.less$/, + exclude: /themes\/.+\.less$/, use: [{ loader: 'style-loader' }, { @@ -53,6 +62,13 @@ module.exports = { loader: 'less-loader' }] }, + { + test: /themes\/.+\.less$/, + use: extractThemesPlugin.extract({ + fallback: 'style-loader', + use: ['css-loader', 'less-loader'] + }) + }, { test: /\.woff(2)?(\?v=[0-9].[0-9].[0-9])?$/, use: [{