joshua/beats-website
Archived
1
Fork 0
Code Activity

Fixed the style a bit

Browse source
This commit is contained in:
Joshua Moerman 2013-04-16 13:53:49 +02:00
parent 72c6e7b476
commit 6f0f557bc6
2 changed files with 27 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
index.css
View file

@ -1,7 +1,8 @@
/* General */ /* General */
body { body {
color: #888; font-family: Georgia, serif;
background: #000; color: #999;
background: #333;
font-size: 16pt; font-size: 16pt;
margin: 0px; margin: 0px;
overflow: hidden; overflow: hidden;
@ -19,36 +20,43 @@ a {
/* Login */ /* Login */
.modalDialog { .modalDialog {
position: fixed; position: fixed;
font-family: Arial, Helvetica, sans-serif;
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
background: rgba(0,0,0,0.8); background: rgba(0,0,0,0.5);
z-index: 99999; z-index: 99999;
opacity:1;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
} }
.modalDialog > div { .modalDialog > div {
text-align: center; text-align: center;
width: 300px; width: 300px;
position: relative; position: relative;
margin: 10% auto; margin: 40px auto;
padding: 5px 20px 13px 20px; padding: 5px 20px 13px 20px;
border-radius: 10px; border-radius: 10px;
background: #fff; background: #fff;
} }
/* App */
#app {
position: absolute;
width: 1000px;
height: 600px;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
}
/* BALLS */ /* BALLS */
#ballscreen { #ballscreen {
position: absolute; position: absolute;
background-color: rgba(0.0, 0.0, 0.0, 0.0); background-color: rgba(0.0, 0.0, 0.0, 0.0);
width: 1000px; left: 0;
height: 600px; right: 0;
border: 1px solid black; top: 0;
bottom: 0;
} }
.ball { .ball {
-webkit-transition: left 0.1s linear, top 0.1s linear; -webkit-transition: left 0.1s linear, top 0.1s linear;
@ -67,8 +75,10 @@ a {
/* LINES */ /* LINES */
#svgscreen { #svgscreen {
position: absolute; position: absolute;
width: 1000px; left: 0;
height: 600px; right: 0;
top: 0;
bottom: 0;
} }
#svgscreen line.guitar { #svgscreen line.guitar {
stroke: rgb(255,127,0); stroke: rgb(255,127,0);

6
index.html
View file

@ -29,14 +29,14 @@
<div id="app"> <div id="app">
<svg id="svgscreen" xmlns="http://www.w3.org/2000/svg" version="1.1"> <svg id="svgscreen" xmlns="http://www.w3.org/2000/svg" version="1.1">
<rect width="100%" height="100%" style="fill:rgb(255, 255, 255); opacity:0.1; stroke-width:1; stroke:rgb(0,0,0)"/> <rect width="100%" height="100%" style="fill:rgb(0, 0, 0);"/>
</svg> </svg>
<div id="ballscreen"></div> <div id="ballscreen"></div>
<div id="text"> <div id="text">
(<span id="status">provide your name</span>) <a onClick="changeKind();" href="#">Change line kind (to <span id="line_kind">guitar</span>)</a><br/>
<a onClick="changeKind();" href="#">Change line kind (to <span id="line_kind">guitar</span>)</a> <span id="status"></span>
</div> </div>
</div> </div>