├── .gitignore ├── .jscsrc ├── .jshintrc ├── .meteor ├── .finished-upgraders ├── .gitignore ├── .id ├── packages ├── platforms ├── release └── versions ├── LICENSE ├── README.md ├── app.json ├── client ├── client.js ├── head.html ├── styles │ ├── _feedly.scss │ ├── bootstrap │ │ ├── LICENSE │ │ ├── _alerts.scss │ │ ├── _badges.scss │ │ ├── _breadcrumbs.scss │ │ ├── _button-groups.scss │ │ ├── _buttons.scss │ │ ├── _carousel.scss │ │ ├── _close.scss │ │ ├── _code.scss │ │ ├── _component-animations.scss │ │ ├── _dropdowns.scss │ │ ├── _forms.scss │ │ ├── _glyphicons.scss │ │ ├── _grid.scss │ │ ├── _input-groups.scss │ │ ├── _jumbotron.scss │ │ ├── _labels.scss │ │ ├── _list-group.scss │ │ ├── _media.scss │ │ ├── _mixins.scss │ │ ├── _modals.scss │ │ ├── _navbar.scss │ │ ├── _navs.scss │ │ ├── _normalize.scss │ │ ├── _pager.scss │ │ ├── _pagination.scss │ │ ├── _panels.scss │ │ ├── _popovers.scss │ │ ├── _print.scss │ │ ├── _progress-bars.scss │ │ ├── _responsive-utilities.scss │ │ ├── _scaffolding.scss │ │ ├── _tables.scss │ │ ├── _theme.scss │ │ ├── _thumbnails.scss │ │ ├── _tooltip.scss │ │ ├── _type.scss │ │ ├── _utilities.scss │ │ ├── _variables.scss │ │ └── _wells.scss │ └── main.scss └── templates │ ├── aggregated-feed.html │ ├── app-body.html │ ├── app-body.js │ ├── feed.html │ ├── feed.js │ ├── nav.html │ ├── nav.js │ ├── people.html │ ├── people.js │ ├── trending.html │ └── trending.js ├── lib ├── collections.js ├── methods.js └── router.js ├── public ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff └── media │ ├── 011.jpg │ ├── 144568575661705981_4ade117f9005.jpeg │ ├── 164471358120532732_a3ae9498ad97.jpg │ ├── 167111313523218252_a6046175bb32.jpeg │ ├── 184290639033145973_71e492dacec6.jpeg │ ├── 1addc6292e97f5f796cf368df5d4b322.jpg │ ├── 261379381_d8fde25053fa.jpg │ ├── 272236897059737539_c4806e0b14c4.jpg │ ├── 275088534757448505_4f85768f71ec.jpg │ ├── 281485446934954481_c04cfc76c018.png │ ├── 293704645_b4c6dab8ed99.jpg │ ├── 389230669370236857_335b7c698687.jpg │ ├── 6fb3f77d22ddc23305fcd1a2fd8c4e80.jpg │ ├── 70602b9d4f965eee1d0345d99622798f.jpg │ ├── 73f98aae32e30a729bdf1031a78db65a.jpg │ ├── admin.jpg │ ├── e2110e4545f1cc11043659fdd9c07b43.jpg │ └── e315a43813c5533b9f47754406019e24.jpg ├── server ├── bootstrap.js ├── methods.js └── publish.js └── settings.json /.gitignore: -------------------------------------------------------------------------------- 1 | .sass-cache 2 | -------------------------------------------------------------------------------- /.jscsrc: -------------------------------------------------------------------------------- 1 | { 2 | "preset": "airbnb", 3 | "requirePaddingNewLinesBeforeLineComments": null, 4 | "disallowQuotedKeysInObjects": false, 5 | "disallowMultipleVarDecl": false, 6 | "requireDotNotation": false, 7 | "safeContextKeyword": null, 8 | } 9 | -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | 2 | { 3 | // JSHint Default Configuration File (as on JSHint website) 4 | // See http://jshint.com/docs/ for more details 5 | 6 | "maxerr" : 50, // {int} Maximum error before stopping 7 | 8 | // Enforcing 9 | "bitwise" : true, // true: Prohibit bitwise operators (&, |, ^, etc.) 10 | "camelcase" : false, // true: Identifiers must be in camelCase 11 | "curly" : false, // true: Require {} for every new block or scope 12 | "eqeqeq" : true, // true: Require triple equals (===) for comparison 13 | "forin" : true, // true: Require filtering for..in loops with obj.hasOwnProperty() 14 | "freeze" : true, // true: prohibits overwriting prototypes of native objects such as Array, Date etc. 15 | "immed" : false, // true: Require immediate invocations to be wrapped in parens e.g. `(function () { } ());` 16 | "indent" : 4, // {int} Number of spaces to use for indentation 17 | "latedef" : false, // true: Require variables/functions to be defined before being used 18 | "newcap" : false, // true: Require capitalization of all constructor functions e.g. `new F()` 19 | "noarg" : true, // true: Prohibit use of `arguments.caller` and `arguments.callee` 20 | "noempty" : true, // true: Prohibit use of empty blocks 21 | "nonbsp" : true, // true: Prohibit "non-breaking whitespace" characters. 22 | "nonew" : false, // true: Prohibit use of constructors for side-effects (without assignment) 23 | "plusplus" : false, // true: Prohibit use of `++` and `--` 24 | "quotmark" : "single", // Quotation mark consistency: 25 | // false : do nothing (default) 26 | // true : ensure whatever is used is consistent 27 | // "single" : require single quotes 28 | // "double" : require double quotes 29 | "undef" : false, // true: Require all non-global variables to be declared (prevents global leaks) 30 | "unused" : true, // Unused variables: 31 | // true : all variables, last function parameter 32 | // "vars" : all variables only 33 | // "strict" : all variables, all function parameters 34 | "strict" : false, // true: Requires all functions run in ES5 Strict Mode 35 | "maxparams" : false, // {int} Max number of formal params allowed per function 36 | "maxdepth" : false, // {int} Max depth of nested blocks (within functions) 37 | "maxstatements" : false, // {int} Max number statements per function 38 | "maxcomplexity" : false, // {int} Max cyclomatic complexity per function 39 | "maxlen" : false, // {int} Max number of characters per line 40 | "varstmt" : false, // true: Disallow any var statements. Only `let` and `const` are allowed. 41 | 42 | // Relaxing 43 | "asi" : false, // true: Tolerate Automatic Semicolon Insertion (no semicolons) 44 | "boss" : false, // true: Tolerate assignments where comparisons would be expected 45 | "debug" : false, // true: Allow debugger statements e.g. browser breakpoints. 46 | "eqnull" : false, // true: Tolerate use of `== null` 47 | "esnext" : true, // true: Allow ES.next (ES6) syntax (ex: `const`) 48 | "moz" : false, // true: Allow Mozilla specific syntax (extends and overrides esnext features) 49 | // (ex: `for each`, multiple try/catch, function expression…) 50 | "evil" : false, // true: Tolerate use of `eval` and `new Function()` 51 | "expr" : false, // true: Tolerate `ExpressionStatement` as Programs 52 | "funcscope" : false, // true: Tolerate defining variables inside control statements 53 | "globalstrict" : false, // true: Allow global "use strict" (also enables 'strict') 54 | "iterator" : false, // true: Tolerate using the `__iterator__` property 55 | "lastsemic" : false, // true: Tolerate omitting a semicolon for the last statement of a 1-line block 56 | "laxbreak" : false, // true: Tolerate possibly unsafe line breakings 57 | "laxcomma" : false, // true: Tolerate comma-first style coding 58 | "loopfunc" : false, // true: Tolerate functions being defined in loops 59 | "multistr" : false, // true: Tolerate multi-line strings 60 | "noyield" : false, // true: Tolerate generator functions with no yield statement in them. 61 | "notypeof" : false, // true: Tolerate invalid typeof operator values 62 | "proto" : false, // true: Tolerate using the `__proto__` property 63 | "scripturl" : false, // true: Tolerate script-targeted URLs 64 | "shadow" : false, // true: Allows re-define variables later in code e.g. `var x=1; x=2;` 65 | "sub" : true, // true: Tolerate using `[]` notation when it can still be expressed in dot notation 66 | "supernew" : false, // true: Tolerate `new function () { ... };` and `new Object;` 67 | "validthis" : false, // true: Tolerate using this in a non-constructor function 68 | 69 | // Environments 70 | "browser" : true, // Web Browser (window, document, etc) 71 | "browserify" : true, // Browserify (node.js code in the browser) 72 | "couch" : false, // CouchDB 73 | "devel" : false, // Development/debugging (alert, confirm, etc) 74 | "dojo" : false, // Dojo Toolkit 75 | "jasmine" : false, // Jasmine 76 | "jquery" : false, // jQuery 77 | "mocha" : true, // Mocha 78 | "mootools" : false, // MooTools 79 | "node" : true, // Node.js 80 | "nonstandard" : false, // Widely adopted globals (escape, unescape, etc) 81 | "phantom" : false, // PhantomJS 82 | "prototypejs" : false, // Prototype and Scriptaculous 83 | "qunit" : false, // QUnit 84 | "rhino" : false, // Rhino 85 | "shelljs" : false, // ShellJS 86 | "typed" : false, // Globals for typed array constructions 87 | "worker" : false, // Web Workers 88 | "wsh" : false, // Windows Scripting Host 89 | "yui" : false, // Yahoo User Interface 90 | 91 | // Custom Globals 92 | "globals" : { 93 | "Meteor": false, 94 | "DDP": false, 95 | "Mongo": false, //Meteor.Collection renamed to Mongo.Collection 96 | "Session": false, 97 | "Accounts": false, 98 | "Template": false, 99 | "Blaze": false, //UI is being renamed Blaze 100 | "UI": false, 101 | "Match": false, 102 | "check": false, 103 | "Tracker": false, //Deps renamed to Tracker 104 | "Deps": false, 105 | "ReactiveVar": false, 106 | "EJSON": false, 107 | "HTTP": false, 108 | "Email": false, 109 | "Assets": false, 110 | "Handlebars": false, // https://github.com/meteor/meteor/wiki/Handlebars 111 | "Package": false, 112 | "App": false, //mobile-config.js 113 | // Meteor internals 114 | "DDPServer": false, 115 | "global": false, 116 | "Log": false, 117 | "MongoInternals": false, 118 | "process": false, 119 | "WebApp": false, 120 | "WebAppInternals": false, 121 | // globals useful when creating Meteor packages 122 | "Npm": false, 123 | "Tinytest": false, 124 | // common Meteor packages 125 | "Random": false, 126 | "_": false, // Underscore.js 127 | "$": false, // jQuery 128 | "Router": false // iron-router 129 | } // additional predefined global variables 130 | } 131 | -------------------------------------------------------------------------------- /.meteor/.finished-upgraders: -------------------------------------------------------------------------------- 1 | # This file contains information which helps Meteor properly upgrade your 2 | # app when you run 'meteor update'. You should check it into version control 3 | # with your project. 4 | 5 | notices-for-0.9.0 6 | notices-for-0.9.1 7 | 0.9.4-platform-file 8 | notices-for-facebook-graph-api-2 9 | 1.2.0-standard-minifiers-package 10 | 1.2.0-meteor-platform-split 11 | 1.2.0-cordova-changes 12 | 1.2.0-breaking-changes 13 | -------------------------------------------------------------------------------- /.meteor/.gitignore: -------------------------------------------------------------------------------- 1 | local 2 | -------------------------------------------------------------------------------- /.meteor/.id: -------------------------------------------------------------------------------- 1 | # This file contains a token that is unique to your project. 2 | # Check it into your repository along with the rest of this directory. 3 | # It can be used for purposes such as: 4 | # - ensuring you don't accidentally deploy one app on top of another 5 | # - providing package authors with aggregated statistics 6 | 7 | ppi6nf13xcp75kd2nlm 8 | -------------------------------------------------------------------------------- /.meteor/packages: -------------------------------------------------------------------------------- 1 | # Meteor packages used by this project, one per line. 2 | # Check this file (and the other files in this directory) into your repository. 3 | # 4 | # 'meteor add' and 'meteor remove' will edit this file for you, 5 | # but you can also edit it by hand. 6 | 7 | meteor-base # Packages every Meteor app needs to have 8 | mobile-experience # Packages for a great mobile UX 9 | mongo # The database Meteor supports right now 10 | blaze-html-templates # Compile .html files into Meteor Blaze views 11 | session # Client-side reactive dictionary for your app 12 | jquery # Helpful client-side library 13 | tracker # Meteor's client-side reactive programming library 14 | 15 | standard-minifiers # JS/CSS minifiers run for production mode 16 | es5-shim # ECMAScript 5 compatibility for older browsers. 17 | ecmascript # Enable ECMAScript2015+ syntax in app code 18 | 19 | accounts-base 20 | iron:router 21 | fourseven:scss 22 | accounts-password 23 | check 24 | accounts-github 25 | getstream:stream-meteor 26 | dburles:collection-helpers 27 | ian:accounts-ui-bootstrap-3 28 | twbs:bootstrap 29 | momentjs:moment 30 | reactive-var 31 | -------------------------------------------------------------------------------- /.meteor/platforms: -------------------------------------------------------------------------------- 1 | server 2 | browser 3 | -------------------------------------------------------------------------------- /.meteor/release: -------------------------------------------------------------------------------- 1 | METEOR@1.2.1 2 | -------------------------------------------------------------------------------- /.meteor/versions: -------------------------------------------------------------------------------- 1 | accounts-base@1.2.2 2 | accounts-github@1.0.6 3 | accounts-oauth@1.1.8 4 | accounts-password@1.1.4 5 | anti:i18n@0.4.3 6 | autoupdate@1.2.4 7 | babel-compiler@5.8.24_1 8 | babel-runtime@0.1.4 9 | base64@1.0.4 10 | binary-heap@1.0.4 11 | blaze@2.1.3 12 | blaze-html-templates@1.0.1 13 | blaze-tools@1.0.4 14 | boilerplate-generator@1.0.4 15 | caching-compiler@1.0.0 16 | caching-html-compiler@1.0.2 17 | callback-hook@1.0.4 18 | check@1.1.0 19 | coffeescript@1.0.11 20 | cosmos:browserify@0.10.0 21 | dburles:collection-helpers@1.0.4 22 | dburles:mongo-collection-instances@0.3.4 23 | ddp@1.2.2 24 | ddp-client@1.2.1 25 | ddp-common@1.2.2 26 | ddp-rate-limiter@1.0.0 27 | ddp-server@1.2.2 28 | deps@1.0.9 29 | diff-sequence@1.0.1 30 | ecmascript@0.1.6 31 | ecmascript-runtime@0.2.6 32 | ejson@1.0.7 33 | email@1.0.8 34 | es5-shim@4.1.14 35 | fastclick@1.0.7 36 | fourseven:scss@3.4.1 37 | geojson-utils@1.0.4 38 | getstream:stream-meteor@0.4.0 39 | github@1.1.4 40 | hot-code-push@1.0.0 41 | html-tools@1.0.5 42 | htmljs@1.0.5 43 | http@1.1.1 44 | ian:accounts-ui-bootstrap-3@1.2.84 45 | id-map@1.0.4 46 | iron:controller@1.0.12 47 | iron:core@1.0.11 48 | iron:dynamic-template@1.0.12 49 | iron:layout@1.0.12 50 | iron:location@1.0.11 51 | iron:middleware-stack@1.0.11 52 | iron:router@1.0.12 53 | iron:url@1.0.11 54 | jquery@1.11.4 55 | lai:collection-extensions@0.1.4 56 | launch-screen@1.0.4 57 | livedata@1.0.15 58 | localstorage@1.0.5 59 | logging@1.0.8 60 | matb33:collection-hooks@0.7.15 61 | meteor@1.1.10 62 | meteor-base@1.0.1 63 | minifiers@1.1.7 64 | minimongo@1.0.10 65 | mobile-experience@1.0.1 66 | mobile-status-bar@1.0.6 67 | momentjs:moment@2.10.6 68 | mongo@1.1.3 69 | mongo-id@1.0.1 70 | npm-bcrypt@0.7.8_2 71 | npm-mongo@1.4.39_1 72 | oauth@1.1.6 73 | oauth2@1.1.5 74 | observe-sequence@1.0.7 75 | ordered-dict@1.0.4 76 | promise@0.5.1 77 | random@1.0.5 78 | rate-limit@1.0.0 79 | reactive-dict@1.1.3 80 | reactive-var@1.0.6 81 | reload@1.1.4 82 | retry@1.0.4 83 | routepolicy@1.0.6 84 | service-configuration@1.0.5 85 | session@1.1.1 86 | sha@1.0.4 87 | spacebars@1.0.7 88 | spacebars-compiler@1.0.7 89 | srp@1.0.4 90 | standard-minifiers@1.0.2 91 | stylus@2.511.1 92 | templating@1.1.5 93 | templating-tools@1.0.0 94 | tracker@1.0.9 95 | twbs:bootstrap@3.3.6 96 | ui@1.0.8 97 | underscore@1.0.4 98 | url@1.0.5 99 | webapp@1.2.3 100 | webapp-hashing@1.0.5 101 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2015, Stream.io INC 2 | All rights reserved. 3 | 4 | Redistribution and use in source and binary forms, with or without 5 | modification, are permitted provided that the following conditions are met: 6 | 7 | * Redistributions of source code must retain the above copyright notice, this 8 | list of conditions and the following disclaimer. 9 | 10 | * Redistributions in binary form must reproduce the above copyright notice, 11 | this list of conditions and the following disclaimer in the documentation 12 | and/or other materials provided with the distribution. 13 | 14 | * Neither the name of Stream.io INC nor the names of its 15 | contributors may be used to endorse or promote products derived from 16 | this software without specific prior written permission. 17 | 18 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 19 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 20 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 21 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE 22 | FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL 23 | DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR 24 | SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER 25 | CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, 26 | OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 27 | OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 28 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Stream Meteor Example App 2 | 3 | This example Meteor js app shows you how you can use [GetStream.io](https://getstream.io) to built a site similar to Pinterest. 4 | 5 | ## Running locally 6 | 7 | To run this app locally clone this repository add your [Getstream.io](https://getstream.io/dashboard) app key/id/secret to ``settings.json`` and run the following command in the repositories directory: 8 | 9 | ``` 10 | meteor run --settings settings.json 11 | ``` 12 | -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Stream Example App", 3 | "description": "Pinterest esque example app using GetStream.io", 4 | "keywords": [ 5 | "getstream.io", 6 | "Meteor", 7 | "HTML5", 8 | "nodejs" 9 | ], 10 | "website": "https://getstream.io/", 11 | "logo": "http://33.media.tumblr.com/avatar_be8b5eef9ae6_128.png", 12 | "success_url": "/", 13 | "env": { 14 | }, 15 | "addons": [ 16 | "stream", "mongolab" 17 | ], 18 | } -------------------------------------------------------------------------------- /client/client.js: -------------------------------------------------------------------------------- 1 | function username(user) { 2 | if(user && user.username) { 3 | return user.username; 4 | } else if(user && user.services && user.services.github) { 5 | return user.services.github.username; 6 | } else { 7 | return 'unkown user'; 8 | } 9 | } 10 | 11 | Template.registerHelper('equals', (v1, v2) => (v1 === v2)); 12 | 13 | Template.registerHelper('avatarUrl', function(user) { 14 | if(user && user.profile && user.profile.avatar_url) { 15 | return user.profile.avatar_url; 16 | } else if(user) { 17 | return 'https://avatars.githubusercontent.com/' + username(user); 18 | } 19 | }); 20 | 21 | Template.registerHelper('username', username); 22 | 23 | Template.registerHelper('pinned', function(itemId) { 24 | return Pins.find({item: itemId, user: Meteor.userId()}).count() > 0; 25 | }); 26 | 27 | Template.registerHelper('fromNow', time => moment(time).fromNow()); -------------------------------------------------------------------------------- /client/head.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Stream Framework example | Pinterest esque example app 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /client/styles/_feedly.scss: -------------------------------------------------------------------------------- 1 | // MEDIA QUERIES 2 | // -------------------------------------------------- 3 | @mixin respond-to($size, $operator: 'min', $unit: 'px', $query: 'only screen', $unitToRender:'') { 4 | @if unitless($size) { 5 | $unitToRender: 'px' 6 | } @else { 7 | $unitToRender: '' 8 | } 9 | @media #{$query} and (#{$operator}-width: #{$size}#{$unitToRender}) { 10 | @content; 11 | } 12 | } 13 | 14 | @mixin column-gap($size) { 15 | -webkit-column-gap: $size#{'px'}; 16 | -moz-column-gap: $size#{'px'}; 17 | column-gap: $size#{'px'}; 18 | } 19 | 20 | @mixin column-count($quantity) { 21 | -webkit-column-count: $quantity; 22 | -moz-column-count: $quantity; 23 | column-count: $quantity; 24 | } 25 | 26 | #notification-container { 27 | width: 300px; 28 | } 29 | 30 | .badge { 31 | background-color: #d2322d; 32 | } 33 | 34 | body { 35 | min-height: 2000px; 36 | padding-top: 50px; 37 | } 38 | 39 | #wrapper { 40 | max-width: 1100px; 41 | margin: 50px auto; 42 | padding: 0 15px; 43 | } 44 | 45 | .container-pins { 46 | 47 | @include respond-to(480) { 48 | @include column-gap(15); 49 | @include column-count(2); 50 | } 51 | @include respond-to(768) { 52 | @include column-count(3); 53 | } 54 | @include respond-to(1024) { 55 | &:not(.profile) { 56 | @include column-count(4); 57 | } 58 | } 59 | @include respond-to(1100) { 60 | &:not(.profile) { 61 | @include column-count(5); 62 | } 63 | } 64 | } 65 | 66 | .aggregation { 67 | background: #fff; 68 | padding: $grid-gutter-width; 69 | margin-bottom: $grid-gutter-width; 70 | box-shadow: 0 1px 7px 2px rgba(0,0,0,.1); 71 | 72 | & .pin { 73 | max-width: 270px; 74 | margin-right: $grid-gutter-width / 2; 75 | box-shadow: none; 76 | border: 1px solid #eee; 77 | } 78 | & .pin-image { 79 | max-width: 100%; 80 | height: auto; 81 | width: auto; 82 | } 83 | 84 | & .pin-image-holder { 85 | width: auto; 86 | max-height: 270px; 87 | } 88 | } 89 | 90 | .aggregation-header { 91 | height: 45px; 92 | line-height: 45px; 93 | margin-bottom: $grid-gutter-width / 2; 94 | text-transform: uppercase; 95 | } 96 | 97 | .aggregation-time { 98 | text-transform: none; 99 | font-size: 10px; 100 | color: #999; 101 | } 102 | 103 | .pin { 104 | display: inline-block; 105 | background: #fff; 106 | box-shadow: 0 1px 7px 2px rgba(0,0,0,.1); 107 | margin: 0 0 $grid-gutter-width / 2; 108 | -webkit-column-break-inside: avoid; 109 | -moz-column-break-inside: avoid; 110 | column-break-inside: avoid; 111 | @include transition(all .2s ease); 112 | 113 | & textarea { 114 | resize: vertical; 115 | } 116 | } 117 | 118 | .pin-image { 119 | width: 100%; 120 | } 121 | 122 | .pin-image-holder { 123 | overflow: hidden; 124 | width: 100%; 125 | box-shadow: inset 0 1px 2px rgba(0,0,0,.2); 126 | border-bottom: 1px solid rgba(0,0,0,.1); 127 | } 128 | 129 | .pin-caption { 130 | padding: $grid-gutter-width / 2 $grid-gutter-width / 2 0 $grid-gutter-width / 2; 131 | color: $gray; 132 | font-size: 12px; 133 | line-height: 17px; 134 | word-wrap: break-word; 135 | } 136 | 137 | .follow-caption { 138 | padding: $grid-gutter-width / 2 $grid-gutter-width / 2 $grid-gutter-width / 2 $grid-gutter-width / 2; 139 | color: $gray; 140 | font-size: 12px; 141 | line-height: 17px; 142 | word-wrap: break-word; 143 | } 144 | 145 | .pin-bottom { 146 | padding: $grid-gutter-width / 2; 147 | } 148 | 149 | .pin-attribution { 150 | white-space: nowrap; 151 | overflow: hidden; 152 | -ms-text-overflow: ellipsis; 153 | -o-text-overflow: ellipsis; 154 | text-overflow: ellipsis; 155 | color: #717171; 156 | display: block; 157 | color: $gray; 158 | font-size: 10px; 159 | padding: 5px 15px; 160 | background: #f5f5f5; 161 | border-top: 1px solid #eee; 162 | text-transform: uppercase; 163 | } -------------------------------------------------------------------------------- /client/styles/bootstrap/LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2011 Twitter, Inc. 2 | 3 | Licensed under the Apache License, Version 2.0 (the "License"); 4 | you may not use this file except in compliance with the License. 5 | You may obtain a copy of the License at 6 | 7 | http://www.apache.org/licenses/LICENSE-2.0 8 | 9 | Unless required by applicable law or agreed to in writing, software 10 | distributed under the License is distributed on an "AS IS" BASIS, 11 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | See the License for the specific language governing permissions and 13 | limitations under the License. 14 | 15 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_alerts.scss: -------------------------------------------------------------------------------- 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 $headingsColor 19 | color: inherit; 20 | } 21 | // Provide class for links that match alerts 22 | .alert-link { 23 | font-weight: $alert-link-font-weight; 24 | } 25 | 26 | // Improve alignment and spacing of inner content 27 | > p, 28 | > ul { 29 | margin-bottom: 0; 30 | } 31 | > p + p { 32 | margin-top: 5px; 33 | } 34 | } 35 | 36 | // Dismissable alerts 37 | // 38 | // Expand the right padding and account for the close button's positioning. 39 | 40 | .alert-dismissable { 41 | padding-right: ($alert-padding + 20); 42 | 43 | // Adjust close link position 44 | .close { 45 | position: relative; 46 | top: -2px; 47 | right: -21px; 48 | color: inherit; 49 | } 50 | } 51 | 52 | // Alternate styles 53 | // 54 | // Generate contextual modifier classes for colorizing the alert. 55 | 56 | .alert-success { 57 | @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text); 58 | } 59 | .alert-info { 60 | @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text); 61 | } 62 | .alert-warning { 63 | @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text); 64 | } 65 | .alert-danger { 66 | @include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text); 67 | } 68 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_badges.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Badges 3 | // -------------------------------------------------- 4 | 5 | 6 | // Base classes 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 | 27 | // Hover state, but only for links 28 | a.badge { 29 | &:hover, 30 | &:focus { 31 | color: $badge-link-hover-color; 32 | text-decoration: none; 33 | cursor: pointer; 34 | } 35 | } 36 | 37 | // Quick fix for labels/badges in buttons 38 | .btn .badge { 39 | position: relative; 40 | top: -1px; 41 | } 42 | 43 | // Account for counters in navs 44 | a.list-group-item.active > .badge, 45 | .nav-pills > .active > a > .badge { 46 | color: $badge-active-color; 47 | background-color: $badge-active-bg; 48 | } 49 | .nav-pills > li > a > .badge { 50 | margin-left: 3px; 51 | } 52 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_breadcrumbs.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Breadcrumbs 3 | // -------------------------------------------------- 4 | 5 | 6 | .breadcrumb { 7 | padding: 8px 15px; 8 | margin-bottom: $line-height-computed; 9 | list-style: none; 10 | background-color: $breadcrumb-bg; 11 | border-radius: $border-radius-base; 12 | > li { 13 | display: inline-block; 14 | &+li:before { 15 | content: "/\00a0"; // Unicode space added since inline-block means non-collapsing white-space 16 | padding: 0 5px; 17 | color: $breadcrumb-color; 18 | } 19 | } 20 | > .active { 21 | color: $breadcrumb-active-color; 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_button-groups.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Button groups 3 | // -------------------------------------------------- 4 | 5 | // Button carets 6 | // 7 | // Match the button text color to the arrow/caret for indicating dropdown-ness. 8 | 9 | .caret { 10 | .btn-default & { 11 | border-top-color: $btn-default-color; 12 | } 13 | .btn-primary &, 14 | .btn-success &, 15 | .btn-warning &, 16 | .btn-danger &, 17 | .btn-info & { 18 | border-top-color: #fff; 19 | } 20 | } 21 | .dropup { 22 | & .btn-default .caret { 23 | border-bottom-color: $btn-default-color; 24 | } 25 | .btn-primary, 26 | .btn-success, 27 | .btn-warning, 28 | .btn-danger, 29 | .btn-info { 30 | .caret { 31 | border-bottom-color: #fff; 32 | } 33 | } 34 | } 35 | 36 | // Make the div behave like a button 37 | .btn-group, 38 | .btn-group-vertical { 39 | position: relative; 40 | display: inline-block; 41 | vertical-align: middle; // match .btn alignment given font-size hack above 42 | > .btn { 43 | position: relative; 44 | float: left; 45 | // Bring the "active" button to the front 46 | &:hover, 47 | &:focus, 48 | &:active, 49 | &.active { 50 | z-index: 2; 51 | } 52 | &:focus { 53 | // Remove focus outline when dropdown JS adds it after closing the menu 54 | outline: none; 55 | } 56 | } 57 | } 58 | 59 | // Prevent double borders when buttons are next to each other 60 | .btn-group { 61 | .btn + .btn, 62 | .btn + .btn-group, 63 | .btn-group + .btn, 64 | .btn-group + .btn-group { 65 | margin-left: -1px; 66 | } 67 | } 68 | 69 | // Optional: Group multiple button groups together for a toolbar 70 | .btn-toolbar { 71 | @include clearfix(); 72 | 73 | .btn-group { 74 | float: left; 75 | } 76 | // Space out series of button groups 77 | > .btn, 78 | > .btn-group { 79 | + .btn, 80 | + .btn-group { 81 | margin-left: 5px; 82 | } 83 | } 84 | } 85 | 86 | .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { 87 | border-radius: 0; 88 | } 89 | 90 | // 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 91 | .btn-group > .btn:first-child { 92 | margin-left: 0; 93 | &:not(:last-child):not(.dropdown-toggle) { 94 | @include border-right-radius(0); 95 | } 96 | } 97 | // Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it 98 | .btn-group > .btn:last-child:not(:first-child), 99 | .btn-group > .dropdown-toggle:not(:first-child) { 100 | @include border-left-radius(0); 101 | } 102 | 103 | // Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group) 104 | .btn-group > .btn-group { 105 | float: left; 106 | } 107 | .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { 108 | border-radius: 0; 109 | } 110 | .btn-group > .btn-group:first-child { 111 | > .btn:last-child, 112 | > .dropdown-toggle { 113 | @include border-right-radius(0); 114 | } 115 | } 116 | .btn-group > .btn-group:last-child > .btn:first-child { 117 | @include border-left-radius(0); 118 | } 119 | 120 | // On active and open, don't show outline 121 | .btn-group .dropdown-toggle:active, 122 | .btn-group.open .dropdown-toggle { 123 | outline: 0; 124 | } 125 | 126 | 127 | // Sizing 128 | // 129 | // Remix the default button sizing classes into new ones for easier manipulation. 130 | 131 | .btn-group-xs > .btn { @extend .btn-xs; } 132 | .btn-group-sm > .btn { @extend .btn-sm; } 133 | .btn-group-lg > .btn { @extend .btn-lg; } 134 | 135 | 136 | // Split button dropdowns 137 | // ---------------------- 138 | 139 | // Give the line between buttons some depth 140 | .btn-group > .btn + .dropdown-toggle { 141 | padding-left: 8px; 142 | padding-right: 8px; 143 | } 144 | .btn-group > .btn-lg + .dropdown-toggle { 145 | padding-left: 12px; 146 | padding-right: 12px; 147 | } 148 | 149 | // The clickable button for toggling the menu 150 | // Remove the gradient and set the same inset shadow as the :active state 151 | .btn-group.open .dropdown-toggle { 152 | @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); 153 | } 154 | 155 | 156 | // Reposition the caret 157 | .btn .caret { 158 | margin-left: 0; 159 | } 160 | // Carets in other button sizes 161 | .btn-lg .caret { 162 | border-width: $caret-width-large $caret-width-large 0; 163 | border-bottom-width: 0; 164 | } 165 | // Upside down carets for .dropup 166 | .dropup .btn-lg .caret { 167 | border-width: 0 $caret-width-large $caret-width-large; 168 | } 169 | 170 | 171 | // Vertical button groups 172 | // ---------------------- 173 | 174 | .btn-group-vertical { 175 | > .btn, 176 | > .btn-group { 177 | display: block; 178 | float: none; 179 | width: 100%; 180 | max-width: 100%; 181 | } 182 | 183 | // Clear floats so dropdown menus can be properly placed 184 | > .btn-group { 185 | @include clearfix(); 186 | > .btn { 187 | float: none; 188 | } 189 | } 190 | 191 | > .btn + .btn, 192 | > .btn + .btn-group, 193 | > .btn-group + .btn, 194 | > .btn-group + .btn-group { 195 | margin-top: -1px; 196 | margin-left: 0; 197 | } 198 | } 199 | 200 | .btn-group-vertical > .btn { 201 | &:not(:first-child):not(:last-child) { 202 | border-radius: 0; 203 | } 204 | &:first-child:not(:last-child) { 205 | border-top-right-radius: $border-radius-base; 206 | @include border-bottom-radius(0); 207 | } 208 | &:last-child:not(:first-child) { 209 | border-bottom-left-radius: $border-radius-base; 210 | @include border-top-radius(0); 211 | } 212 | } 213 | .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { 214 | border-radius: 0; 215 | } 216 | .btn-group-vertical > .btn-group:first-child { 217 | > .btn:last-child, 218 | > .dropdown-toggle { 219 | @include border-bottom-radius(0); 220 | } 221 | } 222 | .btn-group-vertical > .btn-group:last-child > .btn:first-child { 223 | @include border-top-radius(0); 224 | } 225 | 226 | 227 | 228 | // Justified button groups 229 | // ---------------------- 230 | 231 | .btn-group-justified { 232 | display: table; 233 | width: 100%; 234 | table-layout: fixed; 235 | border-collapse: separate; 236 | .btn { 237 | float: none; 238 | display: table-cell; 239 | width: 1%; 240 | } 241 | } 242 | 243 | 244 | // Checkbox and radio options 245 | [data-toggle="buttons"] > .btn > input[type="radio"], 246 | [data-toggle="buttons"] > .btn > input[type="checkbox"] { 247 | display: none; 248 | } 249 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_buttons.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Buttons 3 | // -------------------------------------------------- 4 | 5 | 6 | // Base styles 7 | // -------------------------------------------------- 8 | 9 | // Core styles 10 | .btn { 11 | display: inline-block; 12 | padding: $padding-base-vertical $padding-base-horizontal; 13 | margin-bottom: 0; // For input.btn 14 | font-size: $font-size-base; 15 | font-weight: $btn-font-weight; 16 | line-height: $line-height-base; 17 | text-align: center; 18 | vertical-align: middle; 19 | cursor: pointer; 20 | border: 1px solid transparent; 21 | border-radius: $border-radius-base; 22 | white-space: nowrap; 23 | @include user-select(none); 24 | 25 | &:focus { 26 | @include tab-focus(); 27 | } 28 | 29 | &:hover, 30 | &:focus { 31 | color: $btn-default-color; 32 | text-decoration: none; 33 | } 34 | 35 | &:active, 36 | &.active { 37 | outline: 0; 38 | background-image: none; 39 | @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); 40 | } 41 | 42 | &.disabled, 43 | &[disabled], 44 | fieldset[disabled] & { 45 | cursor: not-allowed; 46 | pointer-events: none; // Future-proof disabling of clicks 47 | @include opacity(.65); 48 | @include box-shadow(none); 49 | } 50 | 51 | } 52 | 53 | 54 | // Alternate buttons 55 | // -------------------------------------------------- 56 | 57 | .btn-default { 58 | @include button-variant($btn-default-color, $btn-default-bg, $btn-default-border); 59 | } 60 | .btn-primary { 61 | @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border); 62 | } 63 | // Warning appears as orange 64 | .btn-warning { 65 | @include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border); 66 | } 67 | // Danger and error appear as red 68 | .btn-danger { 69 | @include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border); 70 | } 71 | // Success appears as green 72 | .btn-success { 73 | @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border); 74 | } 75 | // Info appears as blue-green 76 | .btn-info { 77 | @include button-variant($btn-info-color, $btn-info-bg, $btn-info-border); 78 | } 79 | 80 | 81 | // Link buttons 82 | // ------------------------- 83 | 84 | // Make a button look and behave like a link 85 | .btn-link { 86 | color: $link-color; 87 | font-weight: normal; 88 | cursor: pointer; 89 | border-radius: 0; 90 | 91 | &, 92 | &:active, 93 | &[disabled], 94 | fieldset[disabled] & { 95 | background-color: transparent; 96 | @include box-shadow(none); 97 | } 98 | &, 99 | &:hover, 100 | &:focus, 101 | &:active { 102 | border-color: transparent; 103 | } 104 | &:hover, 105 | &:focus { 106 | color: $link-hover-color; 107 | text-decoration: underline; 108 | background-color: transparent; 109 | } 110 | &[disabled], 111 | fieldset[disabled] & { 112 | &:hover, 113 | &:focus { 114 | color: $btn-link-disabled-color; 115 | text-decoration: none; 116 | } 117 | } 118 | } 119 | 120 | 121 | // Button Sizes 122 | // -------------------------------------------------- 123 | 124 | .btn-lg { 125 | // line-height: ensure even-numbered height of button next to large input 126 | @include button-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large); 127 | } 128 | .btn-sm, 129 | .btn-xs { 130 | // line-height: ensure proper height of button next to small input 131 | @include button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small); 132 | } 133 | .btn-xs { 134 | padding: 1px 5px; 135 | } 136 | 137 | 138 | // Block button 139 | // -------------------------------------------------- 140 | 141 | .btn-block { 142 | display: block; 143 | width: 100%; 144 | padding-left: 0; 145 | padding-right: 0; 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 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_carousel.scss: -------------------------------------------------------------------------------- 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 | @include transition(.6s ease-in-out left); 20 | 21 | // Account for jankitude on images 22 | > img, 23 | > a > img { 24 | @include img-responsive(); 25 | line-height: 1; 26 | } 27 | } 28 | 29 | > .active, 30 | > .next, 31 | > .prev { display: block; } 32 | 33 | > .active { 34 | left: 0; 35 | } 36 | 37 | > .next, 38 | > .prev { 39 | position: absolute; 40 | top: 0; 41 | width: 100%; 42 | } 43 | 44 | > .next { 45 | left: 100%; 46 | } 47 | > .prev { 48 | left: -100%; 49 | } 50 | > .next.left, 51 | > .prev.right { 52 | left: 0; 53 | } 54 | 55 | > .active.left { 56 | left: -100%; 57 | } 58 | > .active.right { 59 | left: 100%; 60 | } 61 | 62 | } 63 | 64 | // Left/right controls for nav 65 | // --------------------------- 66 | 67 | .carousel-control { 68 | position: absolute; 69 | top: 0; 70 | left: 0; 71 | bottom: 0; 72 | width: $carousel-control-width; 73 | @include opacity($carousel-control-opacity); 74 | font-size: $carousel-control-font-size; 75 | color: $carousel-control-color; 76 | text-align: center; 77 | text-shadow: $carousel-text-shadow; 78 | // We can't have this transition here because webkit cancels the carousel 79 | // animation if you trip this while in the middle of another animation. 80 | 81 | // Set gradients for backgrounds 82 | &.left { 83 | @include gradient-horizontal($start-color: rgba(0,0,0,.5), $end-color: rgba(0,0,0,.0001)); 84 | } 85 | &.right { 86 | left: auto; 87 | right: 0; 88 | @include gradient-horizontal($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.5)); 89 | } 90 | 91 | // Hover/focus state 92 | &:hover, 93 | &:focus { 94 | color: $carousel-control-color; 95 | text-decoration: none; 96 | @include opacity(.9); 97 | } 98 | 99 | // Toggles 100 | .icon-prev, 101 | .icon-next, 102 | .glyphicon-chevron-left, 103 | .glyphicon-chevron-right { 104 | position: absolute; 105 | top: 50%; 106 | left: 50%; 107 | z-index: 5; 108 | display: inline-block; 109 | } 110 | .icon-prev, 111 | .icon-next { 112 | width: 20px; 113 | height: 20px; 114 | margin-top: -10px; 115 | margin-left: -10px; 116 | font-family: serif; 117 | } 118 | 119 | .icon-prev { 120 | &:before { 121 | content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) 122 | } 123 | } 124 | .icon-next { 125 | &:before { 126 | content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) 127 | } 128 | } 129 | } 130 | 131 | // Optional indicator pips 132 | // 133 | // Add an unordered list with the following class and add a list item for each 134 | // slide your carousel holds. 135 | 136 | .carousel-indicators { 137 | position: absolute; 138 | bottom: 10px; 139 | left: 50%; 140 | z-index: 15; 141 | width: 60%; 142 | margin-left: -30%; 143 | padding-left: 0; 144 | list-style: none; 145 | text-align: center; 146 | 147 | li { 148 | display: inline-block; 149 | width: 10px; 150 | height: 10px; 151 | margin: 1px; 152 | text-indent: -999px; 153 | border: 1px solid $carousel-indicator-border-color; 154 | border-radius: 10px; 155 | cursor: pointer; 156 | } 157 | .active { 158 | margin: 0; 159 | width: 12px; 160 | height: 12px; 161 | background-color: $carousel-indicator-active-bg; 162 | } 163 | } 164 | 165 | // Optional captions 166 | // ----------------------------- 167 | // Hidden by default for smaller viewports 168 | .carousel-caption { 169 | position: absolute; 170 | left: 15%; 171 | right: 15%; 172 | bottom: 20px; 173 | z-index: 10; 174 | padding-top: 20px; 175 | padding-bottom: 20px; 176 | color: $carousel-caption-color; 177 | text-align: center; 178 | text-shadow: $carousel-text-shadow; 179 | & .btn { 180 | text-shadow: none; // No shadow for button elements in carousel-caption 181 | } 182 | } 183 | 184 | 185 | // Scale up controls for tablets and up 186 | @media screen and (min-width: $screen-tablet) { 187 | 188 | // Scale up the controls a smidge 189 | .carousel-control .icon-prev, 190 | .carousel-control .icon-next { 191 | width: 30px; 192 | height: 30px; 193 | margin-top: -15px; 194 | margin-left: -15px; 195 | font-size: 30px; 196 | } 197 | 198 | // Show and left align the captions 199 | .carousel-caption { 200 | left: 20%; 201 | right: 20%; 202 | padding-bottom: 30px; 203 | } 204 | 205 | // Move up the indicators 206 | .carousel-indicators { 207 | bottom: 20px; 208 | } 209 | } 210 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_close.scss: -------------------------------------------------------------------------------- 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 | @include opacity(.2); 14 | 15 | &:hover, 16 | &:focus { 17 | color: $close-color; 18 | text-decoration: none; 19 | cursor: pointer; 20 | @include opacity(.5); 21 | } 22 | 23 | // [converter] extracted button& to button.close 24 | } 25 | 26 | // Additional properties for button version 27 | // iOS requires the button element instead of an anchor tag. 28 | // If you want the anchor version, it requires `href="#"`. 29 | button.close { 30 | padding: 0; 31 | cursor: pointer; 32 | background: transparent; 33 | border: 0; 34 | -webkit-appearance: none; 35 | } 36 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_code.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Code (inline and blocK) 3 | // -------------------------------------------------- 4 | 5 | 6 | // Inline and block code styles 7 | code, 8 | pre { 9 | font-family: $font-family-monospace; 10 | } 11 | 12 | // Inline code 13 | code { 14 | padding: 2px 4px; 15 | font-size: 90%; 16 | color: $code-color; 17 | background-color: $code-bg; 18 | white-space: nowrap; 19 | border-radius: $border-radius-base; 20 | } 21 | 22 | // Blocks of code 23 | pre { 24 | display: block; 25 | padding: (($line-height-computed - 1) / 2); 26 | margin: 0 0 ($line-height-computed / 2); 27 | font-size: ($font-size-base - 1); // 14px to 13px 28 | line-height: $line-height-base; 29 | word-break: break-all; 30 | word-wrap: break-word; 31 | color: $pre-color; 32 | background-color: $pre-bg; 33 | border: 1px solid $pre-border-color; 34 | border-radius: $border-radius-base; 35 | 36 | // Make prettyprint styles more spaced out for readability 37 | &.prettyprint { 38 | margin-bottom: $line-height-computed; 39 | } 40 | 41 | // Account for some code outputs that place code tags in pre tags 42 | code { 43 | padding: 0; 44 | font-size: inherit; 45 | color: inherit; 46 | white-space: pre-wrap; 47 | background-color: transparent; 48 | border: 0; 49 | } 50 | } 51 | 52 | // Enable scrollable blocks of code 53 | .pre-scrollable { 54 | max-height: $pre-scrollable-max-height; 55 | overflow-y: scroll; 56 | } 57 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_component-animations.scss: -------------------------------------------------------------------------------- 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/twitter/bootstrap/pull/3552. 9 | 10 | .fade { 11 | opacity: 0; 12 | @include transition(opacity .15s linear); 13 | &.in { 14 | opacity: 1; 15 | } 16 | } 17 | 18 | .collapse { 19 | display: none; 20 | &.in { 21 | display: block; 22 | } 23 | } 24 | .collapsing { 25 | position: relative; 26 | height: 0; 27 | overflow: hidden; 28 | @include transition(height .35s ease); 29 | } 30 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_dropdowns.scss: -------------------------------------------------------------------------------- 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 solid $dropdown-caret-color; 14 | border-right: $caret-width-base solid transparent; 15 | border-left: $caret-width-base solid transparent; 16 | // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed, 17 | // we can just straight up remove this. 18 | border-bottom: 0 dotted; 19 | content: ""; 20 | } 21 | 22 | // The dropdown wrapper (div) 23 | .dropdown { 24 | position: relative; 25 | } 26 | 27 | // Prevent the focus on the dropdown toggle when closing dropdowns 28 | .dropdown-toggle:focus { 29 | outline: 0; 30 | } 31 | 32 | // The dropdown menu (ul) 33 | .dropdown-menu { 34 | position: absolute; 35 | top: 100%; 36 | left: 0; 37 | z-index: $zindex-dropdown; 38 | display: none; // none by default, but block on "open" of the menu 39 | float: left; 40 | min-width: 160px; 41 | padding: 5px 0; 42 | margin: 2px 0 0; // override default ul 43 | list-style: none; 44 | font-size: $font-size-base; 45 | background-color: $dropdown-bg; 46 | border: 1px solid $dropdown-fallback-border; // IE8 fallback 47 | border: 1px solid $dropdown-border; 48 | border-radius: $border-radius-base; 49 | @include box-shadow(0 6px 12px rgba(0,0,0,.175)); 50 | background-clip: padding-box; 51 | 52 | // Aligns the dropdown menu to right 53 | &.pull-right { 54 | right: 0; 55 | left: auto; 56 | } 57 | 58 | // Dividers (basically an hr) within the dropdown 59 | .divider { 60 | @include 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 | .dropdown-menu > .disabled > a { 110 | &:hover, 111 | &:focus { 112 | text-decoration: none; 113 | background-color: transparent; 114 | background-image: none; // Remove CSS gradient 115 | @include reset-filter(); 116 | cursor: not-allowed; 117 | } 118 | } 119 | 120 | // Open state for the dropdown 121 | .open { 122 | // Show the menu 123 | > .dropdown-menu { 124 | display: block; 125 | } 126 | 127 | // Remove the outline when :focus is triggered 128 | > a { 129 | outline: 0; 130 | } 131 | } 132 | 133 | // Dropdown section headers 134 | .dropdown-header { 135 | display: block; 136 | padding: 3px 20px; 137 | font-size: $font-size-small; 138 | line-height: $line-height-base; 139 | color: $dropdown-header-color; 140 | } 141 | 142 | // Backdrop to catch body clicks on mobile, etc. 143 | .dropdown-backdrop { 144 | position: fixed; 145 | left: 0; 146 | right: 0; 147 | bottom: 0; 148 | top: 0; 149 | z-index: $zindex-dropdown - 10; 150 | } 151 | 152 | // Right aligned dropdowns 153 | .pull-right > .dropdown-menu { 154 | right: 0; 155 | left: auto; 156 | } 157 | 158 | // Allow for dropdowns to go bottom up (aka, dropup-menu) 159 | // 160 | // Just add .dropup after the standard .dropdown class and you're set, bro. 161 | // TODO: abstract this so that the navbar fixed styles are not placed here? 162 | 163 | .dropup, 164 | .navbar-fixed-bottom .dropdown { 165 | // Reverse the caret 166 | .caret { 167 | // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once this 168 | // gets fixed, restore `border-top: 0;`. 169 | border-top: 0 dotted; 170 | border-bottom: 4px solid $dropdown-caret-color; 171 | content: ""; 172 | } 173 | // Different positioning for bottom up menu 174 | .dropdown-menu { 175 | top: auto; 176 | bottom: 100%; 177 | margin-bottom: 1px; 178 | } 179 | } 180 | 181 | 182 | // Component alignment 183 | // 184 | // Reiterate per navbar.less and the modified component alignment there. 185 | 186 | @media (min-width: $grid-float-breakpoint) { 187 | .navbar-right { 188 | .dropdown-menu { 189 | right: 0; 190 | left: auto; 191 | } 192 | } 193 | } 194 | 195 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_forms.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Forms 3 | // -------------------------------------------------- 4 | 5 | 6 | // Normalize non-controls 7 | // 8 | // Restyle and baseline non-control form elements. 9 | 10 | fieldset { 11 | padding: 0; 12 | margin: 0; 13 | border: 0; 14 | } 15 | 16 | legend { 17 | display: block; 18 | width: 100%; 19 | padding: 0; 20 | margin-bottom: $line-height-computed; 21 | font-size: ($font-size-base * 1.5); 22 | line-height: inherit; 23 | color: $legend-color; 24 | border: 0; 25 | border-bottom: 1px solid $legend-border-color; 26 | } 27 | 28 | label { 29 | display: inline-block; 30 | margin-bottom: 5px; 31 | font-weight: bold; 32 | } 33 | 34 | 35 | // Normalize form controls 36 | 37 | // Override content-box in Normalize (* isn't specific enough) 38 | input[type="search"] { 39 | @include box-sizing(border-box); 40 | } 41 | 42 | // Position radios and checkboxes better 43 | input[type="radio"], 44 | input[type="checkbox"] { 45 | margin: 4px 0 0; 46 | margin-top: 1px \9; /* IE8-9 */ 47 | line-height: normal; 48 | } 49 | 50 | // Set the height of select and file controls to match text inputs 51 | input[type="file"] { 52 | display: block; 53 | } 54 | 55 | // Make multiple select elements height not fixed 56 | select[multiple], 57 | select[size] { 58 | height: auto; 59 | } 60 | 61 | // Fix optgroup Firefox bug per https://github.com/twbs/bootstrap/issues/7611 62 | select optgroup { 63 | font-size: inherit; 64 | font-style: inherit; 65 | font-family: inherit; 66 | } 67 | 68 | // Focus for select, file, radio, and checkbox 69 | input[type="file"]:focus, 70 | input[type="radio"]:focus, 71 | input[type="checkbox"]:focus { 72 | @include tab-focus(); 73 | } 74 | 75 | // Fix for Chrome number input 76 | // Setting certain font-sizes causes the `I` bar to appear on hover of the bottom increment button. 77 | // See https://github.com/twbs/bootstrap/issues/8350 for more. 78 | input[type="number"] { 79 | &::-webkit-outer-spin-button, 80 | &::-webkit-inner-spin-button { 81 | height: auto; 82 | } 83 | } 84 | 85 | 86 | // Placeholder 87 | // 88 | // Placeholder text gets special styles because when browsers invalidate entire 89 | // lines if it doesn't understand a selector/ 90 | .form-control { 91 | @include placeholder(); 92 | } 93 | 94 | 95 | // Common form controls 96 | // 97 | // Shared size and type resets for form controls. Apply `.form-control` to any 98 | // of the following form controls: 99 | // 100 | // select 101 | // textarea 102 | // input[type="text"] 103 | // input[type="password"] 104 | // input[type="datetime"] 105 | // input[type="datetime-local"] 106 | // input[type="date"] 107 | // input[type="month"] 108 | // input[type="time"] 109 | // input[type="week"] 110 | // input[type="number"] 111 | // input[type="email"] 112 | // input[type="url"] 113 | // input[type="search"] 114 | // input[type="tel"] 115 | // input[type="color"] 116 | 117 | .form-control { 118 | display: block; 119 | width: 100%; 120 | height: $input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) 121 | padding: $padding-base-vertical $padding-base-horizontal; 122 | font-size: $font-size-base; 123 | line-height: $line-height-base; 124 | color: $input-color; 125 | vertical-align: middle; 126 | background-color: $input-bg; 127 | border: 1px solid $input-border; 128 | border-radius: $input-border-radius; 129 | @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); 130 | @include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s); 131 | 132 | // Customize the `:focus` state to imitate native WebKit styles. 133 | @include form-control-focus(); 134 | 135 | // Disabled and read-only inputs 136 | // Note: HTML5 says that controls under a fieldset > legend:first-child won't 137 | // be disabled if the fieldset is disabled. Due to implementation difficulty, 138 | // we don't honor that edge case; we style them as disabled anyway. 139 | &[disabled], 140 | &[readonly], 141 | fieldset[disabled] & { 142 | cursor: not-allowed; 143 | background-color: $input-bg-disabled; 144 | } 145 | 146 | // [converter] extracted textarea& to textarea.form-control 147 | } 148 | 149 | // Reset height for `textarea`s 150 | textarea.form-control { 151 | height: auto; 152 | } 153 | 154 | 155 | // Form groups 156 | // 157 | // Designed to help with the organization and spacing of vertical forms. For 158 | // horizontal forms, use the predefined grid classes. 159 | 160 | .form-group { 161 | margin-bottom: 15px; 162 | } 163 | 164 | 165 | // Checkboxes and radios 166 | // 167 | // Indent the labels to position radios/checkboxes as hanging controls. 168 | 169 | .radio, 170 | .checkbox { 171 | display: block; 172 | min-height: $line-height-computed; // clear the floating input if there is no label text 173 | margin-top: 10px; 174 | margin-bottom: 10px; 175 | padding-left: 20px; 176 | vertical-align: middle; 177 | label { 178 | display: inline; 179 | margin-bottom: 0; 180 | font-weight: normal; 181 | cursor: pointer; 182 | } 183 | } 184 | .radio input[type="radio"], 185 | .radio-inline input[type="radio"], 186 | .checkbox input[type="checkbox"], 187 | .checkbox-inline input[type="checkbox"] { 188 | float: left; 189 | margin-left: -20px; 190 | } 191 | .radio + .radio, 192 | .checkbox + .checkbox { 193 | margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing 194 | } 195 | 196 | // Radios and checkboxes on same line 197 | .radio-inline, 198 | .checkbox-inline { 199 | display: inline-block; 200 | padding-left: 20px; 201 | margin-bottom: 0; 202 | vertical-align: middle; 203 | font-weight: normal; 204 | cursor: pointer; 205 | } 206 | .radio-inline + .radio-inline, 207 | .checkbox-inline + .checkbox-inline { 208 | margin-top: 0; 209 | margin-left: 10px; // space out consecutive inline controls 210 | } 211 | 212 | // Apply same disabled cursor tweak as for inputs 213 | // 214 | // Note: Neither radios nor checkboxes can be readonly. 215 | input[type="radio"], 216 | input[type="checkbox"], 217 | .radio, 218 | .radio-inline, 219 | .checkbox, 220 | .checkbox-inline { 221 | &[disabled], 222 | fieldset[disabled] & { 223 | cursor: not-allowed; 224 | } 225 | } 226 | 227 | // Form control sizing 228 | 229 | @include input-size('.input-sm', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small); 230 | 231 | @include input-size('.input-lg', $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large); 232 | 233 | 234 | // Form control feedback states 235 | // 236 | // Apply contextual and semantic states to individual form controls. 237 | 238 | // Warning 239 | .has-warning { 240 | @include form-control-validation($state-warning-text, $state-warning-text, $state-warning-bg); 241 | } 242 | // Error 243 | .has-error { 244 | @include form-control-validation($state-danger-text, $state-danger-text, $state-danger-bg); 245 | } 246 | // Success 247 | .has-success { 248 | @include form-control-validation($state-success-text, $state-success-text, $state-success-bg); 249 | } 250 | 251 | 252 | // Static form control text 253 | // 254 | // Apply class to a `p` element to make any string of text align with labels in 255 | // a horizontal form layout. 256 | 257 | .form-control-static { 258 | margin-bottom: 0; // Remove default margin from `p` 259 | padding-top: ($padding-base-vertical + 1); 260 | } 261 | 262 | 263 | // Help text 264 | // 265 | // Apply to any element you wish to create light text for placement immediately 266 | // below a form control. Use for general help, formatting, or instructional text. 267 | 268 | .help-block { 269 | display: block; // account for any element using help-block 270 | margin-top: 5px; 271 | margin-bottom: 10px; 272 | color: lighten($text-color, 25%); // lighten the text some for contrast 273 | } 274 | 275 | 276 | 277 | // Inline forms 278 | // 279 | // Make forms appear inline(-block) by adding the `.form-inline` class. Inline 280 | // forms begin stacked on extra small (mobile) devices and then go inline when 281 | // viewports reach <768px. 282 | // 283 | // Requires wrapping inputs and labels with `.form-group` for proper display of 284 | // default HTML form controls and our custom form controls (e.g., input groups). 285 | // 286 | // Heads up! This is mixin-ed into `.navbar-form` in navbars.less. 287 | 288 | .form-inline { 289 | 290 | // Kick in the inline 291 | @media (min-width: $screen-tablet) { 292 | // Inline-block all the things for "inline" 293 | .form-group { 294 | display: inline-block; 295 | margin-bottom: 0; 296 | vertical-align: middle; 297 | } 298 | 299 | // In navbar-form, allow folks to *not* use `.form-group` 300 | .form-control { 301 | display: inline-block; 302 | } 303 | 304 | // Remove default margin on radios/checkboxes that were used for stacking, and 305 | // then undo the floating of radios and checkboxes to match (which also avoids 306 | // a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969). 307 | .radio, 308 | .checkbox { 309 | display: inline-block; 310 | margin-top: 0; 311 | margin-bottom: 0; 312 | padding-left: 0; 313 | } 314 | .radio input[type="radio"], 315 | .checkbox input[type="checkbox"] { 316 | float: none; 317 | margin-left: 0; 318 | } 319 | } 320 | } 321 | 322 | 323 | // Horizontal forms 324 | // 325 | // Horizontal forms are built on grid classes and allow you to create forms with 326 | // labels on the left and inputs on the right. 327 | 328 | .form-horizontal { 329 | 330 | // Consistent vertical alignment of labels, radios, and checkboxes 331 | .control-label, 332 | .radio, 333 | .checkbox, 334 | .radio-inline, 335 | .checkbox-inline { 336 | margin-top: 0; 337 | margin-bottom: 0; 338 | padding-top: ($padding-base-vertical + 1); // Default padding plus a border 339 | } 340 | 341 | // Make form groups behave like rows 342 | .form-group { 343 | @include make-row(); 344 | } 345 | 346 | // Only right align form labels here when the columns stop stacking 347 | @media (min-width: $screen-tablet) { 348 | .control-label { 349 | text-align: right; 350 | } 351 | } 352 | } 353 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_glyphicons.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Glyphicons for Bootstrap 3 | // 4 | // Since icons are fonts, they can be placed anywhere text is placed and are 5 | // thus automatically sized to match the surrounding child. To use, create an 6 | // inline element with the appropriate classes, like so: 7 | // 8 | // Star 9 | 10 | // Import the fonts 11 | @font-face { 12 | font-family: 'Glyphicons Halflings'; 13 | src: font-url('#{$icon-font-path}#{$icon-font-name}.eot'); 14 | src: font-url('#{$icon-font-path}#{$icon-font-name}.eot?#iefix') format('embedded-opentype'), 15 | font-url('#{$icon-font-path}#{$icon-font-name}.woff') format('woff'), 16 | font-url('#{$icon-font-path}#{$icon-font-name}.ttf') format('truetype'), 17 | font-url('#{$icon-font-path}#{$icon-font-name}.svg#glyphicons-halflingsregular') format('svg'); 18 | } 19 | 20 | // Catchall baseclass 21 | .glyphicon { 22 | position: relative; 23 | top: 1px; 24 | display: inline-block; 25 | font-family: 'Glyphicons Halflings'; 26 | font-style: normal; 27 | font-weight: normal; 28 | line-height: 1; 29 | -webkit-font-smoothing: antialiased; 30 | } 31 | 32 | // Individual icons 33 | .glyphicon-asterisk { &:before { content: "\2a"; } } 34 | .glyphicon-plus { &:before { content: "\2b"; } } 35 | .glyphicon-euro { &:before { content: "\20ac"; } } 36 | .glyphicon-minus { &:before { content: "\2212"; } } 37 | .glyphicon-cloud { &:before { content: "\2601"; } } 38 | .glyphicon-envelope { &:before { content: "\2709"; } } 39 | .glyphicon-pencil { &:before { content: "\270f"; } } 40 | .glyphicon-glass { &:before { content: "\e001"; } } 41 | .glyphicon-music { &:before { content: "\e002"; } } 42 | .glyphicon-search { &:before { content: "\e003"; } } 43 | .glyphicon-heart { &:before { content: "\e005"; } } 44 | .glyphicon-star { &:before { content: "\e006"; } } 45 | .glyphicon-star-empty { &:before { content: "\e007"; } } 46 | .glyphicon-user { &:before { content: "\e008"; } } 47 | .glyphicon-film { &:before { content: "\e009"; } } 48 | .glyphicon-th-large { &:before { content: "\e010"; } } 49 | .glyphicon-th { &:before { content: "\e011"; } } 50 | .glyphicon-th-list { &:before { content: "\e012"; } } 51 | .glyphicon-ok { &:before { content: "\e013"; } } 52 | .glyphicon-remove { &:before { content: "\e014"; } } 53 | .glyphicon-zoom-in { &:before { content: "\e015"; } } 54 | .glyphicon-zoom-out { &:before { content: "\e016"; } } 55 | .glyphicon-off { &:before { content: "\e017"; } } 56 | .glyphicon-signal { &:before { content: "\e018"; } } 57 | .glyphicon-cog { &:before { content: "\e019"; } } 58 | .glyphicon-trash { &:before { content: "\e020"; } } 59 | .glyphicon-home { &:before { content: "\e021"; } } 60 | .glyphicon-file { &:before { content: "\e022"; } } 61 | .glyphicon-time { &:before { content: "\e023"; } } 62 | .glyphicon-road { &:before { content: "\e024"; } } 63 | .glyphicon-download-alt { &:before { content: "\e025"; } } 64 | .glyphicon-download { &:before { content: "\e026"; } } 65 | .glyphicon-upload { &:before { content: "\e027"; } } 66 | .glyphicon-inbox { &:before { content: "\e028"; } } 67 | .glyphicon-play-circle { &:before { content: "\e029"; } } 68 | .glyphicon-repeat { &:before { content: "\e030"; } } 69 | .glyphicon-refresh { &:before { content: "\e031"; } } 70 | .glyphicon-list-alt { &:before { content: "\e032"; } } 71 | .glyphicon-flag { &:before { content: "\e034"; } } 72 | .glyphicon-headphones { &:before { content: "\e035"; } } 73 | .glyphicon-volume-off { &:before { content: "\e036"; } } 74 | .glyphicon-volume-down { &:before { content: "\e037"; } } 75 | .glyphicon-volume-up { &:before { content: "\e038"; } } 76 | .glyphicon-qrcode { &:before { content: "\e039"; } } 77 | .glyphicon-barcode { &:before { content: "\e040"; } } 78 | .glyphicon-tag { &:before { content: "\e041"; } } 79 | .glyphicon-tags { &:before { content: "\e042"; } } 80 | .glyphicon-book { &:before { content: "\e043"; } } 81 | .glyphicon-print { &:before { content: "\e045"; } } 82 | .glyphicon-font { &:before { content: "\e047"; } } 83 | .glyphicon-bold { &:before { content: "\e048"; } } 84 | .glyphicon-italic { &:before { content: "\e049"; } } 85 | .glyphicon-text-height { &:before { content: "\e050"; } } 86 | .glyphicon-text-width { &:before { content: "\e051"; } } 87 | .glyphicon-align-left { &:before { content: "\e052"; } } 88 | .glyphicon-align-center { &:before { content: "\e053"; } } 89 | .glyphicon-align-right { &:before { content: "\e054"; } } 90 | .glyphicon-align-justify { &:before { content: "\e055"; } } 91 | .glyphicon-list { &:before { content: "\e056"; } } 92 | .glyphicon-indent-left { &:before { content: "\e057"; } } 93 | .glyphicon-indent-right { &:before { content: "\e058"; } } 94 | .glyphicon-facetime-video { &:before { content: "\e059"; } } 95 | .glyphicon-picture { &:before { content: "\e060"; } } 96 | .glyphicon-map-marker { &:before { content: "\e062"; } } 97 | .glyphicon-adjust { &:before { content: "\e063"; } } 98 | .glyphicon-tint { &:before { content: "\e064"; } } 99 | .glyphicon-edit { &:before { content: "\e065"; } } 100 | .glyphicon-share { &:before { content: "\e066"; } } 101 | .glyphicon-check { &:before { content: "\e067"; } } 102 | .glyphicon-move { &:before { content: "\e068"; } } 103 | .glyphicon-step-backward { &:before { content: "\e069"; } } 104 | .glyphicon-fast-backward { &:before { content: "\e070"; } } 105 | .glyphicon-backward { &:before { content: "\e071"; } } 106 | .glyphicon-play { &:before { content: "\e072"; } } 107 | .glyphicon-pause { &:before { content: "\e073"; } } 108 | .glyphicon-stop { &:before { content: "\e074"; } } 109 | .glyphicon-forward { &:before { content: "\e075"; } } 110 | .glyphicon-fast-forward { &:before { content: "\e076"; } } 111 | .glyphicon-step-forward { &:before { content: "\e077"; } } 112 | .glyphicon-eject { &:before { content: "\e078"; } } 113 | .glyphicon-chevron-left { &:before { content: "\e079"; } } 114 | .glyphicon-chevron-right { &:before { content: "\e080"; } } 115 | .glyphicon-plus-sign { &:before { content: "\e081"; } } 116 | .glyphicon-minus-sign { &:before { content: "\e082"; } } 117 | .glyphicon-remove-sign { &:before { content: "\e083"; } } 118 | .glyphicon-ok-sign { &:before { content: "\e084"; } } 119 | .glyphicon-question-sign { &:before { content: "\e085"; } } 120 | .glyphicon-info-sign { &:before { content: "\e086"; } } 121 | .glyphicon-screenshot { &:before { content: "\e087"; } } 122 | .glyphicon-remove-circle { &:before { content: "\e088"; } } 123 | .glyphicon-ok-circle { &:before { content: "\e089"; } } 124 | .glyphicon-ban-circle { &:before { content: "\e090"; } } 125 | .glyphicon-arrow-left { &:before { content: "\e091"; } } 126 | .glyphicon-arrow-right { &:before { content: "\e092"; } } 127 | .glyphicon-arrow-up { &:before { content: "\e093"; } } 128 | .glyphicon-arrow-down { &:before { content: "\e094"; } } 129 | .glyphicon-share-alt { &:before { content: "\e095"; } } 130 | .glyphicon-resize-full { &:before { content: "\e096"; } } 131 | .glyphicon-resize-small { &:before { content: "\e097"; } } 132 | .glyphicon-exclamation-sign { &:before { content: "\e101"; } } 133 | .glyphicon-gift { &:before { content: "\e102"; } } 134 | .glyphicon-leaf { &:before { content: "\e103"; } } 135 | .glyphicon-eye-open { &:before { content: "\e105"; } } 136 | .glyphicon-eye-close { &:before { content: "\e106"; } } 137 | .glyphicon-warning-sign { &:before { content: "\e107"; } } 138 | .glyphicon-plane { &:before { content: "\e108"; } } 139 | .glyphicon-random { &:before { content: "\e110"; } } 140 | .glyphicon-comment { &:before { content: "\e111"; } } 141 | .glyphicon-magnet { &:before { content: "\e112"; } } 142 | .glyphicon-chevron-up { &:before { content: "\e113"; } } 143 | .glyphicon-chevron-down { &:before { content: "\e114"; } } 144 | .glyphicon-retweet { &:before { content: "\e115"; } } 145 | .glyphicon-shopping-cart { &:before { content: "\e116"; } } 146 | .glyphicon-folder-close { &:before { content: "\e117"; } } 147 | .glyphicon-folder-open { &:before { content: "\e118"; } } 148 | .glyphicon-resize-vertical { &:before { content: "\e119"; } } 149 | .glyphicon-resize-horizontal { &:before { content: "\e120"; } } 150 | .glyphicon-hdd { &:before { content: "\e121"; } } 151 | .glyphicon-bullhorn { &:before { content: "\e122"; } } 152 | .glyphicon-certificate { &:before { content: "\e124"; } } 153 | .glyphicon-thumbs-up { &:before { content: "\e125"; } } 154 | .glyphicon-thumbs-down { &:before { content: "\e126"; } } 155 | .glyphicon-hand-right { &:before { content: "\e127"; } } 156 | .glyphicon-hand-left { &:before { content: "\e128"; } } 157 | .glyphicon-hand-up { &:before { content: "\e129"; } } 158 | .glyphicon-hand-down { &:before { content: "\e130"; } } 159 | .glyphicon-circle-arrow-right { &:before { content: "\e131"; } } 160 | .glyphicon-circle-arrow-left { &:before { content: "\e132"; } } 161 | .glyphicon-circle-arrow-up { &:before { content: "\e133"; } } 162 | .glyphicon-circle-arrow-down { &:before { content: "\e134"; } } 163 | .glyphicon-globe { &:before { content: "\e135"; } } 164 | .glyphicon-tasks { &:before { content: "\e137"; } } 165 | .glyphicon-filter { &:before { content: "\e138"; } } 166 | .glyphicon-fullscreen { &:before { content: "\e140"; } } 167 | .glyphicon-dashboard { &:before { content: "\e141"; } } 168 | .glyphicon-heart-empty { &:before { content: "\e143"; } } 169 | .glyphicon-link { &:before { content: "\e144"; } } 170 | .glyphicon-phone { &:before { content: "\e145"; } } 171 | .glyphicon-usd { &:before { content: "\e148"; } } 172 | .glyphicon-gbp { &:before { content: "\e149"; } } 173 | .glyphicon-sort { &:before { content: "\e150"; } } 174 | .glyphicon-sort-by-alphabet { &:before { content: "\e151"; } } 175 | .glyphicon-sort-by-alphabet-alt { &:before { content: "\e152"; } } 176 | .glyphicon-sort-by-order { &:before { content: "\e153"; } } 177 | .glyphicon-sort-by-order-alt { &:before { content: "\e154"; } } 178 | .glyphicon-sort-by-attributes { &:before { content: "\e155"; } } 179 | .glyphicon-sort-by-attributes-alt { &:before { content: "\e156"; } } 180 | .glyphicon-unchecked { &:before { content: "\e157"; } } 181 | .glyphicon-expand { &:before { content: "\e158"; } } 182 | .glyphicon-collapse-down { &:before { content: "\e159"; } } 183 | .glyphicon-collapse-up { &:before { content: "\e160"; } } 184 | .glyphicon-log-in { &:before { content: "\e161"; } } 185 | .glyphicon-flash { &:before { content: "\e162"; } } 186 | .glyphicon-log-out { &:before { content: "\e163"; } } 187 | .glyphicon-new-window { &:before { content: "\e164"; } } 188 | .glyphicon-record { &:before { content: "\e165"; } } 189 | .glyphicon-save { &:before { content: "\e166"; } } 190 | .glyphicon-open { &:before { content: "\e167"; } } 191 | .glyphicon-saved { &:before { content: "\e168"; } } 192 | .glyphicon-import { &:before { content: "\e169"; } } 193 | .glyphicon-export { &:before { content: "\e170"; } } 194 | .glyphicon-send { &:before { content: "\e171"; } } 195 | .glyphicon-floppy-disk { &:before { content: "\e172"; } } 196 | .glyphicon-floppy-saved { &:before { content: "\e173"; } } 197 | .glyphicon-floppy-remove { &:before { content: "\e174"; } } 198 | .glyphicon-floppy-save { &:before { content: "\e175"; } } 199 | .glyphicon-floppy-open { &:before { content: "\e176"; } } 200 | .glyphicon-credit-card { &:before { content: "\e177"; } } 201 | .glyphicon-transfer { &:before { content: "\e178"; } } 202 | .glyphicon-cutlery { &:before { content: "\e179"; } } 203 | .glyphicon-header { &:before { content: "\e180"; } } 204 | .glyphicon-compressed { &:before { content: "\e181"; } } 205 | .glyphicon-earphone { &:before { content: "\e182"; } } 206 | .glyphicon-phone-alt { &:before { content: "\e183"; } } 207 | .glyphicon-tower { &:before { content: "\e184"; } } 208 | .glyphicon-stats { &:before { content: "\e185"; } } 209 | .glyphicon-sd-video { &:before { content: "\e186"; } } 210 | .glyphicon-hd-video { &:before { content: "\e187"; } } 211 | .glyphicon-subtitles { &:before { content: "\e188"; } } 212 | .glyphicon-sound-stereo { &:before { content: "\e189"; } } 213 | .glyphicon-sound-dolby { &:before { content: "\e190"; } } 214 | .glyphicon-sound-5-1 { &:before { content: "\e191"; } } 215 | .glyphicon-sound-6-1 { &:before { content: "\e192"; } } 216 | .glyphicon-sound-7-1 { &:before { content: "\e193"; } } 217 | .glyphicon-copyright-mark { &:before { content: "\e194"; } } 218 | .glyphicon-registration-mark { &:before { content: "\e195"; } } 219 | .glyphicon-cloud-download { &:before { content: "\e197"; } } 220 | .glyphicon-cloud-upload { &:before { content: "\e198"; } } 221 | .glyphicon-tree-conifer { &:before { content: "\e199"; } } 222 | .glyphicon-tree-deciduous { &:before { content: "\e200"; } } 223 | .glyphicon-briefcase { &:before { content: "\1f4bc"; } } 224 | .glyphicon-calendar { &:before { content: "\1f4c5"; } } 225 | .glyphicon-pushpin { &:before { content: "\1f4cc"; } } 226 | .glyphicon-paperclip { &:before { content: "\1f4ce"; } } 227 | .glyphicon-camera { &:before { content: "\1f4f7"; } } 228 | .glyphicon-lock { &:before { content: "\1f512"; } } 229 | .glyphicon-bell { &:before { content: "\1f514"; } } 230 | .glyphicon-bookmark { &:before { content: "\1f516"; } } 231 | .glyphicon-fire { &:before { content: "\1f525"; } } 232 | .glyphicon-wrench { &:before { content: "\1f527"; } } 233 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_grid.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Grid system 3 | // -------------------------------------------------- 4 | 5 | 6 | // Set the container width, and override it for fixed navbars in media queries 7 | .container { 8 | @include container-fixed(); 9 | } 10 | 11 | // mobile first defaults 12 | .row { 13 | @include make-row(); 14 | } 15 | 16 | // Common styles for small and large grid columns 17 | .col-xs-1, 18 | .col-xs-2, 19 | .col-xs-3, 20 | .col-xs-4, 21 | .col-xs-5, 22 | .col-xs-6, 23 | .col-xs-7, 24 | .col-xs-8, 25 | .col-xs-9, 26 | .col-xs-10, 27 | .col-xs-11, 28 | .col-xs-12, 29 | .col-sm-1, 30 | .col-sm-2, 31 | .col-sm-3, 32 | .col-sm-4, 33 | .col-sm-5, 34 | .col-sm-6, 35 | .col-sm-7, 36 | .col-sm-8, 37 | .col-sm-9, 38 | .col-sm-10, 39 | .col-sm-11, 40 | .col-sm-12, 41 | .col-md-1, 42 | .col-md-2, 43 | .col-md-3, 44 | .col-md-4, 45 | .col-md-5, 46 | .col-md-6, 47 | .col-md-7, 48 | .col-md-8, 49 | .col-md-9, 50 | .col-md-10, 51 | .col-md-11, 52 | .col-md-12, 53 | .col-lg-1, 54 | .col-lg-2, 55 | .col-lg-3, 56 | .col-lg-4, 57 | .col-lg-5, 58 | .col-lg-6, 59 | .col-lg-7, 60 | .col-lg-8, 61 | .col-lg-9, 62 | .col-lg-10, 63 | .col-lg-11, 64 | .col-lg-12 { 65 | position: relative; 66 | // Prevent columns from collapsing when empty 67 | min-height: 1px; 68 | // Inner gutter via padding 69 | padding-left: ($grid-gutter-width / 2); 70 | padding-right: ($grid-gutter-width / 2); 71 | } 72 | 73 | 74 | // Extra small grid 75 | // 76 | // Grid classes for extra small devices like smartphones. No offset, push, or 77 | // pull classes are present here due to the size of the target. 78 | // 79 | // it's full-width. 80 | 81 | .col-xs-1, 82 | .col-xs-2, 83 | .col-xs-3, 84 | .col-xs-4, 85 | .col-xs-5, 86 | .col-xs-6, 87 | .col-xs-7, 88 | .col-xs-8, 89 | .col-xs-9, 90 | .col-xs-10, 91 | .col-xs-11 { 92 | float: left; 93 | } 94 | .col-xs-1 { width: percentage((1 / $grid-columns)); } 95 | .col-xs-2 { width: percentage((2 / $grid-columns)); } 96 | .col-xs-3 { width: percentage((3 / $grid-columns)); } 97 | .col-xs-4 { width: percentage((4 / $grid-columns)); } 98 | .col-xs-5 { width: percentage((5 / $grid-columns)); } 99 | .col-xs-6 { width: percentage((6 / $grid-columns)); } 100 | .col-xs-7 { width: percentage((7 / $grid-columns)); } 101 | .col-xs-8 { width: percentage((8 / $grid-columns)); } 102 | .col-xs-9 { width: percentage((9 / $grid-columns)); } 103 | .col-xs-10 { width: percentage((10/ $grid-columns)); } 104 | .col-xs-11 { width: percentage((11/ $grid-columns)); } 105 | .col-xs-12 { width: 100%; } 106 | 107 | 108 | // Small grid 109 | // 110 | // Columns, offsets, pushes, and pulls for the small device range, from phones 111 | // to tablets. 112 | // 113 | // it's full-width. 114 | 115 | @media (min-width: $screen-tablet) { 116 | .container { 117 | max-width: $container-tablet; 118 | } 119 | 120 | .col-sm-1, 121 | .col-sm-2, 122 | .col-sm-3, 123 | .col-sm-4, 124 | .col-sm-5, 125 | .col-sm-6, 126 | .col-sm-7, 127 | .col-sm-8, 128 | .col-sm-9, 129 | .col-sm-10, 130 | .col-sm-11 { 131 | float: left; 132 | } 133 | .col-sm-1 { width: percentage((1 / $grid-columns)); } 134 | .col-sm-2 { width: percentage((2 / $grid-columns)); } 135 | .col-sm-3 { width: percentage((3 / $grid-columns)); } 136 | .col-sm-4 { width: percentage((4 / $grid-columns)); } 137 | .col-sm-5 { width: percentage((5 / $grid-columns)); } 138 | .col-sm-6 { width: percentage((6 / $grid-columns)); } 139 | .col-sm-7 { width: percentage((7 / $grid-columns)); } 140 | .col-sm-8 { width: percentage((8 / $grid-columns)); } 141 | .col-sm-9 { width: percentage((9 / $grid-columns)); } 142 | .col-sm-10 { width: percentage((10/ $grid-columns)); } 143 | .col-sm-11 { width: percentage((11/ $grid-columns)); } 144 | .col-sm-12 { width: 100%; } 145 | 146 | // Push and pull columns for source order changes 147 | .col-sm-push-1 { left: percentage((1 / $grid-columns)); } 148 | .col-sm-push-2 { left: percentage((2 / $grid-columns)); } 149 | .col-sm-push-3 { left: percentage((3 / $grid-columns)); } 150 | .col-sm-push-4 { left: percentage((4 / $grid-columns)); } 151 | .col-sm-push-5 { left: percentage((5 / $grid-columns)); } 152 | .col-sm-push-6 { left: percentage((6 / $grid-columns)); } 153 | .col-sm-push-7 { left: percentage((7 / $grid-columns)); } 154 | .col-sm-push-8 { left: percentage((8 / $grid-columns)); } 155 | .col-sm-push-9 { left: percentage((9 / $grid-columns)); } 156 | .col-sm-push-10 { left: percentage((10/ $grid-columns)); } 157 | .col-sm-push-11 { left: percentage((11/ $grid-columns)); } 158 | 159 | .col-sm-pull-1 { right: percentage((1 / $grid-columns)); } 160 | .col-sm-pull-2 { right: percentage((2 / $grid-columns)); } 161 | .col-sm-pull-3 { right: percentage((3 / $grid-columns)); } 162 | .col-sm-pull-4 { right: percentage((4 / $grid-columns)); } 163 | .col-sm-pull-5 { right: percentage((5 / $grid-columns)); } 164 | .col-sm-pull-6 { right: percentage((6 / $grid-columns)); } 165 | .col-sm-pull-7 { right: percentage((7 / $grid-columns)); } 166 | .col-sm-pull-8 { right: percentage((8 / $grid-columns)); } 167 | .col-sm-pull-9 { right: percentage((9 / $grid-columns)); } 168 | .col-sm-pull-10 { right: percentage((10/ $grid-columns)); } 169 | .col-sm-pull-11 { right: percentage((11/ $grid-columns)); } 170 | 171 | // Offsets 172 | .col-sm-offset-1 { margin-left: percentage((1 / $grid-columns)); } 173 | .col-sm-offset-2 { margin-left: percentage((2 / $grid-columns)); } 174 | .col-sm-offset-3 { margin-left: percentage((3 / $grid-columns)); } 175 | .col-sm-offset-4 { margin-left: percentage((4 / $grid-columns)); } 176 | .col-sm-offset-5 { margin-left: percentage((5 / $grid-columns)); } 177 | .col-sm-offset-6 { margin-left: percentage((6 / $grid-columns)); } 178 | .col-sm-offset-7 { margin-left: percentage((7 / $grid-columns)); } 179 | .col-sm-offset-8 { margin-left: percentage((8 / $grid-columns)); } 180 | .col-sm-offset-9 { margin-left: percentage((9 / $grid-columns)); } 181 | .col-sm-offset-10 { margin-left: percentage((10/ $grid-columns)); } 182 | .col-sm-offset-11 { margin-left: percentage((11/ $grid-columns)); } 183 | } 184 | 185 | 186 | // Medium grid 187 | // 188 | // Columns, offsets, pushes, and pulls for the desktop device range. 189 | // 190 | // it's full-width. 191 | 192 | @media (min-width: $screen-desktop) { 193 | .container { 194 | max-width: $container-desktop; 195 | } 196 | .col-md-1, 197 | .col-md-2, 198 | .col-md-3, 199 | .col-md-4, 200 | .col-md-5, 201 | .col-md-6, 202 | .col-md-7, 203 | .col-md-8, 204 | .col-md-9, 205 | .col-md-10, 206 | .col-md-11 { 207 | float: left; 208 | } 209 | .col-md-1 { width: percentage((1 / $grid-columns)); } 210 | .col-md-2 { width: percentage((2 / $grid-columns)); } 211 | .col-md-3 { width: percentage((3 / $grid-columns)); } 212 | .col-md-4 { width: percentage((4 / $grid-columns)); } 213 | .col-md-5 { width: percentage((5 / $grid-columns)); } 214 | .col-md-6 { width: percentage((6 / $grid-columns)); } 215 | .col-md-7 { width: percentage((7 / $grid-columns)); } 216 | .col-md-8 { width: percentage((8 / $grid-columns)); } 217 | .col-md-9 { width: percentage((9 / $grid-columns)); } 218 | .col-md-10 { width: percentage((10/ $grid-columns)); } 219 | .col-md-11 { width: percentage((11/ $grid-columns)); } 220 | .col-md-12 { width: 100%; } 221 | 222 | // Push and pull columns for source order changes 223 | .col-md-push-0 { left: auto; } 224 | .col-md-push-1 { left: percentage((1 / $grid-columns)); } 225 | .col-md-push-2 { left: percentage((2 / $grid-columns)); } 226 | .col-md-push-3 { left: percentage((3 / $grid-columns)); } 227 | .col-md-push-4 { left: percentage((4 / $grid-columns)); } 228 | .col-md-push-5 { left: percentage((5 / $grid-columns)); } 229 | .col-md-push-6 { left: percentage((6 / $grid-columns)); } 230 | .col-md-push-7 { left: percentage((7 / $grid-columns)); } 231 | .col-md-push-8 { left: percentage((8 / $grid-columns)); } 232 | .col-md-push-9 { left: percentage((9 / $grid-columns)); } 233 | .col-md-push-10 { left: percentage((10/ $grid-columns)); } 234 | .col-md-push-11 { left: percentage((11/ $grid-columns)); } 235 | 236 | .col-md-pull-0 { right: auto; } 237 | .col-md-pull-1 { right: percentage((1 / $grid-columns)); } 238 | .col-md-pull-2 { right: percentage((2 / $grid-columns)); } 239 | .col-md-pull-3 { right: percentage((3 / $grid-columns)); } 240 | .col-md-pull-4 { right: percentage((4 / $grid-columns)); } 241 | .col-md-pull-5 { right: percentage((5 / $grid-columns)); } 242 | .col-md-pull-6 { right: percentage((6 / $grid-columns)); } 243 | .col-md-pull-7 { right: percentage((7 / $grid-columns)); } 244 | .col-md-pull-8 { right: percentage((8 / $grid-columns)); } 245 | .col-md-pull-9 { right: percentage((9 / $grid-columns)); } 246 | .col-md-pull-10 { right: percentage((10/ $grid-columns)); } 247 | .col-md-pull-11 { right: percentage((11/ $grid-columns)); } 248 | 249 | // Offsets 250 | .col-md-offset-0 { margin-left: 0; } 251 | .col-md-offset-1 { margin-left: percentage((1 / $grid-columns)); } 252 | .col-md-offset-2 { margin-left: percentage((2 / $grid-columns)); } 253 | .col-md-offset-3 { margin-left: percentage((3 / $grid-columns)); } 254 | .col-md-offset-4 { margin-left: percentage((4 / $grid-columns)); } 255 | .col-md-offset-5 { margin-left: percentage((5 / $grid-columns)); } 256 | .col-md-offset-6 { margin-left: percentage((6 / $grid-columns)); } 257 | .col-md-offset-7 { margin-left: percentage((7 / $grid-columns)); } 258 | .col-md-offset-8 { margin-left: percentage((8 / $grid-columns)); } 259 | .col-md-offset-9 { margin-left: percentage((9 / $grid-columns)); } 260 | .col-md-offset-10 { margin-left: percentage((10/ $grid-columns)); } 261 | .col-md-offset-11 { margin-left: percentage((11/ $grid-columns)); } 262 | } 263 | 264 | 265 | // Large grid 266 | // 267 | // Columns, offsets, pushes, and pulls for the large desktop device range. 268 | // 269 | // it's full-width. 270 | 271 | @media (min-width: $screen-lg-desktop) { 272 | .container { 273 | max-width: $container-lg-desktop; 274 | } 275 | 276 | .col-lg-1, 277 | .col-lg-2, 278 | .col-lg-3, 279 | .col-lg-4, 280 | .col-lg-5, 281 | .col-lg-6, 282 | .col-lg-7, 283 | .col-lg-8, 284 | .col-lg-9, 285 | .col-lg-10, 286 | .col-lg-11 { 287 | float: left; 288 | } 289 | .col-lg-1 { width: percentage((1 / $grid-columns)); } 290 | .col-lg-2 { width: percentage((2 / $grid-columns)); } 291 | .col-lg-3 { width: percentage((3 / $grid-columns)); } 292 | .col-lg-4 { width: percentage((4 / $grid-columns)); } 293 | .col-lg-5 { width: percentage((5 / $grid-columns)); } 294 | .col-lg-6 { width: percentage((6 / $grid-columns)); } 295 | .col-lg-7 { width: percentage((7 / $grid-columns)); } 296 | .col-lg-8 { width: percentage((8 / $grid-columns)); } 297 | .col-lg-9 { width: percentage((9 / $grid-columns)); } 298 | .col-lg-10 { width: percentage((10/ $grid-columns)); } 299 | .col-lg-11 { width: percentage((11/ $grid-columns)); } 300 | .col-lg-12 { width: 100%; } 301 | 302 | // Push and pull columns for source order changes 303 | .col-lg-push-0 { left: auto; } 304 | .col-lg-push-1 { left: percentage((1 / $grid-columns)); } 305 | .col-lg-push-2 { left: percentage((2 / $grid-columns)); } 306 | .col-lg-push-3 { left: percentage((3 / $grid-columns)); } 307 | .col-lg-push-4 { left: percentage((4 / $grid-columns)); } 308 | .col-lg-push-5 { left: percentage((5 / $grid-columns)); } 309 | .col-lg-push-6 { left: percentage((6 / $grid-columns)); } 310 | .col-lg-push-7 { left: percentage((7 / $grid-columns)); } 311 | .col-lg-push-8 { left: percentage((8 / $grid-columns)); } 312 | .col-lg-push-9 { left: percentage((9 / $grid-columns)); } 313 | .col-lg-push-10 { left: percentage((10/ $grid-columns)); } 314 | .col-lg-push-11 { left: percentage((11/ $grid-columns)); } 315 | 316 | .col-lg-pull-0 { right: auto; } 317 | .col-lg-pull-1 { right: percentage((1 / $grid-columns)); } 318 | .col-lg-pull-2 { right: percentage((2 / $grid-columns)); } 319 | .col-lg-pull-3 { right: percentage((3 / $grid-columns)); } 320 | .col-lg-pull-4 { right: percentage((4 / $grid-columns)); } 321 | .col-lg-pull-5 { right: percentage((5 / $grid-columns)); } 322 | .col-lg-pull-6 { right: percentage((6 / $grid-columns)); } 323 | .col-lg-pull-7 { right: percentage((7 / $grid-columns)); } 324 | .col-lg-pull-8 { right: percentage((8 / $grid-columns)); } 325 | .col-lg-pull-9 { right: percentage((9 / $grid-columns)); } 326 | .col-lg-pull-10 { right: percentage((10/ $grid-columns)); } 327 | .col-lg-pull-11 { right: percentage((11/ $grid-columns)); } 328 | 329 | // Offsets 330 | .col-lg-offset-0 { margin-left: 0; } 331 | .col-lg-offset-1 { margin-left: percentage((1 / $grid-columns)); } 332 | .col-lg-offset-2 { margin-left: percentage((2 / $grid-columns)); } 333 | .col-lg-offset-3 { margin-left: percentage((3 / $grid-columns)); } 334 | .col-lg-offset-4 { margin-left: percentage((4 / $grid-columns)); } 335 | .col-lg-offset-5 { margin-left: percentage((5 / $grid-columns)); } 336 | .col-lg-offset-6 { margin-left: percentage((6 / $grid-columns)); } 337 | .col-lg-offset-7 { margin-left: percentage((7 / $grid-columns)); } 338 | .col-lg-offset-8 { margin-left: percentage((8 / $grid-columns)); } 339 | .col-lg-offset-9 { margin-left: percentage((9 / $grid-columns)); } 340 | .col-lg-offset-10 { margin-left: percentage((10/ $grid-columns)); } 341 | .col-lg-offset-11 { margin-left: percentage((11/ $grid-columns)); } 342 | } 343 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_input-groups.scss: -------------------------------------------------------------------------------- 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 | &.col { 14 | float: none; 15 | padding-left: 0; 16 | padding-right: 0; 17 | } 18 | 19 | .form-control { 20 | width: 100%; 21 | margin-bottom: 0; 22 | } 23 | } 24 | 25 | // Sizing options 26 | // 27 | // Remix the default form control sizing classes into new ones for easier 28 | // manipulation. 29 | 30 | .input-group-lg > .form-control, 31 | .input-group-lg > .input-group-addon, 32 | .input-group-lg > .input-group-btn > .btn { @extend .input-lg; } 33 | .input-group-sm > .form-control, 34 | .input-group-sm > .input-group-addon, 35 | .input-group-sm > .input-group-btn > .btn { @extend .input-sm; } 36 | 37 | 38 | // Display as table-cell 39 | // ------------------------- 40 | .input-group-addon, 41 | .input-group-btn, 42 | .input-group .form-control { 43 | display: table-cell; 44 | 45 | &:not(:first-child):not(:last-child) { 46 | border-radius: 0; 47 | } 48 | } 49 | // Addon and addon wrapper for buttons 50 | .input-group-addon, 51 | .input-group-btn { 52 | width: 1%; 53 | white-space: nowrap; 54 | vertical-align: middle; // Match the inputs 55 | } 56 | 57 | // Text input groups 58 | // ------------------------- 59 | .input-group-addon { 60 | padding: $padding-base-vertical $padding-base-horizontal; 61 | font-size: $font-size-base; 62 | font-weight: normal; 63 | line-height: 1; 64 | text-align: center; 65 | background-color: $input-group-addon-bg; 66 | border: 1px solid $input-group-addon-border-color; 67 | border-radius: $border-radius-base; 68 | 69 | // Sizing 70 | &.input-sm { 71 | padding: $padding-small-vertical $padding-small-horizontal; 72 | font-size: $font-size-small; 73 | border-radius: $border-radius-small; 74 | } 75 | &.input-lg { 76 | padding: $padding-large-vertical $padding-large-horizontal; 77 | font-size: $font-size-large; 78 | border-radius: $border-radius-large; 79 | } 80 | 81 | // Nuke default margins from checkboxes and radios to vertically center within. 82 | input[type="radio"], 83 | input[type="checkbox"] { 84 | margin-top: 0; 85 | } 86 | } 87 | 88 | // Reset rounded corners 89 | .input-group .form-control:first-child, 90 | .input-group-addon:first-child, 91 | .input-group-btn:first-child > .btn, 92 | .input-group-btn:first-child > .dropdown-toggle, 93 | .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) { 94 | @include border-right-radius(0); 95 | } 96 | .input-group-addon:first-child { 97 | border-right: 0; 98 | } 99 | .input-group .form-control:last-child, 100 | .input-group-addon:last-child, 101 | .input-group-btn:last-child > .btn, 102 | .input-group-btn:last-child > .dropdown-toggle, 103 | .input-group-btn:first-child > .btn:not(:first-child) { 104 | @include border-left-radius(0); 105 | } 106 | .input-group-addon:last-child { 107 | border-left: 0; 108 | } 109 | 110 | // Button input groups 111 | // ------------------------- 112 | .input-group-btn { 113 | position: relative; 114 | white-space: nowrap; 115 | } 116 | .input-group-btn > .btn { 117 | position: relative; 118 | // Jankily prevent input button groups from wrapping 119 | + .btn { 120 | margin-left: -4px; 121 | } 122 | // Bring the "active" button to the front 123 | &:hover, 124 | &:active { 125 | z-index: 2; 126 | } 127 | } 128 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_jumbotron.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Jumbotron 3 | // -------------------------------------------------- 4 | 5 | 6 | .jumbotron { 7 | padding: $jumbotron-padding; 8 | margin-bottom: $jumbotron-padding; 9 | font-size: ($font-size-base * 1.5); 10 | font-weight: 200; 11 | line-height: ($line-height-base * 1.5); 12 | color: $jumbotron-color; 13 | background-color: $jumbotron-bg; 14 | 15 | h1 { 16 | line-height: 1; 17 | color: $jumbotron-heading-color; 18 | } 19 | p { 20 | line-height: 1.4; 21 | } 22 | 23 | .container & { 24 | border-radius: $border-radius-large; // Only round corners at higher resolutions if contained in a container 25 | } 26 | 27 | @media screen and (min-width: $screen-tablet) { 28 | padding-top: ($jumbotron-padding * 1.6); 29 | padding-bottom: ($jumbotron-padding * 1.6); 30 | 31 | .container & { 32 | padding-left: ($jumbotron-padding * 2); 33 | padding-right: ($jumbotron-padding * 2); 34 | } 35 | 36 | h1 { 37 | font-size: ($font-size-base * 4.5); 38 | } 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_labels.scss: -------------------------------------------------------------------------------- 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 | &[href] { 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 | 33 | // Colors 34 | // Contextual variations (linked labels get darker on :hover) 35 | 36 | .label-default { 37 | @include label-variant($label-default-bg); 38 | } 39 | 40 | .label-primary { 41 | @include label-variant($label-primary-bg); 42 | } 43 | 44 | .label-success { 45 | @include label-variant($label-success-bg); 46 | } 47 | 48 | .label-info { 49 | @include label-variant($label-info-bg); 50 | } 51 | 52 | .label-warning { 53 | @include label-variant($label-warning-bg); 54 | } 55 | 56 | .label-danger { 57 | @include label-variant($label-danger-bg); 58 | } 59 | -------------------------------------------------------------------------------- /client/styles/bootstrap/_list-group.scss: -------------------------------------------------------------------------------- 1 | // 2 | // List groups 3 | // -------------------------------------------------- 4 | 5 | // Base class 6 | // 7 | // Easily usable on