├── .DS_Store ├── .bowerrc ├── .editorconfig ├── .gitignore ├── .jscsrc ├── .jshintrc ├── .yo-rc.json ├── LICENSE ├── README.md ├── app ├── .DS_Store ├── 404.html ├── favicon.ico ├── images │ ├── .DS_Store │ ├── arrow.png │ └── flat-avatar.png ├── index.html ├── menu.html ├── robots.txt ├── scripts │ ├── app.js │ └── controllers │ │ ├── dashboard.js │ │ └── login.js ├── styles │ ├── base.less │ ├── fonts │ │ ├── glyphicons-halflings-regular.eot │ │ ├── glyphicons-halflings-regular.svg │ │ ├── glyphicons-halflings-regular.ttf │ │ ├── glyphicons-halflings-regular.woff │ │ └── glyphicons-halflings-regular.woff2 │ ├── less │ │ ├── .csscomb.json │ │ ├── .csslintrc │ │ ├── alerts.less │ │ ├── badges.less │ │ ├── bootstrap.less │ │ ├── breadcrumbs.less │ │ ├── button-groups.less │ │ ├── buttons.less │ │ ├── carousel.less │ │ ├── close.less │ │ ├── code.less │ │ ├── component-animations.less │ │ ├── dropdowns.less │ │ ├── forms.less │ │ ├── glyphicons.less │ │ ├── grid.less │ │ ├── input-groups.less │ │ ├── jumbotron.less │ │ ├── labels.less │ │ ├── list-group.less │ │ ├── media.less │ │ ├── mixins.less │ │ ├── mixins │ │ │ ├── alerts.less │ │ │ ├── background-variant.less │ │ │ ├── border-radius.less │ │ │ ├── buttons.less │ │ │ ├── center-block.less │ │ │ ├── clearfix.less │ │ │ ├── forms.less │ │ │ ├── gradients.less │ │ │ ├── grid-framework.less │ │ │ ├── grid.less │ │ │ ├── hide-text.less │ │ │ ├── image.less │ │ │ ├── labels.less │ │ │ ├── list-group.less │ │ │ ├── nav-divider.less │ │ │ ├── nav-vertical-align.less │ │ │ ├── opacity.less │ │ │ ├── pagination.less │ │ │ ├── panels.less │ │ │ ├── progress-bar.less │ │ │ ├── reset-filter.less │ │ │ ├── resize.less │ │ │ ├── responsive-visibility.less │ │ │ ├── size.less │ │ │ ├── tab-focus.less │ │ │ ├── table-row.less │ │ │ ├── text-emphasis.less │ │ │ ├── text-overflow.less │ │ │ └── vendor-prefixes.less │ │ ├── modals.less │ │ ├── navbar.less │ │ ├── navs.less │ │ ├── normalize.less │ │ ├── pager.less │ │ ├── pagination.less │ │ ├── panels.less │ │ ├── popovers.less │ │ ├── print.less │ │ ├── progress-bars.less │ │ ├── responsive-embed.less │ │ ├── responsive-utilities.less │ │ ├── scaffolding.less │ │ ├── tables.less │ │ ├── theme.less │ │ ├── thumbnails.less │ │ ├── tooltip.less │ │ ├── type.less │ │ ├── utilities.less │ │ ├── variables.less │ │ └── wells.less │ ├── main.less │ ├── pages │ │ ├── dashboard.less │ │ └── login.less │ ├── transitions │ │ ├── all.less │ │ ├── animations.less │ │ ├── avatar.less │ │ └── pages.less │ └── widgets │ │ ├── checkbox.less │ │ └── input-underline.less └── views │ ├── base.html │ ├── dashboard.html │ ├── dashboard │ ├── overview.html │ └── reports.html │ ├── login.html │ └── main-content.html ├── bower.json ├── dist ├── .DS_Store ├── .htaccess ├── 404.html ├── favicon.ico ├── fonts │ ├── fontawesome-webfont.eot │ ├── fontawesome-webfont.svg │ ├── fontawesome-webfont.ttf │ ├── fontawesome-webfont.woff │ ├── fontawesome-webfont.woff2 │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ ├── glyphicons-halflings-regular.woff │ └── glyphicons-halflings-regular.woff2 ├── images │ ├── arrow.png │ └── flat-avatar.png ├── index.html ├── robots.txt ├── scripts │ ├── oldieshim.js │ ├── scripts.js │ └── vendor.js ├── styles │ ├── main.css │ └── vendor.css └── views │ ├── base.html │ ├── dashboard.html │ ├── dashboard │ ├── overview.html │ └── reports.html │ ├── login.html │ └── main-content.html ├── examples └── preview.png ├── gulpfile.js ├── package.json └── test ├── karma.conf.js └── spec └── controllers └── main.js /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/.DS_Store -------------------------------------------------------------------------------- /.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "bower_components" 3 | } 4 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent 2 | # coding styles between different editors and IDEs 3 | # editorconfig.org 4 | 5 | root = true 6 | 7 | 8 | [*] 9 | 10 | # Change these settings to your own preference 11 | indent_style = space 12 | indent_size = 2 13 | 14 | # We recommend you to keep these unchanged 15 | end_of_line = lf 16 | charset = utf-8 17 | trim_trailing_whitespace = true 18 | insert_final_newline = true 19 | 20 | [*.md] 21 | trim_trailing_whitespace = false 22 | 23 | [*.html] 24 | indent_size = 4 25 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | bower_components/ 3 | .tmp/ 4 | gen/ 5 | docs/ 6 | -------------------------------------------------------------------------------- /.jscsrc: -------------------------------------------------------------------------------- 1 | { 2 | "requireCurlyBraces": [ 3 | "if", 4 | "else", 5 | "for", 6 | "while", 7 | "do", 8 | "try", 9 | "catch" 10 | ], 11 | "requireOperatorBeforeLineBreak": true, 12 | "requireCamelCaseOrUpperCaseIdentifiers": true, 13 | "maximumLineLength": { 14 | "value": 80, 15 | "allowComments": true, 16 | "allowRegex": true 17 | }, 18 | "validateIndentation": 2, 19 | "validateQuoteMarks": "'", 20 | 21 | "disallowMultipleLineStrings": true, 22 | "disallowMixedSpacesAndTabs": true, 23 | "disallowTrailingWhitespace": true, 24 | "disallowSpaceAfterPrefixUnaryOperators": true, 25 | "disallowMultipleVarDecl": true, 26 | "disallowKeywordsOnNewLine": ["else"], 27 | 28 | "requireSpaceAfterKeywords": [ 29 | "if", 30 | "else", 31 | "for", 32 | "while", 33 | "do", 34 | "switch", 35 | "return", 36 | "try", 37 | "catch" 38 | ], 39 | "requireSpaceBeforeBinaryOperators": [ 40 | "=", "+=", "-=", "*=", "/=", "%=", "<<=", ">>=", ">>>=", 41 | "&=", "|=", "^=", "+=", 42 | 43 | "+", "-", "*", "/", "%", "<<", ">>", ">>>", "&", 44 | "|", "^", "&&", "||", "===", "==", ">=", 45 | "<=", "<", ">", "!=", "!==" 46 | ], 47 | "requireSpaceAfterBinaryOperators": true, 48 | "requireSpacesInConditionalExpression": true, 49 | "requireSpaceBeforeBlockStatements": true, 50 | "requireSpacesInForStatement": true, 51 | "requireLineFeedAtFileEnd": true, 52 | "requireSpacesInFunctionExpression": { 53 | "beforeOpeningCurlyBrace": true 54 | }, 55 | "disallowSpacesInAnonymousFunctionExpression": { 56 | "beforeOpeningRoundBrace": true 57 | }, 58 | "disallowSpacesInsideObjectBrackets": "all", 59 | "disallowSpacesInsideArrayBrackets": "all", 60 | "disallowSpacesInsideParentheses": true, 61 | 62 | "disallowMultipleLineBreaks": true, 63 | "disallowNewlineBeforeBlockStatements": true 64 | } -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "node": true, 3 | "browser": true, 4 | "esnext": true, 5 | "bitwise": true, 6 | "camelcase": true, 7 | "curly": true, 8 | "eqeqeq": true, 9 | "immed": true, 10 | "indent": 2, 11 | "latedef": true, 12 | "newcap": true, 13 | "noarg": true, 14 | "quotmark": "single", 15 | "undef": true, 16 | "unused": true, 17 | "strict": true, 18 | "trailing": true, 19 | "smarttabs": true, 20 | "jasmine": true, 21 | "globals": { 22 | "angular": false, 23 | "inject": false 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /.yo-rc.json: -------------------------------------------------------------------------------- 1 | { 2 | "generator-yangular": { 3 | "scriptsDir": "app/scripts/", 4 | "viewsDir": "app/views/" 5 | } 6 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 GeekyAnts 4 | http://geekyants.com/ 5 | 6 | Permission is hereby granted, free of charge, to any person obtaining a copy 7 | of this software and associated documentation files (the "Software"), to deal 8 | in the Software without restriction, including without limitation the rights 9 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 10 | copies of the Software, and to permit persons to whom the Software is 11 | furnished to do so, subject to the following conditions: 12 | 13 | The above copyright notice and this permission notice shall be included in all 14 | copies or substantial portions of the Software. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 17 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 18 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 19 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 20 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 21 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 22 | SOFTWARE. 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## NOTICE: This repo has been deprecated 2 | 3 | ## [DEPRECATED] Versatile Dashboard - Free AngularJS Admin Starter Theme 4 | 5 | ### Note: This project is no longer maintained. 6 | 7 | ## [Demo](http://rawgit.com/start-angular/versatile-dashboard-theme/master/dist/index.html) 8 | 9 | Versatile Admin Theme is a Boilerplate for Animated AngularJS Starter Theme written with Bootstrap LESS. Powered by Gulp. 10 | ![Preview](/examples/preview.png) 11 | 12 | Find out more [Free Angular Themes at StartAngular.com](http://www.startangular.com/). 13 | 14 | ## Installation 15 | 1. Clone this project or Download that ZIP file 16 | 2. Make sure you have [bower](http://bower.io/), [gulp](https://www.npmjs.com/package/gulp) and [npm](https://www.npmjs.org/) installed globally 17 | 3. On the command prompt run the following commands 18 | - cd `project-directory` 19 | - `bower install` 20 | - `npm install` 21 | - `gulp serve` - For development mode 22 | - `gulp build` - concat, minify and generate the files for deployment 23 | 24 | 25 | ### Goodness of Bootstrap Less 26 | In the source, we have the less files of Bootstrap attached and the variables have been updated to create this theme. You can change the variable in the less file. Animation and Transitions are in separate less file. 27 | 28 | ### Automation tools 29 | 30 | - [Gulp](http://gulpjs.com/) 31 | -------------------------------------------------------------------------------- /app/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/.DS_Store -------------------------------------------------------------------------------- /app/404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Page Not Found :( 6 | 141 | 142 | 143 |
144 |

