dergeorg/SmartShopper
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

design update

Browse Source
This commit is contained in:
Lukas Nowy 2019-01-29 01:10:16 +01:00
parent 096752e3dd
commit 65ed6c932c
3 changed files with 56 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
express-server/public/ocrscan/ocrscan.js
View File

@ -1,9 +1,16 @@
var id; var id;
$(document).ready(function() { $(document).ready(function() {
M.AutoInit();
//initialize all modals //initialize all modals
$('.modal').modal(); $('.modal').modal({
dismissible: false
});
$('.materialboxed').materialbox(); $('.materialboxed').materialbox();
$('.fixed-action-btn').floatingActionButton();
if ($(window).width() > 600) { if ($(window).width() > 600) {
//large //large
@ -116,6 +123,18 @@ $(document).on("click", ".collection-item", function() {
$(this).addClass("active"); $(this).addClass("active");
}); });
$(".btncont").click(function() {
$('.r1').animate({'margin-top': '0'}, 1000);
});
$(".opt1").click(function() {
$('.r1').animate({'margin-top': '-100%'}, 1000);
$(".r2").css("display", "block");
});
$(".opt2").click(function() {
// $('.row').animate({'margin-top': '-100%'}, 1000);
});
}); });

26
express-server/public/ocrscan/style.css
View File

@ -1,18 +1,37 @@
.opt1 { .opt1 {
background-color: #ff5722 ; background-color: #f4511e;
height: 100%; height: 100%;
max-height: 100%; max-height: 100%;
transition: 1s;
}
.opt1:hover {
background-color: #ff8a65;
} }
.opt2 { .opt2 {
background-color: #03a9f4; background-color: #039be5 ;
height: 100%; height: 100%;
max-height: 100%; max-height: 100%;
transition: 1s;
} }
.row { .opt2:hover {
background-color: #4fc3f7;
}
.r1 {
height: 100%; height: 100%;
max-height: 100%; max-height: 100%;
margin-top: 100%;
}
.r2 {
height: 100%;
max-height: 100%;
background-color: forestgreen;
display: none;
margin-top: 50%;
} }
html, body { html, body {
@ -20,6 +39,7 @@ html, body {
margin: 0; margin: 0;
max-height: 100%; max-height: 100%;
overflow: hidden; overflow: hidden;
background-color: #161616;
} }
.ico { .ico {

14
express-server/views/ocrscan.ejs
View File

@ -34,17 +34,25 @@
<body> <body>
<div class="row"> <div class="row r1">
<div class="col s12 m6 l6 opt1 waves-effect waves-dark" > <div class="col s12 m6 l6 opt1 waves-effect waves-dark" >
<center><i class="material-icons ico" >file_upload</i></center> <center><i class="material-icons ico" >file_upload</i></center>
</div> </div>
<div class="col s12 m6 l6 opt2 waves-effect waves-dark"> <div class="col s12 m6 l6 opt2 waves-effect waves-dark" onclick="M.toast({html: 'Not yet available'})">
<center><i class="material-icons ico">camera</i></center> <center><i class="material-icons ico">camera</i></center>
</div> </div>
</div> </div>
<div class="fixed-action-btn">
<a class="btn-floating btn-large red">
<i class="large material-icons blue-grey darken-4">arrow_back</i>
</a>
</div>
<!-- Modal Structure --> <!-- Modal Structure -->
<div id="modal1" class="modal"> <div id="modal1" class="modal">
<div class="modal-content"> <div class="modal-content">
@ -55,7 +63,7 @@
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<a href="/dash" class="modal-close waves-effect waves-red btn-flat">Return to Dashboard</a> <a href="/dash" class="modal-close waves-effect waves-red btn-flat">Return to Dashboard</a>
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Continue</a> <a href="#!" class="modal-close waves-effect waves-green btn-flat btncont">Continue</a>
</div> </div>
</div> </div>