From 1a55a6736f6ae35ee35f8073972a0f39d85da139 Mon Sep 17 00:00:00 2001
From: "m.epshtein" <m.epshtein@micord.ru>
Date: Mon, 15 Jul 2024 12:54:18 +0300
Subject: [PATCH] placeholder animation

---
 frontend/src/resources/css/inbox-lkrp.css     | 22 +++++++++----------
 .../template/app/component/login.html         |  3 ++-
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/frontend/src/resources/css/inbox-lkrp.css b/frontend/src/resources/css/inbox-lkrp.css
index 1077f7fc..0b708c78 100644
--- a/frontend/src/resources/css/inbox-lkrp.css
+++ b/frontend/src/resources/css/inbox-lkrp.css
@@ -63,6 +63,7 @@ body.webbpm.ervu_lkrp_ul {
     --indent-medium: 32px;
     --indent-small: 24px;
     --indent-mini: 16px;
+    --indent-extra-mini: 10px;
 }
 
 .webbpm.ervu_lkrp_ul a {
@@ -267,7 +268,6 @@ body.webbpm.ervu_lkrp_ul {
         }
     }
     .row {
-        position: relative;
         margin-bottom: 0;
 
         & + .row {
@@ -276,6 +276,7 @@ body.webbpm.ervu_lkrp_ul {
     }    
     input {
         height: 56px;
+        padding-top: 20px;
         padding-left: 16px;
         border: 0;
         border-radius: 8px;        
@@ -292,24 +293,23 @@ body.webbpm.ervu_lkrp_ul {
         }
         & + label {
             position: absolute;
-            top: 2px;
-            left: 2px;
+            top: 16px;
+            left: 16px;
             pointer-events: none;
             transition: all 200ms;
         }
+        &:focus + label,
+        &:not(:placeholder-shown) + label {
+            top: 4px;
+            font-size: var(--indent-extra-mini);             
+            z-index: 20;
+        }
     }
     .login-btn-box {
-        margin-: 32px;
+        margin-top: 32px;
     }
 }
 
-.input:focus + label,
-.input:not(:placeholder-shown) + label{
-    top: -10px;
-    left: 10px;
-    font-size: 11px; 
-}
-
 .webbpm.ervu_lkrp_ul .form-signin .row.registration > * + *,
 .webbpm.ervu_lkrp_ul .form-signin .login-btn-box .password,
 .webbpm.ervu_lkrp_ul .form-signin .login-btn-box .btn + .btn {
diff --git a/frontend/src/resources/template/app/component/login.html b/frontend/src/resources/template/app/component/login.html
index cb3ccac9..44c63709 100644
--- a/frontend/src/resources/template/app/component/login.html
+++ b/frontend/src/resources/template/app/component/login.html
@@ -21,10 +21,11 @@
                         [type]="passwordType ? 'text' : 'password'"
                         name="password"
                         class="form-control field-password-view"
-                        placeholder="Пароль" required
+                        placeholder=" " required
                         [(ngModel)]="password"
                         maxlength="100"
                 >
+                <label>Пароль</label>
                 <div class="input-group-append">
                     <span class="input-group-text">
                         <i