Reformatted css, and added 'Main Menu' button from /profile

hourglass/client/login/login.css

@@ -3,7 +3,9 @@
 	width: 100%;
 	margin: 0;
 	box-shadow: 2px 2px 5px 3px #666;
+
 	background-color: #EBEBEB;
+
 	display: inline-block;
 	position: relative;
 	z-index: 50;
@@ -13,6 +15,7 @@
 	padding: 0.5%;
 	padding-left: 1%;
 	float: left;
+
 	-webkit-filter: drop-shadow(2px 2px 5px #333);
 	filter: drop-shadow(2px 2px 5px #333);
 }
@@ -33,6 +36,7 @@
 	min-height: 100%;
 	position: absolute;
 	top: 11%;
+
 	background-color: #E5E5E5;
 	background-image: url("banner100.jpg");
 }
@@ -41,10 +45,13 @@
 	position: fixed;
 	top: 50%;
 	left: 50%;
+
 	-moz-border-radius: 50%;
 	-webkit-border-radius: 50%;
 	border-radius: 50%;
+
 	background-color: rgba(0,0,0,0.2);
+
 	-webkit-filter: drop-shadow(2px 2px 5px #333);
 	filter: drop-shadow(2px 2px 5px #333);
 }
@@ -58,6 +65,7 @@
 .text {
 	text-align: center;
 	color: #FFF;
+
 	-webkit-filter: drop-shadow(2px 2px 5px #444);
 	filter: drop-shadow(2px 2px 5px #444);
 }
@@ -76,15 +84,20 @@ p.text {
 #loginButton {
 	font-size: 200%;
 	padding: 2%;
+
 	-webkit-border-radius: 6;
 	-moz-border-radius: 6;
 	border-radius: 6px;
+
 	position: relative;
+
 	background-color: #005CE6;
+
 	-webkit-transition: background-color 0.4s ease;  
 	-moz-transition: background-color 0.4s ease; 
 	-ms-transition: background-color 0.4s ease;
 	transition: background-color 0.4s ease; 
+
 	cursor: pointer;
 }
 
@@ -94,6 +107,7 @@ p.text {
 
 #loginButton:active {
 	background-color: #FF4D4D;
+
 	-webkit-transition: background-color 0.1s ease;  
 	-moz-transition: background-color 0.1s ease; 
 	-ms-transition: background-color 0.1s ease;
@@ -116,6 +130,7 @@ p.text {
 	font-size: 150%;
 	margin: 0;
 	padding: 1%;
+
 	-webkit-filter: drop-shadow(2px 2px 5px #444);
 	filter: drop-shadow(2px 2px 5px #444);
 }
@@ -123,6 +138,7 @@ p.text {
 a {
 	color: #0099CC;
 	text-decoration: none;
+
 	-webkit-transition: color 0.4s ease;  
 	-moz-transition: color 0.4s ease; 
 	-ms-transition: color 0.4s ease;
@@ -132,3 +148,4 @@ a {
 a:hover {
 	color: #00BFFF;
 }
+

hourglass/client/main/main.js

@@ -22,12 +22,14 @@ var themeColors = {
 
     }
 };
+
 var calendarColors = {
     "test": "red",
     "project": "blue",
     "normal": "green",
     "quiz": "black"
 };
+
 var options = {
     "privacy": ["Public", "Hidden"],
     "category": ["Class", "Club", "Other"]

hourglass/client/profile/profile.css

@@ -56,6 +56,7 @@
 	-moz-border-radius: 50%;
 	-webkit-border-radius: 50%;
 	border-radius: 50%;
+
 	position: absolute;
 	top: 43%;
 	left: 2.5%;
@@ -67,6 +68,7 @@
 	width: 100%;
 	height: 5%;
 	padding: 0.5% 0 0.5% 0;
+
 	background-color: #0D0D0D;
 }
 
@@ -82,10 +84,13 @@
 
 .profOptions {
 	box-shadow: 2px 2px 5px 3px #666;
+
 	position: absolute;
 	display: none;
 	z-index: 5;
+
 	opacity: 0;
+
 	-webkit-transition: opacity 0.4s ease;  
 	-moz-transition: opacity 0.4s ease; 
 	-ms-transition: opacity 0.4s ease;
@@ -97,8 +102,10 @@
 	min-width: 10%;
 	padding: 20px;
 	margin: 0;
+
 	text-align: center;
 	cursor: pointer;
+	
 	-webkit-transition: box-shadow 0.4s ease;  
 	-moz-transition: box-shadow 0.4s ease; 
 	-ms-transition: box-shadow 0.4s ease;
@@ -119,6 +126,7 @@
 	padding: 4%;
 	padding-top: 2.5%;
 	padding-right: 4%;
+
 	box-shadow: 2px 2px 5px 3px #666;
 }
 
@@ -137,6 +145,7 @@
 	height: 30%;
 	float: right;
 	border-top: 5px solid #2E4F74;
+
 	-webkit-transition: width 0.4s ease;  
 	-moz-transition: width 0.4s ease; 
 	-ms-transition: width 0.4s ease;
@@ -161,9 +170,12 @@
 .profFunction {
 	margin-right: 1%;
 	padding: 2%;
+
 	border: 2px solid rgba(0,0,0,0.2);
+
 	display: inherit;
 	cursor: pointer;
+
 	-webkit-transition: background-color 0.4s ease;  
 	-moz-transition: background-color 0.4s ease; 
 	-ms-transition: background-color 0.4s ease;
@@ -172,10 +184,10 @@
 
 .profFunction:hover {
 	background-color: rgba(0,0,0,0.1);
+
 }
 
-.profFunction i,
+.profFunction i, .profFunction h4 {
-.profFunction h4 {
 	padding: 1%;
 }
 
@@ -188,34 +200,29 @@
 	width: 30%;
 	margin-top: 3%;
 	padding: 1.5% 1% 1.5% 1%;
+
 	-webkit-animation: expand .7s ease 1;
     animation: expand .7s ease 1;
 }
 
 @-webkit-keyframes expand {
-    0% {
+    0%	 { width: 0%; }
-        width: 0%;
+    100% { width: 30%; }
-    }
-    100% {
-        width: 30%;
-    }
 } 
 
 @keyframes expand {
-    0% {
+    0%	 { width: 0%; }
-        width: 0%;
+    100% { width: 30%; }
-    }
-    100% {
-        width: 30%;
-    }
 }
 
 #label {
 	width: 90%;
 	margin-top: 2.5%;
 	margin-bottom: 2%;
+	
 	background-color: rgba(0,0,0,0.2);
 	box-shadow: none;
+
 	display: table;
 	cursor: default;
 }
@@ -224,7 +231,9 @@
 	width: 90%;
 	padding: 1%;
 	padding-right: 100%;
+
 	display: inline-block;
+
 	overflow-x: hidden;
 	overflow-y: scroll;
 }
@@ -233,7 +242,9 @@
 	font-style: italic;
 	font-weight: 200;
 	margin-left: 1%;
+
 	color: #999;
+
 	-webkit-filter :none;
 	filter: none;
 }
@@ -243,9 +254,11 @@
 	width: 100%;
 	margin-bottom: 3%;
 	padding: 2%;
+
 	box-shadow: 2px 2px 5px 3px #666;
 	display: table;
 	cursor: pointer;
+
 	-webkit-transition: background-color 0.4s ease;  
 	-moz-transition: background-color 0.4s ease; 
 	-ms-transition: background-color 0.4s ease;
@@ -314,9 +327,11 @@
 	font-size: 140%;
 	margin: 0 35% 0 35%;
 	padding: 2%;
+
 	background-color: rgba(0,0,0,0.25);
 	text-align: center;
 	cursor: pointer;
+
 	-webkit-transition: background-color 0.4s ease;  
 	-moz-transition: background-color 0.4s ease; 
 	-ms-transition: background-color 0.4s ease;
@@ -338,18 +353,21 @@
 #save {
 	font-size: 90%;
 	background-color: #CC4444;
+
 	box-shadow: -1px 2px 5px 1px #333;
+
 	position: absolute;
 	top: 0;
 	right: 10%;
-    z-index: 5;
+	z-index: 50;
+
 	-webkit-transition: transform 0.2s ease, background-color 0.1s ease;  
 	-moz-transition: transform 0.2s ease, background-color 0.1s ease; 
 	-ms-transition: transform 0.2s ease, background-color 0.1s ease;
 	transition: transform 0.2s ease, background-color 0.1s ease;
 }
 
-#save:hover {
+#save:hover, #mainpage:hover {
 	-webkit-transform: scale(1.05);
     -moz-transform: scale(1.05);
     -ms-transform: scale(1.05);
@@ -361,10 +379,33 @@
 	background-color: #34CB34;
 }
 
-#save h2 {
+#save h2, #mainpage h2 {
 	font-weight: 200;
 	width: 100%;
 	padding: 8%;
+
 	-webkit-filter: none;
 	filter: none !important;
 }
+
+#mainpage {
+	font-size: 90%;
+	background-color: #617C9E;
+
+	box-shadow: -1px 2px 5px 1px #333;
+
+	position: absolute;
+	top: 0;
+	left: 10%;
+	z-index: 50;
+
+	-webkit-transition: transform 0.2s ease, background-color 0.1s ease;  
+	-moz-transition: transform 0.2s ease, background-color 0.1s ease; 
+	-ms-transition: transform 0.2s ease, background-color 0.1s ease;
+	transition: transform 0.2s ease, background-color 0.1s ease;
+}
+
+#mainpage:active {
+	background-color: #56708D;
+}
+

hourglass/client/profile/profile.html

@@ -1,6 +1,7 @@
 <template name="profile">
 	<div id="profPage" style="background-color:{{divColor 'header'}};height:{{mainHeight}};">
 		<div id="save"><h2>Save Settings</h2></div>
+		<div id="mainpage" onclick="window.location='/'"><h2>Main Page</h2></div>
 		<div id="profMainContainer" style="{{mainCenter}}">
 			<div id="profBanner" style="{{banner}};"></div>
 			<div id="profAvatar" style="{{avatar}};{{avatarDim}}"></div>
@@ -56,9 +57,9 @@
 								<span class="subscriptions classText">Members</span>
 							</div>
 							<div class="classHolder" style="max-height:{{classHolderHeight}}">
-								<!-- {{#each myclasses}}
+								{{#each myclasses}}
 									{{> classDisplay}}
-								{{/each}} -->
+								{{/each}}
 							</div>
 						{{/if}}