added more buttons, need more styling
This commit is contained in:
parent
0128c61fea
commit
2ead3f5aaa
@ -12,7 +12,7 @@
|
||||
</head>
|
||||
<body>
|
||||
<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">
|
||||
<textarea id="name" rows="1" placeholder="Your Name"></textarea>
|
||||
<textarea id="message" rows="2" placeholder="Your Message"></textarea>
|
||||
@ -21,8 +21,8 @@
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div id="photo-page" class="photoBox">
|
||||
<button id="photo-back">Back</button>
|
||||
<div id="photo-page" class="photo-page">
|
||||
<button id="photo-back" class="back-button">Back</button><br>
|
||||
<input id="fileInput" accept="image/*" capture="camera" type="file">
|
||||
<br>
|
||||
<p>
|
||||
@ -40,11 +40,11 @@
|
||||
<canvas id="canvas3" width="400" height="400"></canvas>
|
||||
<br>
|
||||
|
||||
<button id="rotLeft">Rotate left</button>
|
||||
<button id="rotRight">Rotate right</button>
|
||||
<button id="rot-left" class="back-button">Rotate left</button>
|
||||
<button id="rot-right" class="back-button">Rotate right</button>
|
||||
|
||||
<button id="submit-photo" class="photo-buttons">submit</button>
|
||||
<button id="cancel-photo" class="photo-buttons">cancel</button>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
@ -81,10 +81,10 @@ margin:10px;
|
||||
box-shadow:0 0 23px #bbb;
|
||||
}
|
||||
|
||||
#back-button{
|
||||
.back-button{
|
||||
display:inline;
|
||||
float:left;
|
||||
width:30%;
|
||||
width:100%;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
outline: none;
|
||||
@ -229,37 +229,16 @@ hr{
|
||||
}
|
||||
|
||||
.photoBox {
|
||||
width: 98%;
|
||||
margin: 0 auto;
|
||||
line-height: 40px;
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 25%;
|
||||
left: 25%;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
padding: 16px;
|
||||
background-color:#fff;
|
||||
z-index:1002;
|
||||
overflow: auto;
|
||||
|
||||
|
||||
|
||||
padding:30px;
|
||||
|
||||
width: 100%;
|
||||
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;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user