rra/meshenger
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added more buttons, need more styling

Browse Source
This commit is contained in:
dennisdebel 2015-05-19 22:27:23 +02:00
parent 0128c61fea
commit 2ead3f5aaa
2 changed files with 12 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/index.html
View File

@ -12,7 +12,7 @@
</head> </head>
<body> <body>
<div id="message-page"> <div id="message-page">
<button id="message-back">Back</button> <button id="message-back" class="back-button">Back</button><br><br>
<form id="message-form" action="" accept-charset="utf-8"> <form id="message-form" action="" accept-charset="utf-8">
<textarea id="name" rows="1" placeholder="Your Name"></textarea> <textarea id="name" rows="1" placeholder="Your Name"></textarea>
<textarea id="message" rows="2" placeholder="Your Message"></textarea> <textarea id="message" rows="2" placeholder="Your Message"></textarea>
@ -21,8 +21,8 @@
</form> </form>
</div> </div>
<div id="photo-page" class="photoBox"> <div id="photo-page" class="photo-page">
<button id="photo-back">Back</button> <button id="photo-back" class="back-button">Back</button><br>
<input id="fileInput" accept="image/*" capture="camera" type="file"> <input id="fileInput" accept="image/*" capture="camera" type="file">
<br> <br>
<p> <p>
@ -40,11 +40,11 @@
<canvas id="canvas3" width="400" height="400"></canvas> <canvas id="canvas3" width="400" height="400"></canvas>
<br> <br>
<button id="rotLeft">Rotate left</button> <button id="rot-left" class="back-button">Rotate left</button>
<button id="rotRight">Rotate right</button> <button id="rot-right" class="back-button">Rotate right</button>
<button id="submit-photo" class="photo-buttons">submit</button> <button id="submit-photo" class="photo-buttons">submit</button>
<button id="cancel-photo" class="photo-buttons">cancel</button>
</div> </div>

33
web/style.css
View File

@ -81,10 +81,10 @@ margin:10px;
box-shadow:0 0 23px #bbb; box-shadow:0 0 23px #bbb;
} }
#back-button{ .back-button{
display:inline; display:inline;
float:left; float:left;
width:30%; width:100%;
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
outline: none; outline: none;
@ -229,37 +229,16 @@ hr{
} }
.photoBox { .photoBox {
width: 98%;
margin: 0 auto;
line-height: 40px;
display: none; display: none;
position: absolute; position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 50%;
padding: 16px;
background-color:#fff; background-color:#fff;
z-index:1002; z-index:1002;
overflow: auto; overflow: auto;
width: 100%;
padding:30px;
overflow: visible; overflow: visible;
-moz-box-shadow:0 0 23px #bbb;
-webkit-box-shadow:0 0 23px #bbb;
box-shadow:0 0 23px #bbb;
-webkit-border-top-left-radius:123px;
-webkit-border-top-right-radius:123px;
-webkit-border-bottom-right-radius:123px;
-webkit-border-bottom-left-radius:123px;
-moz-border-radius-bottomright:123px;
-moz-border-radius-bottomleft:123px;
-moz-border-top-left-radius:123px;
-moz-border-top-right-radius:123px;
border-top-left-radius:123px;
border-top-right-radius:123px;
border-bottom-right-radius:123px;
border-bottom-left-radius:123px;
background:#fff; background:#fff;
} }