PolicyChanges/policychanges
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

more ui

Browse Source
This commit is contained in:
PolicyChanges1@gmail.com 2021-02-28 13:54:03 -05:00
parent 5d263ecadf
commit 7f96fda082
2 changed files with 23 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
css/styles.css
View File

@ -22,8 +22,7 @@ body{
left:42%;
top:50%;
position: absolute;
background: #555;
background:rgba(1,1,1,.10);
background:rgba(0,0,0,0);
width:560px;
}
@ -31,7 +30,6 @@ body{
#scene{
height:100%;
position: absolute;
background: #2f2f2f;
left:210px;
background:rgba(1,1,1,.10);
}
@ -53,21 +51,19 @@ body{
height:200px;
width:200px;
margin:0 auto;
background: rgba(30,30,30,.70);
border: 1px solid black;
background: rgba(0,0,0,.40);
border: 1px solid DimGrey;
}
#leftInfo ul {padding:2%;}
#hold{
left:50px;
text-align:right;
left:55px;
position:relative;
width:80px;
height:435px;
background: #2f2f2f;
margin:10px auto;
background:rgba(0,0,0,.80);
height:400px;
margin:5px auto;
background:rgba(10,10,10,.40);
}
#gameOver{
@ -115,12 +111,10 @@ body{
#preview{
width:80px;
height:468px;
height:400px;
top:0px;
background: #ffffff;
margin:10px auto;
background:rgba(0,0,0,.80);
background:rgba(10,10,10,.40);
}

29
index.html
View File

@ -46,14 +46,13 @@
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/tdjyzz?gui=true&t=10&paused=false&muted=false" allowfullscreen></iframe> -->
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/3lVfDm?gui=true&t=10&paused=true&muted=false" allowfullscreen></iframe> -->
<iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/WldfWX?gui=&paused=false&muted=false" ></iframe>
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/WldfWX?gui=&paused=false&muted=false" ></iframe> -->
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/3sy3Wy?gui=true&t=10&paused=false&muted=false" ></iframe> -->
<!-- <iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/MlSSRt?gui=&paused=false&muted=false" allowfullscreen></iframe> -->
<iframe id="bg" width="640" height="360" frameborder="0" src="https://www.shadertoy.com/embed/MlSSRt?gui=&paused=false&muted=false" allowfullscreen></iframe>
<script>
document.getElementById("bg").width = window.innerWidth;
document.getElementById("bg").height = window.innerHeight;
//document.getElementById("bg").setAttribute("tabIndex", "-1");
//document.getElementById("divbg").setAttribute("tabIndex", "-1");
document.getElementById("bg").removeAttribute("tabIndex");
document.getElementById("divbg").removeAttribute("tabIndex");
</script>
@ -123,14 +122,14 @@ document.getElementById("divbg").removeAttribute("tabIndex");
</ul>
</div>
<canvas style="border: 1px solid #000;" id="hold"></canvas>
<canvas style="border: 1px solid DarkGrey;" id="hold"></canvas>
<br>
<br>
<input style="padding:1px;text-decoration:underline;overflow:visible;font-size:12px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;text-align:left;" type="button" id="Timer" value="Timer Off"/>
<input disabled=true style="padding:1px;overflow:visible;width:80px;font-size:12px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;text-align:left;" type="text" id="Time" value=""/>
<input style="padding:1px;text-decoration:underline;overflow:visible;font-size:12px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;text-align:left;" type="button" id="Timer" value="Timer Off"/>
<input disabled=true style="padding:1px;overflow:visible;width:80px;font-size:12px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="Time" value=""/>
<input disabled=true style="overflow:visible;width:40%;font-size:12px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="besttimetext" value="Best Time:"/>
<input disabled=true style="overflow:visible;width:80px;font-size:12px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="besttime" value=""/>
<input disabled=true style="overflow:visible;width:40%;font-size:12px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;text-align:left;" type="text" id="besttimetext" value="Best Time:"/>
<input disabled=true style="overflow:visible;width:80px;font-size:12px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;text-align:left;" type="text" id="besttime" value=""/>
</div>
<div id="gameOver">
@ -145,16 +144,16 @@ document.getElementById("divbg").removeAttribute("tabIndex");
<h2 id="scoreInfo">Score: <br><span id="score" >0</span></h2>
<!-- <h1 style="visibility:collapse;" id="linesInfo">Lines: <br><span id="lines" >0</span></h1> -->
<div style="visibility:collapse" id="rewardInfo" class="invisible">+<span id="reward">0</span></div>
<canvas style="border: 1px solid #000;" id="preview"></canvas>
<canvas style="border: 1px solid DarkGrey;" id="preview"></canvas>
<br>
<select style="width:80px;font-size:13px;background:rgba(0,0,0,.80);color:dodgerblue;border: 1px solid Black;text-align:left;" id="settings" name="setting">
<select style="width:80px;font-size:13px;background:rgba(40,40,40,.80);color:dodgerblue;border: 1px solid DarkGrey;text-align:left;" id="settings" name="setting">
<option selected="">Settings:</option>
</select>
<input style="width:80px;font-size:13px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;text-align:left;" type="text" id="setting_value">
<input style="width:80px;font-size:12px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;" id="submitsetting" type="submit" value="Set Setting"></input>
<input style="width:80px;font-size:12px;background:rgba(0,0,0,.80);color:dodgerblue;border:1px solid black;" id="test" type="submit" value="Test Yourself"></input>
<input style="width:80px;font-size:13px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;text-align:left;" type="text" id="setting_value">
<input style="width:80px;font-size:12px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;" id="submitsetting" type="submit" value="Set Setting"></input>
<input style="width:80px;font-size:12px;background:rgba(40,40,40,.80);color:dodgerblue;border:1px solid DarkGrey;" id="test" type="submit" value="Test Yourself"></input>
</div>