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