Browse Source

Fix countries hover

Fix starting input phone number with '+'
master
Eduard Kuzmenko 4 years ago
parent
commit
f686a189a1
  1. 16
      src/pages/pageSignIn.ts
  2. 2
      src/scss/style.scss

16
src/pages/pageSignIn.ts

@ -240,17 +240,25 @@ let onFirstMount = () => {
//console.log('input', this.value); //console.log('input', this.value);
this.classList.remove('error'); this.classList.remove('error');
const diff = Math.abs(this.value.length - lastValue.length); const value = this.value;
const diff = Math.abs(value.length - lastValue.length);
if(diff > 1 && !pasted && isAppleMobile) { if(diff > 1 && !pasted && isAppleMobile) {
this.value = lastValue + this.value; this.value = lastValue + value;
} }
pasted = false; pasted = false;
telLabel.innerText = 'Phone Number'; telLabel.innerText = 'Phone Number';
let {formatted, country} = formatPhoneNumber(this.value); let formatted: string, country: Country;
if(this.value.replace(/\++/, '+') === '+') {
this.value = '+';
} else {
const o = formatPhoneNumber(this.value);
formatted = o.formatted;
country = o.country;
this.value = lastValue = formatted ? '+' + formatted : ''; this.value = lastValue = formatted ? '+' + formatted : '';
}
//console.log(formatted, country); //console.log(formatted, country);
@ -281,7 +289,7 @@ let onFirstMount = () => {
//console.log('keypress', this.value); //console.log('keypress', this.value);
if(!btnNext.style.visibility &&/* this.value.length >= 9 && */ e.key === 'Enter') { if(!btnNext.style.visibility &&/* this.value.length >= 9 && */ e.key === 'Enter') {
return btnNext.click(); return btnNext.click();
} else if(/\D/.test(e.key) && !(e.metaKey || e.ctrlKey)) { } else if(/\D/.test(e.key) && !(e.metaKey || e.ctrlKey) && !(e.key === '+' && e.shiftKey/* && !this.value */)) {
e.preventDefault(); e.preventDefault();
return false; return false;
} }

2
src/scss/style.scss

@ -557,7 +557,7 @@ hr {
display: grid; display: grid;
grid-template-columns: calc(26px + 2rem) 1fr 80px; grid-template-columns: calc(26px + 2rem) 1fr 80px;
@include hover-effect(); @include hover-background-effect();
} }
// +2 px bc of whitespace // +2 px bc of whitespace

Loading…
Cancel
Save