diff --git a/content/forms/phone-input.md b/content/forms/phone-input.md index 5037a1d07..58b4fe351 100644 --- a/content/forms/phone-input.md +++ b/content/forms/phone-input.md @@ -43,13 +43,13 @@ This example can be used to select the country code from a dropdown menu and set
@@ -104,6 +96,51 @@ This example can be used to select the country code from a dropdown menu and set
+ + + {{< /example >}} ## Floating label input @@ -129,16 +166,17 @@ Set a phone number inside an input field with a floating label inspired by Mater Use this example to send a verification code to the user's phone number for authentication. {{< example id="phone-verification-number-input" github="components/phone-input.md" show_dark=true iframeHeight="360" disable_init_js="true" >}} +
- +

We will send you an SMS with a verification code.

+ + + + {{< /example >}} ## Phone number select @@ -272,17 +348,17 @@ const resetToDefault = () => { Use this example to authenticate users with a login form using a phone number instead of an email address. {{< example id="phone-auth-number-input" github="components/phone-input.md" show_dark=true iframeHeight="390" disable_init_js="true" >}} +
- -
+
+
- +
@@ -345,6 +414,51 @@ Use this example to authenticate users with a login form using a phone number in
+ + + {{< /example >}} ## Advanced phone verification @@ -352,16 +466,18 @@ Use this example to authenticate users with a login form using a phone number in Use this example to verify a phone number via SMS or phone call using a dropdown component. {{< example id="phone-code-alt-number-input" github="components/phone-input.md" show_dark=true iframeHeight="360" disable_init_js="true" >}} + +
-
+
- +
- +
+ + {{< /example >}} \ No newline at end of file