RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-11 03:24:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

💄 Improve style

Browse Source
This commit is contained in:
SrGooglo 2023-05-09 22:56:50 +00:00
parent 74c20d3b24
commit a2b405ed74
2 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/app/src/components/Searcher/index.jsx
View File

@ -68,8 +68,11 @@ const Results = (props) => {
} }
return <div className="category" id={type}> return <div className="category" id={type}>
<h3>{createIconRender(decorator.icon)}{decorator.label}</h3>
<div className="suggestions"> <div className="suggestions">
<span>
<span className="icon">{createIconRender(decorator.icon)}</span>
<span className="label">{decorator.label}</span>
</span>
{ {
results[type].map((item) => { results[type].map((item) => {
return React.createElement(ResultRenders[type], { item, onClick: (...props) => handleOnClick(type, ...props) }) return React.createElement(ResultRenders[type], { item, onClick: (...props) => handleOnClick(type, ...props) })

28
packages/app/src/components/Searcher/index.less
View File

@ -1,4 +1,6 @@
.searcher { .searcher {
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -7,6 +9,8 @@
transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
gap: 20px;
.ant-input-affix-wrapper { .ant-input-affix-wrapper {
border: 0; border: 0;
padding: 0; padding: 0;
@ -34,6 +38,8 @@
} }
.results { .results {
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -43,37 +49,33 @@
width: 100%; width: 100%;
padding: 10px; padding: 10px;
margin-top: 20px;
background-color: var(--background-color-primary); background-color: var(--background-color-primary);
border-radius: 8px; border-radius: 8px;
gap: 10px;
.category { .category {
h3 {
font-size: 1rem;
font-weight: 600;
}
width: 100%; width: 100%;
margin-bottom: 20px; gap: 10px;
h3 {
font-size: 2rem;
font-weight: 600;
margin-bottom: 10px;
}
.suggestions { .suggestions {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
width: 90%; gap: 10px;
margin: auto;
.suggestion { .suggestion {
width: 100%; width: 100%;
margin-bottom: 10px;
padding: 10px; padding: 10px;
border-radius: 8px; border-radius: 8px;