Move tools from side nav into tools page boxes

src/app/global/mainController.js

@@ -47,16 +47,4 @@ angular
         $scope.addFolder = function () {
             $scope.$broadcast('vaultAddFolder');
         };
-
-        $scope.import = function () {
-            $scope.$broadcast('toolsImport');
-        };
-
-        $scope.export = function () {
-            $scope.$broadcast('toolsExport');
-        };
-
-        $scope.audits = function () {
-            $scope.$broadcast('toolsAudits');
-        };
     });

src/app/settings/settingsController.js

@@ -46,8 +46,7 @@
             $uibModal.open({
                 animation: true,
                 templateUrl: 'app/settings/views/settingsChangeEmail.html',
-                controller: 'settingsChangeEmailController',
+                controller: 'settingsChangeEmailController'
-                size: 'sm'
             });
         };
 
@@ -79,8 +78,7 @@
             $uibModal.open({
                 animation: true,
                 templateUrl: 'app/settings/views/settingsDelete.html',
-                controller: 'settingsDeleteController',
+                controller: 'settingsDeleteController'
-                size: 'sm'
             });
         };
     });

src/app/tools/toolsController.js

@@ -10,23 +10,14 @@
             });
         };
 
-        $scope.$on('toolsImport', function (event, args) {
-            $scope.import();
-        });
-
         $scope.export = function () {
             $uibModal.open({
                 animation: true,
                 templateUrl: 'app/tools/views/toolsExport.html',
-                controller: 'toolsExportController',
+                controller: 'toolsExportController'
-                size: 'sm'
             });
         };
 
-        $scope.$on('toolsExport', function (event, args) {
-            $scope.export();
-        });
-
         $scope.audits = function () {
             $uibModal.open({
                 animation: true,
@@ -34,8 +25,4 @@
                 controller: 'toolsAuditsController'
             });
         };
-
-        $scope.$on('toolsAudits', function (event, args) {
-            $scope.audits();
-        });
     });

src/app/tools/views/tools.html

@@ -5,5 +5,43 @@
     </h1>
 </section>
 <section class="content">
-    Several tools are available in the menu to the left. More tools coming soon...
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Import</h3>
+        </div>
+        <div class="box-body">
+            Quickly import your logins and other data from a previous bitwarden export or from another
+            password manager application.
+        </div>
+        <div class="box-footer">
+            <button class="btn btn-default btn-flat" type="button" ng-click="import()">Import Data</button>
+        </div>
+    </div>
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Export</h3>
+        </div>
+        <div class="box-body">
+            Export all of your vault data in <code>.csv</code> format.
+        </div>
+        <div class="box-footer">
+            <button class="btn btn-default btn-flat" type="button" ng-click="export()">Export Data</button>
+        </div>
+    </div>
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Password Generator</h3>
+        </div>
+        <div class="box-body">
+            Coming soon!
+        </div>
+    </div>
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Audits</h3>
+        </div>
+        <div class="box-body">
+            Coming soon!
+        </div>
+    </div>
 </section>

src/app/tools/views/toolsExport.html

@@ -4,7 +4,12 @@
 </div>
 <form name="exportForm" ng-submit="exportForm.$valid && export(model)" api-form="exportPromise" ng-show="!startedExport">
     <div class="modal-body">
-        <p>Export all of your vault data in <code>.csv</code> format. Enter your master password to continue.</p>
+        <p>Enter your master password to continue.</p>
+        <div class="callout callout-warning">
+            <h4><i class="fa fa-warning"></i> Warning</h4>
+            This export contains your <u>unencrypted</u> data in <code>.csv</code> format. You should not store or send it
+            over unsecure channels (such as email). Delete it immediately after your are done using it.
+        </div>
         <div class="callout callout-danger validation-errors" ng-show="exportForm.$errors">
             <h4>Errors have occured</h4>
             <ul>

src/app/tools/views/toolsImport.html

@@ -5,7 +5,7 @@
 <form name="importForm" ng-submit="importForm.$valid && import(model)" ng-show="!processing">
     <div class="modal-body">
         <div class="form-group">
-            <label for="source">Source</label>
+            <label for="source">1. Select the source of this import file</label>
             <select id="source" name="source" class="form-control" ng-model="model.source" ng-change="setSource()">
                 <option ng-repeat="option in options" value="{{option.id}}">{{option.name}}</option>
             </select>
@@ -15,7 +15,7 @@
             <div ng-bind-html="source.instructions"></div>
         </div>
         <div class="form-group">
-            <label for="file">File</label>
+            <label for="file">2. Select the import file</label>
             <input type="file" id="file" name="file" required />
         </div>
     </div>

src/app/views/backendLayout.html

@@ -69,23 +69,6 @@
                 </li>
                 <li class="treeview" ng-class="{active: $state.includes('backend.tools')}">
                     <a ui-sref="backend.tools"><i class="fa fa-wrench"></i> <span>Tools</span></a>
-                    <ul class="treeview-menu">
-                        <li>
-                            <a href="javascript:void(0)" ng-click="import()">
-                                <i class="fa fa-circle-o"></i> Import
-                            </a>
-                        </li>
-                        <li>
-                            <a href="javascript:void(0)" ng-click="export()">
-                                <i class="fa fa-circle-o"></i> Export
-                            </a>
-                        </li>
-                        <li>
-                            <a href="javascript:void(0)" ng-click="audits()">
-                                <i class="fa fa-circle-o"></i> Audits
-                            </a>
-                        </li>
-                    </ul>
                 </li>
                 <li>
                     <a href="https://help.bitwarden.com/" target="_blank"

src/less/vault.less

@@ -3,6 +3,7 @@
 /* Theme Adjustments */
 
 @boxed-layout-bg-image-path: "../images/boxed-bg.png";
+@yellow: #e48c00;
 
 body {
     background-color: @gray;