You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

119 lines
5.3 KiB
HTML

<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<div class="page" data-name="sendmoney">
<div class="navbar">
<div class="navbar-inner">
<div class="left">
<a href="/home" class="link icon-only back">
<i class="icon icon-back"></i>
</a>
</div>
<div class="title">Send Money</div>
</div>
</div>
<div class="page-content">
<input type="hidden" id="publicid" value="{{this.$route.params.publicID}}" />
<div class="block">
<div id="step1" class="display-none">
<div class="row justify-content-center">
{{#if @global.qrenabled}}
<div class="col-100 tablet-50 desktop-25">
<div class="button button-large button-fill button-round" id="scanqrcodebtn">
<i class="fas fa-qrcode"></i> Scan Code
</div>
</div>
{{/if}}
<div class="col-100 tablet-50 desktop-25">
<div class="button button-large button-outline button-round" id="typecodebtn">
<i class="fas fa-keyboard"></i> Enter Code
</div>
</div>
</div>
</div>
<div id="step2" class="display-none">
<div class="row justify-content-center">
<div class="col-100 tablet-50 desktop-25">
<div class="card">
<div class="card-content card-content-padding">
<div class="money-input-box">
<div class="currency">$</div>
<input type="tel" min="0.00" max="999.99" placeholder="0.00" id="amount-box" class="money-input" />
</div>
<p class="segmented segmented-raised segmented-round">
<button class="button button-round preset-amount-button" data-target="#amount-box" data-amount="1.00">$1</button>
<button class="button button-round preset-amount-button" data-target="#amount-box" data-amount="5.00">$5</button>
<button class="button button-round preset-amount-button" data-target="#amount-box" data-amount="10.00">$10</button>
<button class="button button-round preset-amount-button" data-target="#amount-box" data-amount="20.00">$20</button>
</p>
</div>
<div class="card-footer display-block">
<div class="button button-large button-fill button-round" id="sendbtn">
<i class="fas fa-arrow-up"></i> Send
</div>
</div>
</div>
</div>
<div class="col-100 tablet-50 desktop-25">
<div class="card">
<div class="card-content card-content-padding">
<h3><i class="fas fa-user"></i> <span id="person-name"></span></h3>
<div>
<a id="verified-badge-container" class="link popup-open" href="#" data-popup="#verification-popup">
<span id="verified-badge" class="display-none">
<i class="fas fa-check-circle text-color-green"></i> &nbsp; Verified
</span>
<span id="unverified-badge" class="display-none">
<i class="fas fa-question-circle text-color-blue"></i> &nbsp; Unverified
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="popup" id="verification-popup">
<div class="navbar">
<div class="navbar-inner">
<div class="title">Verified Receivers</div>
<div class="right">
<a href="#" class="link icon-only popup-close">
<i class="material-icons">close</i>
</a>
</div>
</div>
</div>
<div class="block">
<p>
A verified receiver is a person who is confirmed in need of
assistance.
<p>
They have been vetted by a case worker or other person who works
for a local organization that helps people in need.
<p>
Your money will be used for essentials only, regardless of the
receiver's verification status.
</div>
</div>
<script src="js/sendmoney.js"></script>
</div>