Add gamecard to top right of screen

YorkshireKev · Aug 3, 2015 · d3b346c · d3b346c
1 parent b1f95a4
commit d3b346c
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 4 deletions.
diff --git a/assets/gamecard.xcf b/assets/gamecard.xcf
diff --git a/css/style.css b/css/style.css
@@ -0,0 +1,45 @@
+body {
+	margin: 0;
+	font-family: Monospace;
+	color: #555555;
+	margin: 0;
+	overflow: hidden;
+}
+
+/* unvisited link */
+a {
+  color: #5555FF;
+}
+
+canvas {
+	width: 100%;
+	height: 100%
+}
+
+#info {
+	text-align: center;
+	padding: 10px;
+	z-index: 20;
+  width: 100%;
+  position: absolute;
+}
+
+.gamecard {
+	text-align: left;
+	right: 0;
+	opacity: 0.8;
+	padding: 0;
+	z-index: 10;
+  width: 200px;
+  height: 170px;
+  position: absolute;
+  background-image: url("../images/gamecard.png");
+  background-repeat: no-repeat;
+}
+
+h2 {
+	background-color: #E8DFE0;
+	color: black;
+	font-size: 15px;
+	margin-top: 140px;
+}
diff --git a/images/gamecard.png b/images/gamecard.png
diff --git a/index.html b/index.html
@@ -1,12 +1,18 @@
 <html>
   <head meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 	<title>Virual Slot Machine by YorkshireKev</title>
-	<style>
-      body { margin: 0; }
-      canvas { width: 100%; height: 100% }
-    </style>
+	<link href="css/style.css" rel="stylesheet">
   </head>
   <body>
+    <div id="info">Virual Slot Machine - MIT Open Source License (c)2015 Kevin Ellis<br/>
+      <a href="http://www.kevssite.com">www.kevssite.com</a> | <a href="#">Source Code</a><br/>
+    </div>
+    <div class="gamecard">
+      <h2>
+        Credits Played: 10
+        Credits Won: 0
+      </h2>
+    </div>
 	<script type="text/javascript" src="js/three.js"></script>
     <script type="text/javascript" src="js/stats.min.js"></script>
     <script type="text/javascript" src="js/orbit.js"></script>