Merge pull request #112 from kevgliss/uitweaks

UI tweaks

bower.json

@@ -29,11 +29,13 @@
     "angular-ui-switch": "~0.1.0",
     "angular-chart.js": "~0.7.1",
     "satellizer": "~0.9.4",
-    "angularjs-toaster": "~0.4.14"
+    "angularjs-toaster": "~0.4.14",
+    "ngletteravatar": "~3.0.1"
   },
   "devDependencies": {
     "angular-mocks": "~1.3",
-    "angular-scenario": "~1.3"
+    "angular-scenario": "~1.3",
+    "ngletteravatar": "~3.0.1"
   },
   "resolutions": {
     "bootstrap": "~3.3.1",

lemur/static/app/angular/app.js

@@ -13,7 +13,8 @@ var lemur = angular
     'toaster',
     'uiSwitch',
     'mgo-angular-wizard',
-    'satellizer'
+    'satellizer',
+    'ngLetterAvatar'
   ])
   .config(function ($routeProvider, $authProvider) {
     $routeProvider

lemur/static/app/angular/welcome/welcome.html

@@ -1,12 +1,26 @@
 <div class="jumbotron">
+  <span class="pull-right"><button class="btn btn-sm btn-primary">First Time? Take the Tour!</button></span>
   <h1>Hey there!</h1>
+  <p>Welcome to Lemur! A central portal for all (most) of your TLS certificate needs. With Lemur you are able to create, deploy and track the TLS certificates in your environment. Lets get started!</p>
+</div>
 
-  <p>Welcome to Lemur! A central portal for all (most) of your TLS needs.</p>
+<div class="container marketing">
-
+    <!-- Three columns of text below the carousel -->
-  <p><a href="/#/certificates/create" class="btn btn-primary btn-lg" role="button">Create a Certificate</a></p>
+    <div class="row">
-</div>
+        <div class="col-lg-4">
-<div class="row featurette">
+            <h2>Create</h2>
-  <div class="col-md-10">
+            <p>With Lemur you can create certificates from any authority; internal or external! Lemur does not issue certificates itself. Instead it acts as a broker, creating private keys and CSRs that are sent to external services.</p>
-    <h2 class="featurette-heading">TLS In The Cloud <span class="text-muted">Encrypt it all </span></h2>
+            <p><a class="btn btn-default" href="#" role="button">View certificates &raquo;</a></p>
-  </div>
+        </div><!-- /.col-lg-4 -->
+        <div class="col-lg-4">
+            <h2>Deploy</h2>
+            <p>Once certificates have been created with Lemur, you can put them to use! Lemur has the ability to create destinations for certificates that allow them to be uploaded to and used by a variety of environments.</p>
+            <p><a class="btn btn-default" href="#" role="button">View Destinations &raquo;</a></p>
+        </div><!-- /.col-lg-4 -->
+        <div class="col-lg-4">
+            <h2>Authority</h2>
+            <p>Have an internal Certificate Authority? Need an easy way to create an manage those authorities? Lemur has you covered!</p>
+            <p><a class="btn btn-default" href="#" role="button">View Authorities &raquo;</a></p>
+        </div><!-- /.col-lg-4 -->
+    </div><!-- /.row -->
 </div>

lemur/static/app/index.html

@@ -71,7 +71,12 @@
                 <ul ng-show="currentUser.username" class="nav navbar-nav navbar-right">
                     <li class="dropdown" dropdown on-toggle="toggled(open)">
                         <a href class="dropdown-toggle profile-nav" dropdown-toggle>
-                      {{ currentUser.username }}<img ng-if="currentUser.profileImage" src="{{ currentUser.profileImage }}" class="profile img-circle">
+                            <span ng-show="currentUser.profileImage">
+                                {{ currentUser.username }}<img src="{{ currentUser.profileImage }}" class="profile img-circle">
+                            </span>
+                            <span ng-show="!currentUser.profileImage">
+                                {{ currentUser.username }}<ng-letter-avatar height="35" width="35" data="currentUser.username" shape="round"></ng-letter-avatar>
+                            </span>
                         </a>
                         <ul class="dropdown-menu">
                             <li><a ng-click="logout()">Logout</a></li>
@@ -87,7 +92,10 @@
     </div>
     <footer class="footer">
       <div class="container">
-        <p class="text-muted">Lemur is broken regularly by <a href="https://github.com/Netflix/lemur.git">Netflix</a>.</p>
+        <p class="text-muted">
+            <span>Lemur is broken regularly by <a href="https://github.com/Netflix/lemur.git">Netflix</a>.</span>
+            <span class="pull-right">Confused? Check out our <a href="https://lemur.readthedocs.org/en/latest">docs</a>!</span>
+        </p>
       </div>
     </footer>
 </body>