adding auth + main module

bower.json

@@ -56,7 +56,8 @@
     "ng-js-tree": "~0.0.7",
     "angular-ui-select": "^0.19.6",
     "angular-upload": "^1.0.12",
-    "ng-tags-input": "^3.2.0"
+    "ng-tags-input": "^3.2.0",
+    "lodash": "^4.17.4"
   },
   "resolutions": {
     "angular": "~1.5.9",

src/app/pages/authSignIn/auth.service.js

@@ -0,0 +1,39 @@
+/**
+ * @author ayoub
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.authSignIn')
+    .factory('AuthService',AuthService);
+
+  /** @ngInject */
+  function AuthService($http, $q) {
+    var apiBaseUrl = "http://localhost:9000"
+    var endpoint = apiBaseUrl + "/auth";
+
+    function login(params) {
+      params = params || {};
+
+      var access_token = { "access_token" : params.access_token }
+      var auth = { headers : { 'Authorization':  'Basic ' + btoa(params.email + ":" + params.password)}}
+
+      var deferred = $q.defer();
+      $http.post(endpoint, access_token, auth)
+       .success(function(data) { 
+          deferred.resolve(data);
+       }).error(function(msg, code) {
+          deferred.reject(msg);
+       });
+
+     return deferred.promise;
+
+
+      return $http.post(endpoint, access_token, auth)
+    }
+
+    return {
+      login:login
+    }
+  }
+})();

src/app/pages/authSignIn/authSignIn.html

@@ -0,0 +1,35 @@
+<div class="login" ng-controller="authSignInCtrl as signInVm">
+  <main class="auth-main">
+    <div class="auth-block">
+      <h1>Sign in to Blur Admin</h1>
+      <a ui-sref="authSignUp" class="auth-link">New to Blur Admin? Sign up!</a>
+
+      <form class="form-horizontal" ng-submit="signInVm.login()">
+        <div class="form-group">
+          <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
+
+          <div class="col-sm-10">
+            <input type="email" ng-model="signInVm.email" class="form-control" id="inputEmail3" placeholder="Email">
+          </div>
+        </div>
+        <div class="form-group">
+          <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
+
+          <div class="col-sm-10">
+            <input type="password" ng-model="signInVm.password" class="form-control" id="inputPassword3" placeholder="Password">
+          </div>
+        </div>
+        <div class="form-group">
+          <div class="col-sm-offset-2 col-sm-10">
+            <button type="submit" class="btn btn-default btn-auth">Sign in</button>
+            <a href class="forgot-pass">Forgot password?</a>
+          </div>
+        </div>
+      </form>
+
+      <div class="error">{{vm.error}}
+      </div>
+
+    </div>
+  </main>
+</div>

src/app/pages/authSignIn/authSignIn.module.js

@@ -0,0 +1,22 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.authSignIn', [])
+    .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig($stateProvider) {
+    $stateProvider
+      .state('authSignIn', {
+        url: '/authSignIn',
+        templateUrl: 'app/pages/authSignIn/authSignIn.html',
+        title: 'My Page',
+        controller: 'authSignInCtrl',
+        sidebarMeta: {
+          order: 800,
+        },
+        authenticate: false
+      });
+  }
+
+})();

src/app/pages/authSignIn/authSignInCtrl.js

@@ -0,0 +1,49 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.authSignIn')
+    .controller('authSignInCtrl', authSignInCtrl);
+
+  /** @ngInject */
+  function authSignInCtrl($scope, localStorage, $state, AuthService) {
+    var vm = this;
+
+
+    vm.login = login;
+
+    init();
+
+    function init() {
+      localStorage.clear();
+      vm.error = ""
+    }
+
+    function login() {
+      var userObject = {
+        email: vm.email,
+        password: vm.password
+      };
+      AuthService
+          .login(userObject)
+          .then(
+            function (data){
+              if (data.token && data.user) {
+
+                  localStorage.setObject('user', data.user);
+                  localStorage.setObject('token', data.token);
+                  $state.go('main.dashboard');
+              }
+              console.log("AuthService loggedin",data)
+            },
+            function (error){
+              vm.error = "There were an error logging you in"
+              console.log("Error", error);
+            }
+          ); 
+      
+    }
+
+
+  }
+
+})();

