Reverted to old version
This commit is contained in:
sairaj mote
parent
68fb207786
commit
562a19acf5
11
css/main.css
11
css/main.css
@ -6,7 +6,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
font-size: clamp(1rem, 1.2vmax, 1.2rem);
|
font-size: clamp(1rem, 1.2vmax, 1.5rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
html,
|
html,
|
||||||
@ -768,7 +768,7 @@ h3 {
|
|||||||
}
|
}
|
||||||
#home_page > section {
|
#home_page > section {
|
||||||
display: grid;
|
display: grid;
|
||||||
width: min(100% - 2rem, 42rem);
|
width: min(100% - 2rem, 36rem);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
@ -818,16 +818,13 @@ h3 {
|
|||||||
overflow: visible;
|
overflow: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
#file_upload_section fieldset {
|
label.interact {
|
||||||
padding: 0.5rem;
|
|
||||||
}
|
|
||||||
#file_upload_section label.interact {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border-radius: 0.3rem;
|
border-radius: 0.3rem;
|
||||||
padding: 0.5rem 1rem 0.5rem 0;
|
padding: 0.5rem 1rem 0.5rem 0;
|
||||||
}
|
}
|
||||||
#file_upload_section label.interact input {
|
label.interact input {
|
||||||
height: 1.2em;
|
height: 1.2em;
|
||||||
width: 1.2em;
|
width: 1.2em;
|
||||||
accent-color: var(--accent-color);
|
accent-color: var(--accent-color);
|
||||||
|
|||||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -6,7 +6,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
font-size: clamp(1rem, 1.2vmax, 1.2rem);
|
font-size: clamp(1rem, 1.2vmax, 1.5rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
html,
|
html,
|
||||||
@ -730,7 +730,7 @@ h3 {
|
|||||||
gap: 1rem;
|
gap: 1rem;
|
||||||
& > section {
|
& > section {
|
||||||
display: grid;
|
display: grid;
|
||||||
width: min(calc(100% - 2rem), 42rem);
|
width: min(calc(100% - 2rem), 36rem);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
@ -779,11 +779,6 @@ h3 {
|
|||||||
background-color: rgba(var(--background-color), 1);
|
background-color: rgba(var(--background-color), 1);
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
#file_upload_section {
|
|
||||||
fieldset {
|
|
||||||
padding: 0.5rem;
|
|
||||||
}
|
|
||||||
label.interact {
|
label.interact {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -795,7 +790,6 @@ h3 {
|
|||||||
accent-color: var(--accent-color);
|
accent-color: var(--accent-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
#verification_list {
|
#verification_list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
202
index.html
202
index.html
@ -970,98 +970,99 @@
|
|||||||
|
|
||||||
reader.readAsArrayBuffer(selectedFile);
|
reader.readAsArrayBuffer(selectedFile);
|
||||||
}
|
}
|
||||||
|
// <fieldset>
|
||||||
|
// <legend>A. Personal information</legend>
|
||||||
|
// <sm-input placeholder="Full name"></sm-input>
|
||||||
|
// <sm-textarea placeholder="Full address" rows="3"></sm-textarea>
|
||||||
|
// </fieldset>
|
||||||
|
// <fieldset>
|
||||||
|
// <legend>B. Politically exposed person form (PEP'S)</legend>
|
||||||
|
// <div class="grid gap-3">
|
||||||
|
// <div class="grid gap-1">
|
||||||
|
// <p>Do you hold or have held any important public office? E.g. Minister, Mayor, Deputy, Other</p>
|
||||||
|
// <div class="flex align-center gap-1" onchange=${(e) => { setIsHoldingImpPubOffice(e.target.value === 'yes') }}>
|
||||||
|
// <label class="interact">
|
||||||
|
// <input type="radio" name="person-pep" value="yes"/>
|
||||||
|
// <span>Yes</span>
|
||||||
|
// </label>
|
||||||
|
// <label class="interact">
|
||||||
|
// <input type="radio" name="person-pep" value="no" checked/>
|
||||||
|
// <span>No</span>
|
||||||
|
// </label>
|
||||||
|
// </div>
|
||||||
|
// ${isHoldingImpPubOffice ? html`
|
||||||
|
// <sm-input placeholder="Title"></sm-input>
|
||||||
|
// <div class="flex align-center gap-0-5 flex-wrap">
|
||||||
|
// <sm-input placeholder="Period" class="flex-1"></sm-input>
|
||||||
|
// <input placeholder="Start" type="date" class="flex-1">
|
||||||
|
// <input placeholder="End" type="date" class="flex-1">
|
||||||
|
// </div>
|
||||||
|
// `: ''}
|
||||||
|
// </div>
|
||||||
|
// <div class="grid gap-1">
|
||||||
|
// <p>Does any family member (Husband, parents, siblings, in-laws, etc.) hold or have held any important public office?</p>
|
||||||
|
// <div class="flex align-center gap-1" onchange=${(e) => { setIsFamilyMemberHoldingImpPubOffice(e.target.value === 'yes') }}>
|
||||||
|
// <label class="interact">
|
||||||
|
// <input type="radio" name="family-pep" value="yes"/>
|
||||||
|
// <span>Yes</span>
|
||||||
|
// </label>
|
||||||
|
// <label class="interact">
|
||||||
|
// <input type="radio" name="family-pep" value="no" checked/>
|
||||||
|
// <span>No</span>
|
||||||
|
// </label>
|
||||||
|
// </div>
|
||||||
|
// ${isFamilyMemberHoldingImpPubOffice ? html`
|
||||||
|
// <sm-input placeholder="Name"></sm-input>
|
||||||
|
// <sm-input placeholder="Title"></sm-input>
|
||||||
|
// <sm-input placeholder="Relative name"></sm-input>
|
||||||
|
// <sm-input placeholder="Sibling"></sm-input>
|
||||||
|
// `: ''}
|
||||||
|
// </div>
|
||||||
|
// <div class="grid gap-1">
|
||||||
|
// <p>Does you have an associate holding a major public office?</p>
|
||||||
|
// <div class="flex align-center gap-1" onchange=${(e) => { setIsAssociatedWithImpPubOffice(e.target.value === 'yes') }}>
|
||||||
|
// <label class="interact">
|
||||||
|
// <input type="radio" name="associate-pep" value="yes"/>
|
||||||
|
// <span>Yes</span>
|
||||||
|
// </label>
|
||||||
|
// <label class="interact">
|
||||||
|
// <input type="radio" name="associate-pep" value="no" checked/>
|
||||||
|
// <span>No</span>
|
||||||
|
// </label>
|
||||||
|
// </div>
|
||||||
|
// ${isAssociatedWithImpPubOffice ? html`
|
||||||
|
// <sm-input placeholder="Name"></sm-input>
|
||||||
|
// <sm-input placeholder="Position held"></sm-input>
|
||||||
|
// <div class="flex align-center gap-0-5 flex-wrap">
|
||||||
|
// <sm-input placeholder="Period" class="flex-1"></sm-input>
|
||||||
|
// <input placeholder="Start" type="date" class="flex-1">
|
||||||
|
// <input placeholder="End" type="date" class="flex-1">
|
||||||
|
// </div>
|
||||||
|
// `: ''}
|
||||||
|
// </div>
|
||||||
|
// <p>
|
||||||
|
// Politically Exposed Persons (PEP'S): Those natural persons identified at the beginning or during the course of the contractual relationship, nationals or foreigners, who perform or have performed public functions in our country or in their country of origin, as well as their relatives in the first and second degree of consanguinity or affinity, life partners or commercial or business associates.
|
||||||
|
// </p>
|
||||||
|
// </div>
|
||||||
|
// </fieldset>
|
||||||
|
// <fieldset>
|
||||||
|
// <legend>C. Declaration of legal origin and accuracy of the information</legend>
|
||||||
|
// <ol class="grid gap-1-5" type="a">
|
||||||
|
// <li>
|
||||||
|
// All the values that we (I) deliver will have an origin that in no way will be related to the cultivation, production, manufacture, storage or transport or illicit traffic of narcotic or psychotropic substances or any other related illegal activity, nor will we (I) admit that third parties make deposits in accounts in our (my) charge with funds coming from the above mentioned activities or those foreseen by the Anti-Money Laundering Law, allowing any investigation procedure by <strong>Project B El Salvador</strong> or the corresponding authorities.
|
||||||
|
// </li>
|
||||||
|
// <li>
|
||||||
|
// The information provided in this instrument to <strong>Project B El Salvador</strong> is true and may be verified at any time.
|
||||||
|
// </li>
|
||||||
|
// <li>
|
||||||
|
// We exempt <strong>Project B El Salvador</strong> from any liability arising from erroneous, false, or inaccurate information that we (I) have (would have) provided in this document or from the violation thereof.
|
||||||
|
// </li>
|
||||||
|
// </ol>
|
||||||
|
// </fieldset>
|
||||||
|
// <fieldset>
|
||||||
|
// <legend>D. Provided documents</legend>
|
||||||
|
// </fieldset>
|
||||||
return html`
|
return html`
|
||||||
<fieldset>
|
|
||||||
<legend>A. Personal information</legend>
|
|
||||||
<sm-input placeholder="Full name"></sm-input>
|
|
||||||
<sm-textarea placeholder="Full address" rows="3"></sm-textarea>
|
|
||||||
</fieldset>
|
|
||||||
<fieldset>
|
|
||||||
<legend>B. Politically exposed person form (PEP'S)</legend>
|
|
||||||
<div class="grid gap-3">
|
|
||||||
<div class="grid gap-1">
|
|
||||||
<p>Do you hold or have held any important public office? E.g. Minister, Mayor, Deputy, Other</p>
|
|
||||||
<div class="flex align-center gap-1" onchange=${(e) => { setIsHoldingImpPubOffice(e.target.value === 'yes') }}>
|
|
||||||
<label class="interact">
|
|
||||||
<input type="radio" name="person-pep" value="yes"/>
|
|
||||||
<span>Yes</span>
|
|
||||||
</label>
|
|
||||||
<label class="interact">
|
|
||||||
<input type="radio" name="person-pep" value="no" checked/>
|
|
||||||
<span>No</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
${isHoldingImpPubOffice ? html`
|
|
||||||
<sm-input placeholder="Title"></sm-input>
|
|
||||||
<div class="flex align-center gap-0-5 flex-wrap">
|
|
||||||
<sm-input placeholder="Period" class="flex-1"></sm-input>
|
|
||||||
<input placeholder="Start" type="date" class="flex-1">
|
|
||||||
<input placeholder="End" type="date" class="flex-1">
|
|
||||||
</div>
|
|
||||||
`: ''}
|
|
||||||
</div>
|
|
||||||
<div class="grid gap-1">
|
|
||||||
<p>Does any family member (Husband, parents, siblings, in-laws, etc.) hold or have held any important public office?</p>
|
|
||||||
<div class="flex align-center gap-1" onchange=${(e) => { setIsFamilyMemberHoldingImpPubOffice(e.target.value === 'yes') }}>
|
|
||||||
<label class="interact">
|
|
||||||
<input type="radio" name="family-pep" value="yes"/>
|
|
||||||
<span>Yes</span>
|
|
||||||
</label>
|
|
||||||
<label class="interact">
|
|
||||||
<input type="radio" name="family-pep" value="no" checked/>
|
|
||||||
<span>No</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
${isFamilyMemberHoldingImpPubOffice ? html`
|
|
||||||
<sm-input placeholder="Name"></sm-input>
|
|
||||||
<sm-input placeholder="Title"></sm-input>
|
|
||||||
<sm-input placeholder="Relative name"></sm-input>
|
|
||||||
<sm-input placeholder="Sibling"></sm-input>
|
|
||||||
`: ''}
|
|
||||||
</div>
|
|
||||||
<div class="grid gap-1">
|
|
||||||
<p>Does you have an associate holding a major public office?</p>
|
|
||||||
<div class="flex align-center gap-1" onchange=${(e) => { setIsAssociatedWithImpPubOffice(e.target.value === 'yes') }}>
|
|
||||||
<label class="interact">
|
|
||||||
<input type="radio" name="associate-pep" value="yes"/>
|
|
||||||
<span>Yes</span>
|
|
||||||
</label>
|
|
||||||
<label class="interact">
|
|
||||||
<input type="radio" name="associate-pep" value="no" checked/>
|
|
||||||
<span>No</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
${isAssociatedWithImpPubOffice ? html`
|
|
||||||
<sm-input placeholder="Name"></sm-input>
|
|
||||||
<sm-input placeholder="Position held"></sm-input>
|
|
||||||
<div class="flex align-center gap-0-5 flex-wrap">
|
|
||||||
<sm-input placeholder="Period" class="flex-1"></sm-input>
|
|
||||||
<input placeholder="Start" type="date" class="flex-1">
|
|
||||||
<input placeholder="End" type="date" class="flex-1">
|
|
||||||
</div>
|
|
||||||
`: ''}
|
|
||||||
</div>
|
|
||||||
<p>
|
|
||||||
Politically Exposed Persons (PEP'S): Those natural persons identified at the beginning or during the course of the contractual relationship, nationals or foreigners, who perform or have performed public functions in our country or in their country of origin, as well as their relatives in the first and second degree of consanguinity or affinity, life partners or commercial or business associates.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
<fieldset>
|
|
||||||
<legend>C. Declaration of legal origin and accuracy of the information</legend>
|
|
||||||
<ol class="grid gap-1-5" type="a">
|
|
||||||
<li>
|
|
||||||
All the values that we (I) deliver will have an origin that in no way will be related to the cultivation, production, manufacture, storage or transport or illicit traffic of narcotic or psychotropic substances or any other related illegal activity, nor will we (I) admit that third parties make deposits in accounts in our (my) charge with funds coming from the above mentioned activities or those foreseen by the Anti-Money Laundering Law, allowing any investigation procedure by <strong>Project B El Salvador</strong> or the corresponding authorities.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
The information provided in this instrument to <strong>Project B El Salvador</strong> is true and may be verified at any time.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
We exempt <strong>Project B El Salvador</strong> from any liability arising from erroneous, false, or inaccurate information that we (I) have (would have) provided in this document or from the violation thereof.
|
|
||||||
</li>
|
|
||||||
</ol>
|
|
||||||
</fieldset>
|
|
||||||
<fieldset>
|
|
||||||
<legend>D. Provided documents</legend>
|
|
||||||
<fieldset id="file_doc_type_selector" onchange=${(e) => { setSelectedIdProof(e.target.value) }}>
|
<fieldset id="file_doc_type_selector" onchange=${(e) => { setSelectedIdProof(e.target.value) }}>
|
||||||
<legend>Select ID proof</legend>
|
<legend>Select ID proof</legend>
|
||||||
<label class="interact">
|
<label class="interact">
|
||||||
@ -1088,9 +1089,8 @@
|
|||||||
<input type="file" id="file_input" accept=".png,.jpg,.pdf" class="hidden" onchange=${handleFileChange}/>
|
<input type="file" id="file_input" accept=".png,.jpg,.pdf" class="hidden" onchange=${handleFileChange}/>
|
||||||
</label>
|
</label>
|
||||||
`: ''}
|
`: ''}
|
||||||
${selectedFile ? html`
|
${selectedFile && !isUploading ? html`
|
||||||
<div id="file_upload_section" class=${`grid gap-1 card`}>
|
<div id="file_upload_section" class=${`grid gap-1 card`}>
|
||||||
${!isUploading ? html`
|
|
||||||
<div id="upload_button_wrapper" class="flex flex align-center gap-1 flex-wrap">
|
<div id="upload_button_wrapper" class="flex flex align-center gap-1 flex-wrap">
|
||||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"> <path d="M0 0h24v24H0V0z" fill="none" /> <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z" /> </svg>
|
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"> <path d="M0 0h24v24H0V0z" fill="none" /> <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6z" /> </svg>
|
||||||
<h4 id="selected_file_name">${selectedFile?.name}</h4>
|
<h4 id="selected_file_name">${selectedFile?.name}</h4>
|
||||||
@ -1103,10 +1103,8 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`: ''}
|
|
||||||
</div>
|
</div>
|
||||||
`: ''}
|
`: ''}
|
||||||
</fieldset>
|
|
||||||
${selectedFile ? html`
|
${selectedFile ? html`
|
||||||
<fieldset onchange=${(e) => { setSelectedVerifier(e.target.value) }}>
|
<fieldset onchange=${(e) => { setSelectedVerifier(e.target.value) }}>
|
||||||
<legend>Select KYC verifier</legend>
|
<legend>Select KYC verifier</legend>
|
||||||
@ -1225,16 +1223,16 @@
|
|||||||
// user KYC home page
|
// user KYC home page
|
||||||
const selectedCountry = getRef('country_selector')?.value;
|
const selectedCountry = getRef('country_selector')?.value;
|
||||||
const { renderedRequests, concurrentRequests, isVerified } = render.userRequests()
|
const { renderedRequests, concurrentRequests, isVerified } = render.userRequests()
|
||||||
|
// <div class="grid gap-1">
|
||||||
|
// <div>Select country</div>
|
||||||
|
// <sm-select id="country_selector" onchange=${() => renderHome()}>
|
||||||
|
// <sm-option value="el-salvador">El Salvador</sm-option>
|
||||||
|
// <sm-option value="india">India</sm-option>
|
||||||
|
// </sm-select>
|
||||||
|
// </div>
|
||||||
const fileUploadSection = html`
|
const fileUploadSection = html`
|
||||||
<section class="flex flex-direction-column gap-1">
|
<section class="flex flex-direction-column gap-1">
|
||||||
<h3 class="text-center" style="margin-bottom: 1rem">KYC verification</h3>
|
<h3 class="text-center" style="margin-bottom: 1rem">KYC verification</h3>
|
||||||
<div class="grid gap-1">
|
|
||||||
<div>Select country</div>
|
|
||||||
<sm-select id="country_selector" onchange=${() => renderHome()}>
|
|
||||||
<sm-option value="el-salvador">El Salvador</sm-option>
|
|
||||||
<sm-option value="india">India</sm-option>
|
|
||||||
</sm-select>
|
|
||||||
</div>
|
|
||||||
${render.countrySpecificForm(selectedCountry)}
|
${render.countrySpecificForm(selectedCountry)}
|
||||||
</section>
|
</section>
|
||||||
`;
|
`;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user