clean up the css just a little bit

chee · May 24, 2014 · 29c8134 · 29c8134
1 parent 12b8709
commit 29c8134
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 23 deletions.
diff --git a/css/style.css b/css/style.css
@@ -13,14 +13,14 @@ body {
 	text-align: center;
 }
 
-#video,
-#effects,
-.show-effects #output {
+.video,
+.effects,
+.show-effects .output {
 	display: none;
 }
 
-#output,
-.show-effects #effects {
+.output,
+.show-effects .effects {
 	display: block;
 }
 
@@ -64,9 +64,8 @@ body {
 .photographs {
 	line-height: 100px;
 	height: 117px;
-	border-top:    1px solid #fff;
+	border-top: 1px solid #fff;
 	border-bottom: 1px solid #fff;
-	background: #e7e7e7;
 	white-space: nowrap;
 	overflow-x: scroll;
 }
@@ -143,8 +142,8 @@ body {
 
 .metadata {
 	text-align: center;
-	height: 25px;
-	line-height: 25px;
+	height: 50px;
+	line-height: 38px;
 	border-top: 1px solid #666;
 	color: #666;
 	font-size: 14px;
@@ -157,7 +156,7 @@ body {
 	background: white;
 }
 
-#effects {
+.effects {
 	overflow: auto;
 	text-align: center;
 	background: #345;
@@ -210,4 +209,4 @@ button:active,
 	background-image: linear-gradient( to bottom, #333, #666 );
 	box-shadow: inset 0 4px 8px rgba( 0, 0, 0, 0.4 );
 	text-shadow: -1px 1px #555;
-}
+}
diff --git a/html/index.html b/html/index.html
@@ -1,18 +1,14 @@
 <!doctype html>
 <title>Futupuri</title>
-<style>@import url( '../css/style.css' );</style>
+<link rel="stylesheet" href="../css/style.css">
 
-<video class="main-panel" autoplay id="video"></video>
-<canvas class="main-panel" id="output" width="640" height="480"></canvas>
-<div class="main-panel" id="effects"></div>
-
-<audio hidden="hidden" id="camera-shutter">
-	 <!--
-	 camera-shutter.ogg is licensed CC BY 3.0.
-	 Attribution goes to Jormarp http://www.freesound.org/people/Jormarp/sounds/142638/
-	 -->
-	<source src="../audio/camera-shutter.ogg" />
+<audio hidden="hidden" id="camera-shutter" src="../audio/camera-shutter.ogg">
+	camera-shutter.ogg is licensed CC BY 3.0.
+	Attribution goes to Jormarp http://www.freesound.org/people/Jormarp/sounds/142638/
 </audio>
+<video class="main-panel video" autoplay id="js-video"></video>
+<canvas class="main-panel output" id="js-output" width="640" height="480"></canvas>
+<div class="main-panel effects" id="js-effects"></div>
 
 <div class="controls">
 	<div></div
@@ -24,7 +20,7 @@
 </div>
 
 <footer class="metadata">
-	<span class="photo-value">0</span> photos !
+	<span class="photo-value">0</span> photos
 </footer>
 
 <article id="templates">