acid-info/logos-press-engine
1
0
Fork 0
mirror of https://github.com/acid-info/logos-press-engine.git synced 2025-02-23 22:58:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement search component

Browse Source
This commit is contained in:
jinhojang6 2023-04-19 00:23:16 +09:00
parent 18d5c18b03
commit d7669494e9
7 changed files with 28 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -9,7 +9,7 @@
"lint": "next lint" "lint": "next lint"
}, },
"dependencies": { "dependencies": {
"@acid-info/lsd-react": "^0.1.0-alpha.2", "@acid-info/lsd-react": "^0.1.0-alpha.3",
"@emotion/react": "^11.10.6", "@emotion/react": "^11.10.6",
"@emotion/styled": "^11.10.6", "@emotion/styled": "^11.10.6",
"@hookstate/core": "^4.0.1", "@hookstate/core": "^4.0.1",

0
src/components/.placeholder
View File

8
src/components/Search/Search.module.css Normal file
View File

@ -0,0 +1,8 @@
.searchBox {
width: 100% !important;
}
.searchBox > div {
border-left: none !important;
border-right: none !important;
}

12
src/components/Search/Search.tsx Normal file
View File

@ -0,0 +1,12 @@
import { Autocomplete } from "@acid-info/lsd-react";
import styles from "./Search.module.css";
export default function Search() {
return (
<Autocomplete
className={styles.searchBox}
placeholder="Search through the LPE posts.."
withIcon
/>
);
}

1
src/components/Search/index.ts Normal file
View File

@ -0,0 +1 @@
export { default as Search } from './Search';

8
src/layouts/HeaderLayout/Header.layout.tsx
View File

@ -1,8 +1,8 @@
import { Header } from "@/components/Header"; import { Header } from "@/components/Header";
import { HeaderTags } from "@/components/HeaderTags"; import { HeaderTags } from "@/components/HeaderTags";
import { Navbar } from "@/components/Navbar"; import { Navbar } from "@/components/Navbar";
import { Search } from "@/components/Search";
import useIsDarkState from "@/states/isDarkState/isDarkState"; import useIsDarkState from "@/states/isDarkState/isDarkState";
import { Autocomplete } from "@acid-info/lsd-react";
export default function HeaderLayout() { export default function HeaderLayout() {
const isDarkState = useIsDarkState(); const isDarkState = useIsDarkState();
@ -11,11 +11,7 @@ export default function HeaderLayout() {
<Navbar isDark={isDarkState.get()} toggle={isDarkState.toggle} /> <Navbar isDark={isDarkState.get()} toggle={isDarkState.toggle} />
<Header /> <Header />
<HeaderTags /> <HeaderTags />
<Autocomplete <Search />
placeholder="Search through the LPE posts.."
style={{ width: "100%" }}
withIcon
/>
</> </>
); );
} }

8
yarn.lock
View File

@ -2,10 +2,10 @@
# yarn lockfile v1 # yarn lockfile v1
"@acid-info/lsd-react@^0.1.0-alpha.2": "@acid-info/lsd-react@^0.1.0-alpha.3":
version "0.1.0-alpha.2" version "0.1.0-alpha.3"
resolved "https://registry.yarnpkg.com/@acid-info/lsd-react/-/lsd-react-0.1.0-alpha.2.tgz#79056cf561694454fcd3efc8eee1313a41ab041a" resolved "https://registry.yarnpkg.com/@acid-info/lsd-react/-/lsd-react-0.1.0-alpha.3.tgz#c0103a4a8f79c7c204aa8110a304ba70ada37b00"
integrity sha512-hZtNWqdRJ78ClolA22GfhJGs8ttxbZW3wnHi7JxLiZdtEF9huoiU/gTjIXW/q6v8mbweyHBvToELDOSauyUyKA== integrity sha512-oqeVWJQXTFh/6eqYLpraam7saf8CcprqWIIl08PYIL+LdBnrepfqVPyFZCEOGmtrM3khhNIpt/4l9LP9E7CI4g==
dependencies: dependencies:
"@emotion/react" "^11.10.5" "@emotion/react" "^11.10.5"
"@emotion/styled" "^11.10.5" "@emotion/styled" "^11.10.5"