From e90f0de75e57fcf91e56902510b430bab1a2182c Mon Sep 17 00:00:00 2001
From: Kenneth Jao <ksjdragon@gmail.com>
Date: Tue, 20 Sep 2016 09:47:14 -0400
Subject: [PATCH 1/4] CSS fix

---
 hourglass/client/profile/profile.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/hourglass/client/profile/profile.js b/hourglass/client/profile/profile.js
index 5c5c41e..70422ee 100644
--- a/hourglass/client/profile/profile.js
+++ b/hourglass/client/profile/profile.js
@@ -76,15 +76,15 @@ Template.profile.helpers({
         return Session.get("user").name;
     },
     motd() { // Returns the current user's description
-        if (Session.get("user").description !== "") return Session.get("user").description;
+        if (Session.get("user").description !== undefined) return Session.get("user").description;
         return "Say something about yourself!";
     },
     school() { // Returns the current user's school's name
-        if (Session.get("user").school !== "") return Session.get("user").school;
+        if (Session.get("user").school !== undefined) return Session.get("user").school;
         return "Click here to edit...";
     },
     grade() { // Returns the current user's grade
-        if (Session.get("user").grade !== "") return Session.get("user").grade + "th";
+        if (Session.get("user").grade !== undefined) return Session.get("user").grade + "th";
         return "Click here to edit...";
     },
     classes() { // Loads all of the possible classes ( Limit of twenty shown ) ( Sorts by class size ) 

From bba1cd1c7543905f2b49ce82527bb58897065e0d Mon Sep 17 00:00:00 2001
From: Kenneth Jao <ksjdragon@gmail.com>
Date: Tue, 27 Sep 2016 00:22:26 -0400
Subject: [PATCH 2/4] Added themes in constants, and background images, minor
 fixes

---
 hourglass/client/main/main.css       | 11 ++++--
 hourglass/client/main/main.html      | 17 +++++----
 hourglass/client/main/main.js        |  4 +--
 hourglass/client/profile/profile.css |  4 +--
 hourglass/client/profile/profile.js  |  6 ++--
 hourglass/lib/constants.js           | 52 ++++++++++++++++++++++++++--
 6 files changed, 72 insertions(+), 22 deletions(-)

diff --git a/hourglass/client/main/main.css b/hourglass/client/main/main.css
index c80051b..b1d9e16 100644
--- a/hourglass/client/main/main.css
+++ b/hourglass/client/main/main.css
@@ -262,7 +262,7 @@ input, textarea {
 .mode, .function {
 	width: 100%;
 	position: relative;
-	background-color: #849CAE;
+	background-color: rgba(255,255,255,0.2);
 
 	-webkit-transition: background-color 0.5s ease, box-shadow 0.5s ease;  
 	-moz-transition: background-color 0.5s ease, box-shadow 0.5s ease; 
@@ -577,6 +577,7 @@ input, textarea {
 }
 
 #editWork {
+	min-height: 68vh;
 	margin: auto;
 	margin-top: 5%;
 
@@ -599,6 +600,7 @@ input, textarea {
 #editWorkCont {
 	width: 100%;
 	height: 100%;
+	min-height: 68vh;
 
 	position: relative;
 	display: table;
@@ -1012,9 +1014,12 @@ input, textarea {
 	background-color: rgba(255,255,255,0.1);
 }
 
+.fc-past {
+	background-color: rgba(0,0,0,0.2);
+}
+
 .fc-day:not(.fc-past) {
 	cursor: pointer;
-	box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1);
 
 	-webkit-transition: box-shadow 0.4s ease;  
 	-moz-transition: box-shadow 0.4s ease; 
@@ -1023,7 +1028,7 @@ input, textarea {
 } 
 
 .fc-day:not(.fc-past):hover {
-	box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.15);
+	box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1);
 }
 
 .fc-slats, .fc-content-skeleton {
diff --git a/hourglass/client/main/main.html b/hourglass/client/main/main.html
index d47fcb2..fc3e14c 100644
--- a/hourglass/client/main/main.html
+++ b/hourglass/client/main/main.html
@@ -12,21 +12,21 @@
             <div id="dropdown">
                 <img src="{{avatar}}">
             </div>
-            <div id="headerBar"></div>
+            <div id="headerBar" style="background-color:{{divColor 'statusIcons'}}"></div>
         </header>
         <div id="menuContainer" style="left:{{menuStatus}};background-color:{{divColor 'sidebar'}}">
             <div id="modes">
-                <div class="mode classes" style="background-color:{{divColor 'funcButton'}}">
+                <div class="mode classes">
                     <i class="fa fa-university" aria-hidden="true"></i>
                     <h4 style="color:{{modeStatus 'classes'}}">Classes</h4>
                 </div>
-                <div class="mode calendar" style="background-color:{{divColor 'funcButton'}}">
+                <div class="mode calendar">
                     <i class="fa fa-calendar" aria-hidden="true"></i>
                     <h4 style="color:{{modeStatus 'calendar'}}">Calendar</h4>
                 </div>
             </div>
             <div id="functions">
-                <div class="function manageClass" onclick="window.location='/profile'" style="background-color:{{divColor 'funcButton'}}">
+                <div class="function manageClass" onclick="window.location='/profile'">
                     <i class="fa fa-tasks" aria-hidden="true"></i>
                     <h4>Manage Classes</h4>
                 </div>
@@ -54,11 +54,10 @@
                     </div>
                 </div>
             {{/if}}
-
-                <div id="exportDiv" class="sideFilter">
-                    <i id="export" class="fa fa-download" aria-hidden="true"></i>
-                    <h4 id="exportText">Export</h4>
-                </div>
+            <div id="exportDiv" class="sideFilter">
+                <i id="export" class="fa fa-download" aria-hidden="true"></i>
+                <h4 id="exportText">Export</h4>
+            </div>
         </div>
         <div id="optionsContainer" style="right:{{optionsStatus}};background-color:{{divColor 'sidebar'}}">
             <h3>Preferences</h3>
diff --git a/hourglass/client/main/main.js b/hourglass/client/main/main.js
index 6e276b4..eee8b1d 100644
--- a/hourglass/client/main/main.js
+++ b/hourglass/client/main/main.js
@@ -260,7 +260,7 @@ function startDragula() {
 
 Template.main.helpers({
     schoolName() { // Finds the name of the user's school.
-        if(Session.get("user").school === undefined) return;
+        if(Session.get("user").school === undefined || Session.get("user").school === null) return;
         return " - " + Session.get("user").school;
     },
     iconColor(icon) { // Sidebar status color
@@ -975,7 +975,7 @@ function closeInput(modifyingInput) { // Close a changeable input and change it
     if (Session.equals("sidebar", "optionsContainer") || Session.equals("sidebar", "both")) {
         color = "#000";
     } else {
-        color = "#8C8C8C";
+        color = "#BEBEBE";
     }
     span.style.color = color;
     Session.set("commentRestrict","");
diff --git a/hourglass/client/profile/profile.css b/hourglass/client/profile/profile.css
index b6f1e91..614119f 100644
--- a/hourglass/client/profile/profile.css
+++ b/hourglass/client/profile/profile.css
@@ -1,6 +1,6 @@
 .change {
 	font-size: 150%;
-	color: #8C8C8C;
+	color: #BEBEBE;
 	cursor: pointer;
 }
 
@@ -22,7 +22,7 @@
 .changeInput {
 	font-size: 100%;
 	padding: 0;
-	color: #8C8C8C;
+	color: #BEBEBE;
 	position: relative;
 }
 
diff --git a/hourglass/client/profile/profile.js b/hourglass/client/profile/profile.js
index b9bd82e..868af91 100644
--- a/hourglass/client/profile/profile.js
+++ b/hourglass/client/profile/profile.js
@@ -76,15 +76,15 @@ Template.profile.helpers({
         return Session.get("user").name;
     },
     motd() { // Returns the current user's description
-        if (Session.get("user").description !== undefined) return Session.get("user").description;
+        if (Session.get("user").description !== undefined && Session.get("user").description !== null) return Session.get("user").description;
         return "Say something about yourself!";
     },
     school() { // Returns the current user's school's name
-        if (Session.get("user").school !== undefined) return Session.get("user").school;
+        if (Session.get("user").school !== undefined && Session.get("user").school !== null) return Session.get("user").school;
         return "Click here to edit...";
     },
     grade() { // Returns the current user's grade
-        if (Session.get("user").grade !== undefined) return Session.get("user").grade + "th";
+        if (Session.get("user").grade !== undefined && Session.get("user").grade !== null) return Session.get("user").grade + "th";
         return "Click here to edit...";
     },
     classes() { // Loads all of the possible classes ( Limit of twenty shown ) ( Sorts by class size ) 
diff --git a/hourglass/lib/constants.js b/hourglass/lib/constants.js
index 0af3d0f..7b623a3 100644
--- a/hourglass/lib/constants.js
+++ b/hourglass/lib/constants.js
@@ -4,7 +4,6 @@ themeColors =  {
         "header": "#EBEBEB",
         "sidebar": "#65839A",
         "dropdown": "#E6E6E6",
-        "adminButtons": "#C8C0C0",
         "funcButton": "#849CAE",
         "statusIcons": "#33ADFF",
         "highlightText": "#FF1A1A",
@@ -13,12 +12,11 @@ themeColors =  {
         "calendar": "#000",
         "text": "#000"
     },
-    "dark": {
+    /*"dark": {
         "background": "Black.jpg",
         "header": "#373A56",
         "sidebar": "#35435D",
         "dropdown": "#373A56", 
-        "adminButtons": "#63667E",
         "funcButton": "#5D75A2",
         "statusIcons": "#33ADFF",
         "highlightText": "#FF1A1A",
@@ -27,6 +25,54 @@ themeColors =  {
         "calendar": "#000",
         //30313B
         "text": "#F6F6F6" 
+    },*/
+    /*"dark": {
+       "background": "RedBlack.png",
+        "header": "#302c36",
+        "sidebar": "#327c5a",
+        "dropdown": "#cc3333", 
+        "statusIcons": "#327c5a",
+        "highlightText": "#c9fe62",
+        "cards": "#151313",
+        "classes":"#302c36",
+        "calendar": "#000",
+        "text": "#fcf0f0"  
+    },*/
+    /*"dark": {
+       "background": "Sea.png",
+        "header": "#1e926c",
+        "sidebar": "#3cb08a",
+        "dropdown": "#2ea96a", 
+        "statusIcons": "#61d9a3",
+        "highlightText": "#c9fe62",
+        "cards": "#1c564f",
+        "classes":"#2567a1",
+        "calendar": "#000",
+        "text": "#fcf0f0"  
+    },*/
+    /*"dark": {
+       "background": "Earth.png",
+        "header": "#dea743",
+        "sidebar": "#6d9957",
+        "dropdown": "#89bb52", 
+        "statusIcons": "#91ee61",
+        "highlightText": "#b9f643",
+        "cards": "#496234",
+        "classes":"#c18311",
+        "calendar": "#000",
+        "text": "#fcf0f0"  
+    },*/
+    "dark": {
+       "background": "NeonBlue.png",
+        "header": "#1d1c23",
+        "sidebar": "#312e32",
+        "dropdown": "#2e312b", 
+        "statusIcons": "#70e6e6",
+        "highlightText": "#70e6e6",
+        "cards": "#1f212f",
+        "classes":"#1faab1",
+        "calendar": "#000",
+        "text": "#fcf0f0"  
     }
 };
 

From 73d14137cdb5bb877c63b6cafeb7329ec4013663 Mon Sep 17 00:00:00 2001
From: Kenneth Jao <ksjdragon@gmail.com>
Date: Tue, 27 Sep 2016 00:26:29 -0400
Subject: [PATCH 3/4] Fix merge

---
 hourglass/client/profile/profile.js | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/hourglass/client/profile/profile.js b/hourglass/client/profile/profile.js
index 7b5cb9c..b115900 100644
--- a/hourglass/client/profile/profile.js
+++ b/hourglass/client/profile/profile.js
@@ -76,12 +76,7 @@ Template.profile.helpers({
         return Session.get("user").name;
     },
     motd() { // Returns the current user's description
-<<<<<<< HEAD
         if (Session.get("user").description !== undefined && Session.get("user").description !== null) return Session.get("user").description;
-=======
-        console.log(Session.get("user").description);
-        if (Session.get("user").description !== "") return Session.get("user").description;
->>>>>>> cc52ddc64bbeef3b2cf95c446e19577866096196
         return "Say something about yourself!";
     },
     school() { // Returns the current user's school's name

From c9ad662b36218f72a498407c87034cbb01bb9429 Mon Sep 17 00:00:00 2001
From: Kenneth Jao <ksjdragon@gmail.com>
Date: Tue, 27 Sep 2016 12:04:40 -0400
Subject: [PATCH 4/4] renamed theme colors

---
 hourglass/client/main/main.html       |  64 ++++++++--------
 hourglass/client/main/main.js         |   4 +-
 hourglass/client/profile/profile.html |  58 +++++++-------
 hourglass/client/profile/profile.js   |   2 +-
 hourglass/lib/constants.js            | 105 ++++++++++++--------------
 5 files changed, 112 insertions(+), 121 deletions(-)

diff --git a/hourglass/client/main/main.html b/hourglass/client/main/main.html
index fc3e14c..3272968 100644
--- a/hourglass/client/main/main.html
+++ b/hourglass/client/main/main.html
@@ -5,16 +5,16 @@
 
 <template name="main">
     <div class="noScroll">
-        <header id="mainHeader" style="background-color:{{userProfile}}{{divColor 'header'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
+        <header id="mainHeader" style="background-color:{{userProfile}}{{divColor 'mainColor'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
             <i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i>
             <h1>Hourglass</h1><h2>{{schoolName}}</h2>
             <i class="fa fa-cog" aria-hidden="true" style="color:{{iconColor 'options'}}"></i>
             <div id="dropdown">
                 <img src="{{avatar}}">
             </div>
-            <div id="headerBar" style="background-color:{{divColor 'statusIcons'}}"></div>
+            <div id="headerBar" style="background-color:{{divColor 'iconHighlight'}}"></div>
         </header>
-        <div id="menuContainer" style="left:{{menuStatus}};background-color:{{divColor 'sidebar'}}">
+        <div id="menuContainer" style="left:{{menuStatus}};background-color:{{divColor 'sidebarColor'}}">
             <div id="modes">
                 <div class="mode classes">
                     <i class="fa fa-university" aria-hidden="true"></i>
@@ -59,7 +59,7 @@
                 <h4 id="exportText">Export</h4>
             </div>
         </div>
-        <div id="optionsContainer" style="right:{{optionsStatus}};background-color:{{divColor 'sidebar'}}">
+        <div id="optionsContainer" style="right:{{optionsStatus}};background-color:{{divColor 'sidebarColor'}}">
             <h3>Preferences</h3>
 
             <div id="prefCont">
@@ -69,8 +69,8 @@
                     <span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
                     </div>
                     <div class="prefOptions">
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Light</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Dark</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Light</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Dark</p>
                     </div>
                 </div>
                 <div>
@@ -79,8 +79,8 @@
                     <span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
                     </div>
                     <div class="prefOptions">
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Classes</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Calendar</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Classes</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Calendar</p>
                     </div>
                 </div>
                 <div>
@@ -89,11 +89,11 @@
                     <span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
                     </div>
                     <div class="prefOptions">
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Day</p>
-                        <P class="prefOptionText"  style="background-color:{{divColor 'header'}}">2 Days</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Week</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">1 Month</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Never</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">1 Day</p>
+                        <P class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">2 Days</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">1 Week</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">1 Month</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Never</p>
                     </div>
                 </div>
                 <div>
@@ -102,8 +102,8 @@
                     <span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
                     </div>
                     <div class="prefOptions">
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">No</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Yes</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">No</p>
                     </div>
                 </div>
                 <div>
@@ -112,8 +112,8 @@
                     <span class="change radio" re="readonly" id="prefReport">{{pref 'hideReport'}}</span>
                     </div>
                     <div class="prefOptions">
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
-                        <p class="prefOptionText"  style="background-color:{{divColor 'header'}}">No</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">Yes</p>
+                        <p class="prefOptionText"  style="background-color:{{divColor 'mainColor'}}">No</p>
                     </div>
                 </div>
             </div>
@@ -137,7 +137,7 @@
 
         <div class="overlay">
             <div id="editWork" style="width:{{screen '.4'}}">
-                <div id="editWorkCont" style="background-color:{{divColor 'header'}};border-top:10px solid {{work 'typeColor'}}">
+                <div id="editWorkCont" style="background-color:{{divColor 'mainColor'}};border-top:10px solid {{work 'typeColor'}}">
                     <div id="workInfoContainer">
                         <div id="workNameDiv">
                             <span id="workNamerestrict">{{commentLength}}</span>
@@ -159,11 +159,11 @@
                                 <span class="change radio req" re="readonly" id="workType">{{work 'type'}}</span>
                                 </div>
                                 <div class="workOptions type">
-                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Normal</p>
-                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Quiz</p>
-                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Test</p>
-                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Project</p>
-                                    <p class="workOptionText"  style="background-color:{{divColor 'header'}}">Other</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'mainColor'}}">Normal</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'mainColor'}}">Quiz</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'mainColor'}}">Test</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'mainColor'}}">Project</p>
+                                    <p class="workOptionText"  style="background-color:{{divColor 'mainColor'}}">Other</p>
                                 </div>
                             </div>
                             <!-- <div id="workAttach">Attach other files</div>
@@ -233,13 +233,13 @@
             </div>
         </div>
 
-        <div id="userDropdown" style="background-color:{{divColor 'dropdown'}}">
-            <div id="userTab" style="border-bottom: 3vh solid {{divColor 'dropdown'}}"></div>
-            <div id="userDropdownAvatar" style="background-color:{{divColor 'dropdown'}}">
+        <div id="userDropdown" style="background-color:{{divColor 'userDropdownColor'}}">
+            <div id="userTab" style="border-bottom: 3vh solid {{divColor 'userDropdownColor'}}"></div>
+            <div id="userDropdownAvatar" style="background-color:{{divColor 'userDropdownColor'}}">
                 <img src="{{avatar}}">
                 <p>{{username}}</p>
             </div>
-            <div id="userFunctions" style="background-color:{{divColor 'dropdown'}}">
+            <div id="userFunctions" style="background-color:{{divColor 'userDropdownColor'}}">
                 <div id="myprofile" class="userFunction" onclick="window.location='/profile';">
                     <i class="fa fa-user" aria-hidden="true"></i>
                     <p>My Profile</p>
@@ -251,7 +251,7 @@
                     </div>
                 {{/if}}
             </div>
-            <div style="background-color:{{divColor 'dropdown'}}">
+            <div style="background-color:{{divColor 'userDropdownColor'}}">
                 <div id="myprofile" class="userFunction" onclick="document.getElementById('login-buttons-logout').click();">
                     <i class="fa fa-sign-out" aria-hidden="true"></i>
                     <p>Sign out</p>
@@ -259,13 +259,13 @@
             </div>
         </div>
 
-        <div id="requests" style="bottom:{{requestStatus}};background-color:{{divColor 'cards'}}">
-            <div id="requestTab" style="background-color:{{divColor 'cards'}}">
+        <div id="requests" style="bottom:{{requestStatus}};background-color:{{divColor 'secondaryColor'}}">
+            <div id="requestTab" style="background-color:{{divColor 'secondaryColor'}}">
                 <i class="fa fa-question" aria-hidden="true"></i>
             </div>
             <p>Send an help request, feature, or bug report.</p>
             <textarea id="requestArea" class="restrict" rows="4" cols="50" maxlength="500" placeholder="Enter request here..."></textarea><br>
-            <div id="requestCont" style="background-color:{{divColor 'cards'}}">
+            <div id="requestCont" style="background-color:{{divColor 'secondaryColor'}}">
                 <span id="requestrestrict">{{commentLength}}</span>
                 <div id="requestSubmit">Send</div>
             </div>
@@ -290,7 +290,7 @@
 
 <template name="classesMode">
     <div class="classWrapper">
-        <div class="mainClass" style="background-color:{{divColor 'classes'}}">
+        <div class="mainClass" style="background-color:{{divColor 'classCardColor'}}">
             <div class="classInfo"> <!-- class color -->
                 <h3 class="mainClassName">{{name}}</h3>
                 <p class="mainClassHour">{{hour}}</p>
diff --git a/hourglass/client/main/main.js b/hourglass/client/main/main.js
index eee8b1d..9c4f8ee 100644
--- a/hourglass/client/main/main.js
+++ b/hourglass/client/main/main.js
@@ -92,7 +92,7 @@ Template.registerHelper('divColor', (div) => { // Reactive color changing based
 });
 
 Template.registerHelper('textColor', () => { // Reactive color for text.
-    document.getElementsByTagName("body")[0].style.color = themeColors[Session.get("user").preferences.theme].text;
+    document.getElementsByTagName("body")[0].style.color = themeColors[Session.get("user").preferences.theme].textColor;
     return;
 });
 
@@ -310,7 +310,7 @@ Template.main.helpers({
     },
     modeStatus(status) { // Color status of display modes.
         if (!Session.equals("mode",status)) return;
-        return themeColors[Session.get("user").preferences.theme].highlightText;
+        return themeColors[Session.get("user").preferences.theme].modeHighlight;
     },
     currMode(name) { // Status of display mode.
         return Session.equals("mode",name);
diff --git a/hourglass/client/profile/profile.html b/hourglass/client/profile/profile.html
index 2668852..59a408d 100644
--- a/hourglass/client/profile/profile.html
+++ b/hourglass/client/profile/profile.html
@@ -3,7 +3,7 @@
 		<div id="mainpage{{userProfile}}" onclick="window.location='/'"><h2>Main Page</h2></div>
 		<div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div>
 		<div id="profWrapper">
-			<div id="profPage" style="background-color:{{divColor 'header'}};min-width:{{screen}}{{textColor}}{{loadNew}}">
+			<div id="profPage" style="background-color:{{divColor 'mainColor'}};min-width:{{screen}}{{textColor}}{{loadNew}}">
 				<div id="profMainContainer">
 					<div id="profTop">
 						<img id="profBanner" src='{{banner}}' alt="Banner">
@@ -17,7 +17,7 @@
 					<div id="profCards">
 						<div id="cardColLeft">
 							<!-- Card 1 -->
-							<div id="profInfo" class="card" style="background-color:{{divColor 'cards'}}">
+							<div id="profInfo" class="card" style="background-color:{{divColor 'secondaryColor'}}">
 								<h3 class="profHea">About</h3>
 								<div id="about">
 									<div>
@@ -31,16 +31,16 @@
 										<span class="change radio" re="readonly" id="grade">{{grade}}</span>
 										</div>
 							            <div class="profOptions">
-						                  	<p class="profOptionText"  style="background-color:{{divColor 'header'}}">9th</p>
-							                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">10th</p>
-							                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">11th</p>
-							                <p class="profOptionText"  style="background-color:{{divColor 'header'}}">12th</p>
+						                  	<p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">9th</p>
+							                <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">10th</p>
+							                <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">11th</p>
+							                <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">12th</p>
 							            </div>
 						            </div>
 						        </div>
 							</div>
 							<!-- Card 2 -->
-							<div id="profPreferences" class="card" style="background-color:{{divColor 'cards'}}">
+							<div id="profPreferences" class="card" style="background-color:{{divColor 'secondaryColor'}}">
 								<h3 class="profHea">Preferences</h3>
 								<div id="preferences">
 						            <div class="radioContainer">
@@ -49,8 +49,8 @@
 						                <span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
 						                </div>
 						                <div class="profOptions">
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Light</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Dark</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Light</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Dark</p>
 						                </div>
 						            </div>
 						            <br>
@@ -60,8 +60,8 @@
 						                <span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
 						                </div>
 						                <div class="profOptions">
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Classes</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Calendar</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Classes</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Calendar</p>
 						                </div>
 						            </div>
 						            <br>
@@ -71,11 +71,11 @@
 						                <span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
 						                </div>
 						                <div class="profOptions">
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Day</p>
-						                    <P class="profOptionText"  style="background-color:{{divColor 'header'}}">2 Days</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Week</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">1 Month</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Never</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">1 Day</p>
+						                    <P class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">2 Days</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">1 Week</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">1 Month</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Never</p>
 						                </div>
 						            </div>
 						            <br>
@@ -85,8 +85,8 @@
 						                <span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
 						                </div>
 						                <div class="profOptions">
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">No</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Yes</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">No</p>
 						                </div>
 						            </div>
 						            <br>
@@ -96,8 +96,8 @@
 						                <span class="change radio" re="readonly" id="prefReport">{{pref 'hideReport'}}</span>
 						                </div>
 						                <div class="profOptions">
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">Yes</p>
-						                    <p class="profOptionText"  style="background-color:{{divColor 'header'}}">No</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">Yes</p>
+						                    <p class="profOptionText"  style="background-color:{{divColor 'mainColor'}}">No</p>
 						                </div>
 						            </div>
 						        </div>
@@ -105,7 +105,7 @@
 						</div>
 						<div id="cardColRight">
 							<!-- Card 3 -->
-							<div id="profClasses" class="card" style="background-color:{{divColor 'cards'}};">
+							<div id="profClasses" class="card" style="background-color:{{divColor 'secondaryColor'}};">
 								<h3 class="profHea">Classes</h3>
 								<div id="classes">
 									<div id="profFunctions">
@@ -195,17 +195,17 @@
 									            <p class="profTitle">Privacy:</p>
 								              	<input class="creInput radio op" type="text" name="privacy" readonly>
 								              	<div class="profOptions creOp">
-								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Public</p>
-								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Private</p>
+								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'mainColor'}}">Public</p>
+								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'mainColor'}}">Private</p>
 								              	</div>
 							              	</div>
 							              	<div class="formDiv">
 									            <p class="profTitle">Category:</p>
 								              	<input class="creInput radio op" type="text" name="category" readonly>
 								              	<div class="profOptions creOp">
-								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Class</p>
-								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Club</p>
-								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'header'}}">Other</p>
+								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'mainColor'}}">Class</p>
+								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'mainColor'}}">Club</p>
+								                  	<p class="profOptionText cre"  style="background-color:{{divColor 'mainColor'}}">Other</p>
 								              	</div>
 									        </div>
 								        </div>
@@ -220,7 +220,7 @@
 			</div>
 		</div>
 		<div class="overlay">
-		    <div class="overlayCont" style="background-color:{{divColor 'header'}}">
+		    <div class="overlayCont" style="background-color:{{divColor 'mainColor'}}">
 		     	<p>{{confirmText}}</p>
 		     	<div id="faCont">
 		     		<i class="fa fa-check-circle-o" aria-hidden="true"></i>
@@ -229,7 +229,7 @@
 		    </div>
 	  	</div>
 
-	  	<div id="createdClasses" style="background-color:{{divColor 'cards'}};right:{{ownedStatus}}" classid="{{selectedClass '_id'}}">
+	  	<div id="createdClasses" style="background-color:{{divColor 'secondaryColor'}};right:{{ownedStatus}}" classid="{{selectedClass '_id'}}">
 	  		<h3>{{selectedClass 'name'}}</h3>
 	  		<h4 id="codetext">Code:</h4>
 	  		<input id="code" value="{{selectedClass 'code'}}" type="text" readonly>
@@ -266,7 +266,7 @@
 	  		<div id="deleteClass">Delete Class</div>
 	  	</div>
 
-	  	<div id="joinPrivClass" style="background-color:{{divColor 'cards'}};bottom:{{privStatus}}">
+	  	<div id="joinPrivClass" style="background-color:{{divColor 'secondaryColor'}};bottom:{{privStatus}}">
 	  		<h3>Enter Code:</h3>
 	  		<input id="privateCode" type="text" placeholder="Enter code here...">
 	  		<h4 id="privSubmit">Submit</h4>
diff --git a/hourglass/client/profile/profile.js b/hourglass/client/profile/profile.js
index b115900..7da7ca7 100644
--- a/hourglass/client/profile/profile.js
+++ b/hourglass/client/profile/profile.js
@@ -118,7 +118,7 @@ Template.profile.helpers({
     },
     profClassTabColor(status) { // Change this [Supposed to show the current mode that's selected via color]    
         if (Session.equals("profClassTab",status)) {            
-            return themeColors[Meteor.user().profile.preferences.theme].highlightText;        
+            return themeColors[Meteor.user().profile.preferences.theme].modeHighlight;        
         } else {            
             return;        
         }    
diff --git a/hourglass/lib/constants.js b/hourglass/lib/constants.js
index 7b623a3..24987af 100644
--- a/hourglass/lib/constants.js
+++ b/hourglass/lib/constants.js
@@ -1,78 +1,69 @@
 themeColors =  {
     "light": {
         "background": "White.jpg",
-        "header": "#EBEBEB",
-        "sidebar": "#65839A",
-        "dropdown": "#E6E6E6",
-        "funcButton": "#849CAE",
-        "statusIcons": "#33ADFF",
-        "highlightText": "#FF1A1A",
-        "cards": "#FEFEFE",
-        "classes":"#EBEBEB",
-        "calendar": "#000",
-        "text": "#000"
+        "mainColor": "#EBEBEB",
+        "secondaryColor": "#FEFEFE",
+        "sidebarColor": "#65839A",
+        "userDropdownColor": "#E6E6E6",
+        "iconHighlight": "#33ADFF",
+        "modeHighlight": "#FF1A1A",
+        "classCardColor":"#EBEBEB",
+        "textColor": "#000"
     },
     /*"dark": {
         "background": "Black.jpg",
-        "header": "#373A56",
-        "sidebar": "#35435D",
-        "dropdown": "#373A56", 
-        "funcButton": "#5D75A2",
-        "statusIcons": "#33ADFF",
-        "highlightText": "#FF1A1A",
-        "cards": "#151A2B",
-        "classes":"#46396E",
-        "calendar": "#000",
-        //30313B
-        "text": "#F6F6F6" 
+        "mainColor": "#373A56",
+        "secondaryColor": "#151A2B",
+        "sidebarColor": "#35435D",
+        "userDropdownColor": "#373A56", 
+        "iconHighlight": "#33ADFF",
+        "modeHighlight": "#FF1A1A",
+        "classCardColor":"#46396E",
+        "textColor": "#F6F6F6" 
     },*/
     /*"dark": {
        "background": "RedBlack.png",
-        "header": "#302c36",
-        "sidebar": "#327c5a",
-        "dropdown": "#cc3333", 
-        "statusIcons": "#327c5a",
-        "highlightText": "#c9fe62",
-        "cards": "#151313",
-        "classes":"#302c36",
-        "calendar": "#000",
-        "text": "#fcf0f0"  
+        "mainColor": "#302c36",
+        "secondaryColor": "#151313",
+        "sidebarColor": "#327c5a",
+        "userDropdownColor": "#cc3333", 
+        "iconHighlight": "#327c5a",
+        "modeHighlight": "#c9fe62",
+        "classCardColor":"#302c36",
+        "textColor": "#fcf0f0"  
     },*/
     /*"dark": {
        "background": "Sea.png",
-        "header": "#1e926c",
-        "sidebar": "#3cb08a",
-        "dropdown": "#2ea96a", 
-        "statusIcons": "#61d9a3",
-        "highlightText": "#c9fe62",
-        "cards": "#1c564f",
-        "classes":"#2567a1",
-        "calendar": "#000",
-        "text": "#fcf0f0"  
+        "mainColor": "#1e926c",
+        "secondaryColor": "#1c564f",
+        "sidebarColor": "#3cb08a",
+        "userDropdownColor": "#2ea96a", 
+        "iconHighlight": "#61d9a3",
+        "modeHighlight": "#c9fe62",
+        "classCardColor":"#2567a1",
+        "textColor": "#fcf0f0"  
     },*/
     /*"dark": {
        "background": "Earth.png",
-        "header": "#dea743",
-        "sidebar": "#6d9957",
-        "dropdown": "#89bb52", 
-        "statusIcons": "#91ee61",
-        "highlightText": "#b9f643",
-        "cards": "#496234",
-        "classes":"#c18311",
-        "calendar": "#000",
-        "text": "#fcf0f0"  
+        "mainColor": "#dea743",
+        "secondaryColor": "#496234",
+        "sidebarColor": "#6d9957",
+        "userDropdownColor": "#89bb52", 
+        "iconHighlight": "#91ee61",
+        "modeHighlight": "#b9f643",
+        "classCardColor":"#c18311",
+        "textColor": "#fcf0f0"  
     },*/
     "dark": {
        "background": "NeonBlue.png",
-        "header": "#1d1c23",
-        "sidebar": "#312e32",
-        "dropdown": "#2e312b", 
-        "statusIcons": "#70e6e6",
-        "highlightText": "#70e6e6",
-        "cards": "#1f212f",
-        "classes":"#1faab1",
-        "calendar": "#000",
-        "text": "#fcf0f0"  
+        "mainColor": "#1d1c23",
+        "secondaryColor": "#1f212f",
+        "sidebarColor": "#312e32",
+        "userDropdownColor": "#2e312b", 
+        "iconHighlight": "#70e6e6",
+        "modeHighlight": "#70e6e6",
+        "classCardColor":"#1faab1",
+        "textColor": "#fcf0f0"  
     }
 };