2024-04-27 09:33:09 +00:00
{% extends "mnfapp/base.html" %} {% load static %} {% load i18n %}
<!-- {% block title %}Conversion Room {%endblock%} -->
< html >
< head >
{% block content %}
< script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" > < / script >
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> -->
< script >
$(document).ready(function(){
{% comment %} $(".container-995").hide();
$(".new").show(); {% endcomment %}
});
< / script >
< style >
.label{
width: 112px;
}
.containerAudit{
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
position: absolute;
width: 50vw;
text-align: center;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
height: 40vh;
}
.containerAudit form{
display: flex;
width: 40vw;
margin-left: 10vw;
margin-top: 20%;
/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
}
.actsic_builder{
background-color: #ee3c4d;
color: #fff;
}
#form-container {
min-width: 100%;
}
input[type="file"] {
display: inline-block !important;
}
#id_screenplay_name,
#id_author_name {
border: 1px solid;
border-radius:3px;
height: 28px;
margin: 0px 0px 5px;
padding: 0 0 0 7px;
{% comment %} width: 165px; {% endcomment %}
}
{% comment %}
#id_screenplay_name{
border-radius:3px;
height: 28px;
font-size : 14px;
color: #000;
} {% endcomment %}
#id_language{
border-radius:3px;
height: 28px;
width: 155px;
margin: 0px 0px 5px;
}
#id_script_file {
width: 180px;
margin: auto;
}
.btn-primary{
margin-left:20px;
font-weight: bold;
}
.form-field{
padding: 0 5px 0 0;
display: flex;
grid-gap: 0 5px;
align-items: center;
justify-content: left;
}
.form-row-audit {
display: grid;
grid-template-columns: repeat(3, 1fr);
row-gap: 10px;
margin-bottom: 6px;
margin-top: 20px;
}
.author_center {
width: 100%;
display: flex;
gap: 0 5px;
justify-content: center;
align-items: center;
}
.mb-5{
font-weight: 700;
}
.container-995 {
width: 80%;
max-width: 100% !important;
padding: 0 !important;
}
#input_fields_container_audit{
max-width: 410px;
}
.footer{
width:100%;
position: absolute !important;
bottom: 0;
}
.card.card-custom {
-webkit-box-shadow: none;
box-shadow: none;
}
.mt-5 {
margin-top: 0 !important;
}
.card.card-custom>.card-body {
padding: 0 2rem !important;
}
@media screen and (max-width: 1025px) {
.card.card-custom>.card-body {
margin-bottom: 2rem !important;
}
}
@media screen and (max-width: 860px) {
.container-995 {
margin: auto 0;
}
}
@media screen and (max-width: 768px) {
.form-row-audit {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 2rem;
}
.form-row-audit>div {
display: flex;
align-items: center;
justify-content: left;
width: 100%;
}
#input_fields_container_audit {
margin-bottom: 2rem;
min-width: 86vw;
text-align: center;
}
#input_fields_container_audit h3 {
font-size: 15px !important;
width: auto !important;
}
#input_fields_container_audit p {
font-size: 10px !important;
width: 80vw;
}
#input_fields_container_audit .form-field {
justify-content: center;
width: 80vw;
}
#input_fields_container_audit .submit-btn-container {
width: 80vw !important;
}
}
@media screen and (max-width: 1367px) {
#mulitligule {
min-height: 105vh;
}
.footer {
position: static !important;
}
}
< / style >
< / head >
< body >
< center class = "new" style = "display: none" >
< h3 style = "padding: 1em" >
We are processing your script. < br / >
We will notify you when it is Audited.
< / h3 >
< / center >
< div id = "mulitligule" class = "container-995" style = "max-width: 1170px" >
< div class = "pb-0" style = "padding: 0.5em" >
< div class = "card card-custom" >
< div class = "card-body" >
< h3 class = "mb-5" style = "font-size: 24px; font-weight: 700;" > {% trans "Welcome to Script Audit !" %}< / h3 >
< p class = "ml-2" style = "font-size: 14px; color: #616161;" >
A Screenplay is a technical document.
< / p >
< p class = "ml-2" style = "font-size: 14px; color: #616161;" >
Hence, it is required to be written precisely as per international
conventions regarding font type and size, indentation, alignment
and spaces.
< / p >
< p class = "ml-2" style = "font-size: 14px; color: #616161;" >
However, inadvertent human errors may creep in while writing a
Screenplay.
< / p >
< p class = "ml-2" style = "font-size: 14px; color: #616161;" >
The Script Auditor identifies such inadvertent errors and corrects
them.
< / p >
< p class = "ml-2" style = "font-size: 14px; color: #616161;" >
It's simple. Upload your Script, wait for a few minutes and get
the audited version of your Script.
< / p >
< form
method="post"
action="{% url 'upload_audit_facade' %}"
enctype="multipart/form-data"
id="form-container"
>
{% csrf_token %}
<!-- <p class="lead ml - 2">{% trans "Upload your Script in docx or pdf or fdx or txt format below to Audit it and we will notify you once it is Audited." %}</p> -->
{% if form.non_field_errors %}
< div class = "error-message" >
{% for error in form.non_field_errors %} {% comment %}
< p class = "custom-error" > {{ error }}< / p >
{% endcomment %} {% endfor %}
< / div >
{% endif %}
< div class = "form-row-audit" >
< div class = "form-field w-100" >
< label for = "id_screenplay_name" style = "min-width: 115px; font-size: 14px; font-weight: 500;"
>Screenplay name< span style = "color: #ee3c4d" > *< / span > < /label
>
< input
type="text"
name="screenplay_name"
maxlength="40"
required
id="id_screenplay_name"
/>
< / div >
< div class = "author_center" >
< label for = "id_author_name" style = "font-size: 14px; font-weight: 500;"
>Author< span style = "color: #ee3c4d" > *< / span > < /label
>
< input
type="text"
id="author_name"
name="author_name"
maxlength="25"
required
id="id_author_name"
style="padding-left: 5px; height: 28px"
/>
< / div >
< div class = "form-field" >
< label for = "id_language" style = "font-size: 14px; font-weight: 500;" > Language:< / label >
< select type = "text" name = "language" id = "id_language" >
< option value = "en" > English< / option >
< option value = "en" > Other< / option >
< / select >
< / div >
< / div >
< div id = "input_fields_container_audit" >
< h3 style = "font-size: 16px; font-weight: 600; width: 485px;" >
Upload on Blockchain and Audit your Screenplay !
< / h3 >
< div style = "text-align: center;" >
< p style = "font-size: 12px;" > Please upload your script in "docx", "pdf", "fdx" or "txt" format only..< / p >
< / div >
< div class = "form-field" >
<!-- <label for="id_script_file">Script file<span style="color: #EE3C4D;">*</span></label> -->
< input
type="file"
name="script_file"
required
id="id_script_file"
syle="margin-left: 9rem"
/>
< / div >
{% for field in form %}
< div class = "mt-5 mx-3" >
{% if field.errors %}
< p class = "text-primary" > {{ field.errors.0 }}< / p >
{% endif %}
< / div >
{% endfor %} {% comment %} < button > Submit< / button > {% endcomment
%} {% comment %}
< button type = "submit" class = "btn btn-primary my-5" >
Submit
< / button >
{% endcomment %}
< div class = "submit-btn-container " style = "width: 100%; text-align: center; margin-top: 0.4rem;" >
< input
value="UPLOAD"
id="submit-btn"
class="btn btn-primary mx-auto"
style="
border-radius: 10px;
font-family: inherit;
font-weight: 700;
font-size: 14px;
padding: 6px 30px 6px 30px;
background: #33B0CA;
border: none;
"
type="submit"
/>
< / div >
< / div >
< / form >
< script >
document
.getElementById("form-container")
.addEventListener("submit", function () {
document.getElementById("submit-btn").disabled = true;
document.getElementById("submit-btn").style.backgroundColor = "#616161";
document.getElementById("submit-btn").style.color = "#FAFAFA";
});
< / script >
< script >
const authorNameInput = document.getElementById("author_name");
authorNameInput.addEventListener("input", function () {
this.value = this.value.replace(/[^a-zA-Z ]/g, "");
});
< / script >
< / div >
< / div >
< / div >
< / div >
< / body >
< / html >
2024-04-30 04:59:37 +00:00
{% comment %} {% include "mnfapp/footer.html" %} {% endcomment %}
2024-04-27 09:33:09 +00:00
{% endblock %}