src/app/pages/authSignUp/authSignUp.html

@@ -0,0 +1,49 @@
+<div class="login">
+
+  <main class="auth-main">
+    <div class="auth-block">
+      <h1>Sign up to Blur Admin</h1>
+      <a ui-sref="authSignIn" class="auth-link">Already have a Blur Admin account? Sign in!</a>
+
+      <form class="form-horizontal">
+        <div class="form-group">
+          <label for="inputName3" class="col-sm-2 control-label">Name</label>
+
+          <div class="col-sm-10">
+            <input type="text" class="form-control" id="inputName3" placeholder="Full Name">
+          </div>
+        </div>
+        <div class="form-group">
+          <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
+
+          <div class="col-sm-10">
+            <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
+          </div>
+        </div>
+        <div class="form-group">
+          <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
+
+          <div class="col-sm-10">
+            <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
+          </div>
+        </div>
+        <div class="form-group">
+          <div class="col-sm-offset-2 col-sm-10">
+            <button type="submit" class="btn btn-default btn-auth">Sign up</button>
+          </div>
+        </div>
+      </form>
+
+      <div class="auth-sep"><span><span>or Sign up with one click</span></span>
+      </div>
+
+      <div class="al-share-auth">
+        <ul class="al-share clearfix">
+          <li><i class="socicon socicon-facebook" title="Share on Facebook"></i></li>
+          <li><i class="socicon socicon-twitter" title="Share on Twitter"></i></li>
+          <li><i class="socicon socicon-google" title="Share on Google Plus"></i></li>
+        </ul>
+      </div>
+    </div>
+  </main>
+</div>

src/app/pages/authSignUp/authSignUp.module.js

@@ -0,0 +1,22 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.authSignUp', [])
+    .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig($stateProvider) {
+    $stateProvider
+      .state('authSignUp', {
+        url: '/authSignUp',
+        templateUrl: 'app/pages/authSignUp/authSignUp.html',
+        title: 'My Page',
+        controller: 'authSignUpCtrl',
+        sidebarMeta: {
+          order: 800,
+        },
+        authenticate: false
+      });
+  }
+
+})();

src/app/pages/authSignUp/authSignUpCtrl.js

@@ -0,0 +1,13 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.authSignUp')
+    .controller('authSignUpCtrl', authSignUpCtrl);
+
+  /** @ngInject */
+  function authSignUpCtrl($scope) {
+    var vm = this;
+
+  }
+
+})();

src/app/pages/config/config.module.js

@@ -0,0 +1,13 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.config', [])
+    .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig() {
+
+  }
+
+  
+})();

src/app/pages/config/routeChange.js

@@ -0,0 +1,20 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.config')
+    .run(stateChangeStart);
+
+  /** @ngInject */
+  function stateChangeStart($rootScope, $state, localStorage) {
+    $rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams) {
+      var login = localStorage.getObject('user');
+      var token = localStorage.getObject('token');
+      if (toState.authenticate && (_.isEmpty(login) ||  _.isEmpty(token)) ) {
+        // User isn’t authenticated
+        $state.transitionTo("authSignIn");
+        event.preventDefault();
+      }
+    });
+  }
+
+})();

src/app/pages/dashboard/dashboard.html

@@ -0,0 +1 @@
+Dash

src/app/pages/dashboard/dashboard.module.js

