Login UI changes

User/forms.py

@@ -33,8 +33,8 @@ class MyForm5(forms.Form):
 
 
 class MyForm2(forms.Form):
- UserName = forms.CharField(label='User Name')
- Password = forms.CharField(label='Password', widget=forms.PasswordInput)
+ UserName = forms.CharField(label='User Name', widget=forms.TextInput(attrs={'class': 'input_field'}))
+ Password = forms.CharField(label='Password', widget=forms.PasswordInput(attrs={'class': 'input_field'}))
 
 
 MODE_CHOICES2 = [

templates/Admin/AdminLogin.html

@@ -20,17 +20,17 @@
   </head>
 
   <style>
-body
-{
-background-image:url('{% static 'image/vehicle_service.jpg'%}');
-background-repeat:no-repeat;
-background-size:100%;
-}
-
-.login_form
-{
+    body
+    {
+    background-image:url('{% static 'image/vehicle_service.jpg'%}');
+    background-repeat:no-repeat;
+    background-size:100%;
+    }
+
+    .login_form
+          {
               width: 400px;
-    height: 400px;
+              height: 450px;
               background: #CFD8DC;
               color: #000;
               top: 50%;
@@ -39,28 +39,28 @@ background-size:100%;
               transform: translate(-50%, -50%);
               box-sizing: border-box;
               border-radius: 25px;
-}
+          }
 
-.login_text
-{
+    .login_text
+          {
               margin-top: 75px;
               text-align: center;
               margin-bottom: 30px;
               font-weight: bold;
               color: #02111f;
-}
+          }
 
-.logo
-{
+    .logo
+          {
               height: 150px;
               width: 150px;
               position: absolute;
               top: -20%;
               left: calc(42% - 42px);
-}
+          }
 
-.login_btn
-{
+    .login_btn
+        {
             margin-left: 12%;
             margin-right:12%;
             margin-top: 7%;
@@ -69,7 +69,28 @@ background-size:100%;
             width: 300px;
             border-radius: 25px;
             text-align: center;
-}
+        }
+
+    .input_field
+        {
+              width: 100%;
+              padding: 12px 20px;
+              border: 1px solid #ccc;
+              border-radius: 10px;
+        }
+
+    .table th
+        {
+              padding-top: 3px;
+              vertical-align: initial;
+              border-top: 0px;
+        }
+
+    .table td
+        {
+              vertical-align: initial;
+              border-top: 0px;
+        }
 
 </style>