Hide placeholder if no space

kolzchut · Dec 24, 2023 · 316c93b · 316c93b
1 parent 58784cd
commit 316c93b
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/projects/srm/src/app/area-search-selector/area-search-selector.component.html b/projects/srm/src/app/area-search-selector/area-search-selector.component.html
@@ -20,7 +20,7 @@
     >באיזור המפה</button>
     <input class='area focusable' #area
            [class.active]='state.searching || !!state.area_'
-           [placeholder]='layout.desktop() ? (state.inputPlaceholder | async) : ""'
+           [placeholder]='state.inputPlaceholder | async'
            aria-label='חיפוש איזורים בארץ'
            (focus)='state.focusInput()'
            (blur)='state.blurInput()'

diff --git a/projects/srm/src/app/area-search-selector/area-search-selector.component.less b/projects/srm/src/app/area-search-selector/area-search-selector.component.less
@@ -106,6 +106,7 @@
             font-weight: 400;
             line-height: 20px;
              cursor: text;
+             container: area-select-input / inline-size;
 
             .background-image;
             background-size: 24px;
@@ -118,6 +119,10 @@
                 font-size: 16px;
                 font-weight: 400;
                 line-height: 20px;
+
+                @container area-select-input (max-width: 50px) {
+                    color: transparent;
+                }
             }
             &:focus {
                 outline: none;