daydream

commit 267d1da1940de71e7aa01cbc4afbd96019b76acb
parent e6855d924d8ba4a1425d45b4cd1e4dbbccce61d7
Author: Marcel <mtrnord1@gmail.com>
Date:   Mon, 15 Jun 2020 15:34:32 +0200

Add patterns for login input fields for cheap input verification

Took 14 minutes

Diffstat:
M
src/app/views/login.rs
 | 
5
+++++
M
static/custom-css.scss
 | 
9
+++++++++

2 files changed, 14 insertions(+), 0 deletions(-)
diff --git a/src/app/views/login.rs b/src/app/views/login.rs
@@ -195,6 +195,8 @@ impl Component for Login {
                                         <div class="login-inline">
                                            <span class="material-icons login-icons" id="ma-icon" style="font-size: 28px !important;">{"http"}</span>
                                             <input
+                                                pattern="^https:\\/\\/.*$"
+                                                required=true
                                                 class=homeserver_classes
                                                 type="url"
                                                 id="homeserver"
@@ -213,6 +215,8 @@ impl Component for Login {
                                         <div class="login-inline">
                                            <span class="material-icons login-icons" id="ma-icon">{"person"}</span>
                                             <input
+                                                required=true
+                                                pattern="^(@[\x21-\x39\x3B-\x7E]+:.*|[\x21-\x39\x3B-\x7E]+)$"
                                                 class=mxid_classes
                                                 id="username"
                                                 name="username"
@@ -230,6 +234,7 @@ impl Component for Login {
                                         <div class="login-inline">
                                            <span class="material-icons login-icons" id="ma-icon">{"vpn_key"}</span>
                                             <input
+                                                required=true
                                                 class=password_classes
                                                 type="password"
                                                 id="password"
diff --git a/static/custom-css.scss b/static/custom-css.scss
@@ -291,6 +291,15 @@ input.login-input {
   color: #BDBDBD;
 }
 
+input:placeholder-shown {
+  border: none;
+  border-bottom: 2px solid #FFFFFF;
+}
+
+input.login-input:invalid {
+  border-bottom: 2px solid red;
+}
+
 .login-icons {
   font-size: 24px !important;
   color: white;