added main.css with support for local playback

... as it has been missed in cd933addf7d09132ad4596de9b357337e007ee56
2017-08-04 13:13:35 +02:00 · 2017-08-04 13:13:35 +02:00 · fa9a8de0eb
commit fa9a8de0eb
parent cd933addf7
1 changed files with 141 additions and 0 deletions
--- a/static/main.css
+++ b/static/main.css
@ -1 +1,142 @@
+html, body {
+	margin: 0;
+}
+
+html {
+	font-family: Helvetica, "Open Sans", sans-serif;
+}
+
+body {
+	background-color: #333;
+	color: #eee;
+}
+
+a {
+	text-decoration: none;
+}
+
+h1 {
+	text-align: center;
+}
+
+form {
+	text-align: center;
+	display: inline;
+}
+
+input, button {
+	background-color: #666;
+	border: 1px solid #999;
+	border-radius: 5px;
+	color: #eee;
+	margin: 0;
+	padding: 5px;
+	vertical-align: middle;
+}
+
+button {
+	margin: 5px;
+}
+
+button:hover {
+        background-color: #999;
+        border: 1px solid #666;
+}
+
+button:active {
+        background-color: #999;
+        border: 1px solid #666;	
+	color: #000;
+}
+
+label {
+	vertical-align: middle;
+}
+
+nav {
+	text-align: center;
+	margin: 1em;
+}
+
+nav a {
+	background-color: #eee;
+	border: 1px solid #000;
+	border-radius: 5px;
+	color: #333;
+	display: inline-block;
+	padding: 1em;
+}
+
+content {
+	position: absolute;
+	width: 100%;
+}
+
+section {
+	position: absolute;
+	left: 0;
+	text-align: center;
+	top: 0;
+	width: 100%;
+}
+
+div #reset {
+	font-size: 2em;
+	padding-left: 5px;
+	display: inline;
+	vertical-align: middle;
+}
+
+div #reset:hover {
+	cursor: pointer;
+}
+
+.sound {
+	display: inline-block;
+}
+
+.sound a {
+	background-color: #ff4136;
+	border: 1px solid #000;
+	border-radius: 50px;
+	box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.6);
+	color: #eee;
+	display: inline-block;
+	font-size: 0.6em;
+	height: 100px;
+	line-height: 100px;
+	margin: 10px;
+	overflow: hidden;
+	text-align: center;
+	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
+	width: 100px;
+}
+
+.sound a:hover {
+	cursor: pointer;
+}
+
+.sound a:active {
+        background-color: #ff4136;
+        box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.6);
+	cursor: pointer;
+}
+
+.sound-pressed {
+        background-color: #ff4136 !important;
+        box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.6) !important;
+}
+
+.unselectable {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+#local-mode-button .local {
+	color: red;
+}