improve ui
This commit is contained in:
parent
db265a7448
commit
06977855aa
|
@ -27,6 +27,15 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.modal-movie .modal-content {
|
||||
width: 95%;
|
||||
max-width: 1280px;
|
||||
}
|
||||
|
||||
.movie {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.snapshot-link {
|
||||
width: 49%;
|
||||
|
|
|
@ -91,9 +91,14 @@ var SnapshotEvent = function() {
|
|||
link.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
view.innerHTML = template.innerHTML.replace('{src}', link.getAttribute('href'));
|
||||
|
||||
view.querySelector('.modal-close').addEventListener('click', function() {
|
||||
view.innerHTML = '';
|
||||
}, false);
|
||||
|
||||
view.querySelector('.modal-background').addEventListener('click', function() {
|
||||
view.innerHTML = '';
|
||||
}, false);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
|
@ -26,10 +26,10 @@
|
|||
<div id="snapshot-view"></div>
|
||||
|
||||
<template id="snapshot-template">
|
||||
<div class="modal is-active">
|
||||
<div class="modal is-active modal-movie">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-content" controls>
|
||||
<video controls class="image">
|
||||
<video controls class="image movie">
|
||||
<source src="{src}" type="video/mp4" />
|
||||
</video>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue