diff --git a/packages/apps/dashboard/ui-2024/src/assets/styles/_search.scss b/packages/apps/dashboard/ui-2024/src/assets/styles/_search.scss index 9e4c919a47..9c1b4902d6 100644 --- a/packages/apps/dashboard/ui-2024/src/assets/styles/_search.scss +++ b/packages/apps/dashboard/ui-2024/src/assets/styles/_search.scss @@ -6,7 +6,7 @@ #search-bar{ width: 100%; border-radius: 8px; - padding: 16px 85px 16px 17px; + // padding: 16px 85px 16px 17px; line-height: 24px; &:focus, &:focus-visible { @@ -20,18 +20,12 @@ } .search-close{ - position: absolute; - right: 56px; - top: 15px; cursor: pointer; } .search-button{ - position: absolute; - right: 4px; background-color: $secondary; border-radius: 8px; - top: 4px; svg{ font-size: 32px; } @@ -55,7 +49,6 @@ .search-button{ padding: 4px; - top: 5px; background: #1406B214; svg{ font-size: 24px; @@ -68,15 +61,8 @@ } } - .search-close{ - position: absolute; - right: 40px; - top: 13px; - font-size: 16px; - } - #search-bar{ - padding: 8px 68px 8px 16px; + padding: 8px 0; } @media (max-width: 1150px) { diff --git a/packages/apps/dashboard/ui-2024/src/components/Search/Search.tsx b/packages/apps/dashboard/ui-2024/src/components/Search/Search.tsx index cb934c4c17..0ff63580a4 100644 --- a/packages/apps/dashboard/ui-2024/src/components/Search/Search.tsx +++ b/packages/apps/dashboard/ui-2024/src/components/Search/Search.tsx @@ -38,6 +38,7 @@ const Search: FC<{ className?: string; displaySearchBar?: boolean }> = ({ const handleClearClick = () => { setInputValue(''); + setAddress(''); }; const handleInputBlur = () => { @@ -91,6 +92,10 @@ const Search: FC<{ className?: string; displaySearchBar?: boolean }> = ({ border: 'none', }, }, + '& .MuiInputBase-input': { + overflow: 'hidden', + textOverflow: 'ellipsis', + }, }} InputProps={{ sx: { @@ -102,6 +107,7 @@ const Search: FC<{ className?: string; displaySearchBar?: boolean }> = ({ color: `${colorPalette.sky.main}`, opacity: 1, }, + padding: '0 5px', }, startAdornment: ( = ({ width: displaySearchBar ? '100px' : '220px', height: '100%', backgroundColor: `${colorPalette.white}`, + marginLeft: '1rem', }} > = ({ ), endAdornment: inputValue && ( - + + + + ), }} /> - - - ); };