Not found :(

145 |

Sorry, but the page you were trying to view does not exist.

146 |

It looks like this was the result of either:

147 | 151 | 154 | 155 |
156 | 157 | 158 | -------------------------------------------------------------------------------- /app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/favicon.ico -------------------------------------------------------------------------------- /app/images/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/images/.DS_Store -------------------------------------------------------------------------------- /app/images/arrow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/images/arrow.png -------------------------------------------------------------------------------- /app/images/flat-avatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/images/flat-avatar.png -------------------------------------------------------------------------------- /app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Versatile Metro-UI Angular Theme 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 23 | 24 | 25 |
26 |
27 |
28 | 29 | 30 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /app/menu.html: -------------------------------------------------------------------------------- 1 | 2 |
3 |
4 | 5 |
6 | 7 | 12 |
13 | 14 | -------------------------------------------------------------------------------- /app/robots.txt: -------------------------------------------------------------------------------- 1 | # robotstxt.org 2 | 3 | User-agent: * 4 | -------------------------------------------------------------------------------- /app/scripts/app.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | /** 4 | * @ngdoc overview 5 | * @name yapp 6 | * @description 7 | * # yapp 8 | * 9 | * Main module of the application. 10 | */ 11 | var states = [ 12 | { name: 'base', state: { abstract: true, url: '', templateUrl: 'views/base.html', data: {text: "Base", visible: false } } }, 13 | { name: 'login', state: { url: '/login', parent: 'base', templateUrl: 'views/login.html', controller: 'LoginCtrl', data: {text: "Login", visible: false } } }, 14 | { name: 'dashboard', state: { url: '/dashboard', parent: 'base', templateUrl: 'views/dashboard.html', controller: 'DashboardCtrl', data: {text: "Dashboard", visible: false } } }, 15 | { name: 'overview', state: { url: '/overview', parent: 'dashboard', templateUrl: 'views/dashboard/overview.html', data: {text: "Overview", visible: true } } }, 16 | { name: 'reports', state: { url: '/reports', parent: 'dashboard', templateUrl: 'views/dashboard/reports.html', data: {text: "Reports", visible: true } } }, 17 | { name: 'logout', state: { url: '/login', data: {text: "Logout", visible: true }} } 18 | ]; 19 | 20 | angular.module('yapp', [ 21 | 'ui.router', 22 | 'snap', 23 | 'ngAnimate' 24 | ]) 25 | .config(function($stateProvider, $urlRouterProvider) { 26 | $urlRouterProvider.when('/dashboard', '/dashboard/overview'); 27 | $urlRouterProvider.otherwise('/login'); 28 | 29 | angular.forEach(states, function (state) { 30 | $stateProvider.state(state.name, state.state); 31 | }); 32 | }); 33 | -------------------------------------------------------------------------------- /app/scripts/controllers/dashboard.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | /** 4 | * @ngdoc function 5 | * @name yapp.controller:MainCtrl 6 | * @description 7 | * # MainCtrl 8 | * Controller of yapp 9 | */ 10 | angular.module('yapp') 11 | .controller('DashboardCtrl', function($scope, $state) { 12 | $scope.$state = $state; 13 | 14 | $scope.menuItems = []; 15 | angular.forEach($state.get(), function (item) { 16 | if (item.data && item.data.visible) { 17 | $scope.menuItems.push({name: item.name, text: item.data.text}); 18 | } 19 | }); 20 | }); 21 | -------------------------------------------------------------------------------- /app/scripts/controllers/login.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | /** 4 | * @ngdoc function 5 | * @name yapp.controller:MainCtrl 6 | * @description 7 | * # MainCtrl 8 | * Controller of yapp 9 | */ 10 | angular.module('yapp') 11 | .controller('LoginCtrl', function($scope, $location) { 12 | 13 | $scope.submit = function() { 14 | 15 | $location.path('/dashboard'); 16 | 17 | return false; 18 | } 19 | 20 | }); 21 | -------------------------------------------------------------------------------- /app/styles/base.less: -------------------------------------------------------------------------------- 1 | .ui-base { 2 | position: absolute; 3 | top: 0; 4 | left: 0; 5 | right: 0; 6 | bottom: 0; 7 | background: #585858; 8 | // overflow: auto; 9 | } 10 | 11 | -------------------------------------------------------------------------------- /app/styles/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/styles/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /app/styles/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/styles/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /app/styles/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/styles/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /app/styles/fonts/glyphicons-halflings-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/start-angular/versatile-dashboard-theme/df56dc775568d567a51a5aa61a425d8ad1d07f62/app/styles/fonts/glyphicons-halflings-regular.woff2 -------------------------------------------------------------------------------- /app/styles/less/.csslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "adjoining-classes": false, 3 | "box-sizing": false, 4 | "box-model": false, 5 | "compatible-vendor-prefixes": false, 6 | "floats": false, 7 | "font-sizes": false, 8 | "gradients": false, 9 | "important": false, 10 | "known-properties": false, 11 | "outline-none": false, 12 | "qualified-headings": false, 13 | "regex-selectors": false, 14 | "shorthand": false, 15 | "text-indent": false, 16 | "unique-headings": false, 17 | "universal-selector": false, 18 | "unqualified-attributes": false 19 | } 20 | -------------------------------------------------------------------------------- /app/styles/less/alerts.less: -------------------------------------------------------------------------------- 1 | // 2 | // Alerts 3 | // -------------------------------------------------- 4 | 5 | 6 | // Base styles 7 | // ------------------------- 8 | 9 | .alert { 10 | padding: @alert-padding; 11 | margin-bottom: @line-height-computed; 12 | border: 1px solid transparent; 13 | border-radius: @alert-border-radius; 14 | 15 | // Headings for larger alerts 16 | h4 { 17 | margin-top: 0; 18 | // Specified for the h4 to prevent conflicts of changing @headings-color 19 | color: inherit; 20 | } 21 | 22 | // Provide class for links that match alerts 23 | .alert-link { 24 | font-weight: @alert-link-font-weight; 25 | } 26 | 27 | // Improve alignment and spacing of inner content 28 | > p, 29 | > ul { 30 | margin-bottom: 0; 31 | } 32 | 33 | > p + p { 34 | margin-top: 5px; 35 | } 36 | } 37 | 38 | // Dismissible alerts 39 | // 40 | // Expand the right padding and account for the close button's positioning. 41 | 42 | .alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0. 43 | .alert-dismissible { 44 | padding-right: (@alert-padding + 20); 45 | 46 | // Adjust close link position 47 | .close { 48 | position: relative; 49 | top: -2px; 50 | right: -21px; 51 | color: inherit; 52 | } 53 | } 54 | 55 | // Alternate styles 56 | // 57 | // Generate contextual modifier classes for colorizing the alert. 58 | 59 | .alert-success { 60 | .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text); 61 | } 62 | 63 | .alert-info { 64 | .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text); 65 | } 66 | 67 | .alert-warning { 68 | .alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text); 69 | } 70 | 71 | .alert-danger { 72 | .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text); 73 | } 74 | -------------------------------------------------------------------------------- /app/styles/less/badges.less: -------------------------------------------------------------------------------- 1 | // 2 | // Badges 3 | // -------------------------------------------------- 4 | 5 | 6 | // Base class 7 | .badge { 8 | display: inline-block; 9 | min-width: 10px; 10 | padding: 3px 7px; 11 | font-size: @font-size-small; 12 | font-weight: @badge-font-weight; 13 | color: @badge-color; 14 | line-height: @badge-line-height; 15 | vertical-align: baseline; 16 | white-space: nowrap; 17 | text-align: center; 18 | background-color: @badge-bg; 19 | border-radius: @badge-border-radius; 20 | 21 | // Empty badges collapse automatically (not available in IE8) 22 | &:empty { 23 | display: none; 24 | } 25 | 26 | // Quick fix for badges in buttons 27 | .btn & { 28 | position: relative; 29 | top: -1px; 30 | } 31 | 32 | .btn-xs &, 33 | .btn-group-xs > .btn & { 34 | top: 0; 35 | padding: 1px 5px; 36 | } 37 | 38 | // Hover state, but only for links 39 | a& { 40 | &:hover, 41 | &:focus { 42 | color: @badge-link-hover-color; 43 | text-decoration: none; 44 | cursor: pointer; 45 | } 46 | } 47 | 48 | // Account for badges in navs 49 | .list-group-item.active > &, 50 | .nav-pills > .active > a > & { 51 | color: @badge-active-color; 52 | background-color: @badge-active-bg; 53 | } 54 | 55 | .list-group-item > & { 56 | float: right; 57 | } 58 | 59 | .list-group-item > & + & { 60 | margin-right: 5px; 61 | } 62 | 63 | .nav-pills > li > a > & { 64 | margin-left: 3px; 65 | } 66 | } 67 | -------------------------------------------------------------------------------- /app/styles/less/bootstrap.less: -------------------------------------------------------------------------------- 1 | // Core variables and mixins 2 | @import "variables.less"; 3 | @import "mixins.less"; 4 | 5 | // Reset and dependencies 6 | @import "normalize.less"; 7 | @import "print.less"; 8 | @import "glyphicons.less"; 9 | 10 | // Core CSS 11 | @import "scaffolding.less"; 12 | @import "type.less"; 13 | @import "code.less"; 14 | @import "grid.less"; 15 | @import "tables.less"; 16 | @import "forms.less"; 17 | @import "buttons.less"; 18 | 19 | // Components 20 | @import "component-animations.less"; 21 | @import "dropdowns.less"; 22 | @import "button-groups.less"; 23 | @import "input-groups.less"; 24 | @import "navs.less"; 25 | @import "navbar.less"; 26 | @import "breadcrumbs.less"; 27 | @import "pagination.less"; 28 | @import "pager.less"; 29 | @import "labels.less"; 30 | @import "badges.less"; 31 | @import "jumbotron.less"; 32 | @import "thumbnails.less"; 33 | @import "alerts.less"; 34 | @import "progress-bars.less"; 35 | @import "media.less"; 36 | @import "list-group.less"; 37 | @import "panels.less"; 38 | @import "responsive-embed.less"; 39 | @import "wells.less"; 40 | @import "close.less"; 41 | 42 | // Components w/ JavaScript 43 | @import "modals.less"; 44 | @import "tooltip.less"; 45 | @import "popovers.less"; 46 | @import "carousel.less"; 47 | 48 | // Utility classes 49 | @import "utilities.less"; 50 | @import "responsive-utilities.less"; 51 | -------------------------------------------------------------------------------- /app/styles/less/breadcrumbs.less: -------------------------------------------------------------------------------- 1 | // 2 | // Breadcrumbs 3 | // -------------------------------------------------- 4 | 5 | 6 | .breadcrumb { 7 | padding: @breadcrumb-padding-vertical @breadcrumb-padding-horizontal; 8 | margin-bottom: @line-height-computed; 9 | list-style: none; 10 | background-color: @breadcrumb-bg; 11 | border-radius: @border-radius-base; 12 | 13 | > li { 14 | display: inline-block; 15 | 16 | + li:before { 17 | content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space 18 | padding: 0 5px; 19 | color: @breadcrumb-color; 20 | } 21 | } 22 | 23 | > .active { 24 | color: @breadcrumb-active-color; 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /app/styles/less/button-groups.less: -------------------------------------------------------------------------------- 1 | // 2 | // Button groups 3 | // -------------------------------------------------- 4 | 5 | // Make the div behave like a button 6 | .btn-group, 7 | .btn-group-vertical { 8 | position: relative; 9 | display: inline-block; 10 | vertical-align: middle; // match .btn alignment given font-size hack above 11 | > .btn { 12 | position: relative; 13 | float: left; 14 | // Bring the "active" button to the front 15 | &:hover, 16 | &:focus, 17 | &:active, 18 | &.active { 19 | z-index: 2; 20 | } 21 | } 22 | } 23 | 24 | // Prevent double borders when buttons are next to each other 25 | .btn-group { 26 | .btn + .btn, 27 | .btn + .btn-group, 28 | .btn-group + .btn, 29 | .btn-group + .btn-group { 30 | margin-left: -1px; 31 | } 32 | } 33 | 34 | // Optional: Group multiple button groups together for a toolbar 35 | .btn-toolbar { 36 | margin-left: -5px; // Offset the first child's margin 37 | &:extend(.clearfix all); 38 | 39 | .btn-group, 40 | .input-group { 41 | float: left; 42 | } 43 | > .btn, 44 | > .btn-group, 45 | > .input-group { 46 | margin-left: 5px; 47 | } 48 | } 49 | 50 | .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { 51 | border-radius: 0; 52 | } 53 | 54 | // Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match 55 | .btn-group > .btn:first-child { 56 | margin-left: 0; 57 | &:not(:last-child):not(.dropdown-toggle) { 58 | .border-right-radius(0); 59 | } 60 | } 61 | // Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it 62 | .btn-group > .btn:last-child:not(:first-child), 63 | .btn-group > .dropdown-toggle:not(:first-child) { 64 | .border-left-radius(0); 65 | } 66 | 67 | // Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group) 68 | .btn-group > .btn-group { 69 | float: left; 70 | } 71 | .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { 72 | border-radius: 0; 73 | } 74 | .btn-group > .btn-group:first-child:not(:last-child) { 75 | > .btn:last-child, 76 | > .dropdown-toggle { 77 | .border-right-radius(0); 78 | } 79 | } 80 | .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child { 81 | .border-left-radius(0); 82 | } 83 | 84 | // On active and open, don't show outline 85 | .btn-group .dropdown-toggle:active, 86 | .btn-group.open .dropdown-toggle { 87 | outline: 0; 88 | } 89 | 90 | 91 | // Sizing 92 | // 93 | // Remix the default button sizing classes into new ones for easier manipulation. 94 | 95 | .btn-group-xs > .btn { &:extend(.btn-xs); } 96 | .btn-group-sm > .btn { &:extend(.btn-sm); } 97 | .btn-group-lg > .btn { &:extend(.btn-lg); } 98 | 99 | 100 | // Split button dropdowns 101 | // ---------------------- 102 | 103 | // Give the line between buttons some depth 104 | .btn-group > .btn + .dropdown-toggle { 105 | padding-left: 8px; 106 | padding-right: 8px; 107 | } 108 | .btn-group > .btn-lg + .dropdown-toggle { 109 | padding-left: 12px; 110 | padding-right: 12px; 111 | } 112 | 113 | // The clickable button for toggling the menu 114 | // Remove the gradient and set the same inset shadow as the :active state 115 | .btn-group.open .dropdown-toggle { 116 | .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); 117 | 118 | // Show no shadow for `.btn-link` since it has no other button styles. 119 | &.btn-link { 120 | .box-shadow(none); 121 | } 122 | } 123 | 124 | 125 | // Reposition the caret 126 | .btn .caret { 127 | margin-left: 0; 128 | } 129 | // Carets in other button sizes 130 | .btn-lg .caret { 131 | border-width: @caret-width-large @caret-width-large 0; 132 | border-bottom-width: 0; 133 | } 134 | // Upside down carets for .dropup 135 | .dropup .btn-lg .caret { 136 | border-width: 0 @caret-width-large @caret-width-large; 137 | } 138 | 139 | 140 | // Vertical button groups 141 | // ---------------------- 142 | 143 | .btn-group-vertical { 144 | > .btn, 145 | > .btn-group, 146 | > .btn-group > .btn { 147 | display: block; 148 | float: none; 149 | width: 100%; 150 | max-width: 100%; 151 | } 152 | 153 | // Clear floats so dropdown menus can be properly placed 154 | > .btn-group { 155 | &:extend(.clearfix all); 156 | > .btn { 157 | float: none; 158 | } 159 | } 160 | 161 | > .btn + .btn, 162 | > .btn + .btn-group, 163 | > .btn-group + .btn, 164 | > .btn-group + .btn-group { 165 | margin-top: -1px; 166 | margin-left: 0; 167 | } 168 | } 169 | 170 | .btn-group-vertical > .btn { 171 | &:not(:first-child):not(:last-child) { 172 | border-radius: 0; 173 | } 174 | &:first-child:not(:last-child) { 175 | border-top-right-radius: @border-radius-base; 176 | .border-bottom-radius(0); 177 | } 178 | &:last-child:not(:first-child) { 179 | border-bottom-left-radius: @border-radius-base; 180 | .border-top-radius(0); 181 | } 182 | } 183 | .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { 184 | border-radius: 0; 185 | } 186 | .btn-group-vertical > .btn-group:first-child:not(:last-child) { 187 | > .btn:last-child, 188 | > .dropdown-toggle { 189 | .border-bottom-radius(0); 190 | } 191 | } 192 | .btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { 193 | .border-top-radius(0); 194 | } 195 | 196 | 197 | // Justified button groups 198 | // ---------------------- 199 | 200 | .btn-group-justified { 201 | display: table; 202 | width: 100%; 203 | table-layout: fixed; 204 | border-collapse: separate; 205 | > .btn, 206 | > .btn-group { 207 | float: none; 208 | display: table-cell; 209 | width: 1%; 210 | } 211 | > .btn-group .btn { 212 | width: 100%; 213 | } 214 | 215 | > .btn-group .dropdown-menu { 216 | left: auto; 217 | } 218 | } 219 | 220 | 221 | // Checkbox and radio options 222 | // 223 | // In order to support the browser's form validation feedback, powered by the 224 | // `required` attribute, we have to "hide" the inputs via `clip`. We cannot use 225 | // `display: none;` or `visibility: hidden;` as that also hides the popover. 226 | // Simply visually hiding the inputs via `opacity` would leave them clickable in 227 | // certain cases which is prevented by using `clip` and `pointer-events`. 228 | // This way, we ensure a DOM element is visible to position the popover from. 229 | // 230 | // See https://github.com/twbs/bootstrap/pull/12794 and 231 | // https://github.com/twbs/bootstrap/pull/14559 for more information. 232 | 233 | [data-toggle="buttons"] { 234 | > .btn, 235 | > .btn-group > .btn { 236 | input[type="radio"], 237 | input[type="checkbox"] { 238 | position: absolute; 239 | clip: rect(0,0,0,0); 240 | pointer-events: none; 241 | } 242 | } 243 | } 244 | -------------------------------------------------------------------------------- /app/styles/less/buttons.less: -------------------------------------------------------------------------------- 1 | // 2 | // Buttons 3 | // -------------------------------------------------- 4 | 5 | 6 | // Base styles 7 | // -------------------------------------------------- 8 | 9 | .btn { 10 | display: inline-block; 11 | margin-bottom: 0; // For input.btn 12 | font-weight: @btn-font-weight; 13 | text-align: center; 14 | vertical-align: middle; 15 | touch-action: manipulation; 16 | cursor: pointer; 17 | background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 18 | border: 1px solid transparent; 19 | white-space: nowrap; 20 | .button-size(@padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base; @border-radius-base); 21 | .user-select(none); 22 | 23 | &, 24 | &:active, 25 | &.active { 26 | &:focus, 27 | &.focus { 28 | .tab-focus(); 29 | } 30 | } 31 | 32 | &:hover, 33 | &:focus, 34 | &.focus { 35 | color: @btn-default-color; 36 | text-decoration: none; 37 | } 38 | 39 | &:active, 40 | &.active { 41 | outline: 0; 42 | background-image: none; 43 | .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); 44 | } 45 | 46 | &.disabled, 47 | &[disabled], 48 | fieldset[disabled] & { 49 | cursor: @cursor-disabled; 50 | pointer-events: none; // Future-proof disabling of clicks 51 | .opacity(.65); 52 | .box-shadow(none); 53 | } 54 | } 55 | 56 | 57 | // Alternate buttons 58 | // -------------------------------------------------- 59 | 60 | .btn-default { 61 | .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border); 62 | } 63 | .btn-primary { 64 | .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border); 65 | } 66 | // Success appears as green 67 | .btn-success { 68 | .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border); 69 | } 70 | // Info appears as blue-green 71 | .btn-info { 72 | .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border); 73 | } 74 | // Warning appears as orange 75 | .btn-warning { 76 | .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border); 77 | } 78 | // Danger and error appear as red 79 | .btn-danger { 80 | .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border); 81 | } 82 | 83 | 84 | // Link buttons 85 | // ------------------------- 86 | 87 | // Make a button look and behave like a link 88 | .btn-link { 89 | color: @link-color; 90 | font-weight: normal; 91 | border-radius: 0; 92 | 93 | &, 94 | &:active, 95 | &.active, 96 | &[disabled], 97 | fieldset[disabled] & { 98 | background-color: transparent; 99 | .box-shadow(none); 100 | } 101 | &, 102 | &:hover, 103 | &:focus, 104 | &:active { 105 | border-color: transparent; 106 | } 107 | &:hover, 108 | &:focus { 109 | color: @link-hover-color; 110 | text-decoration: @link-hover-decoration; 111 | background-color: transparent; 112 | } 113 | &[disabled], 114 | fieldset[disabled] & { 115 | &:hover, 116 | &:focus { 117 | color: @btn-link-disabled-color; 118 | text-decoration: none; 119 | } 120 | } 121 | } 122 | 123 | 124 | // Button Sizes 125 | // -------------------------------------------------- 126 | 127 | .btn-lg { 128 | // line-height: ensure even-numbered height of button next to large input 129 | .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); 130 | } 131 | .btn-sm { 132 | // line-height: ensure proper height of button next to small input 133 | .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); 134 | } 135 | .btn-xs { 136 | .button-size(@padding-xs-vertical; @padding-xs-horizontal; @font-size-small; @line-height-small; @border-radius-small); 137 | } 138 | 139 | 140 | // Block button 141 | // -------------------------------------------------- 142 | 143 | .btn-block { 144 | display: block; 145 | width: 100%; 146 | } 147 | 148 | // Vertically space out multiple block buttons 149 | .btn-block + .btn-block { 150 | margin-top: 5px; 151 | } 152 | 153 | // Specificity overrides 154 | input[type="submit"], 155 | input[type="reset"], 156 | input[type="button"] { 157 | &.btn-block { 158 | width: 100%; 159 | } 160 | } 161 | -------------------------------------------------------------------------------- /app/styles/less/carousel.less: -------------------------------------------------------------------------------- 1 | // 2 | // Carousel 3 | // -------------------------------------------------- 4 | 5 | 6 | // Wrapper for the slide container and indicators 7 | .carousel { 8 | position: relative; 9 | } 10 | 11 | .carousel-inner { 12 | position: relative; 13 | overflow: hidden; 14 | width: 100%; 15 | 16 | > .item { 17 | display: none; 18 | position: relative; 19 | .transition(.6s ease-in-out left); 20 | 21 | // Account for jankitude on images 22 | > img, 23 | > a > img { 24 | &:extend(.img-responsive); 25 | line-height: 1; 26 | } 27 | 28 | // WebKit CSS3 transforms for supported devices 29 | @media all and (transform-3d), (-webkit-transform-3d) { 30 | .transition-transform(~'0.6s ease-in-out'); 31 | .backface-visibility(~'hidden'); 32 | .perspective(1000); 33 | 34 | &.next, 35 | &.active.right { 36 | .translate3d(100%, 0, 0); 37 | left: 0; 38 | } 39 | &.prev, 40 | &.active.left { 41 | .translate3d(-100%, 0, 0); 42 | left: 0; 43 | } 44 | &.next.left, 45 | &.prev.right, 46 | &.active { 47 | .translate3d(0, 0, 0); 48 | left: 0; 49 | } 50 | } 51 | } 52 | 53 | > .active, 54 | > .next, 55 | > .prev { 56 | display: block; 57 | } 58 | 59 | > .active { 60 | left: 0; 61 | } 62 | 63 | > .next, 64 | > .prev { 65 | position: absolute; 66 | top: 0; 67 | width: 100%; 68 | } 69 | 70 | > .next { 71 | left: 100%; 72 | } 73 | > .prev { 74 | left: -100%; 75 | } 76 | > .next.left, 77 | > .prev.right { 78 | left: 0; 79 | } 80 | 81 | > .active.left { 82 | left: -100%; 83 | } 84 | > .active.right { 85 | left: 100%; 86 | } 87 | 88 | } 89 | 90 | // Left/right controls for nav 91 | // --------------------------- 92 | 93 | .carousel-control { 94 | position: absolute; 95 | top: 0; 96 | left: 0; 97 | bottom: 0; 98 | width: @carousel-control-width; 99 | .opacity(@carousel-control-opacity); 100 | font-size: @carousel-control-font-size; 101 | color: @carousel-control-color; 102 | text-align: center; 103 | text-shadow: @carousel-text-shadow; 104 | // We can't have this transition here because WebKit cancels the carousel 105 | // animation if you trip this while in the middle of another animation. 106 | 107 | // Set gradients for backgrounds 108 | &.left { 109 | #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001)); 110 | } 111 | &.right { 112 | left: auto; 113 | right: 0; 114 | #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5)); 115 | } 116 | 117 | // Hover/focus state 118 | &:hover, 119 | &:focus { 120 | outline: 0; 121 | color: @carousel-control-color; 122 | text-decoration: none; 123 | .opacity(.9); 124 | } 125 | 126 | // Toggles 127 | .icon-prev, 128 | .icon-next, 129 | .glyphicon-chevron-left, 130 | .glyphicon-chevron-right { 131 | position: absolute; 132 | top: 50%; 133 | z-index: 5; 134 | display: inline-block; 135 | } 136 | .icon-prev, 137 | .glyphicon-chevron-left { 138 | left: 50%; 139 | margin-left: -10px; 140 | } 141 | .icon-next, 142 | .glyphicon-chevron-right { 143 | right: 50%; 144 | margin-right: -10px; 145 | } 146 | .icon-prev, 147 | .icon-next { 148 | width: 20px; 149 | height: 20px; 150 | margin-top: -10px; 151 | line-height: 1; 152 | font-family: serif; 153 | } 154 | 155 | 156 | .icon-prev { 157 | &:before { 158 | content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) 159 | } 160 | } 161 | .icon-next { 162 | &:before { 163 | content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) 164 | } 165 | } 166 | } 167 | 168 | // Optional indicator pips 169 | // 170 | // Add an unordered list with the following class and add a list item for each 171 | // slide your carousel holds. 172 | 173 | .carousel-indicators { 174 | position: absolute; 175 | bottom: 10px; 176 | left: 50%; 177 | z-index: 15; 178 | width: 60%; 179 | margin-left: -30%; 180 | padding-left: 0; 181 | list-style: none; 182 | text-align: center; 183 | 184 | li { 185 | display: inline-block; 186 | width: 10px; 187 | height: 10px; 188 | margin: 1px; 189 | text-indent: -999px; 190 | border: 1px solid @carousel-indicator-border-color; 191 | border-radius: 10px; 192 | cursor: pointer; 193 | 194 | // IE8-9 hack for event handling 195 | // 196 | // Internet Explorer 8-9 does not support clicks on elements without a set 197 | // `background-color`. We cannot use `filter` since that's not viewed as a 198 | // background color by the browser. Thus, a hack is needed. 199 | // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer 200 | // 201 | // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we 202 | // set alpha transparency for the best results possible. 203 | background-color: #000 \9; // IE8 204 | background-color: rgba(0,0,0,0); // IE9 205 | } 206 | .active { 207 | margin: 0; 208 | width: 12px; 209 | height: 12px; 210 | background-color: @carousel-indicator-active-bg; 211 | } 212 | } 213 | 214 | // Optional captions 215 | // ----------------------------- 216 | // Hidden by default for smaller viewports 217 | .carousel-caption { 218 | position: absolute; 219 | left: 15%; 220 | right: 15%; 221 | bottom: 20px; 222 | z-index: 10; 223 | padding-top: 20px; 224 | padding-bottom: 20px; 225 | color: @carousel-caption-color; 226 | text-align: center; 227 | text-shadow: @carousel-text-shadow; 228 | & .btn { 229 | text-shadow: none; // No shadow for button elements in carousel-caption 230 | } 231 | } 232 | 233 | 234 | // Scale up controls for tablets and up 235 | @media screen and (min-width: @screen-sm-min) { 236 | 237 | // Scale up the controls a smidge 238 | .carousel-control { 239 | .glyphicon-chevron-left, 240 | .glyphicon-chevron-right, 241 | .icon-prev, 242 | .icon-next { 243 | width: 30px; 244 | height: 30px; 245 | margin-top: -15px; 246 | font-size: 30px; 247 | } 248 | .glyphicon-chevron-left, 249 | .icon-prev { 250 | margin-left: -15px; 251 | } 252 | .glyphicon-chevron-right, 253 | .icon-next { 254 | margin-right: -15px; 255 | } 256 | } 257 | 258 | // Show and left align the captions 259 | .carousel-caption { 260 | left: 20%; 261 | right: 20%; 262 | padding-bottom: 30px; 263 | } 264 | 265 | // Move up the indicators 266 | .carousel-indicators { 267 | bottom: 20px; 268 | } 269 | } 270 | -------------------------------------------------------------------------------- /app/styles/less/close.less: -------------------------------------------------------------------------------- 1 | // 2 | // Close icons 3 | // -------------------------------------------------- 4 | 5 | 6 | .close { 7 | float: right; 8 | font-size: (@font-size-base * 1.5); 9 | font-weight: @close-font-weight; 10 | line-height: 1; 11 | color: @close-color; 12 | text-shadow: @close-text-shadow; 13 | .opacity(.2); 14 | 15 | &:hover, 16 | &:focus { 17 | color: @close-color; 18 | text-decoration: none; 19 | cursor: pointer; 20 | .opacity(.5); 21 | } 22 | 23 | // Additional properties for button version 24 | // iOS requires the button element instead of an anchor tag. 25 | // If you want the anchor version, it requires `href="#"`. 26 | // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile 27 | button& { 28 | padding: 0; 29 | cursor: pointer; 30 | background: transparent; 31 | border: 0; 32 | -webkit-appearance: none; 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /app/styles/less/code.less: -------------------------------------------------------------------------------- 1 | // 2 | // Code (inline and block) 3 | // -------------------------------------------------- 4 | 5 | 6 | // Inline and block code styles 7 | code, 8 | kbd, 9 | pre, 10 | samp { 11 | font-family: @font-family-monospace; 12 | } 13 | 14 | // Inline code 15 | code { 16 | padding: 2px 4px; 17 | font-size: 90%; 18 | color: @code-color; 19 | background-color: @code-bg; 20 | border-radius: @border-radius-base; 21 | } 22 | 23 | // User input typically entered via keyboard 24 | kbd { 25 | padding: 2px 4px; 26 | font-size: 90%; 27 | color: @kbd-color; 28 | background-color: @kbd-bg; 29 | border-radius: @border-radius-small; 30 | box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); 31 | 32 | kbd { 33 | padding: 0; 34 | font-size: 100%; 35 | font-weight: bold; 36 | box-shadow: none; 37 | } 38 | } 39 | 40 | // Blocks of code 41 | pre { 42 | display: block; 43 | padding: ((@line-height-computed - 1) / 2); 44 | margin: 0 0 (@line-height-computed / 2); 45 | font-size: (@font-size-base - 1); // 14px to 13px 46 | line-height: @line-height-base; 47 | word-break: break-all; 48 | word-wrap: break-word; 49 | color: @pre-color; 50 | background-color: @pre-bg; 51 | border: 1px solid @pre-border-color; 52 | border-radius: @border-radius-base; 53 | 54 | // Account for some code outputs that place code tags in pre tags 55 | code { 56 | padding: 0; 57 | font-size: inherit; 58 | color: inherit; 59 | white-space: pre-wrap; 60 | background-color: transparent; 61 | border-radius: 0; 62 | } 63 | } 64 | 65 | // Enable scrollable blocks of code 66 | .pre-scrollable { 67 | max-height: @pre-scrollable-max-height; 68 | overflow-y: scroll; 69 | } 70 | -------------------------------------------------------------------------------- /app/styles/less/component-animations.less: -------------------------------------------------------------------------------- 1 | // 2 | // Component animations 3 | // -------------------------------------------------- 4 | 5 | // Heads up! 6 | // 7 | // We don't use the `.opacity()` mixin here since it causes a bug with text 8 | // fields in IE7-8. Source: https://github.com/twbs/bootstrap/pull/3552. 9 | 10 | .fade { 11 | opacity: 0; 12 | .transition(opacity .15s linear); 13 | &.in { 14 | opacity: 1; 15 | } 16 | } 17 | 18 | .collapse { 19 | display: none; 20 | 21 | &.in { display: block; } 22 | tr&.in { display: table-row; } 23 | tbody&.in { display: table-row-group; } 24 | } 25 | 26 | .collapsing { 27 | position: relative; 28 | height: 0; 29 | overflow: hidden; 30 | .transition-property(~"height, visibility"); 31 | .transition-duration(.35s); 32 | .transition-timing-function(ease); 33 | } 34 | -------------------------------------------------------------------------------- /app/styles/less/dropdowns.less: -------------------------------------------------------------------------------- 1 | // 2 | // Dropdown menus 3 | // -------------------------------------------------- 4 | 5 | 6 | // Dropdown arrow/caret 7 | .caret { 8 | display: inline-block; 9 | width: 0; 10 | height: 0; 11 | margin-left: 2px; 12 | vertical-align: middle; 13 | border-top: @caret-width-base dashed; 14 | border-right: @caret-width-base solid transparent; 15 | border-left: @caret-width-base solid transparent; 16 | } 17 | 18 | // The dropdown wrapper (div) 19 | .dropup, 20 | .dropdown { 21 | position: relative; 22 | } 23 | 24 | // Prevent the focus on the dropdown toggle when closing dropdowns 25 | .dropdown-toggle:focus { 26 | outline: 0; 27 | } 28 | 29 | // The dropdown menu (ul) 30 | .dropdown-menu { 31 | position: absolute; 32 | top: 100%; 33 | left: 0; 34 | z-index: @zindex-dropdown; 35 | display: none; // none by default, but block on "open" of the menu 36 | float: left; 37 | min-width: 160px; 38 | padding: 5px 0; 39 | margin: 2px 0 0; // override default ul 40 | list-style: none; 41 | font-size: @font-size-base; 42 | text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) 43 | background-color: @dropdown-bg; 44 | border: 1px solid @dropdown-fallback-border; // IE8 fallback 45 | border: 1px solid @dropdown-border; 46 | border-radius: @border-radius-base; 47 | .box-shadow(0 6px 12px rgba(0,0,0,.175)); 48 | background-clip: padding-box; 49 | 50 | // Aligns the dropdown menu to right 51 | // 52 | // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]` 53 | &.pull-right { 54 | right: 0; 55 | left: auto; 56 | } 57 | 58 | // Dividers (basically an hr) within the dropdown 59 | .divider { 60 | .nav-divider(@dropdown-divider-bg); 61 | } 62 | 63 | // Links within the dropdown menu 64 | > li > a { 65 | display: block; 66 | padding: 3px 20px; 67 | clear: both; 68 | font-weight: normal; 69 | line-height: @line-height-base; 70 | color: @dropdown-link-color; 71 | white-space: nowrap; // prevent links from randomly breaking onto new lines 72 | } 73 | } 74 | 75 | // Hover/Focus state 76 | .dropdown-menu > li > a { 77 | &:hover, 78 | &:focus { 79 | text-decoration: none; 80 | color: @dropdown-link-hover-color; 81 | background-color: @dropdown-link-hover-bg; 82 | } 83 | } 84 | 85 | // Active state 86 | .dropdown-menu > .active > a { 87 | &, 88 | &:hover, 89 | &:focus { 90 | color: @dropdown-link-active-color; 91 | text-decoration: none; 92 | outline: 0; 93 | background-color: @dropdown-link-active-bg; 94 | } 95 | } 96 | 97 | // Disabled state 98 | // 99 | // Gray out text and ensure the hover/focus state remains gray 100 | 101 | .dropdown-menu > .disabled > a { 102 | &, 103 | &:hover, 104 | &:focus { 105 | color: @dropdown-link-disabled-color; 106 | } 107 | 108 | // Nuke hover/focus effects 109 | &:hover, 110 | &:focus { 111 | text-decoration: none; 112 | background-color: transparent; 113 | background-image: none; // Remove CSS gradient 114 | .reset-filter(); 115 | cursor: @cursor-disabled; 116 | } 117 | } 118 | 119 | // Open state for the dropdown 120 | .open { 121 | // Show the menu 122 | > .dropdown-menu { 123 | display: block; 124 | } 125 | 126 | // Remove the outline when :focus is triggered 127 | > a { 128 | outline: 0; 129 | } 130 | } 131 | 132 | // Menu positioning 133 | // 134 | // Add extra class to `.dropdown-menu` to flip the alignment of the dropdown 135 | // menu with the parent. 136 | .dropdown-menu-right { 137 | left: auto; // Reset the default from `.dropdown-menu` 138 | right: 0; 139 | } 140 | // With v3, we enabled auto-flipping if you have a dropdown within a right 141 | // aligned nav component. To enable the undoing of that, we provide an override 142 | // to restore the default dropdown menu alignment. 143 | // 144 | // This is only for left-aligning a dropdown menu within a `.navbar-right` or 145 | // `.pull-right` nav component. 146 | .dropdown-menu-left { 147 | left: 0; 148 | right: auto; 149 | } 150 | 151 | // Dropdown section headers 152 | .dropdown-header { 153 | display: block; 154 | padding: 3px 20px; 155 | font-size: @font-size-small; 156 | line-height: @line-height-base; 157 | color: @dropdown-header-color; 158 | white-space: nowrap; // as with > li > a 159 | } 160 | 161 | // Backdrop to catch body clicks on mobile, etc. 162 | .dropdown-backdrop { 163 | position: fixed; 164 | left: 0; 165 | right: 0; 166 | bottom: 0; 167 | top: 0; 168 | z-index: (@zindex-dropdown - 10); 169 | } 170 | 171 | // Right aligned dropdowns 172 | .pull-right > .dropdown-menu { 173 | right: 0; 174 | left: auto; 175 | } 176 | 177 | // Allow for dropdowns to go bottom up (aka, dropup-menu) 178 | // 179 | // Just add .dropup after the standard .dropdown class and you're set, bro. 180 | // TODO: abstract this so that the navbar fixed styles are not placed here? 181 | 182 | .dropup, 183 | .navbar-fixed-bottom .dropdown { 184 | // Reverse the caret 185 | .caret { 186 | border-top: 0; 187 | border-bottom: @caret-width-base solid; 188 | content: ""; 189 | } 190 | // Different positioning for bottom up menu 191 | .dropdown-menu { 192 | top: auto; 193 | bottom: 100%; 194 | margin-bottom: 2px; 195 | } 196 | } 197 | 198 | 199 | // Component alignment 200 | // 201 | // Reiterate per navbar.less and the modified component alignment there. 202 | 203 | @media (min-width: @grid-float-breakpoint) { 204 | .navbar-right { 205 | .dropdown-menu { 206 | .dropdown-menu-right(); 207 | } 208 | // Necessary for overrides of the default right aligned menu. 209 | // Will remove come v4 in all likelihood. 210 | .dropdown-menu-left { 211 | .dropdown-menu-left(); 212 | } 213 | } 214 | } 215 | -------------------------------------------------------------------------------- /app/styles/less/grid.less: -------------------------------------------------------------------------------- 1 | // 2 | // Grid system 3 | // -------------------------------------------------- 4 | 5 | 6 | // Container widths 7 | // 8 | // Set the container width, and override it for fixed navbars in media queries. 9 | 10 | .container { 11 | .container-fixed(); 12 | 13 | @media (min-width: @screen-sm-min) { 14 | width: @container-sm; 15 | } 16 | @media (min-width: @screen-md-min) { 17 | width: @container-md; 18 | } 19 | @media (min-width: @screen-lg-min) { 20 | width: @container-lg; 21 | } 22 | } 23 | 24 | 25 | // Fluid container 26 | // 27 | // Utilizes the mixin meant for fixed width containers, but without any defined 28 | // width for fluid, full width layouts. 29 | 30 | .container-fluid { 31 | .container-fixed(); 32 | } 33 | 34 | 35 | // Row 36 | // 37 | // Rows contain and clear the floats of your columns. 38 | 39 | .row { 40 | .make-row(); 41 | } 42 | 43 | 44 | // Columns 45 | // 46 | // Common styles for small and large grid columns 47 | 48 | .make-grid-columns(); 49 | 50 | 51 | // Extra small grid 52 | // 53 | // Columns, offsets, pushes, and pulls for extra small devices like 54 | // smartphones. 55 | 56 | .make-grid(xs); 57 | 58 | 59 | // Small grid 60 | // 61 | // Columns, offsets, pushes, and pulls for the small device range, from phones 62 | // to tablets. 63 | 64 | @media (min-width: @screen-sm-min) { 65 | .make-grid(sm); 66 | } 67 | 68 | 69 | // Medium grid 70 | // 71 | // Columns, offsets, pushes, and pulls for the desktop device range. 72 | 73 | @media (min-width: @screen-md-min) { 74 | .make-grid(md); 75 | } 76 | 77 | 78 | // Large grid 79 | // 80 | // Columns, offsets, pushes, and pulls for the large desktop device range. 81 | 82 | @media (min-width: @screen-lg-min) { 83 | .make-grid(lg); 84 | } 85 | -------------------------------------------------------------------------------- /app/styles/less/input-groups.less: -------------------------------------------------------------------------------- 1 | // 2 | // Input groups 3 | // -------------------------------------------------- 4 | 5 | // Base styles 6 | // ------------------------- 7 | .input-group { 8 | position: relative; // For dropdowns 9 | display: table; 10 | border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table 11 | 12 | // Undo padding and float of grid classes 13 | &[class*="col-"] { 14 | float: none; 15 | padding-left: 0; 16 | padding-right: 0; 17 | } 18 | 19 | .form-control { 20 | // Ensure that the input is always above the *appended* addon button for 21 | // proper border colors. 22 | position: relative; 23 | z-index: 2; 24 | 25 | // IE9 fubars the placeholder attribute in text inputs and the arrows on 26 | // select elements in input groups. To fix it, we float the input. Details: 27 | // https://github.com/twbs/bootstrap/issues/11561#issuecomment-28936855 28 | float: left; 29 | 30 | width: 100%; 31 | margin-bottom: 0; 32 | } 33 | } 34 | 35 | // Sizing options 36 | // 37 | // Remix the default form control sizing classes into new ones for easier 38 | // manipulation. 39 | 40 | .input-group-lg > .form-control, 41 | .input-group-lg > .input-group-addon, 42 | .input-group-lg > .input-group-btn > .btn { 43 | .input-lg(); 44 | } 45 | .input-group-sm > .form-control, 46 | .input-group-sm > .input-group-addon, 47 | .input-group-sm > .input-group-btn > .btn { 48 | .input-sm(); 49 | } 50 | 51 | 52 | // Display as table-cell 53 | // ------------------------- 54 | .input-group-addon, 55 | .input-group-btn, 56 | .input-group .form-control { 57 | display: table-cell; 58 | 59 | &:not(:first-child):not(:last-child) { 60 | border-radius: 0; 61 | } 62 | } 63 | // Addon and addon wrapper for buttons 64 | .input-group-addon, 65 | .input-group-btn { 66 | width: 1%; 67 | white-space: nowrap; 68 | vertical-align: middle; // Match the inputs 69 | } 70 | 71 | // Text input groups 72 | // ------------------------- 73 | .input-group-addon { 74 | padding: @padding-base-vertical @padding-base-horizontal; 75 | font-size: @font-size-base; 76 | font-weight: normal; 77 | line-height: 1; 78 | color: @input-color; 79 | text-align: center; 80 | background-color: @input-group-addon-bg; 81 | border: 1px solid @input-group-addon-border-color; 82 | border-radius: @border-radius-base; 83 | 84 | // Sizing 85 | &.input-sm { 86 | padding: @padding-small-vertical @padding-small-horizontal; 87 | font-size: @font-size-small; 88 | border-radius: @border-radius-small; 89 | } 90 | &.input-lg { 91 | padding: @padding-large-vertical @padding-large-horizontal; 92 | font-size: @font-size-large; 93 | border-radius: @border-radius-large; 94 | } 95 | 96 | // Nuke default margins from checkboxes and radios to vertically center within. 97 | input[type="radio"], 98 | input[type="checkbox"] { 99 | margin-top: 0; 100 | } 101 | } 102 | 103 | // Reset rounded corners 104 | .input-group .form-control:first-child, 105 | .input-group-addon:first-child, 106 | .input-group-btn:first-child > .btn, 107 | .input-group-btn:first-child > .btn-group > .btn, 108 | .input-group-btn:first-child > .dropdown-toggle, 109 | .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle), 110 | .input-group-btn:last-child > .btn-group:not(:last-child) > .btn { 111 | .border-right-radius(0); 112 | } 113 | .input-group-addon:first-child { 114 | border-right: 0; 115 | } 116 | .input-group .form-control:last-child, 117 | .input-group-addon:last-child, 118 | .input-group-btn:last-child > .btn, 119 | .input-group-btn:last-child > .btn-group > .btn, 120 | .input-group-btn:last-child > .dropdown-toggle, 121 | .input-group-btn:first-child > .btn:not(:first-child), 122 | .input-group-btn:first-child > .btn-group:not(:first-child) > .btn { 123 | .border-left-radius(0); 124 | } 125 | .input-group-addon:last-child { 126 | border-left: 0; 127 | } 128 | 129 | // Button input groups 130 | // ------------------------- 131 | .input-group-btn { 132 | position: relative; 133 | // Jankily prevent input button groups from wrapping with `white-space` and 134 | // `font-size` in combination with `inline-block` on buttons. 135 | font-size: 0; 136 | white-space: nowrap; 137 | 138 | // Negative margin for spacing, position for bringing hovered/focused/actived 139 | // element above the siblings. 140 | > .btn { 141 | position: relative; 142 | + .btn { 143 | margin-left: -1px; 144 | } 145 | // Bring the "active" button to the front 146 | &:hover, 147 | &:focus, 148 | &:active { 149 | z-index: 2; 150 | } 151 | } 152 | 153 | // Negative margin to only have a 1px border between the two 154 | &:first-child { 155 | > .btn, 156 | > .btn-group { 157 | margin-right: -1px; 158 | } 159 | } 160 | &:last-child { 161 | > .btn, 162 | > .btn-group { 163 | margin-left: -1px; 164 | } 165 | } 166 | } 167 | -------------------------------------------------------------------------------- /app/styles/less/jumbotron.less: -------------------------------------------------------------------------------- 1 | // 2 | // Jumbotron 3 | // -------------------------------------------------- 4 | 5 | 6 | .jumbotron { 7 | padding: @jumbotron-padding (@jumbotron-padding / 2); 8 | margin-bottom: @jumbotron-padding; 9 | color: @jumbotron-color; 10 | background-color: @jumbotron-bg; 11 | 12 | h1, 13 | .h1 { 14 | color: @jumbotron-heading-color; 15 | } 16 | 17 | p { 18 | margin-bottom: (@jumbotron-padding / 2); 19 | font-size: @jumbotron-font-size; 20 | font-weight: 200; 21 | } 22 | 23 | > hr { 24 | border-top-color: darken(@jumbotron-bg, 10%); 25 | } 26 | 27 | .container &, 28 | .container-fluid & { 29 | border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container 30 | } 31 | 32 | .container { 33 | max-width: 100%; 34 | } 35 | 36 | @media screen and (min-width: @screen-sm-min) { 37 | padding: (@jumbotron-padding * 1.6) 0; 38 | 39 | .container &, 40 | .container-fluid & { 41 | padding-left: (@jumbotron-padding * 2); 42 | padding-right: (@jumbotron-padding * 2); 43 | } 44 | 45 | h1, 46 | .h1 { 47 | font-size: (@font-size-base * 4.5); 48 | } 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /app/styles/less/labels.less: -------------------------------------------------------------------------------- 1 | // 2 | // Labels 3 | // -------------------------------------------------- 4 | 5 | .label { 6 | display: inline; 7 | padding: .2em .6em .3em; 8 | font-size: 75%; 9 | font-weight: bold; 10 | line-height: 1; 11 | color: @label-color; 12 | text-align: center; 13 | white-space: nowrap; 14 | vertical-align: baseline; 15 | border-radius: .25em; 16 | 17 | // Add hover effects, but only for links 18 | a& { 19 | &:hover, 20 | &:focus { 21 | color: @label-link-hover-color; 22 | text-decoration: none; 23 | cursor: pointer; 24 | } 25 | } 26 | 27 | // Empty labels collapse automatically (not available in IE8) 28 | &:empty { 29 | display: none; 30 | } 31 | 32 | // Quick fix for labels in buttons 33 | .btn & { 34 | position: relative; 35 | top: -1px; 36 | } 37 | } 38 | 39 | // Colors 40 | // Contextual variations (linked labels get darker on :hover) 41 | 42 | .label-default { 43 | .label-variant(@label-default-bg); 44 | } 45 | 46 | .label-primary { 47 | .label-variant(@label-primary-bg); 48 | } 49 | 50 | .label-success { 51 | .label-variant(@label-success-bg); 52 | } 53 | 54 | .label-info { 55 | .label-variant(@label-info-bg); 56 | } 57 | 58 | .label-warning { 59 | .label-variant(@label-warning-bg); 60 | } 61 | 62 | .label-danger { 63 | .label-variant(@label-danger-bg); 64 | } 65 | -------------------------------------------------------------------------------- /app/styles/less/list-group.less: -------------------------------------------------------------------------------- 1 | // 2 | // List groups 3 | // -------------------------------------------------- 4 | 5 | 6 | // Base class 7 | // 8 | // Easily usable on