Skip to content

Commit 65fb689

Browse files
gholi-devgholi-dev
committed
update logo
1 parent 219d366 commit 65fb689

File tree

4 files changed

+97
-78
lines changed

4 files changed

+97
-78
lines changed

‎public/static/logo.svg‎

Lines changed: 24 additions & 7 deletions
Loading

‎src/components/Header/index.jsx‎

Lines changed: 58 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import React, {
33
useCallback,
44
useEffect,
55
useRef,
6-
useState
6+
useState,
77
} from "react";
88
import { GoSearch, GoRows } from "react-icons/go";
99
import { GoSun, GoMoon } from "react-icons/go";
@@ -17,7 +17,7 @@ import Link from "next/link";
1717

1818
const client = new MeiliSearch({
1919
host: "https://search.liara.ir",
20-
apiKey: "53c93d9ce3308e48a7ad701d4b402d3190324a09e1607f14baae9bd4f805bb11"
20+
apiKey: "53c93d9ce3308e48a7ad701d4b402d3190324a09e1607f14baae9bd4f805bb11",
2121
});
2222

2323
const Header = ({ setShowSidebar }) => {
@@ -42,10 +42,10 @@ const Header = ({ setShowSidebar }) => {
4242
});
4343

4444
useEffect(() => {
45-
const handleKeydown = event => {
45+
const handleKeydown = (event) => {
4646
if ((event.metaKey || event.ctrlKey) && event.key === "k") {
4747
event.preventDefault();
48-
setSearchOpen(prev => !prev);
48+
setSearchOpen((prev) => !prev);
4949
}
5050
if (event.key === "Escape") {
5151
setSearchOpen(false);
@@ -57,43 +57,43 @@ const Header = ({ setShowSidebar }) => {
5757
};
5858
}, []);
5959

60-
useEffect(
61-
() => {
62-
if (darkMode) {
63-
document.documentElement.classList.add("dark");
64-
} else {
65-
document.documentElement.classList.remove("dark");
66-
}
67-
localStorage.setItem("dark", JSON.stringify(darkMode));
68-
},
69-
[darkMode]
70-
);
60+
useEffect(() => {
61+
if (darkMode) {
62+
document.documentElement.classList.add("dark");
63+
} else {
64+
document.documentElement.classList.remove("dark");
65+
}
66+
localStorage.setItem("dark", JSON.stringify(darkMode));
67+
}, [darkMode]);
7168

7269
const toggleDarkMode = () => {
7370
const newMode = !darkMode;
7471
setDarkMode(newMode);
7572
};
7673

77-
const handleMeiliSearch = value => {
74+
const handleMeiliSearch = (value) => {
7875
const userAgent = new UAParser(window.navigator.userAgent);
7976
const eventData = {
8077
term: value,
8178
browser: userAgent.getBrowser().name,
8279
browserVersion: userAgent.getBrowser().version,
8380
os: userAgent.getOS().name,
84-
osVersion: userAgent.getOS().version
81+
osVersion: userAgent.getOS().version,
8582
};
8683

87-
return client.index("docs").search(value, { limit: 10 }).then(res => {
88-
setResults(res.hits);
89-
setNotFound(value != "" && res.hits.length == 0);
90-
if (res.hits.length == 0) {
91-
setCurrent(undefined);
92-
}
93-
});
84+
return client
85+
.index("docs")
86+
.search(value, { limit: 10 })
87+
.then((res) => {
88+
setResults(res.hits);
89+
setNotFound(value != "" && res.hits.length == 0);
90+
if (res.hits.length == 0) {
91+
setCurrent(undefined);
92+
}
93+
});
9494
};
9595

96-
const handleChangeValue = e => {
96+
const handleChangeValue = (e) => {
9797
const { value } = e.target;
9898
setValue(value);
9999
if (value != "") {
@@ -107,7 +107,7 @@ const Header = ({ setShowSidebar }) => {
107107
setSearchOpen(!searchOpen);
108108
};
109109

110-
const handleArrow = arrow => {
110+
const handleArrow = (arrow) => {
111111
switch (arrow.keyCode) {
112112
case 38:
113113
const Negative = index > 0 ? index - 1 : results.length - 1;
@@ -128,21 +128,18 @@ const Header = ({ setShowSidebar }) => {
128128
break;
129129
}
130130
};
131-
useEffect(
132-
() => {
133-
if (results.length == 0) return;
134-
setCurrent(results.filter((_, idx) => idx == index)["0"]);
135-
if (value == "") {
136-
setValue(false);
137-
}
138-
},
139-
[results, index]
140-
);
131+
useEffect(() => {
132+
if (results.length == 0) return;
133+
setCurrent(results.filter((_, idx) => idx == index)["0"]);
134+
if (value == "") {
135+
setValue(false);
136+
}
137+
}, [results, index]);
141138

142-
const handleHover = item => {
139+
const handleHover = (item) => {
143140
setCurrent(results.filter((_, idx) => idx == item)["0"]);
144141
};
145-
const handleSuggestion = value => {
142+
const handleSuggestion = (value) => {
146143
handleMeiliSearch(value);
147144
return (valueRef.current.value = value);
148145
};
@@ -154,7 +151,7 @@ const Header = ({ setShowSidebar }) => {
154151
href="/"
155152
className="flex md:hidden mt-4 mb-3 items-center gap-2 font-semibold"
156153
>
157-
<img className="logo-sidebar" src={"/static/logo.svg"} width="55" />
154+
<img src={"/static/logo.svg"} width="60" />
158155
<span className="text-[11px] px-1 py-0 font-medium text-[#fff] bg-[#333] rounded">
159156
مستندات
160157
</span>
@@ -170,8 +167,7 @@ const Header = ({ setShowSidebar }) => {
170167
جستجو کنید
171168
</div>
172169
<div className="badge-cmd-k hidden absolute md:block top-[5px] left-[5px] text-[15px] h-[21px] w-[40px] text-[#707070] bg-[#ededed] px-1 rounded border border-[#d7d7d7]">
173-
K
174-
<span className="text-[10px] mr-[5px]">⌘</span>
170+
K<span className="text-[10px] mr-[5px]">⌘</span>
175171
</div>
176172
</button>
177173

@@ -208,9 +204,9 @@ const Header = ({ setShowSidebar }) => {
208204
</button>
209205
</div>
210206
</nav>
211-
{searchOpen &&
207+
{searchOpen && (
212208
<Fragment>
213-
<div className="search-box" onKeyDown={e => handleArrow(e)}>
209+
<div className="search-box" onKeyDown={(e) => handleArrow(e)}>
214210
<input
215211
ref={valueRef}
216212
placeholder="جستجو"
@@ -240,30 +236,35 @@ const Header = ({ setShowSidebar }) => {
240236
<div className="results">
241237
<ul>
242238
{results != "" &&
243-
results.map((item, index) =>
239+
results.map((item, index) => (
244240
<li key={index}>
245241
<Link
246242
href={item.element ? item.url + item.element : item.url}
247243
onClick={() => setSearchOpen(false)}
248-
className={`url_results ${current != undefined &&
244+
className={`url_results ${
245+
current != undefined &&
249246
item.id == current.id &&
250-
`current-result `}`}
247+
`current-result `
248+
}`}
251249
onMouseEnter={() => handleHover(index)}
252250
>
253251
<div className="platform_container">
254-
{item.platform &&
252+
{item.platform && (
255253
<div className="w-[30px] p-1 ml-3 bg-[#333] rounded-md">
256254
<PlatformIcon platform={item.platform} />
257-
</div>}
255+
</div>
256+
)}
258257
<p className="">
259258
{item.title}
260-
{item.type === "video" &&
259+
{item.type === "video" && (
261260
<Fragment>
262-
{" "}-{" "}
261+
{" "}
262+
-{" "}
263263
<span className="bg-[#2563eb22] px-2 text-[12px] py-1 rounded-lg">
264264
ویدیو
265265
</span>
266-
</Fragment>}
266+
</Fragment>
267+
)}
267268
</p>
268269
</div>
269270
<img
@@ -272,8 +273,8 @@ const Header = ({ setShowSidebar }) => {
272273
/>
273274
</Link>
274275
</li>
275-
)}
276-
{notFound &&
276+
))}
277+
{notFound && (
277278
<li>
278279
<a className="url_results">
279280
<div className="platform_container">
@@ -283,12 +284,14 @@ const Header = ({ setShowSidebar }) => {
283284
</p>
284285
</div>
285286
</a>
286-
</li>}
287+
</li>
288+
)}
287289
</ul>
288290
</div>
289291
</div>
290292
<span className="search-box-effect" onClick={handleSearch} />
291-
</Fragment>}
293+
</Fragment>
294+
)}
292295
</header>
293296
);
294297
};

‎src/components/Sidebar/index.jsx‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -55,23 +55,24 @@ const Sidebar = ({ setShowSidebar, showSidebar }) => {
5555

5656
return (
5757
<Fragment>
58-
{showSidebar &&
58+
{showSidebar && (
5959
<div
6060
onClick={() => setShowSidebar(false)}
6161
className="bg-[#0006] z-[40] backdrop-blur-sm fixed top-0 left-0 w-full h-full"
62-
/>}
62+
/>
63+
)}
6364
<sidebar
64-
className={`py-4 ${showSidebar
65-
? "block"
66-
: "hidden"} z-50 p-8 overflow-auto bg-[#fbfbfb] top-0 fixed md:block w-[300px] h-[100vh] border-l border-[#00000015]`}
65+
className={`py-4 ${
66+
showSidebar ? "block" : "hidden"
67+
} z-50 p-8 overflow-auto bg-[#fbfbfb] top-0 fixed md:block w-[300px] h-[100vh] border-l border-[#00000015]`}
6768
>
6869
<div
69-
className={`transition-all duration-300 ease-in-out transform ${!isVisible
70-
? " opacity-50"
71-
: " opacity-100"} `}
70+
className={`transition-all duration-300 ease-in-out transform ${
71+
!isVisible ? " opacity-50" : " opacity-100"
72+
} `}
7273
>
7374
<Link href="/" className="flex mb-3 items-center gap-2 font-semibold">
74-
<img className="logo-sidebar" src={"/static/logo.svg"} width="55" />
75+
<img src={"/static/logo.svg"} width="60" />
7576

7677
<span className="text-[11px] px-1 py-0 font-medium text-[#fff] bg-[#333] rounded">
7778
مستندات
@@ -80,7 +81,7 @@ const Sidebar = ({ setShowSidebar, showSidebar }) => {
8081
<div id="sidebar-items">
8182
<ul className="mt-8">
8283
{handleSidebarContent().length &&
83-
handleSidebarContent().map(item => {
84+
handleSidebarContent().map((item) => {
8485
if (item.hr) {
8586
return <hr className="my-4" />;
8687
}
@@ -97,8 +98,10 @@ const Sidebar = ({ setShowSidebar, showSidebar }) => {
9798
return (
9899
<Link href={item.link}>
99100
<li
100-
className={`flex mt-3 pr-2 items-center gap-3 ${isActive &&
101-
"text-[#2196f3] border-r-2 border-[#2196f3]"}`}
101+
className={`flex mt-3 pr-2 items-center gap-3 ${
102+
isActive &&
103+
"text-[#2196f3] border-r-2 border-[#2196f3]"
104+
}`}
102105
>
103106
{item.icon}
104107
{item.title}

‎src/styles/dark.css‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,10 +33,6 @@ img {
3333
border: none !important;
3434
}
3535

36-
.dark .logo-sidebar {
37-
filter: invert(1);
38-
}
39-
4036
.dark hr {
4137
border-color: #fff2;
4238
}

0 commit comments

Comments
 (0)