rahix/openflexure-microscope-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Reformatted capture buttons

Browse source
This commit is contained in:
Joel Collins 2018-11-20 16:14:11 +00:00
parent 69e97ba5a3
commit 44b72ed74f
2 changed files with 30 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

10
openflexure_microscope/api/static/main_v1.js
View file

@ -79,13 +79,13 @@ function updateCaptureList(response) {
html = `
<div class="capture-thumb"><img src="${element_uri}/download?thumbnail=true"></div>
<div class="capture-actions">
<b>${element.filename}</b>
<div class='capture-heading'>${element.filename}</div>
<br>
<button type="button" onclick="window.open('${element_uri}/download', '_blank');">View</button>
<button type="button" onclick="window.open('${element_uri}/download?as_attachment=true');">Download</button>
<button type="button" class="capture-button" onclick="window.open('${element_uri}/download', '_blank');">View</button>
<button type="button" class="capture-button" onclick="window.open('${element_uri}/download?as_attachment=true');">Download</button>
<br>
<button type="button" onclick="window.open('${element_uri}/', '_blank');">JSON</button>
<button type="button" onclick="deleteCapture('${element.id}');">Delete</button>
<button type="button" class="capture-button" onclick="window.open('${element_uri}/', '_blank');">JSON</button>
<button type="button" class="capture-button" onclick="deleteCapture('${element.id}');">Delete</button>
<br>
</div>
`

45
openflexure_microscope/api/static/style_v1.css
View file

@ -28,18 +28,18 @@ body {
}
.left{
width: 250px;
width: 220px;
float: left;
}
.Right{
width: 250px;
width: 280px;
float: right;
}
.middle {
margin-left: 250px;
margin-right: 250px;
margin-left: 220px;
margin-right: 280px;
background-color: #d3d3d3;
}
@ -50,24 +50,12 @@ body {
clear: both;
}
/* Columns within panels */
.left-col {
float:left;
}
.right-col {
float:right;
}
.clearfix::after {
content: "";
clear: both;
display: table;
}
/* Flexboxes */
.flexbox {
display: flex;
margin-bottom: 5px;
}
.flexgrow {
flex-grow: 1;
}
@ -80,13 +68,22 @@ body {
}
.capture {
background-color: #d3d3d3;
height: 75px;
width: 260px;
margin-bottom: 5px;
background-color: #d3d3d3;
display: flex;
}
.capture-thumb {
width: 80px;
height: 75px;
}
.capture-heading {
font-weight: bold;
margin: 5px 0 5px 0;
display: inline-block;
}
.capture-actions {
@ -97,5 +94,13 @@ body {
}
.capture img {
width: 80px;
width: 100%;
height: 100%;
object-fit: cover;
}
.capture-button {
width: 75px;
margin-bottom: 3px;
height: 22px;
}