Logo and end screen

diversify · Nov 23, 2014 · a57b2ee · a57b2ee
1 parent 747e6a6
commit a57b2ee
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 8 deletions.
diff --git a/app/partials/game.html b/app/partials/game.html
@@ -1,6 +1,6 @@
 
 
-<div id="game-header"><h2><a href="/">BACK</a></div>
+<div id="game-header"><h2><a href="/"><img src="content/image/logo.png" alt="logo" id="logo" /> <h2>Saturn</h2></a></div>
 <!-- <input type="button" value = "Add Song" ng&#45;click="addSong()"> -->
 <div class="rings-in-back"></div>
 <div class="rings-in-front"></div>

diff --git a/app/partials/start.html b/app/partials/start.html
@@ -1,6 +1,6 @@
 <div id="start">
 	<img src="content/image/logo.png" alt="logo" id="logo" />
-	<h1>SATURN</h1>
+	<h1>Saturn</h1>
 
 	<p>Expand your music collection and <br>guess when music was made!</p>
 	<a href="/game"><button>Play!</button></a>

diff --git a/app/partials/win.html b/app/partials/win.html
@@ -0,0 +1,6 @@
+<div id="win">
+	<img src="content/image/logo.png" alt="logo" id="logo" />
+
+	<h2>YOU WON!</h2>
+	<p>Hope you had fun! Here are all the songs:</p>
+</div>
diff --git a/content/style.css b/content/style.css
@@ -69,7 +69,20 @@ label {
 #game-header {
     background: #eee;
     width: 100%;
-    padding: 25px;
+    padding: 5px 15px;
+}
+
+#game-header #logo {
+    height: 60px;
+    display: inline-block;
+    vertical-align: middle;
+}
+
+#game-header h2 {
+    display: inline-block;
+    vertical-align: middle;
+    font-size: 34px;
+    padding-left: 10px;
 }
 
 .caret-down {
@@ -109,7 +122,7 @@ label {
     border-radius: 50% 50% 0 0;
     -moz-border-radius: 50% 50% 0 0;
     -webkit-border-radius: 50% 50% 0 0;
-    border-top: 4px solid #ff9000;
+    border-top: 8px solid #ff9000;
     margin: auto;
     position: relative;
     top: 177px;
@@ -125,7 +138,7 @@ label {
     border-radius: 50% 50%;
     -moz-border-radius: 50% 50%;
     -webkit-border-radius: 50% 50%;
-    border-bottom: 4px solid #ff9000;
+    border-bottom: 8px solid #ff9000;
     margin: auto;
     margin-bottom: -40px;
     position: relative;
@@ -161,7 +174,7 @@ label {
 }
 
 .title {
-    font-size: 24px;
+    font-size: 24px !important;
     font-weight: bold;
 }
 
@@ -216,10 +229,11 @@ label {
     margin-left: -200px;
     top: 380px;
     text-align: center;
+    font-size: 16px;
 }
 
 #song-details h2 {
-    font-size: 24px;
+    font-size: 18px;
 }
 
 #current-song-circle, .song-circle {
@@ -316,7 +330,7 @@ label {
     padding-bottom: 45px;
 }
 
-#start #logo {
+#start #logo, #win #logo {
     width: 250px;
     margin-bottom: 25px;
 }