├── src ├── app │ ├── home │ │ ├── home.scss │ │ ├── home.controller.js │ │ ├── home.html │ │ └── home.module.js │ ├── index.scss │ ├── core │ │ ├── layouts │ │ │ ├── basic.html │ │ │ └── default.html │ │ ├── scss │ │ │ ├── bootstrap │ │ │ │ ├── mixins │ │ │ │ │ ├── _pulls.scss │ │ │ │ │ ├── _center-block.scss │ │ │ │ │ ├── _hide-text.scss │ │ │ │ │ ├── _size.scss │ │ │ │ │ ├── _text-truncate.scss │ │ │ │ │ ├── _tab-focus.scss │ │ │ │ │ ├── _label.scss │ │ │ │ │ ├── _resize.scss │ │ │ │ │ ├── _text-emphasis.scss │ │ │ │ │ ├── _nav-divider.scss │ │ │ │ │ ├── _reset-filter.scss │ │ │ │ │ ├── _alert.scss │ │ │ │ │ ├── _background-variant.scss │ │ │ │ │ ├── _progress.scss │ │ │ │ │ ├── _navbar-align.scss │ │ │ │ │ ├── _reset-text.scss │ │ │ │ │ ├── _border-radius.scss │ │ │ │ │ ├── _pagination.scss │ │ │ │ │ ├── _responsive-visibility.scss │ │ │ │ │ ├── _clearfix.scss │ │ │ │ │ ├── _list-group.scss │ │ │ │ │ ├── _table-row.scss │ │ │ │ │ ├── _screen-reader.scss │ │ │ │ │ ├── _image.scss │ │ │ │ │ ├── _hover.scss │ │ │ │ │ ├── _grid-framework.scss │ │ │ │ │ ├── _grid.scss │ │ │ │ │ ├── _buttons.scss │ │ │ │ │ ├── _gradients.scss │ │ │ │ │ ├── _breakpoints.scss │ │ │ │ │ └── _forms.scss │ │ │ │ ├── bootstrap-flex.scss │ │ │ │ ├── bootstrap-reboot.scss │ │ │ │ ├── _animation.scss │ │ │ │ ├── _jumbotron.scss │ │ │ │ ├── _breadcrumb.scss │ │ │ │ ├── _images.scss │ │ │ │ ├── _close.scss │ │ │ │ ├── _responsive-embed.scss │ │ │ │ ├── _utilities-responsive.scss │ │ │ │ ├── bootstrap.scss │ │ │ │ ├── _pager.scss │ │ │ │ ├── _code.scss │ │ │ │ ├── bootstrap-grid.scss │ │ │ │ ├── _media.scss │ │ │ │ ├── _mixins.scss │ │ │ │ ├── _alert.scss │ │ │ │ ├── _labels.scss │ │ │ │ ├── _print.scss │ │ │ │ ├── _pagination.scss │ │ │ │ ├── _tooltip.scss │ │ │ │ ├── _utilities.scss │ │ │ │ ├── _nav.scss │ │ │ │ ├── _grid.scss │ │ │ │ ├── _list-group.scss │ │ │ │ ├── _utilities-spacing.scss │ │ │ │ ├── _type.scss │ │ │ │ ├── _popover.scss │ │ │ │ ├── _modal.scss │ │ │ │ ├── _tables.scss │ │ │ │ ├── _buttons.scss │ │ │ │ ├── _progress.scss │ │ │ │ ├── _input-group.scss │ │ │ │ ├── _dropdown.scss │ │ │ │ ├── _navbar.scss │ │ │ │ ├── _carousel.scss │ │ │ │ ├── _button-group.scss │ │ │ │ ├── _card.scss │ │ │ │ ├── _custom-forms.scss │ │ │ │ ├── _reboot.scss │ │ │ │ └── _normalize.scss │ │ │ ├── app.scss │ │ │ └── rin │ │ │ │ ├── _angular.scss │ │ │ │ ├── _base.scss │ │ │ │ └── _components.scss │ │ ├── core.module.js │ │ └── core.config.js │ ├── register │ │ ├── register.scss │ │ ├── register.controller.js │ │ ├── register.module.js │ │ └── register.html │ ├── login │ │ ├── login.scss │ │ ├── login.controller.js │ │ ├── login.module.js │ │ └── login.html │ ├── components │ │ ├── components.scss │ │ ├── components.module.js │ │ ├── components.controller.js │ │ └── components.html │ ├── index.run.js │ ├── index.config.js │ ├── main.scss │ ├── navigation │ │ ├── sidebar │ │ │ ├── sidebar.module.js │ │ │ ├── sidebar.controller.js │ │ │ ├── sidebar.html │ │ │ └── sidebar.scss │ │ └── topbar │ │ │ ├── topbar.module.js │ │ │ ├── topbar.controller.js │ │ │ ├── topbar.scss │ │ │ └── topbar.html │ ├── index.controller.js │ ├── index.module.js │ └── index.route.js ├── assets │ ├── fonts │ │ └── simple-line-icons │ │ │ ├── .gitignore │ │ │ └── fonts │ │ │ ├── Simple-Line-Icons.eot │ │ │ ├── Simple-Line-Icons.ttf │ │ │ ├── Simple-Line-Icons.woff │ │ │ └── Simple-Line-Icons.woff2 │ └── images │ │ ├── logo.png │ │ └── rin │ │ └── cards.jpg └── index.html ├── .bowerrc ├── gulp ├── .jshintrc ├── scripts.js ├── conf.js ├── unit-tests.js ├── e2e-tests.js ├── watch.js ├── inject.js ├── server.js ├── styles.js └── build.js ├── .gitignore ├── .editorconfig ├── gulpfile.js ├── bower.json ├── LICENSE ├── .jshintrc ├── package.json └── README.md /src/app/home/home.scss: -------------------------------------------------------------------------------- 1 | #home { 2 | 3 | } 4 | -------------------------------------------------------------------------------- /.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "bower_components" 3 | } 4 | -------------------------------------------------------------------------------- /gulp/.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../.jshintrc", 3 | "node": true 4 | } 5 | -------------------------------------------------------------------------------- /src/app/index.scss: -------------------------------------------------------------------------------- 1 | // bower:scss 2 | // endbower 3 | 4 | // injector 5 | // endinjector -------------------------------------------------------------------------------- /src/assets/fonts/simple-line-icons/.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | *.log 3 | *~ 4 | *# 5 | .DS_STORE -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | bower_components 3 | npm-debug.log 4 | .DS_Store 5 | dist 6 | .tmp 7 | .idea -------------------------------------------------------------------------------- /src/assets/images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mdchristians/rin/HEAD/src/assets/images/logo.png -------------------------------------------------------------------------------- /src/app/core/layouts/basic.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
-------------------------------------------------------------------------------- /src/app/register/register.scss: -------------------------------------------------------------------------------- 1 | #register { 2 | form { 3 | margin-top: 10vh; 4 | padding: 0.5rem; 5 | } 6 | } -------------------------------------------------------------------------------- /src/assets/images/rin/cards.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mdchristians/rin/HEAD/src/assets/images/rin/cards.jpg -------------------------------------------------------------------------------- /src/app/login/login.scss: -------------------------------------------------------------------------------- 1 | #login { 2 | .hero { 3 | max-width: 100%; 4 | height: 25vh; 5 | margin-bottom: 1rem; 6 | } 7 | } -------------------------------------------------------------------------------- /src/app/components/components.scss: -------------------------------------------------------------------------------- 1 | #components { 2 | .component-space { 3 | margin-top: 50px; 4 | margin-bottom: 10px; 5 | } 6 | } -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_pulls.scss: -------------------------------------------------------------------------------- 1 | @mixin pull-left { 2 | float: left !important; 3 | } 4 | @mixin pull-right { 5 | float: right !important; 6 | } 7 | -------------------------------------------------------------------------------- /src/app/core/scss/app.scss: -------------------------------------------------------------------------------- 1 | @import "rin/variables.scss"; 2 | 3 | @import "bootstrap/bootstrap.scss"; 4 | 5 | @import "rin/base.scss"; 6 | @import "rin/components.scss"; -------------------------------------------------------------------------------- /src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mdchristians/rin/HEAD/src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.eot -------------------------------------------------------------------------------- /src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mdchristians/rin/HEAD/src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.ttf -------------------------------------------------------------------------------- /src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mdchristians/rin/HEAD/src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.woff -------------------------------------------------------------------------------- /src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mdchristians/rin/HEAD/src/assets/fonts/simple-line-icons/fonts/Simple-Line-Icons.woff2 -------------------------------------------------------------------------------- /src/app/core/scss/rin/_angular.scss: -------------------------------------------------------------------------------- 1 | [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide:not(.ng-hide-animate) { 2 | display: none !important; 3 | } -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_center-block.scss: -------------------------------------------------------------------------------- 1 | // Center-align a block level element 2 | 3 | @mixin center-block() { 4 | display: block; 5 | margin-left: auto; 6 | margin-right: auto; 7 | } 8 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_hide-text.scss: -------------------------------------------------------------------------------- 1 | // CSS image replacement 2 | @mixin text-hide() { 3 | font: "0/0" a; 4 | color: transparent; 5 | text-shadow: none; 6 | background-color: transparent; 7 | border: 0; 8 | } 9 | -------------------------------------------------------------------------------- /src/app/index.run.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('rin') 7 | .run(runBlock); 8 | 9 | /** @ngInject */ 10 | function runBlock() { 11 | 12 | } 13 | })(); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_size.scss: -------------------------------------------------------------------------------- 1 | // Sizing shortcuts 2 | 3 | @mixin size($width, $height) { 4 | width: $width; 5 | height: $height; 6 | } 7 | 8 | @mixin square($size) { 9 | @include size($size, $size); 10 | } 11 | -------------------------------------------------------------------------------- /src/app/index.config.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('rin') 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config() { 11 | 12 | } 13 | })(); 14 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_text-truncate.scss: -------------------------------------------------------------------------------- 1 | // Text truncate 2 | // Requires inline-block or block for proper styling 3 | 4 | @mixin text-truncate() { 5 | overflow: hidden; 6 | text-overflow: ellipsis; 7 | white-space: nowrap; 8 | } -------------------------------------------------------------------------------- /src/app/main.scss: -------------------------------------------------------------------------------- 1 | @import "login/login.scss"; 2 | @import "register/register.scss"; 3 | @import "navigation/topbar/topbar.scss"; 4 | @import "navigation/sidebar/sidebar.scss"; 5 | @import "home/home.scss"; 6 | @import "components/components.scss"; 7 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/bootstrap-flex.scss: -------------------------------------------------------------------------------- 1 | // Bootstrap with Flexbox enabled 2 | // 3 | // Includes all the imports from the standard Bootstrap project, but enables 4 | // the flexbox variable. 5 | 6 | $enable-flex: true; 7 | 8 | @import "bootstrap"; 9 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_tab-focus.scss: -------------------------------------------------------------------------------- 1 | // WebKit-style focus 2 | 3 | @mixin tab-focus() { 4 | // Default 5 | outline: thin dotted; 6 | // WebKit 7 | outline: 5px auto -webkit-focus-ring-color; 8 | outline-offset: -2px; 9 | } 10 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = tab 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.md] 12 | trim_trailing_whitespace = false 13 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_label.scss: -------------------------------------------------------------------------------- 1 | // Labels 2 | 3 | @mixin label-variant($color) { 4 | background-color: $color; 5 | 6 | &[href] { 7 | @include hover-focus { 8 | background-color: darken($color, 10%); 9 | } 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_resize.scss: -------------------------------------------------------------------------------- 1 | // Resize anything 2 | 3 | @mixin resizable($direction) { 4 | resize: $direction; // Options: horizontal, vertical, both 5 | overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible` 6 | } 7 | -------------------------------------------------------------------------------- /src/app/navigation/sidebar/sidebar.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.sidebar', []) 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config() { 11 | 12 | } 13 | 14 | })(); 15 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/bootstrap-reboot.scss: -------------------------------------------------------------------------------- 1 | // Bootstrap Reboot only 2 | // 3 | // Includes only Normalize and our custom Reboot reset. 4 | 5 | @import "variables"; 6 | @import "mixins/hover"; 7 | @import "mixins/tab-focus"; 8 | 9 | @import "normalize"; 10 | @import "reboot"; 11 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_text-emphasis.scss: -------------------------------------------------------------------------------- 1 | // Typography 2 | 3 | @mixin text-emphasis-variant($parent, $color) { 4 | #{$parent} { 5 | color: $color; 6 | } 7 | a#{$parent} { 8 | @include hover-focus { 9 | color: darken($color, 10%); 10 | } 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_nav-divider.scss: -------------------------------------------------------------------------------- 1 | // Horizontal dividers 2 | // 3 | // Dividers (basically an hr) within dropdowns and nav lists 4 | 5 | @mixin nav-divider($color: #e5e5e5) { 6 | height: 1px; 7 | margin: ($spacer-y / 2) 0; 8 | overflow: hidden; 9 | background-color: $color; 10 | } 11 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_reset-filter.scss: -------------------------------------------------------------------------------- 1 | // Reset filters for IE 2 | // 3 | // When you need to remove a gradient background, do not forget to use this to reset 4 | // the IE filter for IE9. 5 | 6 | @mixin reset-filter() { 7 | filter: "progid:DXImageTransform.Microsoft.gradient(enabled = false)"; 8 | } 9 | -------------------------------------------------------------------------------- /src/app/navigation/topbar/topbar.module.js: -------------------------------------------------------------------------------- 1 | (function () 2 | { 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.topbar', []) 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config() { 11 | 12 | var vm = this; 13 | 14 | } 15 | 16 | })(); 17 | -------------------------------------------------------------------------------- /src/app/register/register.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.register') 7 | .controller('RegisterController', RegisterController); 8 | 9 | function RegisterController() { 10 | 11 | var vm = this; 12 | 13 | } 14 | 15 | })(); 16 | -------------------------------------------------------------------------------- /src/app/index.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('rin') 7 | .controller('AppController', AppController); 8 | 9 | /** @ngInject */ 10 | function AppController() { 11 | 12 | var vm = this; 13 | 14 | } 15 | 16 | })(); 17 | -------------------------------------------------------------------------------- /src/app/home/home.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.home') 7 | .controller('HomeController', HomeController); 8 | 9 | /** @ngInject */ 10 | function HomeController() { 11 | 12 | var vm = this; 13 | 14 | } 15 | 16 | })(); 17 | -------------------------------------------------------------------------------- /src/app/login/login.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.login') 7 | .controller('LoginController', LoginController); 8 | 9 | /** @ngInject */ 10 | function LoginController() { 11 | 12 | var vm = this; 13 | 14 | } 15 | 16 | })(); -------------------------------------------------------------------------------- /src/app/core/layouts/default.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | -------------------------------------------------------------------------------- /src/app/navigation/topbar/topbar.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.topbar') 7 | .controller('TopbarController', TopbarController); 8 | 9 | /** @ngInject */ 10 | function TopbarController() { 11 | 12 | var vm = this; 13 | 14 | } 15 | 16 | })(); 17 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_alert.scss: -------------------------------------------------------------------------------- 1 | // Alerts 2 | 3 | @mixin alert-variant($background, $border, $body-color) { 4 | background-color: $background; 5 | border-color: $border; 6 | color: $body-color; 7 | 8 | hr { 9 | border-top-color: darken($border, 5%); 10 | } 11 | .alert-link { 12 | color: darken($body-color, 10%); 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var gulp = require('gulp'); 4 | var wrench = require('wrench'); 5 | 6 | wrench.readdirSyncRecursive('./gulp').filter(function(file) { 7 | return (/\.(js)$/i).test(file); 8 | }).map(function(file) { 9 | require('./gulp/' + file); 10 | }); 11 | 12 | gulp.task('default', ['clean'], function () { 13 | gulp.start('build'); 14 | }); 15 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_background-variant.scss: -------------------------------------------------------------------------------- 1 | // Contextual backgrounds 2 | 3 | // [converter] $parent hack 4 | @mixin bg-variant($parent, $color) { 5 | #{$parent} { 6 | color: #fff; 7 | background-color: $color; 8 | } 9 | a#{$parent} { 10 | @include hover-focus { 11 | background-color: darken($color, 10%); 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /src/app/navigation/sidebar/sidebar.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.sidebar') 7 | .controller('SidebarController', SidebarController); 8 | 9 | /** @ngInject */ 10 | function SidebarController() { 11 | 12 | var vm = this; 13 | 14 | } 15 | 16 | })(); 17 | 18 | 19 | -------------------------------------------------------------------------------- /src/app/core/core.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | angular 5 | .module('app.core', 6 | [ 7 | 'ngAnimate', 8 | 'angularMoment', 9 | 'ngResource', 10 | 'ui.bootstrap', 11 | 'ui.router', 12 | 'toastr', 13 | 'chart.js' 14 | ]); 15 | })(); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_progress.scss: -------------------------------------------------------------------------------- 1 | // Progress bars 2 | 3 | @mixin progress-variant($color) { 4 | &[value]::-webkit-progress-value { 5 | background-color: $color; 6 | } 7 | 8 | &[value]::-moz-progress-bar { 9 | background-color: $color; 10 | } 11 | 12 | @media screen and (min-width:0\0) { 13 | .progress-bar { 14 | background-color: $color; 15 | } 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/app/home/home.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Rin

