feat: fix telephonenumber select ui & force important

This commit is contained in:
EETagent 2023-02-10 12:55:52 +01:00
parent 2635c3cbae
commit 115866d0fd
2 changed files with 11 additions and 8 deletions

View file

@ -36,10 +36,6 @@
@apply relative flex items-center justify-center; @apply relative flex items-center justify-center;
} }
select {
@apply hover:border-sspsBlue w-full rounded-lg border border-2 bg-[#f8fafb] p-3 text-xl shadow-lg outline-none transition-colors duration-300;
@apply min-w-40;
}
option { option {
@apply w-full; @apply w-full;
@apply text-center; @apply text-center;
@ -51,8 +47,11 @@
@apply border-red-700; @apply border-red-700;
} }
select { select {
-webkit-appearance: none; @apply hover:border-sspsBlue w-full rounded-lg border border-2 bg-[#f8fafb] p-3 text-xl shadow-lg outline-none transition-colors duration-300;
-moz-appearance: none; @apply min-w-40;
appearance: none;
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important;
} }
</style> </style>

View file

@ -15,7 +15,7 @@
// You must use E164 number format. It's guarantee the parsing and storing consistency. // You must use E164 number format. It's guarantee the parsing and storing consistency.
export let value: E164Number | null; export let value: E164Number | null;
if (value !== null && value !== "" ) { if (value !== null && value !== '') {
let number = parsePhoneNumber(value); let number = parsePhoneNumber(value);
if (number !== null && number !== undefined) { if (number !== null && number !== undefined) {
country = number.country!; country = number.country!;
@ -92,6 +92,10 @@
select { select {
@apply border-1 h-full w-2/5 rounded pl-3 pr-3; @apply border-1 h-full w-2/5 rounded pl-3 pr-3;
@apply hover:border-sspsBlue rounded-lg border border-2 bg-[#f8fafb] p-3 text-xl shadow-lg outline-none transition-colors duration-300; @apply hover:border-sspsBlue rounded-lg border border-2 bg-[#f8fafb] p-3 text-xl shadow-lg outline-none transition-colors duration-300;
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important;
} }
.inputWrapper { .inputWrapper {
@apply relative w-full; @apply relative w-full;