@@ -0,0 +1,26 @@
+/**
+ * @author v.lugovsky
+ * created on 16.12.2015
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.dashboard', [])
+      .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig($stateProvider) {
+    $stateProvider
+        .state('main.dashboard', {
+          url: '/dashboard',
+          templateUrl: 'app/pages/dashboard/dashboard.html',
+          title: 'Dashboard',
+          sidebarMeta: {
+            icon: 'ion-android-home',
+            order: 0,
+          },
+         authenticate: true
+        });
+  }
+
+})();

src/app/pages/main/main.html

@@ -0,0 +1,31 @@
+<div class="body-bg"></div>
+<main ng-if="$pageFinishedLoading" ng-class="{ 'menu-collapsed': $baSidebarService.isMenuCollapsed() }">
+
+  <ba-sidebar></ba-sidebar>
+  <page-top></page-top>
+
+  <div class="al-main">
+    <div class="al-content">
+      <content-top></content-top>
+      <div ui-view autoscroll="true" autoscroll-body-top></div>
+    </div>
+  </div>
+
+  <footer class="al-footer clearfix">
+    <div class="al-footer-right">Created with <i class="ion-heart"></i></div>
+    <div class="al-footer-main clearfix">
+      <div class="al-copy">Blur Admin 2016</div>
+      <ul class="al-share clearfix">
+        <li><i class="socicon socicon-facebook"></i></li>
+        <li><i class="socicon socicon-twitter"></i></li>
+        <li><i class="socicon socicon-google"></i></li>
+        <li><i class="socicon socicon-github"></i></li>
+      </ul>
+    </div>
+  </footer>
+
+  <back-top></back-top>
+</main>
+<div id="preloader" ng-show="!$pageFinishedLoading">
+  <div></div>
+</div>

src/app/pages/main/main.module.js

@@ -0,0 +1,24 @@
+/**
+ * @author l.azevedo
+ * created on 29.07.2017
+ */
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.main', [])
+    .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig($stateProvider) {
+    $stateProvider
+      .state('main', {
+        url: '/main',
+        templateUrl: 'app/pages/main/main.html',
+        redirectTo: 'main.dashboard',
+        authenticate: true
+
+
+      });
+  }
+
+})();

src/app/pages/pages.module.js

@@ -8,15 +8,24 @@
   angular.module('BlurAdmin.pages', [
     'ui.router',
 
+    'BlurAdmin.pages.dashboard',
+    'BlurAdmin.pages.main',
     'BlurAdmin.pages.surveys',
     'BlurAdmin.pages.teams',
     'BlurAdmin.pages.viewer',
-  ])
+    'BlurAdmin.pages.authSignIn',
-      .config(routeConfig);
+    'BlurAdmin.pages.authSignUp',
+    'BlurAdmin.pages.services',
+    'BlurAdmin.pages.config',
+    //'BlurAdmin.pages.main',
+  ]).config(routeConfig)
+  .factory('authInterceptor', authInterceptor);
 
   /** @ngInject */
-  function routeConfig($urlRouterProvider, baSidebarServiceProvider) {
+  function routeConfig($urlRouterProvider, baSidebarServiceProvider, $httpProvider) {
-    $urlRouterProvider.otherwise('/dashboard');
+    $urlRouterProvider.otherwise('/authSignIn');
+
+    $httpProvider.interceptors.push('authInterceptor');
 
     baSidebarServiceProvider.addStaticItem({
       title: 'Pages',
@@ -40,4 +49,44 @@
     });
   }
 
+
+  function authInterceptor($rootScope, $q, localStorage) {
+  console.log('authInterceptor')
+    return {
+        request: function (config) {
+            config.headers = config.headers || {};
+            
+            if (config.data !== undefined && config.url.indexOf('auth') != -1) {
+                    config.data.access_token = 'AlAoWLue33D1sBrKNHOohXdvYNh2Je9i'; //TODO : get this from the config
+            }
+            else if (localStorage.getObject('token')) {
+
+              if (config.data === undefined) {
+                  //Do nothing if data is not originally supplied from the calling method
+              }
+              else {
+                  config.data.access_token = localStorage.getObject('token');
+                  console.log()
+              }
+
+              if (config.method === 'GET') {
+                  /*if (config.params === undefined) {
+                      config.params = {};
+                  }
+                  config.params.test = localStorage.getObject('token');*/
+              }
+                //config.headers.Authorization = 'Bearer ' + $window.sessionStorage.token;
+            }
+            return config;
+        },
+        responseError: function (rejection) {
+            if (rejection.status === 401) {
+                console.log("not authorised");
+                localStorage.clear();
+            }
+            return $q.reject(rejection);
+        }
+    };
+};
+
 })();

src/app/pages/services/localStorage.js

