Commit
•
cac934a
1
Parent(s):
26a5802
working on the chrome
Browse files
src/components/chrome/index.tsx
ADDED
@@ -0,0 +1,46 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import svg1 from "./svg1.svg"
|
2 |
+
import svg2 from "./svg2.svg"
|
3 |
+
import svg3 from "./svg3.svg"
|
4 |
+
|
5 |
+
export function HuggingFaceChrome() {
|
6 |
+
return (
|
7 |
+
<div className="
|
8 |
+
from-gray-50-to-white text-md shadow-alternate fixed
|
9 |
+
right-6 top-5 z-20 flex h-[40px] items-stretch gap-3
|
10 |
+
overflow-hidden rounded-xl
|
11 |
+
border border-gray-200 bg-gradient-to-t pl-4
|
12 |
+
text-gray-500 dark:border-gray-800 max-sm:hidden
|
13 |
+
">
|
14 |
+
<div className="flex flex-none items-center">
|
15 |
+
<div className="relative mr-1.5 flex items-center">
|
16 |
+
<img alt="" className="w-3.5 h-3.5 rounded-full flex-none" src="https://cdn-avatars.huggingface.co/v1/production/uploads/64f73f25098581ab15e2f5ad/d2mDoZd292LK7j6ZT4mNX.png" crossOrigin="anonymous" />
|
17 |
+
</div>
|
18 |
+
<a href="/jbilcke-hf" className="hover:text-blue-600">enzostvs</a>
|
19 |
+
<div className="mx-0.5 text-gray-300">/</div>
|
20 |
+
<a className="font-mono font-semibold text-gray-800 hover:text-blue-600" href="/spaces/jbilcke-hf/ai-stories-factory">ai-stories-factory</a>
|
21 |
+
</div>
|
22 |
+
<div className="inline-flex items-center overflow-hidden whitespace-nowrap rounded-md border bg-white text-sm leading-none text-gray-500 flex-none self-center ">
|
23 |
+
<button className="relative flex items-center overflow-hidden from-red-50 to-transparent dark:from-red-900 p-1 hover:bg-gradient-to-t focus:outline-none" title="Unlike">
|
24 |
+
{
|
25 |
+
// svg1
|
26 |
+
} {
|
27 |
+
//svg2
|
28 |
+
}
|
29 |
+
<span className="ml-4 pl-0.5 hidden">like</span>
|
30 |
+
</button>
|
31 |
+
<button
|
32 |
+
className="flex items-center border-l px-1.5 py-1 text-gray-400 hover:bg-gray-50 focus:bg-gray-100 focus:outline-none dark:hover:bg-gray-900 dark:focus:bg-gray-800"
|
33 |
+
title="See users who liked this repository">
|
34 |
+
TODO
|
35 |
+
</button>
|
36 |
+
</div>
|
37 |
+
<button
|
38 |
+
className="relative flex h-[38px] w-[38px] items-center justify-center border-l border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-800"
|
39 |
+
title="Show space menu">
|
40 |
+
{
|
41 |
+
//svg3
|
42 |
+
}
|
43 |
+
</button>
|
44 |
+
</div>
|
45 |
+
)
|
46 |
+
}
|
src/components/chrome/svg1.svg
ADDED
src/components/chrome/svg2.svg
ADDED
src/components/chrome/svg3.svg
ADDED