forked from Nixius/authelia
bump
This commit is contained in:
parent
630bd3d3f4
commit
71b91a4284
|
|
@ -52,7 +52,15 @@
|
|||
.features li { padding: 0.4rem 0; color: var(--muted); font-size: 0.95rem; }
|
||||
.features li::before { content: "\2713"; color: var(--accent); font-weight: 700; margin-right: 0.75rem; }
|
||||
form { display: flex; flex-direction: column; gap: 0.75rem; }
|
||||
input[type="email"], input[type="text"] {
|
||||
form label {
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: var(--muted);
|
||||
margin-bottom: -0.25rem;
|
||||
}
|
||||
input[type="email"], input[type="text"], input[type="tel"] {
|
||||
width: 100%;
|
||||
background: var(--bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 8px;
|
||||
|
|
@ -62,8 +70,8 @@
|
|||
outline: none;
|
||||
transition: border-color 0.2s;
|
||||
}
|
||||
input[type="email"]:focus, input[type="text"]:focus { border-color: var(--accent); }
|
||||
input[type="email"]::placeholder, input[type="text"]::placeholder { color: var(--muted); }
|
||||
input[type="email"]:focus, input[type="text"]:focus, input[type="tel"]:focus { border-color: var(--accent); }
|
||||
input[type="email"]::placeholder, input[type="text"]::placeholder, input[type="tel"]::placeholder { color: var(--muted); }
|
||||
button {
|
||||
background: var(--accent);
|
||||
color: #fff;
|
||||
|
|
@ -134,12 +142,37 @@
|
|||
<ul class="features">
|
||||
{{range .Features}}<li>{{.}}</li>{{end}}
|
||||
</ul>
|
||||
<form method="POST" action="/subscribe">
|
||||
<input type="email" name="email" placeholder="you@example.com" required>
|
||||
<input type="tel" name="phone" placeholder="+1 555 123 4567" autocomplete="tel" required>
|
||||
<input type="text" name="domain" placeholder="Domain you want to manage (e.g. git.mycompany.com)" autocomplete="off" required>
|
||||
<form method="POST" action="/subscribe" id="subscribe-form">
|
||||
<label for="sub-email">Email</label>
|
||||
<input id="sub-email" type="email" name="email" placeholder="you@example.com" autocomplete="email" required>
|
||||
<label for="sub-phone">Phone <span style="font-weight:400;color:var(--muted)">(10+ digits, any format)</span></label>
|
||||
<input id="sub-phone" type="tel" name="phone" placeholder="e.g. 555 123 4567 or +1 555 123 4567" autocomplete="tel" inputmode="tel" minlength="10" required>
|
||||
<label for="sub-domain">Domain to manage</label>
|
||||
<input id="sub-domain" type="text" name="domain" placeholder="e.g. git.mycompany.com" autocomplete="off" required>
|
||||
<button type="submit">Subscribe Now</button>
|
||||
</form>
|
||||
<script>
|
||||
(function() {
|
||||
var phone = document.getElementById('sub-phone');
|
||||
if (!phone) return;
|
||||
function digitsOnly(s) { return (s || '').replace(/\D/g, ''); }
|
||||
function formatPhone(digits) {
|
||||
if (digits.length <= 3) return digits;
|
||||
if (digits.length <= 6) return digits.slice(0,3) + ' ' + digits.slice(3);
|
||||
if (digits.length <= 10) return digits.slice(0,3) + ' ' + digits.slice(3,6) + ' ' + digits.slice(6);
|
||||
return digits.slice(0,3) + ' ' + digits.slice(3,6) + ' ' + digits.slice(6,10) + ' ' + digits.slice(10,15);
|
||||
}
|
||||
phone.addEventListener('input', function() {
|
||||
var d = digitsOnly(this.value);
|
||||
if (d.length > 15) d = d.slice(0, 15);
|
||||
var formatted = formatPhone(d);
|
||||
if (this.value !== formatted) {
|
||||
this.value = formatted;
|
||||
this.setSelectionRange(formatted.length, formatted.length);
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
{{else}}
|
||||
<h2>Subscribe</h2>
|
||||
<p style="color: var(--muted); margin-bottom: 1rem;">Pricing is being configured. Check back soon.</p>
|
||||
|
|
|
|||
Loading…
Reference in New Issue