16mm
/
intval3
1
0
Fork 0
Code Issues 1 Pull Requests 9 Projects Releases Wiki Activity

Style the buttons and inputs to fill width of screen.

This commit is contained in:
mmcw-dev 2017-10-21 22:01:46 -04:00
parent 96bd6050d3
commit ccdae964ee
1 changed files with 40 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
app/www/index.html
View File

@ -4,15 +4,23 @@
<title>intval 3</title>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<meta name = "viewport" content = "width = 320, initial-scale = 2.3, user-scalable = no">
<meta name = "viewport" content = "width = 320, initial-scale = 1.0, user-scalable = no">
<style>
html,body{
background: #212121;
height: 100%;
padding: 0;
margin: 0;
}
*{
color: #fff;
font-family: 'Arial Neue', Helvetical, Arial, sans-serif;
}
body{
}
#app{
padding: 10% 0;
}
/* The switch - the box around the slider */
.switch {
position: relative;
@ -72,6 +80,7 @@
border-radius: 50%;
}
input[type=number]{
width: 80%;
border: 1px solid #fff;
border-radius: 5px;
color: #fff;
@ -80,9 +89,12 @@
background: transparent;
box-shadow: none;
margin: 5px 0;
padding: 5px 10px;
box-sizing: border-box;
}
button{
border: 1px solid #fff;
width: 80%;
border: 2px solid #fff;
border-radius: 5px;
color: #fff;
font-size: 18px;
@ -91,6 +103,9 @@
box-shadow: none;
outline: none;
margin: 5px 0;
padding: 5px 0;
text-align: center;
text-transform: uppercase;
}
button:focus{
background-color: #20ce45;
@ -100,26 +115,28 @@
</style>
</head>
<body>
<div>
<div id="app">
<div>
<div>Direction</div>
<label class="switch" onclick="setDir();">
<input type="checkbox" id="dir">
<span class="slider round"></span>
</label>
</div>
<div>
</div>
<div>
<div>Exposure (ms)</div>
<input type="number" id="exposure" value="630" min="630" step="1" />
</div>
<div>
</div>
<div>
<div>Delay (ms)</div>
<input type="number" id="delay" value="0" min="0" step="1" />
</div>
<div>
</div>
<div>
<button id="seq">Sequence</button>
</div>
<div>
</div>
<div>
<button id="frame" onclick="frame();">Frame</button>
</div>
</div>
<script>
/*! jQuery v3.2.1 | (c) JS Foundation and other contributors | jquery.org/license */
@ -150,6 +167,7 @@ null==d?void 0:d))},attrHooks:{type:{set:function(a,b){if(!o.radioValue&&"radio"
};
web.setDir = function () {
var dir = $('#dir').val();
console.dir(dir);
};
web.setDirSuccess = function (res) {
'use strict';