From bdc26845e4e61a031df51cf07440b10b13458897 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@di.uoa.gr>
Date: Fri, 1 Dec 2023 17:01:24 +0200
Subject: [PATCH] [develop]: Input: add variables for placeholder position in
 order to fix advanced search-input.

---
 less/input.less | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/less/input.less b/less/input.less
index b1a94de..73fe6fa 100644
--- a/less/input.less
+++ b/less/input.less
@@ -5,6 +5,8 @@
   --input-placeholder-color: @global-meta-color;
   --input-placeholder-weight: 400;
   --input-placeholder-padding-horizontal: 5px;
+  --input-placeholder-top: 0px;
+  --input-placeholder-transform: translateY(-50%);
   --input-hint-color: @global-meta-color;
   --input-color: @global-emphasis-color;
   --input-border-radius: @global-border-radius;
@@ -61,7 +63,7 @@
     background: var(--input-background);
     border-radius: var(--input-border-radius);
     position: relative;
-    padding: var(--input-padding-vertical) 0 var(--input-padding-vertical) var(--input-padding-horizontal);
+    padding: calc(var(--input-padding-vertical) + var(--input-placeholder-top)) 0 calc(var(--input-padding-vertical) - var(--input-placeholder-top)) var(--input-padding-horizontal);
     cursor: pointer;
     color: var(--input-color);
 
@@ -264,8 +266,8 @@
   &.active > .input-box > .placeholder > label,
   &.focused > .input-box > .placeholder > label,
   &.hint > .input-box > .placeholder > label {
-    transform: translateY(-50%);
-    top: calc(var(--input-border-width) * -1);
+    transform: var(--input-placeholder-transform);
+    top: calc(var(--input-placeholder-top) + var(--input-border-width) * -1);
     font-size: 12px;
     line-height: 18px;
   }
@@ -305,6 +307,8 @@
     --input-placeholder-weight: 700;
     --input-placeholder-color: @global-color;
     --input-border-radius: 54px;
+    --input-placeholder-top: 10px;
+    --input-placeholder-transform: none;
     --input-padding-horizontal: 30px;
     --input-padding-vertical: var(--search-input-icon-padding-vertical);
     --input-background-hover: @global-muted-background;