Beginning to build out the orthographic renderer, and updated styles

1 files changed, 21 insertions, 24 deletions

diff --git a/frontend/index.css b/frontend/index.css
index 9f23e96..03221de 100644
--- a/frontend/index.css
+++ b/frontend/index.css
@@ -1,14 +1,14 @@
 html {
-	width: 100vw;
 	background: #2f3032;
+	background: -webkit-radial-gradient(top, #383A56, #303133);
+	background: -moz-radial-gradient(top, #383A56, #303133);
+	background: radial-gradient(to bottom, #383A56, #303133);
 }
 
 body {
 	background: #2f3032;
 	min-height: calc(100vh - 64px);
-	background: -webkit-radial-gradient(top, #383A56, #303133);
-	background: -moz-radial-gradient(top, #383A56, #303133);
-	background: radial-gradient(to bottom, #383A56, #303133);
+	
     font-size: 16px;
     font-family: "Helvetica", sans-serif;
     line-height: 1.75rem;
@@ -20,12 +20,12 @@ body {
 	margin-top: 32px;
 	margin-bottom: 32px;
 	border-radius: 8px;
-	border: 1px solid #383A56;
+	border: 2px solid #383A56;
 	padding: 32px;
 }
 
 header {
-	border-bottom: 2px solid #2f3032;
+	border-bottom: 2px solid #383A56;
     padding-top: 1rem;
     padding-bottom: 1rem;
     font-size: 20px;
@@ -62,12 +62,12 @@ nav {
     min-width: 20%;
     max-width: 20%;
     margin-right: 5%;
-    height: 100%;
     display: flex;
     flex-direction: column;
     text-align: left;
     font-size: 1rem;
     user-select: none;
+	max-height: calc(100vh - 64px);
 }
 
 .outer-tree {
@@ -77,14 +77,14 @@ nav {
     margin: 0;
 }
 
+.outer-tree > li {
+	margin-bottom: 0.25rem;
+}
+
 .outer-tree > li > span {
     display: block;
     width: 100%;
-    cursor: pointer;
-}
-
-.outer-tree > li > span:hover {
-    color: #ede68a;
+	padding: 0.25rem;
 }
 
 .outer-tree > li > span > i {
@@ -92,35 +92,31 @@ nav {
     transition: 100ms ease-in-out transform;
 }
 
-.outer-tree li.expanded > span > i {
-    display: inline-block;
-    transform: rotate(180deg);
-}
-
 .outer-tree li > span > span {
     padding-left: 1rem;;
 }
 
 .inner-tree {
+	margin-left: 0.5rem;
     padding-left: 1rem;
-    display: none;
     list-style: none;
+	border-left: 1px solid white;
+}
+
+.inner-tree > li {
 }
 
 .inner-tree > li > label {
-    color: #ede68a;
+    color: white;
     font-weight: bold;
     text-align: center;
+	text-decoration: underline;
 }
 
 .inner-tree > li > a {
     margin-left: 0.5rem;
 }
 
-.outer-tree > li.expanded .inner-tree {
-    display: inherit;
-}
-
 nav a {
 	color: white;
 	text-decoration: none;
@@ -129,12 +125,13 @@ nav a {
 }
 
 nav a:hover {
-	color: #ede68a;
+	opacity: 0.8;
     cursor: pointer;
 }
 
 .nav-selected {
     font-weight: bold;
+	color: #ede68a;
 }
 
 .spin-loader {