@@ -0,0 +1,56 @@
+/**
+ * @author l.azevedo
+ * created on 29/06/2017
+ */
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.services')
+    .service('localStorage', localStorage);
+
+  /** @ngInject */
+  function localStorage($window) {
+    var service = {
+      set: set,
+      get: get,
+      setObject: setObject,
+      getObject: getObject,
+      clear: clear
+    }
+
+    return service;
+
+    function set(key, value) {
+      if ($window.fakeLocalStorage) {
+        $window.fakeLocalStorage[key] = value;
+      } else {
+        $window.localStorage[key] = value;
+      }
+    }
+
+    function get(key, defaultValue) {
+      return !$window.fakeLocalStorage ? $window.localStorage[key] || defaultValue : $window.fakeLocalStorage[key] || defaultValue;
+    }
+
+    function setObject(key, value) {
+      if ($window.fakeLocalStorage) {
+        $window.fakeLocalStorage[key] = angular.toJson(value);
+      } else {
+        $window.localStorage[key] = angular.toJson(value);
+      }
+    }
+
+    function getObject(key) {
+      return !$window.fakeLocalStorage ? angular.fromJson($window.localStorage[key] || '{}') : angular.fromJson($window.fakeLocalStorage[key] || '{}');
+    }
+
+    function clear() {
+      if ($window.fakeLocalStorage) {
+        $window.fakeLocalStorage = {};
+      } else {
+        $window.localStorage.clear();
+      }
+    }
+  }
+
+})();

src/app/pages/services/services.module.js

@@ -0,0 +1,12 @@
+(function() {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.services', [])
+    .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig() {
+
+  }
+
+})();

src/app/pages/surveys/create/createTabCtrl.js

@@ -257,7 +257,7 @@
         $scope.survey.list = $scope.lists.selected;
         $scope.survey.status = "Sending";
         $log.info("sendSurvey",$scope.survey);
-        $state.transitionTo('surveys.list'/*, {id: item.id}*/);
+        $state.transitionTo('main.surveys.list'/*, {id: item.id}*/);
 
         $scope.saveSurvey(true);
 

src/app/pages/surveys/list/list.controller.js

