Home Animation

templates/css/theme.css

@@ -111,8 +111,8 @@ body.noscroll
  
   }*/
 
-.campusAvatar img
-{
+  .campusAvatar img
+  {
 /*
   margin-top: 1em;
   margin-right: 1em;
@@ -201,6 +201,42 @@ body.noscroll
     color: #7f7f7f;
     font-size: 300%;
     text-shadow:#e0e0e0 1px 1px 0;
+    opacity: 0;
+    -webkit-animation-duration: 8s; 
+    animation-duration: 8s; 
+    -webkit-animation-fill-mode: both; 
+    animation-fill-mode: both; 
+    overflow: hidden;
+    height: 100%;
+  } 
+
+  @-webkit-keyframes fadeOutUp { 
+    0% { 
+      opacity: 1; 
+      -webkit-transform: translateY(0); 
+    } 
+    100% { 
+      opacity: 0; 
+      -webkit-transform: translateY(-200px); 
+      /*-webkit-transform: scale(0,0); */
+      height: 0px;
+    } 
+  } 
+  @keyframes fadeOutUp { 
+    0% { 
+      opacity: 1; 
+      transform: translateY(0); 
+    } 
+    100% { 
+      opacity: 0; 
+      transform: translateY(-200px); 
+      /*transform: scale(0,0); */
+      height: 0px;
+    } 
+  } 
+  .fadeOutUp { 
+    -webkit-animation-name: fadeOutUp; 
+    animation-name: fadeOutUp; 
   }
 
   .user-pane-menu{
@@ -280,7 +316,7 @@ body.noscroll
     color: #7f7f7f;
   }
 
-/*Settings Style*/
+  /*Settings Style*/
 
   .settingList .settingListItem:hover{
     background-color: #E2E2E2;
@@ -299,12 +335,12 @@ body.noscroll
   }
 
 
-/*End Settings*/
+  /*End Settings*/
 
 
   /*md Effects*/
 
-.md-avatar{
+  .md-avatar{
     width: 40px;
     height: 40px;
     margin-top: 8px;
@@ -335,6 +371,6 @@ md-list-item, md-list-item .md-list-item-inner {
   -ms-flex-align: center;
   align-items: center;
   min-height: 48px;
-}*/
+  }*/
 
 /*End Effects for MD*/

templates/views/home.html

@@ -3,7 +3,7 @@
 		<md-progress-circular md-mode="indeterminate"></md-progress-circular>
 	</div>
 	<md-content layout-padding>
-		<md-card class="gray-font">
+		<md-card class="gray-font fadeOutUp">
 			<div layout="row">
 				<div class="spacer"></div>
 				<div>
@@ -15,6 +15,8 @@
 				<div class="spacer"></div>
 				<div>
 					<h1>Welcome To SE-Hub</h1>
+					<P>Software Engineering Course Made Easy</P>
+					v1.0
 				</div>
 				<div class="spacer"></div>
 			</div>