eessppeelllloo/image-sequencer
1
0
Fork 0
mirror of https://github.com/publiclab/image-sequencer.git synced 2025-12-11 19:00:00 +01:00
Code Issues Packages Projects Releases Wiki Activity

Centered the cropped image (#705)

Browse Source 
* Updated demo.css

* Updated defaultHtmlStepUI.js

* Updated defaultHtmlStepUI.js

* Updated defaultHtmlStepUI.js

* Updated demo.css

* Updated defaultHtmlStepUi.js

* Updated defaultHtmlStepUi.js

* Added semi-colons in demo.css

* removed the style attribute from the img element
This commit is contained in:
Harsh Prabhu
2019-03-15 04:37:18 +05:30
committed by Jeffrey Warren
parent 30e9f359d5
commit 0be9e3f33b
2 changed files with 20 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
examples/demo.css
View File

@@ -249,4 +249,16 @@ h1 {
a.name-header{ a.name-header{
text-decoration: none; text-decoration: none;
color: #445; color: #445;
} }
.step-column{
display:flex;
flex-direction:row;
align-items:center;
}
.step-image{
width:100%;
display:flex;
flex-direction:column;
align-items:center;
}

12
examples/lib/defaultHtmlStepUi.js
View File

@@ -26,9 +26,9 @@ function DefaultHtmlStepUi(_sequencer, options) {
step.ui = step.ui =
'\ '\
<div class="container">\ <div class="container">\
<div class="row step">\ <div class="row step" style="display:flex">\
<form class="input-form">\ <form class="input-form">\
<div class="col-md-4 details">\ <div class="col-md-4 details" style="flex:1">\
<h3>\ <h3>\
<span class = "toggle">' +step.name + ' <i class="fa fa-caret-up toggleIcon" aria-hidden="true"></i></span>' + <span class = "toggle">' +step.name + ' <i class="fa fa-caret-up toggleIcon" aria-hidden="true"></i></span>' +
'<span class="load-spin" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></span>' + '<span class="load-spin" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></span>' +
@@ -37,9 +37,11 @@ function DefaultHtmlStepUi(_sequencer, options) {
'</i></p></div>\ '</i></p></div>\
</div>\ </div>\
</form>\ </form>\
<div class="col-md-8 cal">\ <div class="col-md-8 cal step-column">\
<div class="load" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></div>\ <div class="load" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></div>\
<a><img alt="" style="max-width=100%" class="img-thumbnail step-thumbnail"/></a>\ <div class="step-image">\
<a><img alt="" class="img-thumbnail step-thumbnail"/></a>\
</div>\
</div>\ </div>\
</div>\ </div>\
</div>\ </div>\