@@ -23,12 +23,12 @@
 
     function goToCreate() {
       $log.info("Go to create");
-      $state.go('surveys.create');
+      $state.go('main.surveys.create');
     }
 
     function editSurvey(id){
       $log.info("Edit");
-      $state.go('surveys.edit', {'survey_id': id})
+      $state.go('main.surveys.edit', {'survey_id': id})
     }; 
 
     function removeSurvey(id){

src/app/pages/surveys/surveys.module.js

@@ -13,7 +13,7 @@
   /** @ngInject */
   function routeConfig($stateProvider) {
     $stateProvider
-        .state('surveys', {
+        .state('main.surveys', {
           url: '/surveys',
           template : '<ui-view  autoscroll="true" autoscroll-body-top></ui-view>',
           title: 'Surveys',
@@ -21,7 +21,7 @@
           	icon: 'ion-gear-a',
             order: 1000,
           },
-        }).state('surveys.create', {
+        }).state('main.surveys.create', {
           url: '/create',
           templateUrl: 'app/pages/surveys/create/create.html',
           controller: "CreateTabCtrl",
@@ -29,12 +29,12 @@
           sidebarMeta: {
             order: 1000,
           },
-        }).state('surveys.edit', {
+        }).state('main.surveys.edit', {
           url: '/edit/:survey_id',
           templateUrl: 'app/pages/surveys/create/create.html',
           controller: "CreateTabCtrl",
           title: 'Edit a survey'
-        }).state('surveys.list', {
+        }).state('main.surveys.list', {
           url: '/list',
           templateUrl: 'app/pages/surveys/list/list.html',
           controller: "list as vm",

src/app/pages/teams/lists/ListsTabCtrl.js

@@ -169,7 +169,7 @@
 	  if (item && item.isChecked) {
 		  	vm.activeList = item;
         vm.errors.noList = false;
-        $state.transitionTo('teams.lists', {id: item.id}, {notify: false});
+        $state.transitionTo('main.teams.lists', {id: item.id}, {notify: false});
 			angular.forEach(vm.Lists, function(list){
 	      	 if(item.id != list.id)
 			   		list.isChecked = false;
@@ -201,7 +201,7 @@
       vm.activeList = {};
       vm.errors.noList = true;
       vm.listMembers = [];
-      $state.transitionTo('teams.lists', {notify: false});
+      $state.transitionTo('main.teams.lists', {notify: false});
     }
 	  	
 	  

src/app/pages/teams/lists/lists.module.js

@@ -11,7 +11,7 @@
   /** @ngInject */
   function routeConfig($stateProvider,$urlRouterProvider) {
     $stateProvider
-        .state('teams.lists', {
+        .state('main.teams.lists', {
           url: '/lists/:id',
           //abstract: true,
           templateUrl: 'app/pages/teams/lists/lists.html',

src/app/pages/teams/members/composeBox/composeBoxCtrl.js

@@ -50,7 +50,7 @@
         .create(vm.member)
         .then(function (data){
           vm.member = {}
-          $state.go('teams.members');
+          $state.go('main.teams.members');
           
           toastr.info('The member was created successfuly :)', 'Members', {
                       "autoDismiss": true,

src/app/pages/teams/members/detail/memberDetail.html

@@ -5,7 +5,7 @@
         <a href class="collapse-navigation-link ion-navicon"
            ng-click="tabCtrl.navigationCollapsed=!tabCtrl.navigationCollapsed"></a>
       </div>
-      <button ui-sref="teams.members.label({label : detailCtrl.label})"  type="button" class="back-button btn btn-default btn-with-icon"><i
+      <button ui-sref="main.teams.members.label({label : detailCtrl.label})"  type="button" class="back-button btn btn-default btn-with-icon"><i
           class="ion-chevron-left"></i>Back
       </button>
     </div>

src/app/pages/teams/members/members.html

@@ -15,7 +15,7 @@
 
             <div class="labels-container">
               <div ng-repeat="t in tabCtrl.tabs" ui-sref-active="active" class="label-item"
-               ui-sref="teams.members.label({label: t.label})" ng-click="tabCtrl.selectTab(t.label)">
+               ui-sref="main.teams.members.label({label: t.label})" ng-click="tabCtrl.selectTab(t.label)">
                 <span class="tag label {{t.label}}">{{t.name}}</span>
             
               </div>

src/app/pages/teams/members/members.module.js

@@ -11,7 +11,7 @@
   /** @ngInject */
   function routeConfig($stateProvider,$urlRouterProvider) {
     $stateProvider
-        .state('teams.members', {
+        .state('main.teams.members', {
           url: '/members',
           //abstract: true,
           templateUrl: 'app/pages/teams/members/members.html',
@@ -21,13 +21,13 @@
           sidebarMeta: {
             order: 0,
           },
-        }).state('teams.members.label', {
+        }).state('main.teams.members.label', {
           url: '/:label',
           templateUrl: 'app/pages/teams/members/membersListing/membersList.html',
           title: 'Members',
           controller: "MembersListCtrl",
           controllerAs: "listCtrl"
-        }).state('teams.members.detail', {
+        }).state('main.teams.members.detail', {
           url: '/:id',
           templateUrl: 'app/pages/teams/members/detail/memberDetail.html',
           title: 'Detail',

src/app/pages/teams/members/membersListing/membersList.html

@@ -34,11 +34,11 @@
             </label>
           </div>
         </td>
-        <td  class="photo-td" ui-sref="teams.members.detail({id: m.id, label: listCtrl.label})">
+        <td  class="photo-td" ui-sref="main.teams.members.detail({id: m.id, label: listCtrl.label})">
           <img ng-src="{{m.id | profilePicture}}" class="little-human-picture">
          
         </td>
-        <td  ui-sref="teams.members.detail({id: m.id, label: listCtrl.label})">
+        <td  ui-sref="main.teams.members.detail({id: m.id, label: listCtrl.label})">
           <div class="name-container">
             <div><span class="name">{{m.name}}</span></div>
             <div><span ng-repeat="l in m.labels" class="tag label label-primary {{l}}">{{l}}</span></div>

src/app/pages/teams/teams.module.js

@@ -15,7 +15,7 @@
   /** @ngInject */
   function routeConfig($stateProvider) {
     $stateProvider
-        .state('teams', {
+        .state('main.teams', {
           url: '/teams',
           template : '<ui-view  autoscroll="true" autoscroll-body-top></ui-view>',
           abstract: true,

src/app/theme/components/baSidebar/baSidebar.service.js

@@ -73,7 +73,8 @@
                 return {
                   name: s.name,
                   title: s.title,
-                  level: (s.name.match(/\./g) || []).length,
+                  //level: (s.name.match(/\./g) || []).length,
+                  level: ((s.name.match(/\./g) || []).length - 1),
                   order: meta.order,
                   icon: meta.icon,
                   stateRef: s.name,

src/index.html

@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en" ng-app="BlurAdmin">
+
 <head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -23,57 +24,29 @@
   <!-- css files will be automatically insert here -->
   <!-- endinject -->
   <!-- endbuild -->
+
 </head>
+
 <body>
-<div class="body-bg"></div>
+  <div ui-view autoscroll="true" autoscroll-body-top></div>
-<main ng-if="$pageFinishedLoading" ng-class="{ 'menu-collapsed': $baSidebarService.isMenuCollapsed() }">
 
-  <ba-sidebar></ba-sidebar>
+  <!-- build:js(src) scripts/vendor.js -->
-  <page-top></page-top>
+  <!-- bower:js -->
+  <!-- run `gulp inject` to automatically populate bower script dependencies -->
+  <!-- endbower -->
+  <!-- endbuild -->
+  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
 
-  <div class="al-main">
+  <!-- build:js({.tmp/serve,.tmp/partials,src}) scripts/app.js -->
-    <div class="al-content">
+  <!-- inject:js -->
-      <content-top></content-top>
+  <!-- js files will be automatically insert here -->
-      <div ui-view autoscroll="true" autoscroll-body-top></div>
+  <!-- endinject -->
-    </div>
-  </div>
 
-  <footer class="al-footer clearfix">
+  <!-- inject:partials -->
-    <div class="al-footer-right">Created with <i class="ion-heart"></i></div>
+  <!-- angular templates will be automatically converted in js and inserted here -->
-    <div class="al-footer-main clearfix">
+  <!-- endinject -->
-      <div class="al-copy">Blur Admin 2016</div>
+  <!-- endbuild -->
-      <ul class="al-share clearfix">
-        <li><i class="socicon socicon-facebook"></i></li>
-        <li><i class="socicon socicon-twitter"></i></li>
-        <li><i class="socicon socicon-google"></i></li>
-        <li><i class="socicon socicon-github"></i></li>
-      </ul>
-    </div>
-  </footer>
-
-  <back-top></back-top>
-</main>
-
-<div id="preloader" ng-show="!$pageFinishedLoading">
-  <div></div>
-</div>
-
-<!-- build:js(src) scripts/vendor.js -->
-<!-- bower:js -->
-<!-- run `gulp inject` to automatically populate bower script dependencies -->
-<!-- endbower -->
-<!-- endbuild -->
-<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
-
-<!-- build:js({.tmp/serve,.tmp/partials,src}) scripts/app.js -->
-<!-- inject:js -->
-<!-- js files will be automatically insert here -->
-<!-- endinject -->
-
-<!-- inject:partials -->
-<!-- angular templates will be automatically converted in js and inserted here -->
-<!-- endinject -->
-<!-- endbuild -->
 
 </body>
+
 </html>

src/sass/auth.scss

@@ -3,7 +3,6 @@
 @import "theme/_layout.scss";
 @import 'theme/buttons.scss';
 @import 'app/form.scss';
-
 html {
   min-height: 520px;
   height: 100%;
@@ -15,14 +14,17 @@ body {
 }
 
 $text-color: #ffffff;
-
+.form-control,
-.form-control, .form-control:focus {
+.form-control:focus {
   @include placeholderStyle($text-color, 0.9);
   background-color: rgba(0, 0, 0, .4);
   border-radius: 5px;
   color: $text-color;
 }
-.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
+
+.form-control[disabled],
+.form-control[readonly],
+fieldset[disabled] .form-control {
   @include placeholderStyle($text-color, 0.6);
 }
 
@@ -57,12 +59,10 @@ $text-color: #ffffff;
       color: $primary-dark;
     }
   }
-
   .control-label {
     padding-top: 11px;
     color: $text-color;
   }
-
   .form-group {
     margin-bottom: 12px;
   }
@@ -105,18 +105,19 @@ a.forgot-pass {
   text-align: center;
   display: block;
   position: relative;
-  & > span {
+  &>span {
     display: table-cell;
     width: 30%;
     white-space: nowrap;
     padding: 0 24px;
     color: $text-color;
-    & > span {
+    &>span {
       margin-top: -12px;
       display: block;
     }
   }
-  &:before, &:after {
+  &:before,
+  &:after {
     border-top: solid 1px $text-color;
     content: "";
     height: 1px;

src/sass/common.scss

@@ -1,3 +1,4 @@
 @import 'theme/conf/mixins';
 @import 'theme/conf/colorScheme/mint';
 @import 'theme/conf/variables';
+@import 'theme/_login.scss';

src/sass/theme/_login.scss

@@ -0,0 +1,141 @@
+.login {
+  min-height: 520px;
+  @include main-background();
+  height: 100%;
+}
+
+$text-color: #ffffff;
+.login .form-control,
+.login .form-control:focus {
+  @include placeholderStyle($text-color, 0.9);
+  background-color: rgba(0, 0, 0, .4);
+  border-radius: 5px;
+  color: $text-color;
+}
+
+.login .form-control[disabled],
+.login .form-control[readonly],
+fieldset[disabled] .form-control {
+  @include placeholderStyle($text-color, 0.6);
+}
+
+.auth-main {
+  display: flex;
+  align-items: center;
+  height: 100%;
+  width: 100%;
+}
+
+.login .auth-block {
+  width: 540px;
+  margin: 150px auto;
+  border-radius: 5px;
+  @include bg-translucent-dark(0.55);
+  color: #fff;
+  padding: 32px;
+  h1 {
+    font-weight: $font-light;
+    margin-bottom: 28px;
+    text-align: center;
+  }
+  p {
+    font-size: 16px;
+  }
+  a {
+    text-decoration: none;
+    outline: none;
+    transition: all 0.2s ease;
+    color: $primary;
+    &:hover {
+      color: $primary-dark;
+    }
+  }
+  .control-label {
+    padding-top: 11px;
+    color: $text-color;
+  }
+  .form-group {
+    margin-bottom: 12px;
+  }
+}
+
+.login .auth-input {
+  width: 300px;
+  margin-bottom: 24px;
+  input {
+    display: block;
+    width: 100%;
+    border: none;
+    font-size: 16px;
+    padding: 4px 10px;
+    outline: none;
+  }
+}
+
+.login a.forgot-pass {
+  display: block;
+  text-align: right;
+  margin-bottom: -20px;
+  float: right;
+  z-index: 2;
+  position: relative;
+}
+
+.login .auth-link {
+  display: block;
+  font-size: 16px;
+  text-align: center;
+  margin-bottom: 33px;
+}
+
+.login .auth-sep {
+  margin-top: 36px;
+  margin-bottom: 24px;
+  line-height: 20px;
+  font-size: 16px;
+  text-align: center;
+  display: block;
+  position: relative;
+  &>span {
+    display: table-cell;
+    width: 30%;
+    white-space: nowrap;
+    padding: 0 24px;
+    color: $text-color;
+    &>span {
+      margin-top: -12px;
+      display: block;
+    }
+  }
+  &:before,
+  &:after {
+    border-top: solid 1px $text-color;
+    content: "";
+    height: 1px;
+    width: 35%;
+    display: table-cell;
+  }
+}
+
+.login .al-share-auth {
+  text-align: center;
+  .al-share {
+    float: none;
+    margin: 0;
+    padding: 0;
+    display: inline-block;
+    li {
+      margin-left: 24px;
+      &:first-child {
+        margin-left: 0;
+      }
+      i {
+        font-size: 24px;
+      }
+    }
+  }
+}
+
+.login .btn-auth {
+  color: #ffffff!important;
+}