Implement the add new account button
This commit is contained in:
parent
fe48a8e07a
commit
d1732234aa
2 changed files with 131 additions and 21 deletions
|
@ -17,19 +17,16 @@
|
|||
<div class="columns is-centered">
|
||||
<div class="column is-three-fifths">
|
||||
<h1 class="title is-1">New email address</h1>
|
||||
<form action="" method="get">
|
||||
<form action="" method="get" id="form-generate-addr">
|
||||
<label class="label" for="account-name">Account</label>
|
||||
<div class="field has-addons">
|
||||
<div class="control is-expanded">
|
||||
<div class="select is-fullwidth">
|
||||
<select id="account-name">
|
||||
<option>a@example.org</option>
|
||||
<option>b@example.com</option>
|
||||
</select>
|
||||
<select id="account-name"></select>
|
||||
</div>
|
||||
</div>
|
||||
<p class="control">
|
||||
<a class="button is-primary" id="btn-add-account">New</a>
|
||||
<a class="button is-primary js-modal-trigger" data-target="modal-add-account" id="btn-add-account">New</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field">
|
||||
|
@ -52,5 +49,46 @@
|
|||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div id="modal-add-account" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Add a new account</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<form action="" method="get" id="form-new-account">
|
||||
<div class="field">
|
||||
<label class="label" for="new-addr-local-part">Local part</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" id="new-addr-local-part" minlength="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="new-addr-separator">Separator</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" id="new-addr-separator" value="+" minlength="1" maxlength="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="new-addr-domain">Domain name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" id="new-addr-domain" placeholder="example.org" minlength="1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="new-addr-key">Private key</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" id="new-addr-key" minlength="1">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
<footer class="modal-card-foot buttons is-centered">
|
||||
<button class="button is-success" id="btn-new-account">Add</button>
|
||||
<button class="button button-close">Cancel</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue