use parsleyjs instead of formbouncerjs
This commit is contained in:
parent
ffd2ec5e81
commit
1df5bec8df
|
@ -25,15 +25,16 @@
|
|||
</div>
|
||||
{% endif %}
|
||||
|
||||
<form method="post">
|
||||
<form method="post" data-parsley-validate>
|
||||
<div class="row mb-2">
|
||||
<div class="col-sm-6 mb-1 p-1" style="min-width: 4em">
|
||||
<input name="prefix" class="form-control"
|
||||
id="prefix"
|
||||
type="text"
|
||||
pattern="[0-9a-z-_.]{1,}"
|
||||
data-parsley-pattern="[0-9a-z-_.]{1,}"
|
||||
data-parsley-trigger="change"
|
||||
data-parsley-error-message="Only lowercase letters, dots, numbers, dashes (-) and underscores (_) are currently supported."
|
||||
maxlength="40"
|
||||
data-bouncer-message="Only lowercase letters, dots, numbers, dashes (-) and underscores (_) are currently supported."
|
||||
placeholder="Alias prefix, for example newsletter.com-123_xyz"
|
||||
autofocus required>
|
||||
|
||||
|
@ -105,9 +106,6 @@
|
|||
|
||||
{% block script %}
|
||||
<script>
|
||||
// init bouncer
|
||||
new Bouncer('form');
|
||||
|
||||
$('.mailbox-select').multipleSelect();
|
||||
|
||||
// Ctrl-enter submit the form
|
||||
|
|
|
@ -33,7 +33,7 @@
|
|||
|
||||
{% block single_content %}
|
||||
|
||||
<form class="card" method="post" style="max-width: 40rem; margin: auto; border-radius: 2%">
|
||||
<form class="card" method="post" data-parsley-validate style="max-width: 40rem; margin: auto; border-radius: 2%">
|
||||
{% if not client.approved %}
|
||||
<div class="alert alert-warning" style="border-bottom: 3px solid;">
|
||||
<b>{{ client.name }}</b> is in Dev Mode and isn't approved (yet) by SimpleLogin.
|
||||
|
@ -101,10 +101,11 @@
|
|||
<div class="col-sm-6 pr-1 mb-1" style="min-width: 5em">
|
||||
<input name="prefix" class="form-control"
|
||||
type="text"
|
||||
pattern="[0-9a-z-_]{1,}"
|
||||
maxlength="40"
|
||||
data-bouncer-message="Only lowercase letters, dots, numbers, dashes (-) and underscores (_) are currently supported."
|
||||
placeholder="email alias"
|
||||
data-parsley-pattern="[0-9a-z-_.]{1,}"
|
||||
data-parsley-trigger="change"
|
||||
data-parsley-error-message="Only lowercase letters, dots, numbers, dashes (-) and underscores (_) are currently supported."
|
||||
placeholder="Alias prefix, for example newsletter.com-123_xyz"
|
||||
autofocus>
|
||||
</div>
|
||||
|
||||
|
@ -124,10 +125,6 @@
|
|||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<small class="text-muted">
|
||||
Alias can use letter, number, dash and cannot be empty
|
||||
</small>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -202,10 +199,3 @@
|
|||
</div>
|
||||
</form>
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
<script>
|
||||
// init bouncer
|
||||
new Bouncer('form');
|
||||
</script>
|
||||
{% endblock %}
|
|
@ -81,11 +81,6 @@
|
|||
"resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
|
||||
"integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
|
||||
},
|
||||
"formbouncerjs": {
|
||||
"version": "1.4.6",
|
||||
"resolved": "https://registry.npmjs.org/formbouncerjs/-/formbouncerjs-1.4.6.tgz",
|
||||
"integrity": "sha512-uQL/ZFs5w79RPtgtPbmL8HTKrsEK2q7Fph/uBqe4sFNXIszcrVmHcJ3aj5sB4OTsFbV6igQX9819f/f5t5Wjgg=="
|
||||
},
|
||||
"intro.js": {
|
||||
"version": "2.9.3",
|
||||
"resolved": "https://registry.npmjs.org/intro.js/-/intro.js-2.9.3.tgz",
|
||||
|
@ -101,6 +96,14 @@
|
|||
"resolved": "https://registry.npmjs.org/multiple-select/-/multiple-select-1.5.2.tgz",
|
||||
"integrity": "sha512-sTNNRrjnTtB1b1+HTKcjQ/mjWY7Gvigo9F3C/3oTQCTFEpYzwaRYFPRAOu2SogfA1hEfyJTXjyS1VAbanJMsmA=="
|
||||
},
|
||||
"parsleyjs": {
|
||||
"version": "2.9.2",
|
||||
"resolved": "https://registry.npmjs.org/parsleyjs/-/parsleyjs-2.9.2.tgz",
|
||||
"integrity": "sha512-DKS2XXTjEUZ1BJWUzgXAr+550kFBZrom2WYweubqdV7WzdNC1hjOajZDfeBPoAZMkXumJPlB3v37IKatbiW8zQ==",
|
||||
"requires": {
|
||||
"jquery": ">=1.8.0"
|
||||
}
|
||||
},
|
||||
"popper.js": {
|
||||
"version": "1.16.1",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
|
||||
|
|
|
@ -19,9 +19,9 @@
|
|||
"@sentry/browser": "^5.30.0",
|
||||
"bootbox": "^5.5.2",
|
||||
"font-awesome": "^4.7.0",
|
||||
"formbouncerjs": "^1.4.6",
|
||||
"intro.js": "^2.9.3",
|
||||
"multiple-select": "^1.5.2",
|
||||
"parsleyjs": "^2.9.2",
|
||||
"qrious": "^4.0.2",
|
||||
"toastr": "^2.1.4",
|
||||
"vue": "^2.6.14"
|
||||
|
|
|
@ -128,4 +128,41 @@ em {
|
|||
.disabled-content {
|
||||
pointer-events: none;
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
|
||||
/* Parsley CSS */
|
||||
input.parsley-success,
|
||||
select.parsley-success,
|
||||
textarea.parsley-success {
|
||||
color: #468847;
|
||||
background-color: #DFF0D8;
|
||||
border: 1px solid #D6E9C6;
|
||||
}
|
||||
|
||||
input.parsley-error,
|
||||
select.parsley-error,
|
||||
textarea.parsley-error {
|
||||
color: #B94A48;
|
||||
background-color: #F2DEDE;
|
||||
border: 1px solid #EED3D7;
|
||||
}
|
||||
|
||||
.parsley-errors-list {
|
||||
margin: 2px 0 3px;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
font-size: 0.9em;
|
||||
line-height: 0.9em;
|
||||
opacity: 0;
|
||||
color: #B94A48;
|
||||
|
||||
transition: all .3s ease-in;
|
||||
-o-transition: all .3s ease-in;
|
||||
-moz-transition: all .3s ease-in;
|
||||
-webkit-transition: all .3s ease-in;
|
||||
}
|
||||
|
||||
.parsley-errors-list.filled {
|
||||
opacity: 1;
|
||||
}
|
||||
/* END Parsley CSS */
|
|
@ -77,8 +77,9 @@
|
|||
<script
|
||||
src="{{ url_for('static', filename='node_modules/multiple-select/dist/multiple-select.min.js') }}"></script>
|
||||
|
||||
<!-- bouncer library -->
|
||||
<script src="{{ url_for('static', filename='node_modules/formbouncerjs/dist/bouncer.js') }}"></script>
|
||||
<!-- Parseley library -->
|
||||
<script src="{{ url_for('static', filename='node_modules/parsleyjs/dist/parsley.min.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='node_modules/parsleyjs/dist/i18n/en.js') }}"></script>
|
||||
|
||||
|
||||
{% if PLAUSIBLE_HOST and PLAUSIBLE_DOMAIN %}
|
||||
|
|
Loading…
Reference in New Issue