4 |
5 |
6 |
7 |
8 |

Howdy

9 |

Welcome to your new go-to dashboard boiler. It has just enough to get you up and going without loading you down with a bunch of extra jazz.

10 |
11 |
12 |
13 |
14 | 15 | -------------------------------------------------------------------------------- /src/app/core/core.config.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | angular 5 | .module('app.core') 6 | .config(config); 7 | 8 | /** @ngInject */ 9 | function config() { 10 | 11 | // toastr configuration 12 | toastr.options.timeOut = 4000; 13 | toastr.options.positionClass = 'toast-top-right'; 14 | toastr.options.preventDuplicates = true; 15 | } 16 | 17 | })(); -------------------------------------------------------------------------------- /src/app/index.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('rin', [ 7 | 8 | // Core 9 | 'app.core', 10 | 11 | // Navigation 12 | 'app.sidebar', 13 | 'app.topbar', 14 | 15 | // Views 16 | 'app.login', 17 | 'app.register', 18 | 'app.home', 19 | 'app.components' 20 | 21 | ]); 22 | })(); 23 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_navbar-align.scss: -------------------------------------------------------------------------------- 1 | // Navbar vertical align 2 | // 3 | // Vertically center elements in the navbar. 4 | // Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin. 5 | 6 | // @mixin navbar-vertical-align($element-height) { 7 | // margin-top: (($navbar-height - $element-height) / 2); 8 | // margin-bottom: (($navbar-height - $element-height) / 2); 9 | // } 10 | -------------------------------------------------------------------------------- /src/app/navigation/sidebar/sidebar.html: -------------------------------------------------------------------------------- 1 |
2 | 12 |
-------------------------------------------------------------------------------- /gulp/scripts.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | 7 | var browserSync = require('browser-sync'); 8 | 9 | var $ = require('gulp-load-plugins')(); 10 | 11 | gulp.task('scripts', function() { 12 | 13 | return gulp.src(path.join(conf.paths.src, '/app/**/*.js')) 14 | .pipe($.jshint()) 15 | .pipe($.jshint.reporter('jshint-stylish')) 16 | .pipe(browserSync.reload({stream: true})) 17 | .pipe($.size()) 18 | }); -------------------------------------------------------------------------------- /src/app/core/scss/rin/_base.scss: -------------------------------------------------------------------------------- 1 | html { 2 | background-color: $body-bg; 3 | } 4 | body { 5 | background-color: $body-bg; 6 | -webkit-font-smoothing: antialiased; 7 | } 8 | a { 9 | cursor: pointer; 10 | cursor: hand; 11 | 12 | &:hover { 13 | text-decoration: none; 14 | } 15 | } 16 | .wrapper { 17 | padding-top: 66px; 18 | padding-left: $sidebar-width; 19 | } 20 | .container-fluid { 21 | margin-right: auto; 22 | margin-left: auto; 23 | padding: 0.9375rem; 24 | } 25 | .break { 26 | margin-top: 15px; 27 | } -------------------------------------------------------------------------------- /gulp/conf.js: -------------------------------------------------------------------------------- 1 | var gutil = require('gulp-util'); 2 | 3 | /** 4 | * Gulp Paths 5 | */ 6 | exports.paths = { 7 | src: 'src', 8 | dist: 'dist', 9 | tmp: '.tmp', 10 | e2e: 'e2e' 11 | }; 12 | 13 | // Wiredep 14 | exports.wiredep = { 15 | directory: 'bower_components' 16 | }; 17 | 18 | // Error Handler 19 | exports.errorHandler = function(title) { 20 | 'use strict'; 21 | 22 | return function(err) { 23 | gutil.log(gutil.colors.red('[' + title + ']'), err.toString()); 24 | this.emit('end'); 25 | }; 26 | }; -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_animation.scss: -------------------------------------------------------------------------------- 1 | .fade { 2 | opacity: 0; 3 | transition: opacity .15s linear; 4 | 5 | &.in { 6 | opacity: 1; 7 | } 8 | } 9 | 10 | .collapse { 11 | display: none; 12 | 13 | &.in { 14 | display: block; 15 | } 16 | // tr&.in { display: table-row; } 17 | // tbody&.in { display: table-row-group; } 18 | } 19 | 20 | .collapsing { 21 | position: relative; 22 | height: 0; 23 | overflow: hidden; 24 | transition-timing-function: ease; 25 | transition-duration: .35s; 26 | transition-property: height; 27 | } 28 | -------------------------------------------------------------------------------- /src/app/home/home.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.home', []) 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config($stateProvider) { 11 | 12 | $stateProvider.state('app.home', { 13 | url : '/home', 14 | views : { 15 | 'content@app': { 16 | templateUrl: 'app/home/home.html', 17 | controller : 'HomeController as vm' 18 | } 19 | } 20 | }); 21 | } 22 | })(); 23 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_reset-text.scss: -------------------------------------------------------------------------------- 1 | @mixin reset-text { 2 | font-family: $font-family-base; 3 | // We deliberately do NOT reset font-size. 4 | font-style: normal; 5 | font-weight: normal; 6 | letter-spacing: normal; 7 | line-break: auto; 8 | line-height: $line-height; 9 | text-align: left; // Fallback for where `start` is not supported 10 | text-align: start; 11 | text-decoration: none; 12 | text-shadow: none; 13 | text-transform: none; 14 | white-space: normal; 15 | word-break: normal; 16 | word-spacing: normal; 17 | word-wrap: normal; 18 | } 19 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_jumbotron.scss: -------------------------------------------------------------------------------- 1 | .jumbotron { 2 | padding: $jumbotron-padding ($jumbotron-padding / 2); 3 | margin-bottom: $jumbotron-padding; 4 | background-color: $jumbotron-bg; 5 | @include border-radius($border-radius-lg); 6 | } 7 | 8 | .jumbotron-hr { 9 | border-top-color: darken($jumbotron-bg, 10%); 10 | } 11 | 12 | @include media-breakpoint-up(sm) { 13 | .jumbotron { 14 | padding: ($jumbotron-padding * 2) $jumbotron-padding; 15 | } 16 | } 17 | 18 | .jumbotron-fluid { 19 | padding-right: 0; 20 | padding-left: 0; 21 | @include border-radius(0); 22 | } 23 | -------------------------------------------------------------------------------- /src/app/components/components.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.components', []) 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config($stateProvider) { 11 | 12 | $stateProvider 13 | 14 | .state('app.components', { 15 | url: '/components', 16 | views: { 17 | 'content@app': { 18 | templateUrl: 'app/components/components.html', 19 | controller: 'ComponentsController as vm' 20 | } 21 | } 22 | }); 23 | } 24 | })(); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_border-radius.scss: -------------------------------------------------------------------------------- 1 | // Single side border-radius 2 | 3 | @mixin border-top-radius($radius) { 4 | border-top-right-radius: $radius; 5 | border-top-left-radius: $radius; 6 | } 7 | 8 | @mixin border-right-radius($radius) { 9 | border-bottom-right-radius: $radius; 10 | border-top-right-radius: $radius; 11 | } 12 | 13 | @mixin border-bottom-radius($radius) { 14 | border-bottom-right-radius: $radius; 15 | border-bottom-left-radius: $radius; 16 | } 17 | 18 | @mixin border-left-radius($radius) { 19 | border-bottom-left-radius: $radius; 20 | border-top-left-radius: $radius; 21 | } 22 | -------------------------------------------------------------------------------- /gulp/unit-tests.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | 7 | var karma = require('karma'); 8 | 9 | function runTests(singleRun, done) { 10 | karma.server.start({ 11 | configFile: path.join(__dirname, '/../karma.conf.js'), 12 | singleRun: singleRun, 13 | autoWatch: !singleRun 14 | }, function() { 15 | done(); 16 | }); 17 | } 18 | 19 | gulp.task('test', ['scripts'], function(done) { 20 | runTests(true, done); 21 | }); 22 | 23 | gulp.task('test:auto', ['watch'], function(done) { 24 | runTests(false, done); 25 | }); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_pagination.scss: -------------------------------------------------------------------------------- 1 | // Pagination 2 | 3 | @mixin pagination-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) { 4 | > li { 5 | > a, 6 | > span { 7 | padding: $padding-vertical $padding-horizontal; 8 | font-size: $font-size; 9 | line-height: $line-height; 10 | } 11 | &:first-child { 12 | > a, 13 | > span { 14 | @include border-left-radius($border-radius); 15 | } 16 | } 17 | &:last-child { 18 | > a, 19 | > span { 20 | @include border-right-radius($border-radius); 21 | } 22 | } 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_responsive-visibility.scss: -------------------------------------------------------------------------------- 1 | // Responsive utilities 2 | 3 | // 4 | // More easily include all the states for responsive-utilities.less. 5 | // [converter] $parent hack 6 | @mixin responsive-visibility($parent) { 7 | #{$parent} { 8 | display: block !important; 9 | } 10 | table#{$parent} { display: table !important; } 11 | tr#{$parent} { display: table-row !important; } 12 | th#{$parent}, 13 | td#{$parent} { display: table-cell !important; } 14 | } 15 | 16 | // [converter] $parent hack 17 | @mixin responsive-invisibility($parent) { 18 | #{$parent} { 19 | display: none !important; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_breadcrumb.scss: -------------------------------------------------------------------------------- 1 | .breadcrumb { 2 | padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal; 3 | margin-bottom: $spacer-y; 4 | list-style: none; 5 | background-color: $breadcrumb-bg; 6 | @include border-radius($border-radius); 7 | 8 | > li { 9 | display: inline-block; 10 | 11 | + li:before { 12 | $nbsp: "\00a0"; 13 | padding-right: .5rem; 14 | padding-left: .5rem; 15 | color: $breadcrumb-divider-color; 16 | content: "#{$breadcrumb-divider}#{$nbsp}"; // Unicode space added since inline-block means non-collapsing white-space 17 | } 18 | } 19 | 20 | > .active { 21 | color: $breadcrumb-active-color; 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_clearfix.scss: -------------------------------------------------------------------------------- 1 | // Clearfix 2 | // 3 | // For modern browsers 4 | // 1. The space content is one way to avoid an Opera bug when the 5 | // contenteditable attribute is included anywhere else in the document. 6 | // Otherwise it causes space to appear at the top and bottom of elements 7 | // that are clearfixed. 8 | // 2. The use of `table` rather than `block` is only necessary if using 9 | // `:before` to contain the top-margins of child elements. 10 | // 11 | // Source: http://nicolasgallagher.com/micro-clearfix-hack/ 12 | 13 | @mixin clearfix() { 14 | &:before, 15 | &:after { 16 | content: " "; // 1 17 | display: table; // 2 18 | } 19 | &:after { 20 | clear: both; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/app/login/login.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.login', []) 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config($stateProvider) { 11 | 12 | $stateProvider.state('app.login', { 13 | url : '/login', 14 | views: { 15 | 'main@' : { 16 | templateUrl: 'app/core/layouts/basic.html' 17 | }, 18 | 'content@app.login': { 19 | templateUrl: 'app/login/login.html', 20 | controller : 'LoginController as vm' 21 | } 22 | } 23 | }); 24 | } 25 | 26 | })(); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_list-group.scss: -------------------------------------------------------------------------------- 1 | // List Groups 2 | 3 | @mixin list-group-item-variant($state, $background, $color) { 4 | .list-group-item-#{state} { 5 | color: $color; 6 | background-color: $background; 7 | } 8 | 9 | a.list-group-item-#{state}, 10 | button.list-group-item-#{state} { 11 | color: $color; 12 | 13 | .list-group-item-heading { 14 | color: inherit; 15 | } 16 | 17 | @include hover-focus { 18 | color: $color; 19 | background-color: darken($background, 5%); 20 | } 21 | 22 | &.active { 23 | @include plain-hover-focus { 24 | color: #fff; 25 | background-color: $color; 26 | border-color: $color; 27 | } 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/navigation/topbar/topbar.scss: -------------------------------------------------------------------------------- 1 | #topbar { 2 | .navbar { 3 | box-shadow: $topbar-shadow; 4 | } 5 | .navbar-fixed-top { 6 | border: 0; 7 | background-color: $topbar-bg; 8 | color: $topbar-color; 9 | } 10 | .avatar { 11 | object-fit: cover; 12 | border-radius: 500px; 13 | max-width: 50px; 14 | } 15 | .nav-link { 16 | display: block; 17 | padding-top: 0.825rem; 18 | padding-bottom: 0.825rem; 19 | } 20 | .menu-img { 21 | margin-left: 0.5rem; 22 | } 23 | a { 24 | color: $topbar-color; 25 | 26 | &:hover { 27 | color: lighten($topbar-color, 10%); 28 | text-decoration: none; 29 | cursor: pointer; 30 | cursor: hand; 31 | } 32 | } 33 | .navbar-brand { 34 | padding-top: .6rem; 35 | } 36 | } -------------------------------------------------------------------------------- /src/app/register/register.module.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.register', []) 7 | .config(config); 8 | 9 | /** @ngInject */ 10 | function config($stateProvider) { 11 | 12 | $stateProvider.state('app.register', { 13 | url: '/register', 14 | views: { 15 | 'main@' : { 16 | templateUrl: 'app/core/layouts/basic.html' 17 | }, 18 | 'content@app.register': { 19 | templateUrl: 'app/register/register.html', 20 | controller : 'RegisterController as vm' 21 | } 22 | } 23 | }); 24 | } 25 | })(); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_images.scss: -------------------------------------------------------------------------------- 1 | // Responsive images (ensure images don't scale beyond their parents) 2 | .img-responsive { 3 | @include img-responsive(); 4 | } 5 | 6 | // Rounded corners 7 | .img-rounded { 8 | @include border-radius($border-radius-lg); 9 | } 10 | 11 | // Image thumbnails 12 | .img-thumbnail { 13 | padding: $thumbnail-padding; 14 | line-height: $line-height; 15 | background-color: $thumbnail-bg; 16 | border: 1px solid $thumbnail-border; 17 | border-radius: $thumbnail-border-radius; 18 | transition: all .2s ease-in-out; 19 | @include box-shadow(0 1px 2px rgba(0,0,0,.075)); 20 | 21 | // Keep them at most 100% wide 22 | @include img-responsive(inline-block); 23 | } 24 | 25 | // Perfect circle 26 | .img-circle { 27 | border-radius: 50%; 28 | } 29 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_table-row.scss: -------------------------------------------------------------------------------- 1 | // Tables 2 | 3 | @mixin table-row-variant($state, $background) { 4 | // Exact selectors below required to override `.table-striped` and prevent 5 | // inheritance to nested tables. 6 | .table-#{$state} { 7 | &, 8 | > th, 9 | > td { 10 | background-color: $background; 11 | } 12 | } 13 | 14 | // Hover states for `.table-hover` 15 | // Note: this is not available for cells or rows within `thead` or `tfoot`. 16 | .table-hover { 17 | $hover-background: darken($background, 5%); 18 | 19 | .table-#{$state} { 20 | @include hover { 21 | background-color: $hover-background; 22 | 23 | > td, 24 | > th { 25 | background-color: $hover-background; 26 | } 27 | } 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_close.scss: -------------------------------------------------------------------------------- 1 | .close { 2 | float: right; 3 | font-size: ($font-size-base * 1.5); 4 | font-weight: $close-font-weight; 5 | line-height: 1; 6 | color: $close-color; 7 | text-shadow: $close-text-shadow; 8 | opacity: .2; 9 | 10 | @include hover-focus { 11 | color: $close-color; 12 | text-decoration: none; 13 | cursor: pointer; 14 | opacity: .5; 15 | } 16 | } 17 | 18 | // Additional properties for button version 19 | // iOS requires the button element instead of an anchor tag. 20 | // If you want the anchor version, it requires `href="#"`. 21 | // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile 22 | button.close { 23 | padding: 0; 24 | cursor: pointer; 25 | background: transparent; 26 | border: 0; 27 | -webkit-appearance: none; 28 | } 29 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_screen-reader.scss: -------------------------------------------------------------------------------- 1 | // Only display content to screen readers 2 | // 3 | // See: http://a11yproject.com/posts/how-to-hide-content/ 4 | 5 | @mixin sr-only { 6 | position: absolute; 7 | width: 1px; 8 | height: 1px; 9 | padding: 0; 10 | margin: -1px; 11 | overflow: hidden; 12 | clip: rect(0,0,0,0); 13 | border: 0; 14 | } 15 | 16 | // Use in conjunction with .sr-only to only display content when it's focused. 17 | // 18 | // Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 19 | // 20 | // Credit: HTML5 Boilerplate 21 | 22 | @mixin sr-only-focusable { 23 | &:active, 24 | &:focus { 25 | position: static; 26 | width: auto; 27 | height: auto; 28 | margin: 0; 29 | overflow: visible; 30 | clip: auto; 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_responsive-embed.scss: -------------------------------------------------------------------------------- 1 | // Credit: Nicolas Gallagher and SUIT CSS. 2 | 3 | .embed-responsive { 4 | position: relative; 5 | display: block; 6 | height: 0; 7 | padding: 0; 8 | overflow: hidden; 9 | 10 | .embed-responsive-item, 11 | iframe, 12 | embed, 13 | object, 14 | video { 15 | position: absolute; 16 | top: 0; 17 | bottom: 0; 18 | left: 0; 19 | width: 100%; 20 | height: 100%; 21 | border: 0; 22 | } 23 | } 24 | 25 | // Modifier class for 21:9 aspect ratio 26 | .embed-responsive-21by9 { 27 | padding-bottom: percentage(9 / 21); 28 | } 29 | 30 | // Modifier class for 16:9 aspect ratio 31 | .embed-responsive-16by9 { 32 | padding-bottom: percentage(9 / 16); 33 | } 34 | 35 | // Modifier class for 4:3 aspect ratio 36 | .embed-responsive-4by3 { 37 | padding-bottom: percentage(3 / 4); 38 | } 39 | -------------------------------------------------------------------------------- /src/app/navigation/topbar/topbar.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/navigation/sidebar/sidebar.scss: -------------------------------------------------------------------------------- 1 | #sidebar { 2 | 3 | .sidebar { 4 | position: fixed; 5 | top: $topbar-height; 6 | bottom: 0; 7 | left: 0; 8 | z-index: 1000; 9 | display: block; 10 | width: $sidebar-width; 11 | background-color: $sidebar-bg; 12 | color: $sidebar-color; 13 | box-shadow: $sidebar-shadow; 14 | height: 100%; 15 | } 16 | .sidebar-link { 17 | padding: .55rem .2rem; 18 | margin-top: .25rem; 19 | 20 | i { 21 | color: darken($white, 10%); 22 | margin-left: .75rem; 23 | margin-right: .5rem; 24 | } 25 | a { 26 | color: darken($white, 10%); 27 | } 28 | } 29 | .active { 30 | background-color: lighten($sidebar-bg, 10%); 31 | 32 | i { 33 | color: $white; 34 | } 35 | a { 36 | color: $white; 37 | } 38 | } 39 | .sidebar-footer { 40 | position: fixed; 41 | bottom: 0; 42 | left: 0; 43 | width: $sidebar-width; 44 | text-align: center; 45 | padding: 15px 5px; 46 | 47 | img { 48 | max-width: $sidebar-width/3; 49 | } 50 | } 51 | } -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_utilities-responsive.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Mixins 3 | // 4 | 5 | @each $bp in map-keys($grid-breakpoints) { 6 | .hidden-#{$bp}-up { 7 | @include media-breakpoint-up($bp) { 8 | display: none !important; 9 | } 10 | } 11 | .hidden-#{$bp}-down { 12 | @include media-breakpoint-down($bp) { 13 | display: none !important; 14 | } 15 | } 16 | } 17 | 18 | 19 | // Print utilities 20 | // 21 | // Media queries are placed on the inside to be mixin-friendly. 22 | 23 | .visible-print-block { 24 | display: none !important; 25 | 26 | @media print { 27 | display: block !important; 28 | } 29 | } 30 | .visible-print-inline { 31 | display: none !important; 32 | 33 | @media print { 34 | display: inline !important; 35 | } 36 | } 37 | .visible-print-inline-block { 38 | display: none !important; 39 | 40 | @media print { 41 | display: inline-block !important; 42 | } 43 | } 44 | 45 | .hidden-print { 46 | @media print { 47 | @include responsive-invisibility(".hidden-print"); 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /src/app/components/components.controller.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('app.components') 7 | .controller('ComponentsController', ComponentsController); 8 | 9 | /* @ngInject */ 10 | function ComponentsController(toastr) { 11 | 12 | var vm = this; 13 | 14 | /* ANGULAR CHARTS 15 | =============================== */ 16 | vm.lineLabels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; 17 | vm.lineSeries = ['Series A', 'Series B']; 18 | vm.lineColors = ['#2ecc71', '#9b59b6']; 19 | vm.lineData = [ 20 | [65, 59, 80, 81, 56, 55, 40], 21 | [28, 48, 40, 19, 86, 27, 90] 22 | ]; 23 | vm.lineOnClick = function (points, evt) { 24 | toastr.info(points, evt); 25 | }; 26 | 27 | vm.radarLabels =['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running']; 28 | vm.radarColors = ['#3498db', '#f1c40f']; 29 | vm.radarData = [ 30 | [65, 59, 90, 81, 56, 55, 40], 31 | [28, 48, 40, 19, 96, 27, 100] 32 | ]; 33 | } 34 | })(); -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Rin", 3 | "description": "Angular & Bootstrap 4 dashboard boiler", 4 | "main": "gulpfile.js", 5 | "authors": [ 6 | "Matt Christians (http://mdchristians.com)" 7 | ], 8 | "license": "MIT", 9 | "homepage": "http://www.mdchristians.com/", 10 | "dependencies": { 11 | "angular": "~1.4.0", 12 | "angular-animate": "~1.4.8", 13 | "jquery": "~2.2.0", 14 | "bootstrap": "4.0.0-alpha", 15 | "bootstrap-additions": "~0.3.1", 16 | "angular-bootstrap": "~0.14.3", 17 | "angular-chart.js": "~0.8.8", 18 | "angular-moment": "~0.10.3", 19 | "angular-resource": "~1.4.8", 20 | "angular-toastr": "~1.6.0", 21 | "angular-touch": "~1.4.8", 22 | "angular-ui-router": "~0.2.15", 23 | "d3": "~3.5.12", 24 | "moment": "~2.10.6", 25 | "toastr": "~2.1.2", 26 | "angular-charts": "~0.2.7" 27 | }, 28 | "resolutions": { 29 | "angular": "~1.4.0", 30 | "d3": "~3.5.12" 31 | }, 32 | "overrides": { 33 | "jquery": { 34 | "main": "dist/jquery.js" 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /src/app/index.route.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 3 | 'use strict'; 4 | 5 | angular 6 | .module('rin') 7 | .config(routeConfig); 8 | 9 | /** @ngInject */ 10 | function routeConfig($stateProvider, $urlRouterProvider, $locationProvider) { 11 | 12 | $urlRouterProvider.otherwise('/login'); 13 | 14 | $stateProvider 15 | .state('app', { 16 | abstract: true, 17 | views : { 18 | 'main@' : { 19 | templateUrl: 'app/core/layouts/default.html' 20 | }, 21 | 'topbar@app': { 22 | templateUrl: 'app/navigation/topbar/topbar.html', 23 | controller : 'TopbarController as vm' 24 | }, 25 | 'sidebar@app': { 26 | templateUrl: 'app/navigation/sidebar/sidebar.html', 27 | controller : 'SidebarController as vm' 28 | } 29 | } 30 | }); 31 | } 32 | 33 | })(); 34 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_image.scss: -------------------------------------------------------------------------------- 1 | // Image Mixins 2 | // - Responsive image 3 | // - Retina image 4 | 5 | 6 | // Responsive image 7 | // 8 | // Keep images from scaling beyond the width of their parents. 9 | 10 | @mixin img-responsive($display: block) { 11 | display: $display; 12 | max-width: 100%; // Part 1: Set a maximum relative to the parent 13 | height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching 14 | } 15 | 16 | 17 | // Retina image 18 | // 19 | // Short retina mixin for setting background-image and -size. 20 | 21 | @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) { 22 | background-image: url("#{file-1x}"); 23 | 24 | @media 25 | only screen and (-webkit-min-device-pixel-ratio: 2), 26 | only screen and ( -o-min-device-pixel-ratio: 2/1), 27 | only screen and ( min-device-pixel-ratio: 2), 28 | only screen and ( min-resolution: 192dpi), 29 | only screen and ( min-resolution: 2dppx) { 30 | background-image: url("#{file-2x}"); 31 | background-size: $width-1x $height-1x; 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/bootstrap.scss: -------------------------------------------------------------------------------- 1 | // Core variables and mixins 2 | @import "variables"; 3 | @import "mixins"; 4 | 5 | // // Reset and dependencies 6 | @import "normalize"; 7 | @import "print"; 8 | 9 | // Core CSS 10 | @import "reboot"; 11 | @import "type"; 12 | @import "images"; 13 | @import "code"; 14 | @import "grid"; 15 | @import "tables"; 16 | @import "forms"; 17 | @import "buttons"; 18 | 19 | // // Components 20 | @import "animation"; 21 | @import "dropdown"; 22 | @import "button-group"; 23 | @import "input-group"; 24 | @import "custom-forms"; 25 | @import "nav"; 26 | @import "navbar"; 27 | @import "card"; 28 | @import "breadcrumb"; 29 | @import "pagination"; 30 | @import "pager"; 31 | @import "labels"; 32 | @import "jumbotron"; 33 | @import "alert"; 34 | @import "progress"; 35 | @import "media"; 36 | @import "list-group"; 37 | @import "responsive-embed"; 38 | @import "close"; 39 | 40 | // Components w/ JavaScript 41 | @import "modal"; 42 | @import "tooltip"; 43 | @import "popover"; 44 | @import "carousel"; 45 | 46 | // Utility classes 47 | @import "utilities"; 48 | @import "utilities-spacing"; 49 | @import "utilities-responsive"; 50 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016 Matt 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /gulp/e2e-tests.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | 7 | var browserSync = require('browser-sync'); 8 | 9 | var $ = require('gulp-load-plugins')(); 10 | 11 | // Selenium webdriver 12 | gulp.task('webdriver-update', $.protractor.webdriver_update); 13 | 14 | gulp.task('webdriver-standalone', $.protractor.webdriver_standalone); 15 | 16 | function runProtractor(done) { 17 | var params = process.argv; 18 | var args = params.length > 3 ? [params[3], params[4]] : []; 19 | 20 | gulp.src(path.join(conf.paths.e2e, '/**/*.js')) 21 | .pipe($.protractor.protractor({ 22 | configFile: 'protractor.conf.js', 23 | args: args 24 | })) 25 | .on('error', function(err) { 26 | throw err; 27 | }) 28 | .on('end', function() { 29 | // Close browser 30 | browserSync.exit(); 31 | done(); 32 | }); 33 | } 34 | 35 | gulp.task('protractor', ['protractor:src']); 36 | gulp.task('protractor:src', ['serve:e2e', 'webdriver-update'], runProtractor); 37 | gulp.task('protractor:dist', ['serve:e2e-dist', 'webdriver-update'], runProtractor); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_pager.scss: -------------------------------------------------------------------------------- 1 | .pager { 2 | padding-left: 0; 3 | margin-top: $spacer-y; 4 | margin-bottom: $spacer-y; 5 | text-align: center; 6 | list-style: none; 7 | @include clearfix(); 8 | 9 | li { 10 | display: inline; 11 | 12 | > a, 13 | > span { 14 | display: inline-block; 15 | padding: 5px 14px; 16 | background-color: $pager-bg; 17 | border: 1px solid $pager-border; 18 | border-radius: $pager-border-radius; 19 | } 20 | 21 | > a { 22 | @include hover-focus { 23 | text-decoration: none; 24 | background-color: $pager-hover-bg; 25 | } 26 | } 27 | } 28 | 29 | .disabled { 30 | > a { 31 | @include plain-hover-focus { 32 | color: $pager-disabled-color; 33 | cursor: $cursor-disabled; 34 | background-color: $pager-bg; 35 | } 36 | } 37 | > span { 38 | color: $pager-disabled-color; 39 | cursor: $cursor-disabled; 40 | background-color: $pager-bg; 41 | } 42 | } 43 | } 44 | 45 | .pager-next { 46 | > a, 47 | > span { 48 | float: right; 49 | } 50 | } 51 | 52 | .pager-prev { 53 | > a, 54 | > span { 55 | float: left; 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_hover.scss: -------------------------------------------------------------------------------- 1 | @mixin hover { 2 | @if $enable-hover-media-query { 3 | // See Media Queries Level 4: http://drafts.csswg.org/mediaqueries/#hover 4 | // Currently shimmed by https://github.com/twbs/mq4-hover-shim 5 | @media (hover: hover) { 6 | &:hover { @content } 7 | } 8 | } 9 | @else { 10 | &:hover { @content } 11 | } 12 | } 13 | 14 | @mixin hover-focus { 15 | @if $enable-hover-media-query { 16 | &:focus { @content } 17 | @include hover { @content } 18 | } 19 | @else { 20 | &:focus, 21 | &:hover { 22 | @content 23 | } 24 | } 25 | } 26 | 27 | @mixin plain-hover-focus { 28 | @if $enable-hover-media-query { 29 | &, 30 | &:focus { 31 | @content 32 | } 33 | @include hover { @content } 34 | } 35 | @else { 36 | &, 37 | &:focus, 38 | &:hover { 39 | @content 40 | } 41 | } 42 | } 43 | 44 | @mixin hover-focus-active { 45 | @if $enable-hover-media-query { 46 | &:focus, 47 | &:active { 48 | @content 49 | } 50 | @include hover { @content } 51 | } 52 | @else { 53 | &:focus, 54 | &:active, 55 | &:hover { 56 | @content 57 | } 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /src/app/core/scss/rin/_components.scss: -------------------------------------------------------------------------------- 1 | .text-left { text-align: left; } 2 | .text-center { text-align: center; } 3 | .text-right { text-align: right; } 4 | 5 | .box { 6 | background-color: #fff; 7 | position: relative; 8 | margin-bottom: 1.5rem; 9 | 10 | hr { 11 | margin-left: 1rem; 12 | margin-right: 1rem; 13 | margin-top: 0rem; 14 | margin-bottom: 0rem; 15 | } 16 | 17 | .box-header { 18 | position: relative; 19 | padding: 1rem; 20 | padding-bottom: 0rem; 21 | } 22 | .box-body { 23 | padding: 1rem; 24 | } 25 | } 26 | 27 | .card { 28 | max-width: 100%; 29 | 30 | .card-img-top, .card-img { 31 | width: 100%; 32 | } 33 | } 34 | 35 | .linear-primary { 36 | background-image: linear-gradient(to bottom right, $primary 0%, $accent 100%); 37 | } 38 | 39 | .linear-primary { 40 | background-image: linear-gradient(to bottom right, $accent 0%, $success 100%); 41 | } 42 | 43 | .linear-primary { 44 | background-image: linear-gradient(to bottom right, #36ABA2 0%, #EFD23E 100%); 45 | } 46 | 47 | .linear-primary { 48 | background-image: linear-gradient(to bottom right, #36ABA2 0%, #EFD23E 100%); 49 | } 50 | 51 | .linear-primary { 52 | background-image: linear-gradient(to bottom right, #36ABA2 0%, #EFD23E 100%); 53 | } -------------------------------------------------------------------------------- /gulp/watch.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | var console = require('console'); 7 | 8 | var browserSync = require('browser-sync'); 9 | 10 | function isOnlyChange(event) { 11 | return event.type === 'changed'; 12 | } 13 | 14 | gulp.task('watch', ['inject'], function() { 15 | gulp.watch([path.join(conf.paths.src, '/*.html'), 'bower.json'], ['inject']); 16 | gulp.watch([ 17 | path.join(conf.paths.src, '/app/**/*.css'), 18 | path.join(conf.paths.src, '/app/**/*.scss') 19 | ], function(event) { 20 | if (isOnlyChange(event)) { 21 | gulp.start('styles'); 22 | } else { 23 | gulp.start('inject'); 24 | } 25 | }); 26 | 27 | gulp.watch(path.join(conf.paths.src, '/app/**/*.js'), function(event) { 28 | if (isOnlyChange(event)) { 29 | gulp.start('scripts'); 30 | } else { 31 | gulp.start('inject'); 32 | } 33 | }); 34 | 35 | gulp.watch([ 36 | path.join(conf.paths.src, '/app/**/*.html'), 37 | path.join(conf.paths.src, '/app/**/*.json'), 38 | ], function(event) { 39 | browserSync.reload(event.path); 40 | }); 41 | }); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_code.scss: -------------------------------------------------------------------------------- 1 | // Inline and block code styles 2 | code, 3 | kbd, 4 | pre, 5 | samp { 6 | font-family: $font-family-monospace; 7 | } 8 | 9 | // Inline code 10 | code { 11 | padding: .2rem .4rem; 12 | font-size: 90%; 13 | color: $code-color; 14 | background-color: $code-bg; 15 | @include border-radius($border-radius); 16 | } 17 | 18 | // User input typically entered via keyboard 19 | kbd { 20 | padding: .2rem .4rem; 21 | font-size: 90%; 22 | color: $kbd-color; 23 | background-color: $kbd-bg; 24 | @include border-radius($border-radius-sm); 25 | @include box-shadow(inset 0 -.1rem 0 rgba(0,0,0,.25)); 26 | 27 | kbd { 28 | padding: 0; 29 | font-size: 100%; 30 | font-weight: bold; 31 | @include box-shadow(none); 32 | } 33 | } 34 | 35 | // Blocks of code 36 | pre { 37 | display: block; 38 | margin-top: 0; 39 | margin-bottom: 1rem; 40 | font-size: 90%; 41 | line-height: $line-height; 42 | color: $pre-color; 43 | 44 | // Account for some code outputs that place code tags in pre tags 45 | code { 46 | padding: 0; 47 | font-size: inherit; 48 | color: inherit; 49 | background-color: transparent; 50 | border-radius: 0; 51 | } 52 | } 53 | 54 | // Enable scrollable blocks of code 55 | .pre-scrollable { 56 | max-height: $pre-scrollable-max-height; 57 | overflow-y: scroll; 58 | } 59 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/bootstrap-grid.scss: -------------------------------------------------------------------------------- 1 | // Bootstrap Grid only 2 | // 3 | // Includes relevant variables and mixins for the regular (non-flexbox) grid 4 | // system, as well as the generated predefined classes (e.g., `.col-4-sm`). 5 | 6 | 7 | // 8 | // Variables 9 | // 10 | 11 | // Grid system 12 | // 13 | // Define your custom responsive grid. 14 | $grid-breakpoints: ( 15 | // Extra small screen / phone 16 | xs: 0, 17 | // Small screen / phone 18 | sm: 34em, 19 | // Medium screen / tablet 20 | md: 48em, 21 | // Large screen / desktop 22 | lg: 62em, 23 | // Extra large screen / wide desktop 24 | xl: 75em 25 | ) !default; 26 | 27 | // Number of columns in the grid. 28 | $grid-columns: 12 !default; 29 | 30 | // Padding between columns. Gets divided in half for the left and right. 31 | $grid-gutter-width: 1.5rem !default; 32 | 33 | 34 | // Container sizes 35 | // 36 | // Define the maximum width of `.container` for different screen sizes. 37 | 38 | $container-max-widths: ( 39 | sm: 34rem, // 480 40 | md: 45rem, // 720 41 | lg: 60rem, // 960 42 | xl: 72.25rem // 1140 43 | ) !default; 44 | 45 | 46 | // 47 | // Grid mixins 48 | // 49 | 50 | @import "variables"; 51 | 52 | @import "mixins/clearfix"; 53 | @import "mixins/breakpoints"; 54 | @import "mixins/grid-framework"; 55 | @import "mixins/grid"; 56 | 57 | @import "grid"; 58 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_media.scss: -------------------------------------------------------------------------------- 1 | @if $enable-flex { 2 | .media { 3 | display: flex; 4 | margin-bottom: $spacer; 5 | } 6 | .media-body { 7 | flex: 1; 8 | } 9 | } @else { 10 | .media { 11 | margin-top: 15px; 12 | 13 | &:first-child { 14 | margin-top: 0; 15 | } 16 | } 17 | .media, 18 | .media-body { 19 | overflow: hidden; 20 | zoom: 1; 21 | } 22 | .media-body { 23 | width: 10000px; 24 | } 25 | .media-left, 26 | .media-right, 27 | .media-body { 28 | display: table-cell; 29 | vertical-align: top; 30 | } 31 | .media-middle { 32 | vertical-align: middle; 33 | } 34 | .media-bottom { 35 | vertical-align: bottom; 36 | } 37 | } 38 | 39 | 40 | // 41 | // Images/elements as the media anchor 42 | // 43 | 44 | .media-object { 45 | display: block; 46 | 47 | // Fix collapse in webkit from max-width: 100% and display: table-cell. 48 | &.img-thumbnail { 49 | max-width: none; 50 | } 51 | } 52 | 53 | 54 | // 55 | // Alignment 56 | // 57 | 58 | .media-right { 59 | padding-left: 10px; 60 | } 61 | 62 | .media-left { 63 | padding-right: 10px; 64 | } 65 | 66 | 67 | // 68 | // Headings 69 | // 70 | 71 | .media-heading { 72 | margin-top: 0; 73 | margin-bottom: 5px; 74 | } 75 | 76 | 77 | // 78 | // Media list variation 79 | // 80 | 81 | .media-list { 82 | padding-left: 0; 83 | list-style: none; 84 | } 85 | -------------------------------------------------------------------------------- /src/app/login/login.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 5 |
6 |
7 |
8 |
9 |
10 |
11 |

Login

12 |
13 |
14 |
15 | 16 | 17 |
18 |
19 | 20 | 21 |
22 |
23 |
24 | 25 |
26 |
27 |
28 |
29 |
30 | 31 |
32 |
33 |
34 |
-------------------------------------------------------------------------------- /gulp/inject.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | 7 | var $ = require('gulp-load-plugins')(); 8 | 9 | var wiredep = require('wiredep').stream; 10 | var _ = require('lodash'); 11 | 12 | // Inject Task 13 | gulp.task('inject', ['scripts', 'styles'], function() { 14 | var injectStyles = gulp.src([ 15 | path.join(conf.paths.tmp, '/serve/app/**/*.css'), 16 | path.join('!' + conf.paths.tmp, '/serve/app/vendor.css') 17 | ], { 18 | read: false 19 | }); 20 | 21 | var injectScripts = gulp.src([ 22 | path.join(conf.paths.src, '/app/**/*.module.js'), 23 | path.join(conf.paths.src, '/app/**/*.js'), 24 | path.join('!' + conf.paths.src, '/app/**/*.spec.js'), 25 | path.join('!' + conf.paths.src, '/app/**/*.mock.js') 26 | ]) 27 | .pipe($.angularFilesort()).on('error', conf.errorHandler('AngularFilesort')); 28 | 29 | var injectOptions = { 30 | ignorePath: [conf.paths.src, path.join(conf.paths.tmp, '/serve')], 31 | addRootSlash: false 32 | }; 33 | 34 | return gulp.src(path.join(conf.paths.src, '/*.html')) 35 | .pipe($.inject(injectStyles, injectOptions)) 36 | .pipe($.inject(injectScripts, injectOptions)) 37 | .pipe(wiredep(_.extend({}, conf.wiredep))) 38 | .pipe(gulp.dest(path.join(conf.paths.tmp, '/serve'))); 39 | }); -------------------------------------------------------------------------------- /gulp/server.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | 7 | var browserSync = require('browser-sync'); 8 | var browserSyncSpa = require('browser-sync-spa'); 9 | 10 | var util = require('util'); 11 | 12 | var proxyMiddleware = require('http-proxy-middleware'); 13 | 14 | function browserSyncInit(baseDir, browser) { 15 | browser = browser === undefined ? 'default' : browser; 16 | 17 | var routes = null; 18 | if (baseDir === conf.paths.src || (util.isArray(baseDir) && baseDir.indexOf(conf.paths.src) !== -1)) { 19 | routes = { 20 | '/bower_components': 'bower_components' 21 | }; 22 | } 23 | 24 | var server = { 25 | baseDir: baseDir, 26 | routes: routes 27 | }; 28 | 29 | browserSync.instance = browserSync.init({ 30 | startPath: '/', 31 | server: server, 32 | browser: browser 33 | }); 34 | } 35 | 36 | browserSync.use(browserSyncSpa({ 37 | selector: '[ng-app]' 38 | })); 39 | 40 | gulp.task('serve', ['watch'], function() { 41 | browserSyncInit([path.join(conf.paths.tmp, '/serve'), conf.paths.src]); 42 | }); 43 | 44 | gulp.task('serve:dist', ['build'], function() { 45 | browserSyncInit(conf.paths.dist); 46 | }); 47 | 48 | gulp.task('serve:e2e', ['inject'], function() { 49 | browserSyncInit([conf.paths.tmp + '/serve', conf.paths.src], []); 50 | }); 51 | 52 | gulp.task('serve:e2e-dist', ['build'], function() { 53 | browserSyncInit(conf.paths.dist, []); 54 | }); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_mixins.scss: -------------------------------------------------------------------------------- 1 | // Toggles 2 | // 3 | // Used in conjunction with global variables to enable certain theme features. 4 | 5 | @mixin border-radius($radius: $border-radius) { 6 | @if $enable-rounded { 7 | border-radius: $radius; 8 | } 9 | } 10 | 11 | @mixin box-shadow($shadow...) { 12 | @if $enable-shadows { 13 | box-shadow: $shadow; 14 | } 15 | } 16 | 17 | @mixin transition($transition...) { 18 | @if $enable-transitions { 19 | transition: $transition; 20 | } 21 | } 22 | 23 | // Utilities 24 | @import "mixins/breakpoints"; 25 | @import "mixins/hide-text"; 26 | @import "mixins/hover"; 27 | @import "mixins/image"; 28 | @import "mixins/label"; 29 | @import "mixins/reset-filter"; 30 | @import "mixins/resize"; 31 | @import "mixins/responsive-visibility"; 32 | @import "mixins/screen-reader"; 33 | @import "mixins/size"; 34 | @import "mixins/tab-focus"; 35 | @import "mixins/reset-text"; 36 | @import "mixins/text-emphasis"; 37 | @import "mixins/text-truncate"; 38 | 39 | // // Components 40 | @import "mixins/alert"; 41 | @import "mixins/buttons"; 42 | @import "mixins/pagination"; 43 | @import "mixins/list-group"; 44 | @import "mixins/nav-divider"; 45 | @import "mixins/forms"; 46 | @import "mixins/progress"; 47 | @import "mixins/table-row"; 48 | 49 | // // Skins 50 | @import "mixins/background-variant"; 51 | @import "mixins/border-radius"; 52 | @import "mixins/gradients"; 53 | 54 | // // Layout 55 | @import "mixins/clearfix"; 56 | @import "mixins/center-block"; 57 | // @import "mixins/navbar-align"; 58 | @import "mixins/grid-framework"; 59 | @import "mixins/grid"; 60 | @import "mixins/pulls"; 61 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_grid-framework.scss: -------------------------------------------------------------------------------- 1 | // Framework grid generation 2 | // 3 | // Used only by Bootstrap to generate the correct number of grid classes given 4 | // any value of `$grid-columns`. 5 | 6 | @mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) { 7 | // Common properties for all breakpoints 8 | %grid-column { 9 | position: relative; 10 | // Prevent columns from collapsing when empty 11 | min-height: 1px; 12 | // Inner gutter via padding 13 | padding-left: ($gutter / 2); 14 | padding-right: ($gutter / 2); 15 | } 16 | @each $breakpoint in map-keys($breakpoints) { 17 | @for $i from 1 through $columns { 18 | .col-#{$breakpoint}-#{$i} { 19 | @extend %grid-column; 20 | } 21 | } 22 | @include media-breakpoint-up($breakpoint) { 23 | // Work around cross-media @extend (https://github.com/sass/sass/issues/1050) 24 | %grid-column-float-#{$breakpoint} { 25 | @if $enable-flex { 26 | // Do nothing 27 | } @else { 28 | float: left; 29 | } 30 | } 31 | @for $i from 1 through $columns { 32 | .col-#{$breakpoint}-#{$i} { 33 | @extend %grid-column-float-#{$breakpoint}; 34 | @include make-col-span($i, $columns); 35 | } 36 | } 37 | @each $modifier in (pull, push, offset) { 38 | @for $i from 0 through $columns { 39 | .col-#{$breakpoint}-#{$modifier}-#{$i} { 40 | @include make-col-modifier($modifier, $i, $columns) 41 | } 42 | } 43 | } 44 | } 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /gulp/styles.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var path = require('path'); 4 | var gulp = require('gulp'); 5 | var conf = require('./conf'); 6 | var browserSync = require('browser-sync'); 7 | var $ = require('gulp-load-plugins')(); 8 | var wiredep = require('wiredep').stream; 9 | var _ = require('lodash'); 10 | 11 | gulp.task('styles', function() { 12 | var sassOptions = { 13 | style: 'expanded' 14 | }; 15 | 16 | var injectFiles = gulp.src([ 17 | path.join(conf.paths.src, '/app/core/scss/app.scss'), 18 | path.join(conf.paths.src, '/app/main.scss'), 19 | path.join('!' + conf.paths.src, '/app/index.scss') 20 | ], { 21 | read: false 22 | }); 23 | 24 | var injectOptions = { 25 | transform: function(filePath) { 26 | filePath = filePath.replace(conf.paths.src + '/app/', ''); 27 | return '@import "' + filePath + '";'; 28 | }, 29 | starttag: '// injector', 30 | endtag: '// endinjector', 31 | addRootSlash: false 32 | }; 33 | 34 | return gulp.src([ 35 | path.join(conf.paths.src, '/app/index.scss') 36 | ]) 37 | .pipe($.inject(injectFiles, injectOptions)) 38 | .pipe(wiredep(_.extend({}, conf.wiredep))) 39 | .pipe($.sourcemaps.init()) 40 | .pipe($.sass(sassOptions)).on('error', conf.errorHandler('RubySass')) 41 | .pipe($.autoprefixer()).on('error', conf.errorHandler('Autoprefixer')) 42 | .pipe($.sourcemaps.write()) 43 | .pipe(gulp.dest(path.join(conf.paths.tmp, '/serve/app/'))) 44 | .pipe(browserSync.reload({ 45 | stream: true 46 | })); 47 | }); -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_alert.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Base styles 3 | // 4 | 5 | .alert { 6 | padding: $alert-padding; 7 | margin-bottom: $spacer-y; 8 | border: 1px solid transparent; 9 | @include border-radius($alert-border-radius); 10 | 11 | // Improve alignment and spacing of inner content 12 | > p, 13 | > ul { 14 | margin-bottom: 0; 15 | } 16 | > p + p { 17 | margin-top: 5px; 18 | } 19 | } 20 | 21 | // Headings for larger alerts 22 | .alert-heading { 23 | margin-top: 0; 24 | // Specified to prevent conflicts of changing $headings-color 25 | color: inherit; 26 | } 27 | 28 | // Provide class for links that match alerts 29 | .alert-link { 30 | font-weight: $alert-link-font-weight; 31 | } 32 | 33 | 34 | // Dismissible alerts 35 | // 36 | // Expand the right padding and account for the close button's positioning. 37 | 38 | .alert-dismissible { 39 | padding-right: ($alert-padding + 20); 40 | 41 | // Adjust close link position 42 | .close { 43 | position: relative; 44 | top: -2px; 45 | right: -21px; 46 | color: inherit; 47 | } 48 | } 49 | 50 | 51 | // Alternate styles 52 | // 53 | // Generate contextual modifier classes for colorizing the alert. 54 | 55 | .alert-success { 56 | @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text); 57 | } 58 | .alert-info { 59 | @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text); 60 | } 61 | .alert-warning { 62 | @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text); 63 | } 64 | .alert-danger { 65 | @include alert-variant($alert-danger-bg, $alert-danger-border,$alert-danger-text); 66 | } 67 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_labels.scss: -------------------------------------------------------------------------------- 1 | // Base class 2 | // 3 | // Requires one of the contextual, color modifier classes for `color` and 4 | // `background-color`. 5 | 6 | .label { 7 | display: inline-block; 8 | padding: .25em .4em; 9 | font-size: 75%; 10 | font-weight: bold; 11 | line-height: 1; 12 | color: $label-color; 13 | text-align: center; 14 | white-space: nowrap; 15 | vertical-align: baseline; 16 | @include border-radius(); 17 | 18 | // Empty labels collapse automatically 19 | &:empty { 20 | display: none; 21 | } 22 | 23 | // Quick fix for labels in buttons 24 | .btn & { 25 | position: relative; 26 | top: -1px; 27 | } 28 | } 29 | 30 | // Add hover effects, but only for links 31 | a.label { 32 | @include hover-focus { 33 | color: $label-link-hover-color; 34 | text-decoration: none; 35 | cursor: pointer; 36 | } 37 | } 38 | 39 | // Pill labels 40 | // 41 | // Make them extra rounded with a modifier to replace v3's badges. 42 | 43 | .label-pill { 44 | padding-left: .6em; 45 | padding-right: .6em; 46 | border-radius: 1rem; 47 | } 48 | 49 | 50 | // Colors 51 | // 52 | // Contextual variations (linked labels get darker on :hover). 53 | 54 | .label-default { 55 | @include label-variant($label-default-bg); 56 | } 57 | 58 | .label-primary { 59 | @include label-variant($label-primary-bg); 60 | } 61 | 62 | .label-success { 63 | @include label-variant($label-success-bg); 64 | } 65 | 66 | .label-info { 67 | @include label-variant($label-info-bg); 68 | } 69 | 70 | .label-warning { 71 | @include label-variant($label-warning-bg); 72 | } 73 | 74 | .label-danger { 75 | @include label-variant($label-danger-bg); 76 | } 77 | -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "bitwise": true, 3 | "camelcase": true, 4 | "curly": true, 5 | "eqeqeq": true, 6 | "es3": false, 7 | "forin": true, 8 | "freeze": true, 9 | "immed": true, 10 | "indent": 4, 11 | "latedef": "nofunc", 12 | "newcap": true, 13 | "noarg": true, 14 | "noempty": true, 15 | "nonbsp": true, 16 | "nonew": true, 17 | "plusplus": false, 18 | "quotmark": "single", 19 | "undef": true, 20 | "unused": false, 21 | "strict": true, 22 | "maxparams": 10, 23 | "maxdepth": 5, 24 | "maxstatements": 40, 25 | "maxcomplexity": 8, 26 | "asi": false, 27 | "boss": false, 28 | "debug": false, 29 | "eqnull": true, 30 | "esnext": false, 31 | "evil": false, 32 | "expr": false, 33 | "funcscope": false, 34 | "globalstrict": false, 35 | "iterator": false, 36 | "lastsemic": false, 37 | "laxbreak": false, 38 | "laxcomma": false, 39 | "loopfunc": true, 40 | "maxerr": false, 41 | "moz": false, 42 | "multistr": false, 43 | "notypeof": false, 44 | "proto": false, 45 | "scripturl": false, 46 | "shadow": false, 47 | "sub": true, 48 | "supernew": false, 49 | "validthis": true, 50 | "noyield": false, 51 | "browser": true, 52 | "devel": false, 53 | "node": false, 54 | "globals": { 55 | "angular": false, 56 | "$": false, 57 | "inject": false, 58 | "module": false, 59 | "window": false, 60 | "document": false, 61 | "toastr": false, 62 | "PerfectScrollbar": false, 63 | "MobileDetect": false, 64 | "hljs": false, 65 | "d3": false, 66 | "moment": false, 67 | "console": false, 68 | "alert": false 69 | } 70 | } -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_print.scss: -------------------------------------------------------------------------------- 1 | // Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css 2 | 3 | // ========================================================================== 4 | // Print styles. 5 | // Inlined to avoid the additional HTTP request: h5bp.com/r 6 | // ========================================================================== 7 | 8 | @media print { 9 | *, 10 | *:before, 11 | *:after { 12 | text-shadow: none !important; 13 | box-shadow: none !important; 14 | } 15 | 16 | a, 17 | a:visited { 18 | text-decoration: underline; 19 | } 20 | 21 | abbr[title]:after { 22 | content: " (" attr(title) ")"; 23 | } 24 | 25 | pre, 26 | blockquote { 27 | border: 1px solid #999; 28 | page-break-inside: avoid; 29 | } 30 | 31 | thead { 32 | display: table-header-group; // h5bp.com/t 33 | } 34 | 35 | tr, 36 | img { 37 | page-break-inside: avoid; 38 | } 39 | 40 | img { 41 | max-width: 100% !important; 42 | } 43 | 44 | p, 45 | h2, 46 | h3 { 47 | orphans: 3; 48 | widows: 3; 49 | } 50 | 51 | h2, 52 | h3 { 53 | page-break-after: avoid; 54 | } 55 | 56 | // Bootstrap specific changes start 57 | 58 | // Bootstrap components 59 | .navbar { 60 | display: none; 61 | } 62 | .btn, 63 | .dropup > .btn { 64 | > .caret { 65 | border-top-color: #000 !important; 66 | } 67 | } 68 | .label { 69 | border: 1px solid #000; 70 | } 71 | 72 | .table { 73 | border-collapse: collapse !important; 74 | 75 | td, 76 | th { 77 | background-color: #fff !important; 78 | } 79 | } 80 | .table-bordered { 81 | th, 82 | td { 83 | border: 1px solid #ddd !important; 84 | } 85 | } 86 | 87 | // Bootstrap specific changes end 88 | } 89 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_grid.scss: -------------------------------------------------------------------------------- 1 | /// Grid system 2 | // 3 | // Generate semantic grid columns with these mixins. 4 | 5 | @mixin make-container($gutter: $grid-gutter-width) { 6 | margin-right: auto; 7 | margin-left: auto; 8 | padding-left: ($gutter / 2); 9 | padding-right: ($gutter / 2); 10 | @include clearfix(); 11 | } 12 | 13 | @mixin make-row($gutter: $grid-gutter-width) { 14 | @if $enable-flex { 15 | display: flex; 16 | flex-wrap: wrap; 17 | } @else { 18 | @include clearfix(); 19 | } 20 | margin-left: ($gutter / -2); 21 | margin-right: ($gutter / -2); 22 | } 23 | 24 | @mixin make-col($gutter: $grid-gutter-width) { 25 | position: relative; 26 | @if $enable-flex { 27 | // Do nothing 28 | } @else { 29 | float: left; 30 | } 31 | min-height: 1px; 32 | padding-left: ($gutter / 2); 33 | padding-right: ($gutter / 2); 34 | } 35 | 36 | @mixin make-col-span($size, $columns: $grid-columns) { 37 | @if $enable-flex { 38 | flex: 0 0 percentage($size / $columns); 39 | } @else { 40 | width: percentage($size / $columns); 41 | } 42 | } 43 | 44 | @mixin make-col-offset($size, $columns: $grid-columns) { 45 | margin-left: percentage($size / $columns); 46 | } 47 | 48 | @mixin make-col-push($size, $columns: $grid-columns) { 49 | left: if($size > 0, percentage($size / $columns), auto); 50 | } 51 | 52 | @mixin make-col-pull($size, $columns: $grid-columns) { 53 | right: if($size > 0, percentage($size / $columns), auto); 54 | } 55 | 56 | @mixin make-col-modifier($type, $size, $columns) { 57 | // Work around the lack of dynamic mixin @include support (https://github.com/sass/sass/issues/626) 58 | @if $type == push { 59 | @include make-col-push($size, $columns); 60 | } @else if $type == pull { 61 | @include make-col-pull($size, $columns); 62 | } @else if $type == offset { 63 | @include make-col-offset($size, $columns); 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Rin", 3 | "version": "1.0.0", 4 | "description": "Angular & Bootstrap 4 dashboard boiler", 5 | "main": "gulpfile.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "author": "Matt Christians (http://mdchristians.com)", 10 | "license": "MIT", 11 | "dependencies": {}, 12 | "devDependencies": { 13 | "browser-sync": "~2.7.12", 14 | "browser-sync-spa": "~1.0.2", 15 | "chalk": "~1.0.0", 16 | "concat-stream": "~1.5.0", 17 | "del": "~1.2.0", 18 | "gulp": "~3.9.0", 19 | "gulp-angular-filesort": "~1.1.1", 20 | "gulp-angular-templatecache": "~1.6.0", 21 | "gulp-autoprefixer": "~2.3.1", 22 | "gulp-csso": "~1.0.0", 23 | "gulp-filter": "~2.0.2", 24 | "gulp-flatten": "~0.0.4", 25 | "gulp-inject": "~1.3.1", 26 | "gulp-jshint": "~1.11.0", 27 | "gulp-load-plugins": "~0.10.0", 28 | "gulp-minify-html": "~1.0.3", 29 | "gulp-ng-annotate": "~1.0.0", 30 | "gulp-protractor": "~1.0.0", 31 | "gulp-rename": "~1.2.2", 32 | "gulp-replace": "~0.5.3", 33 | "gulp-rev": "~5.0.0", 34 | "gulp-rev-replace": "~0.4.2", 35 | "gulp-sass": "*", 36 | "gulp-size": "~1.2.1", 37 | "gulp-sourcemaps": "~1.5.2", 38 | "gulp-uglify": "~1.2.0", 39 | "gulp-useref": "~1.2.0", 40 | "gulp-util": "~3.0.5", 41 | "http-proxy-middleware": "~0.0.5", 42 | "jshint-stylish": "~2.0.0", 43 | "karma": "~0.12.36", 44 | "karma-angular-filesort": "~0.1.0", 45 | "karma-jasmine": "~0.3.5", 46 | "karma-ng-html2js-preprocessor": "~0.1.2", 47 | "karma-phantomjs-launcher": "~0.2.0", 48 | "lodash": "~3.9.3", 49 | "main-bower-files": "~2.8.0", 50 | "merge-stream": "~0.1.7", 51 | "require-dir": "~0.3.0", 52 | "uglify-save-license": "~0.4.1", 53 | "wiredep": "~2.2.2", 54 | "wrench": "~1.5.8" 55 | }, 56 | "engines": { 57 | "node": ">=0.10.0" 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /src/app/register/register.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 |

Register

7 |
8 |
9 |
10 |
11 | 12 | 13 |
14 |
15 | 16 | 17 |
18 |
19 |
20 | 21 | 22 |
23 |
24 | 25 | 26 |
27 |
28 | 29 | 30 |
31 |
32 |
33 | 34 |
35 |
36 |
37 |
38 |
39 | 40 |
41 |
42 |
43 |
-------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Rin's Dashboard 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 |
34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # ! DEPRECATED ! 2 | 3 | # Rin 4 | 5 | A brilliant Angular 1 & Bootstrap 4 dashboard boilerplate. It's structure follows [John Papa's Angular Style Guide](https://github.com/johnpapa/angular-styleguide) closely, but has some minor changes. Sass for styling. 6 | 7 | ## Demo 8 | 9 | Check it before giving it a go. Just click login, no need to fill out any information! [DEMO](http://mdchristians.com/rin/). 10 | 11 | ## Features 12 | - [Angular](https://angularjs.org/) - HTML enhanced for web apps. 13 | - [Angular Bootstrap](https://angular-ui.github.io/bootstrap/) - Bootstrap components written in pure AngularJS by the AngularUI Team. 14 | - [Angular Charts](http://jtblin.github.io/angular-chart.js/) - Reactive, responsive, beautiful charts for AngularJS based on Chart.js. 15 | - [Angular UI-Router](http://angular-ui.github.io/ui-router/site) - The de-facto solution to flexible routing with nested views in AngularJS. 16 | - [Bootstrap v4](http://v4-alpha.getbootstrap.com/) - Bootstrap is the most popular HTML, CSS, and JS framework in the world. (Currently v4.0.0-alpha). 17 | - [Bootstrap Additions](https://github.com/mgcrea/bootstrap-additions) - CSS extension kit for Twitter Bootstrap 3.0+. 18 | - [Gulp](http://gulpjs.com/) - The streaming build system. 19 | - [Moment](http://momentjs.com/) - Parse, validate, manipulate, and display dates in JavaScript. 20 | - [Toastr](http://codeseven.github.io/toastr/) - Simple javascript toast notifications. 21 | 22 | ## Getting Started 23 | 24 | To begin, we run through our basic clone & install process: 25 | 26 | 1. Clone the repo `git clone https://github.com/mdchristians/rin.git` 27 | 2. navigate into the project `cd rin` 28 | 3. Install the NodeJS dependencies: `npm install`. 29 | 4. Install the Bower dependencies: `bower install`. 30 | 5. Run gulp serve to begin our development: `gulp serve`. 31 | 32 | ## Gulp Commands 33 | 34 | ```sh 35 | gulp serve // Serves project from .tmp folder 36 | gulp clean // Removes any temporary folders 37 | gulp serve:dist // Serves project as it does for production builds 38 | gulp builds // Builds project to 'dist' folder 39 | ``` 40 | 41 | Enjoy! 42 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_pagination.scss: -------------------------------------------------------------------------------- 1 | .pagination { 2 | display: inline-block; 3 | padding-left: 0; 4 | margin-top: $spacer-y; 5 | margin-bottom: $spacer-y; 6 | @include border-radius(); 7 | 8 | > li { 9 | display: inline; // Remove list-style and block-level defaults 10 | 11 | > a, 12 | > span { 13 | position: relative; 14 | float: left; // Collapse white-space 15 | padding: $pagination-padding-y $pagination-padding-x; 16 | margin-left: -1px; 17 | line-height: $line-height; 18 | color: $pagination-color; 19 | text-decoration: none; 20 | background-color: $pagination-bg; 21 | border: 1px solid $pagination-border; 22 | } 23 | &:first-child { 24 | > a, 25 | > span { 26 | margin-left: 0; 27 | @include border-left-radius($border-radius); 28 | } 29 | } 30 | &:last-child { 31 | > a, 32 | > span { 33 | @include border-right-radius($border-radius); 34 | } 35 | } 36 | } 37 | 38 | > li > a, 39 | > li > span { 40 | @include hover-focus { 41 | color: $pagination-hover-color; 42 | background-color: $pagination-hover-bg; 43 | border-color: $pagination-hover-border; 44 | } 45 | } 46 | 47 | > .active > a, 48 | > .active > span { 49 | @include plain-hover-focus { 50 | z-index: 2; 51 | color: $pagination-active-color; 52 | cursor: default; 53 | background-color: $pagination-active-bg; 54 | border-color: $pagination-active-border; 55 | } 56 | } 57 | 58 | > .disabled { 59 | > span, 60 | > a { 61 | @include plain-hover-focus { 62 | color: $pagination-disabled-color; 63 | cursor: $cursor-disabled; 64 | background-color: $pagination-disabled-bg; 65 | border-color: $pagination-disabled-border; 66 | } 67 | } 68 | } 69 | } 70 | 71 | 72 | // 73 | // Sizing 74 | // 75 | 76 | .pagination-lg { 77 | @include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $line-height-lg, $border-radius-lg); 78 | } 79 | 80 | .pagination-sm { 81 | @include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $line-height-sm, $border-radius-sm); 82 | } 83 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_buttons.scss: -------------------------------------------------------------------------------- 1 | // Button variants 2 | // 3 | // Easily pump out default styles, as well as :hover, :focus, :active, 4 | // and disabled options for all buttons 5 | 6 | @mixin button-variant($color, $background, $border) { 7 | color: $color; 8 | background-color: $background; 9 | border-color: $border; 10 | // $shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075); 11 | // .box-shadow($shadow); 12 | 13 | $active-background: darken($background, 10%); 14 | $active-border: darken($border, 12%); 15 | 16 | &:focus, 17 | &.focus, 18 | &:active, 19 | &.active, 20 | .open > &.dropdown-toggle { 21 | color: $color; 22 | background-color: $active-background; 23 | border-color: $active-border; 24 | } 25 | @include hover { 26 | color: $color; 27 | background-color: $active-background; 28 | border-color: $active-border; 29 | } 30 | &:active, 31 | &.active, 32 | .open > &.dropdown-toggle { 33 | // Remove the gradient for the pressed/active state 34 | background-image: none; 35 | @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); 36 | } 37 | &.disabled, 38 | &:disabled, 39 | fieldset[disabled] & { 40 | &:focus, 41 | &.focus { 42 | background-color: $background; 43 | border-color: $border; 44 | } 45 | @include hover { 46 | background-color: $background; 47 | border-color: $border; 48 | } 49 | } 50 | } 51 | 52 | @mixin button-outline-variant($color) { 53 | color: $color; 54 | background-image: none; 55 | background-color: transparent; 56 | border-color: $color; 57 | 58 | &:focus, 59 | &.focus, 60 | &:active, 61 | &.active, 62 | .open > &.dropdown-toggle { 63 | color: #fff; 64 | background-color: $color; 65 | border-color: $color; 66 | } 67 | @include hover { 68 | color: #fff; 69 | background-color: $color; 70 | border-color: $color; 71 | } 72 | 73 | &.disabled, 74 | &:disabled, 75 | fieldset[disabled] & { 76 | &:focus, 77 | &.focus { 78 | border-color: lighten($color, 20%); 79 | } 80 | @include hover { 81 | border-color: lighten($color, 20%); 82 | } 83 | } 84 | } 85 | 86 | // Button sizes 87 | @mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) { 88 | padding: $padding-y $padding-x; 89 | font-size: $font-size; 90 | line-height: $line-height; 91 | @include border-radius($border-radius); 92 | } 93 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/_tooltip.scss: -------------------------------------------------------------------------------- 1 | // Base class 2 | .tooltip { 3 | position: absolute; 4 | z-index: $zindex-tooltip; 5 | display: block; 6 | // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element. 7 | // So reset our font and text properties to avoid inheriting weird values. 8 | @include reset-text(); 9 | font-size: $font-size-sm; 10 | opacity: 0; 11 | 12 | &.in { opacity: $tooltip-opacity; } 13 | 14 | &.tooltip-top, 15 | &.bs-tether-element-attached-bottom { 16 | padding: $tooltip-arrow-width 0; 17 | margin-top: -3px; 18 | 19 | .tooltip-arrow { 20 | bottom: 0; 21 | left: 50%; 22 | margin-left: -$tooltip-arrow-width; 23 | border-width: $tooltip-arrow-width $tooltip-arrow-width 0; 24 | border-top-color: $tooltip-arrow-color; 25 | } 26 | } 27 | &.tooltip-right, 28 | &.bs-tether-element-attached-left { 29 | padding: 0 $tooltip-arrow-width; 30 | margin-left: 3px; 31 | 32 | .tooltip-arrow { 33 | top: 50%; 34 | left: 0; 35 | margin-top: -$tooltip-arrow-width; 36 | border-width: $tooltip-arrow-width $tooltip-arrow-width $tooltip-arrow-width 0; 37 | border-right-color: $tooltip-arrow-color; 38 | } 39 | } 40 | &.tooltip-bottom, 41 | &.bs-tether-element-attached-top { 42 | padding: $tooltip-arrow-width 0; 43 | margin-top: 3px; 44 | 45 | .tooltip-arrow { 46 | top: 0; 47 | left: 50%; 48 | margin-left: -$tooltip-arrow-width; 49 | border-width: 0 $tooltip-arrow-width $tooltip-arrow-width; 50 | border-bottom-color: $tooltip-arrow-color; 51 | } 52 | } 53 | &.tooltip-left, 54 | &.bs-tether-element-attached-right { 55 | padding: 0 $tooltip-arrow-width; 56 | margin-left: -3px; 57 | 58 | .tooltip-arrow { 59 | top: 50%; 60 | right: 0; 61 | margin-top: -$tooltip-arrow-width; 62 | border-width: $tooltip-arrow-width 0 $tooltip-arrow-width $tooltip-arrow-width; 63 | border-left-color: $tooltip-arrow-color; 64 | } 65 | } 66 | } 67 | 68 | // Wrapper for the tooltip content 69 | .tooltip-inner { 70 | max-width: $tooltip-max-width; 71 | padding: 3px 8px; 72 | color: $tooltip-color; 73 | text-align: center; 74 | background-color: $tooltip-bg; 75 | @include border-radius($border-radius); 76 | } 77 | 78 | // Arrows 79 | .tooltip-arrow { 80 | position: absolute; 81 | width: 0; 82 | height: 0; 83 | border-color: transparent; 84 | border-style: solid; 85 | } 86 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_gradients.scss: -------------------------------------------------------------------------------- 1 | // Gradients 2 | 3 | // Horizontal gradient, from left to right 4 | // 5 | // Creates two color stops, start and end, by specifying a color and position for each color stop. 6 | // Color stops are not available in IE9. 7 | @mixin gradient-horizontal($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) { 8 | background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent); 9 | background-repeat: repeat-x; 10 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 11 | } 12 | 13 | // Vertical gradient, from top to bottom 14 | // 15 | // Creates two color stops, start and end, by specifying a color and position for each color stop. 16 | // Color stops are not available in IE9. 17 | @mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) { 18 | background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); 19 | background-repeat: repeat-x; 20 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 21 | } 22 | 23 | @mixin gradient-directional($start-color: #555, $end-color: #333, $deg: 45deg) { 24 | background-repeat: repeat-x; 25 | background-image: linear-gradient($deg, $start-color, $end-color); 26 | } 27 | @mixin gradient-horizontal-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) { 28 | background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color); 29 | background-repeat: no-repeat; 30 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 gets no color-stop at all for proper fallback 31 | } 32 | @mixin gradient-vertical-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) { 33 | background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color); 34 | background-repeat: no-repeat; 35 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 gets no color-stop at all for proper fallback 36 | } 37 | @mixin gradient-radial($inner-color: #555, $outer-color: #333) { 38 | background-image: radial-gradient(circle, $inner-color, $outer-color); 39 | background-repeat: no-repeat; 40 | } 41 | @mixin gradient-striped($color: rgba(255,255,255,.15), $angle: 45deg) { 42 | background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent); 43 | } -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_breakpoints.scss: -------------------------------------------------------------------------------- 1 | // Breakpoint viewport sizes and media queries. 2 | // 3 | // Breakpoints are defined as a map of (name: minimum width), order from small to large: 4 | // 5 | // (xs: 0, sm: 34rem, md: 45rem) 6 | // 7 | // The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default. 8 | 9 | // Name of the next breakpoint, or null for the last breakpoint. 10 | // 11 | // >> breakpoint-next(sm) 12 | // md 13 | // >> breakpoint-next(sm, $breakpoints: (xs: 0, sm: 34rem, md: 45rem)) 14 | // md 15 | // >> breakpoint-next(sm, $breakpoint-names: (xs sm md)) 16 | // md 17 | @function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) { 18 | $n: index($breakpoint-names, $name); 19 | @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null); 20 | } 21 | 22 | // Minimum breakpoint width. Null for the smallest (first) breakpoint. 23 | // 24 | // >> breakpoint-min(sm, (xs: 0, sm: 34rem, md: 45rem)) 25 | // 34rem 26 | @function breakpoint-min($name, $breakpoints: $grid-breakpoints) { 27 | $min: map-get($breakpoints, $name); 28 | @return if($min != 0, $min, null); 29 | } 30 | 31 | // Maximum breakpoint width. Null for the largest (last) breakpoint. 32 | // The maximum value is calculated as the minimum of the next one less 0.1. 33 | // 34 | // >> breakpoint-max(sm, (xs: 0, sm: 34rem, md: 45rem)) 35 | // 44.9rem 36 | @function breakpoint-max($name, $breakpoints: $grid-breakpoints) { 37 | $next: breakpoint-next($name, $breakpoints); 38 | @return if($next, breakpoint-min($next, $breakpoints) - 0.1, null); 39 | } 40 | 41 | // Media of at least the minimum breakpoint width. No query for the smallest breakpoint. 42 | // Makes the @content apply to the given breakpoint and wider. 43 | @mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) { 44 | $min: breakpoint-min($name, $breakpoints); 45 | @if $min { 46 | @media (min-width: $min) { 47 | @content; 48 | } 49 | } @else { 50 | @content; 51 | } 52 | } 53 | 54 | // Media of at most the maximum breakpoint width. No query for the largest breakpoint. 55 | // Makes the @content apply to the given breakpoint and narrower. 56 | @mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) { 57 | $max: breakpoint-max($name, $breakpoints); 58 | @if $max { 59 | @media (max-width: $max) { 60 | @content; 61 | } 62 | } @else { 63 | @content; 64 | } 65 | } 66 | 67 | // Media between the breakpoint's minimum and maximum widths. 68 | // No minimum for the smallest breakpoint, and no maximum for the largest one. 69 | // Makes the @content apply only to the given breakpoint, not viewports any wider or narrower. 70 | @mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) { 71 | @include media-breakpoint-up($name, $breakpoints) { 72 | @include media-breakpoint-down($name, $breakpoints) { 73 | @content; 74 | } 75 | } 76 | } 77 | -------------------------------------------------------------------------------- /src/app/core/scss/bootstrap/mixins/_forms.scss: -------------------------------------------------------------------------------- 1 | // Form validation states 2 | // 3 | // Used in _forms.scss to generate the form validation CSS for warnings, errors, 4 | // and successes. 5 | 6 | @mixin form-control-validation($state, $color) { 7 | // Color the label and help text 8 | .help-block, 9 | .control-label, 10 | .radio, 11 | .checkbox, 12 | .radio-inline, 13 | .checkbox-inline, 14 | &.radio label, 15 | &.checkbox label, 16 | &.radio-inline label, 17 | &.checkbox-inline label { 18 | color: $color; 19 | } 20 | // Set the border and box shadow on specific inputs to match 21 | .form-control { 22 | border-color: $color; 23 | // @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work 24 | 25 | &:focus { 26 | // border-color: darken($border-color, 10%); 27 | // $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%); 28 | // @include box-shadow($shadow); 29 | } 30 | } 31 | 32 | // Set validation states also for addons 33 | .input-group-addon { 34 | color: $color; 35 | border-color: $color; 36 | background-color: lighten($color, 40%); 37 | } 38 | // Optional feedback icon 39 | .form-control-feedback { 40 | color: $color; 41 | } 42 | } 43 | 44 | // Form control focus state 45 | // 46 | // Generate a customized focus state and for any input with the specified color, 47 | // which defaults to the `@input-border-focus` variable. 48 | // 49 | // We highly encourage you to not customize the default value, but instead use 50 | // this to tweak colors on an as-needed basis. This aesthetic change is based on 51 | // WebKit's default styles, but applicable to a wider range of browsers. Its 52 | // usability and accessibility should be taken into account with any change. 53 | // 54 | // Example usage: change the default blue border and shadow to white for better 55 | // contrast against a dark gray background. 56 | @mixin form-control-focus() { 57 | &:focus { 58 | border-color: $input-border-focus; 59 | outline: none; 60 | $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $input-box-shadow-focus; 61 | @include box-shadow($shadow); 62 | } 63 | } 64 | 65 | // Form control sizing 66 | // 67 | // Relative text size, padding, and border-radii changes for form controls. For 68 | // horizontal sizing, wrap controls in the predefined grid classes. `