diff --git a/packages/app/src/components/Searcher/index.jsx b/packages/app/src/components/Searcher/index.jsx index 380a20cd..fc73a206 100755 --- a/packages/app/src/components/Searcher/index.jsx +++ b/packages/app/src/components/Searcher/index.jsx @@ -68,8 +68,11 @@ const Results = (props) => { } return
-

{createIconRender(decorator.icon)}{decorator.label}

+ + {createIconRender(decorator.icon)} + {decorator.label} + { results[type].map((item) => { return React.createElement(ResultRenders[type], { item, onClick: (...props) => handleOnClick(type, ...props) }) diff --git a/packages/app/src/components/Searcher/index.less b/packages/app/src/components/Searcher/index.less index 139f2f49..ce75ebd1 100755 --- a/packages/app/src/components/Searcher/index.less +++ b/packages/app/src/components/Searcher/index.less @@ -1,4 +1,6 @@ .searcher { + position: relative; + display: flex; flex-direction: column; @@ -7,6 +9,8 @@ transition: all 0.3s ease-in-out; + gap: 20px; + .ant-input-affix-wrapper { border: 0; padding: 0; @@ -34,6 +38,8 @@ } .results { + position: relative; + display: flex; flex-direction: column; @@ -43,37 +49,33 @@ width: 100%; padding: 10px; - margin-top: 20px; background-color: var(--background-color-primary); border-radius: 8px; + gap: 10px; + .category { + h3 { + font-size: 1rem; + font-weight: 600; + } + width: 100%; - margin-bottom: 20px; - - h3 { - font-size: 2rem; - font-weight: 600; - - margin-bottom: 10px; - } + gap: 10px; .suggestions { display: flex; flex-direction: column; align-items: flex-start; - width: 90%; - - margin: auto; + gap: 10px; .suggestion { width: 100%; - margin-bottom: 10px; padding: 10px; border-radius: 8px;