74 lines
1.6 KiB
HTML
Executable File
74 lines
1.6 KiB
HTML
Executable File
{% extends "mnfapp/base.html" %} {% load static %} {% block content %}
|
|
{% load i18n %}
|
|
{% block title %} {%endblock%}
|
|
<style>
|
|
.demo {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
padding: 1em;
|
|
}
|
|
|
|
video {
|
|
width: 60vw;
|
|
border-radius: 4px;
|
|
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
|
}
|
|
|
|
.actconversion_studio {
|
|
background-color: #ee3c4d;
|
|
color: #fff;
|
|
}
|
|
|
|
.footer {
|
|
position: sticky;
|
|
margin-top: 100vh;
|
|
}
|
|
</style>
|
|
|
|
<div class="demo">
|
|
<h2>Book Conversion Demo</h2>
|
|
|
|
<video id="vid" controlsList="nodownload" controls autoplay>
|
|
<source src="{%static '/media/BookConversionDemo.mp4'%}" type="video/mp4" controlsList="nodownload" />
|
|
</video>
|
|
</div>
|
|
|
|
<div id="boxybox" style="
|
|
display: none;
|
|
position: absolute;
|
|
z-index: 1;
|
|
width: 50vw;
|
|
top: 30%;
|
|
left: 25%;
|
|
background-color: #0a0a0a;
|
|
color: white;
|
|
">
|
|
<h1 style="text-align: center">{% trans 'Try Conversion Now' %}</h1>
|
|
<h3 style="
|
|
text-align: center;
|
|
color: white;
|
|
padding: 8px;
|
|
background-color: red;
|
|
">
|
|
<a href="{%url 'conversion'%}" style="color: white">{% trans 'Convert Your scripts' %}</a>
|
|
</h3>
|
|
</div>
|
|
{% include 'mnfapp/footer.html' %}
|
|
<script>
|
|
const TIME_TO_SHOW_BUTTON = 59;
|
|
const video = document.getElementById("vid");
|
|
const box = document.getElementById("boxybox");
|
|
|
|
video.addEventListener("timeupdate", function showButton() {
|
|
if (video.currentTime > TIME_TO_SHOW_BUTTON) {
|
|
box.style.display = "block";
|
|
<!-- video.removeEventListener("timeupdate", showButton);-->
|
|
} else {
|
|
box.style.display = "none";
|
|
}
|
|
});
|
|
</script>
|
|
|
|
{% endblock %} |