Merge pull request #114 from erundle/docsCSS

Improving homepage

Author: Walden Raines

Gruntfile.js

@@ -65,6 +65,12 @@ module.exports = function (grunt) {
           src: ['*.css', '!*.min.css'],
           dest: 'dist/styles',
           expand: true
+        },
+        img: {
+          cwd: 'misc/',
+          src: 'patternfly-orb.svg',
+          dest: 'dist/docs/img',
+          expand: true
         }
       },
       cssmin: {

grunt-ngdocs-index.tmpl

@@ -238,16 +238,16 @@
 
         <div id="loading" ng-show="loading">Loading...</div>
 
-        <span ng-show="breadcrumb[breadcrumb.length-1].name === 'API Documentation'">
-          <br/>
-          <h1><strong>Welcome to Angular-PatternFly!</strong><h1>
-          <h2>Angular-PatternFly contains custom AngularJS directives which adhere to the PatternFly Refererence Implementation.</h2>
-          <h2>PatternFly is a community project that promotes design commonality and improved user experience. Its offerings
-          include visual and behavioral patterns based on research and UX best practices that solve common design problems.<h2>
-          <h3>For more information, please see <a href="https://www.patternfly.org/">https://www.patternfly.org.</a></h3>
-          <h3><a href="https://github.com/patternfly/angular-patternfly/issues/">Report an issue on Angular PatternFly on Github.</a></h3>
-          <h3><a href="https://patternfly.atlassian.net/secure/RapidBoard.jspa?rapidView=4&projectKey=PTNFLY&view=planning.nodetail">View the Implementation Roadmap on Jira.</a></h3>
-        </span>
+        <div class="home" ng-show="breadcrumb[breadcrumb.length-1].name === 'API Documentation'">
+          <h1>Welcome to Angular PatternFly!<h1>
+          <img src="img/patternfly-orb.svg" alt="PatternFly logo" />
+          <h3>Angular PatternFly contains custom AngularJS directives which utilize the PatternFly Refererence Implementation.<br/>PatternFly is a community of designers and developers collaborating to build a UI framework for enterprise web applications.</h3>
+          <ul>
+            <li><a href="https://www.patternfly.org/">More About PatternFly</a></li>
+            <li><a href="https://github.com/patternfly/angular-patternfly/issues/">Report an issue on Github</a></li>
+            <li><a href="https://patternfly.atlassian.net/secure/RapidBoard.jspa?rapidView=4&projectKey=PTNFLY&view=planning.nodetail">View the Implementation Roadmap</a></li>
+          </ul>
+        </div>
 
         <div ng-hide="loading" ng-include src="currentPage.partialUrl" onload="afterPartialLoaded()" autoscroll class="content slide-reveal"></div>
 <% if (discussions) { %>

misc/ng-docs.css

@@ -1,18 +1,39 @@
-img.AngularJS-small {
-  width: 95px;
-  height: 25px;
+/* Home Page Styles */
+.home {
+  text-align: center;
 }
 
-/* this is here to avoid the display=block shuffling of ngShow */
-.breadcrumb li > * {
-  float: none;
-  margin: 0;
+.home h1 {
+  font-size: 30px;
+  font-weight: 300;
+  padding-top: 20px;
+  margin: 22px 0 0;
 }
 
-.breadcrumb {
-  padding-top: 6px;
-  padding-bottom: 0;
-  line-height: 18px
+.home img {
+  width: 320px;
+  border: 1px solid #3bb1dc;
+  border-radius: 200px;
+}
+
+.home h3 {
+  margin-top: 40px;
+  margin-bottom: 40px;
+  line-height: 35px;
+}
+
+.home ul {
+  margin-top: 20px;
+  list-style: none;
+}
+
+.home ul li{
+  display: inline-block;
+  padding: 0 10px;
+}
+
+.home ul li + li{
+  border-left: 1px solid #bbb;
 }
 
 .navbar img {
@@ -48,11 +69,22 @@ img.AngularJS-small {
   height: 1em;
 }
 
-
 .icon-cog {
   line-height: 13px;
 }
 
+/* this is here to avoid the display=block shuffling of ngShow */
+.breadcrumb li > * {
+  float: none;
+  margin: 0;
+}
+
+.breadcrumb {
+  padding-top: 6px;
+  padding-bottom: 0;
+  line-height: 18px
+}
+
 /* =============================== */
 
 .form-search {
@@ -142,7 +174,6 @@ img.AngularJS-small {
   padding-top: 6px;
 }
 
-
 .docs-search {
   margin: 10px 0;
   padding: 4px 0 4px 20px;
@@ -333,3 +364,5 @@ ul.events > li > h3 {
 .type-hint-function {
   background-color: #003399;
 }
+
+