Skip to content

Commit 38317fd

Browse files
jsvigneshkannajsvigneshkanna
committed
navbar plagarism removed
1 parent 939cf5c commit 38317fd

File tree

8 files changed

+774
-406
lines changed

8 files changed

+774
-406
lines changed

‎tailwind_components/navbars/animated_navbar.jsx‎

Lines changed: 122 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,63 +1,128 @@
1-
import { stripIndent } from "react-codepen-prefill-embed";
1+
import {stripIndent} from "react-codepen-prefill-embed";
22

3-
const animated_navbar = stripIndent`<div class="bg-gray-50">
4-
<nav class="relative my-3 mb-3 flex flex-wrap items-center justify-between bg-indigo-500 px-2 pt-1">
5-
<div class="container mx-auto flex flex-wrap items-center justify-between">
6-
<div class="static block w-auto justify-start">
7-
<a class="mr-4 inline-block whitespace-nowrap text-sm font-bold uppercase leading-relaxed text-white" href="#pablo"> Navbar </a>
8-
</div>
9-
<div class="flex items-center" id="example-navbar-warning">
10-
<ul class="ml-auto flex list-none flex-row">
11-
<li class="nav-item rounded-t-xl hover:bg-white">
12-
<a class="flex items-center px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-500" href="#pablo">
13-
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-layout-dashboard mr-1" width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
14-
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
15-
<path d="M4 4h6v8h-6z" />
16-
<path d="M4 16h6v4h-6z" />
17-
<path d="M14 12h6v8h-6z" />
18-
<path d="M14 4h6v4h-6z" />
19-
</svg>
20-
Dashbord
3+
const animated_navbar = stripIndent`
4+
<div class="h-screen bg-sky-300">
5+
<nav
6+
class="relative my-3 mb-3 flex flex-wrap items-center justify-between bg-sky-700 px-2 pt-1"
7+
>
8+
<div class="container mx-auto flex flex-wrap items-center justify-between">
9+
<div class="static block w-auto justify-start">
10+
<a
11+
class="mr-4 inline-block whitespace-nowrap text-sm font-bold uppercase leading-relaxed text-white"
12+
href="https://tailwindcsscomponents.vercel.app/"
13+
target="_blank"
14+
rel="noreferrer"
15+
>
16+
VK Tailwind
2117
</a>
22-
</li>
23-
<li class="nav-item rounded-t-xl hover:bg-white">
24-
<a class="flex items-center px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-500" href="#pablo">
25-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-rolodex mr-1" viewBox="0 0 16 16">
26-
<path d="M8 9.05a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z" />
27-
<path d="M1 1a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h.5a.5.5 0 0 0 .5-.5.5.5 0 0 1 1 0 .5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5.5.5 0 0 1 1 0 .5.5 0 0 0 .5.5h.5a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H6.707L6 1.293A1 1 0 0 0 5.293 1H1Zm0 1h4.293L6 2.707A1 1 0 0 0 6.707 3H15v10h-.085a1.5 1.5 0 0 0-2.4-.63C11.885 11.223 10.554 10 8 10c-2.555 0-3.886 1.224-4.514 2.37a1.5 1.5 0 0 0-2.4.63H1V2Z" />
28-
</svg>
29-
Address
30-
</a>
31-
</li>
32-
<li class="nav-item rounded-t-xl hover:bg-white">
33-
<a class="flex items-center px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-500" href="#pablo">
34-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-earmark-break mr-1" viewBox="0 0 16 16">
35-
<path d="M14 4.5V9h-1V4.5h-2A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v7H2V2a2 2 0 0 1 2-2h5.5L14 4.5zM13 12h1v2a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-2h1v2a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-2zM.5 10a.5.5 0 0 0 0 1h15a.5.5 0 0 0 0-1H.5z" />
36-
</svg>
37-
Components
38-
</a>
39-
</li>
40-
<li class="nav-item rounded-t-xl hover:bg-white">
41-
<a class="flex items-center px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-500" href="#pablo">
42-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-calendar2-week mr-1" viewBox="0 0 16 16">
43-
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM2 2a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H2z" />
44-
<path d="M2.5 4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5H3a.5.5 0 0 1-.5-.5V4zM11 7.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1zm-3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1zm-5 3a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z" />
45-
</svg>
46-
Calender
47-
</a>
48-
</li>
49-
<li class="nav-item rounded-t-xl hover:bg-white">
50-
<a class="flex items-center px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-500" href="#pablo">
51-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-earmark-bar-graph-fill mr-1" viewBox="0 0 16 16">
52-
<path d="M9.293 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.707A1 1 0 0 0 13.707 4L10 .293A1 1 0 0 0 9.293 0zM9.5 3.5v-2l3 3h-2a1 1 0 0 1-1-1zm.5 10v-6a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5zm-2.5.5a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-.5.5h-1zm-3 0a.5.5 0 0 1-.5-.5v-2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5h-1z" />
53-
</svg>
54-
Charts
55-
</a>
56-
</li>
57-
</ul>
58-
</div>
18+
</div>
19+
<div class="flex items-center" id="example-navbar-warning">
20+
<ul class="ml-auto flex list-none flex-row">
21+
<li class="nav-item rounded-t-xl hover:bg-sky-300">
22+
<a
23+
class="flex items-center gap-2 px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-800"
24+
href="https://tailwindcsscomponents.vercel.app/"
25+
target="_blank"
26+
rel="noreferrer"
27+
>
28+
<svg
29+
xmlns="http://www.w3.org/2000/svg"
30+
fill="none"
31+
viewBox="0 0 24 24"
32+
stroke-width="1.5"
33+
stroke="currentColor"
34+
class="h-6 w-6"
35+
>
36+
<path
37+
stroke-linecap="round"
38+
stroke-linejoin="round"
39+
d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25"
40+
/>
41+
</svg>
42+
43+
Home
44+
</a>
45+
</li>
46+
<li class="nav-item rounded-t-xl hover:bg-sky-300">
47+
<a
48+
class="flex items-center gap-2 px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-800"
49+
href="https://tailwindcsscomponents.vercel.app/"
50+
target="_blank"
51+
rel="noreferrer"
52+
>
53+
<svg
54+
xmlns="http://www.w3.org/2000/svg"
55+
fill="none"
56+
viewBox="0 0 24 24"
57+
stroke-width="1.5"
58+
stroke="currentColor"
59+
class="h-6 w-6"
60+
>
61+
<path
62+
stroke-linecap="round"
63+
stroke-linejoin="round"
64+
d="M3.75 3v11.25A2.25 2.25 0 006 16.5h2.25M3.75 3h-1.5m1.5 0h16.5m0 0h1.5m-1.5 0v11.25A2.25 2.25 0 0118 16.5h-2.25m-7.5 0h7.5m-7.5 0l-1 3m8.5-3l1 3m0 0l.5 1.5m-.5-1.5h-9.5m0 0l-.5 1.5m.75-9l3-3 2.148 2.148A12.061 12.061 0 0116.5 7.605"
65+
/>
66+
</svg>
67+
68+
Component
69+
</a>
70+
</li>
71+
<li class="nav-item rounded-t-xl hover:bg-sky-300">
72+
<a
73+
class="flex items-center gap-2 px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-800"
74+
href="https://tailwindcsscomponents.vercel.app/"
75+
target="_blank"
76+
rel="noreferrer"
77+
>
78+
<svg
79+
xmlns="http://www.w3.org/2000/svg"
80+
fill="none"
81+
viewBox="0 0 24 24"
82+
stroke-width="1.5"
83+
stroke="currentColor"
84+
class="h-6 w-6"
85+
>
86+
<path
87+
stroke-linecap="round"
88+
stroke-linejoin="round"
89+
d="M4.26 10.147a60.436 60.436 0 00-.491 6.347A48.627 48.627 0 0112 20.904a48.627 48.627 0 018.232-4.41 60.46 60.46 0 00-.491-6.347m-15.482 0a50.57 50.57 0 00-2.658-.813A59.905 59.905 0 0112 3.493a59.902 59.902 0 0110.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.697 50.697 0 0112 13.489a50.702 50.702 0 017.74-3.342M6.75 15a.75.75 0 100-1.5.75.75 0 000 1.5zm0 0v-3.675A55.378 55.378 0 0112 8.443m-7.007 11.55A5.981 5.981 0 006.75 15.75v-1.5"
90+
/>
91+
</svg>
92+
93+
About Us
94+
</a>
95+
</li>
96+
<li class="nav-item rounded-t-xl hover:bg-sky-300">
97+
<a
98+
class="flex items-center gap-2 px-3 py-2 text-xs font-bold leading-snug text-white hover:text-indigo-800"
99+
href="https://tailwindcsscomponents.vercel.app/"
100+
target="_blank"
101+
rel="noreferrer"
102+
>
103+
<svg
104+
xmlns="http://www.w3.org/2000/svg"
105+
fill="none"
106+
viewBox="0 0 24 24"
107+
stroke-width="1.5"
108+
stroke="currentColor"
109+
class="h-6 w-6"
110+
>
111+
<path
112+
stroke-linecap="round"
113+
stroke-linejoin="round"
114+
d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23-.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.309 48.309 0 0112 21c-2.773 0-5.491-.235-8.135-.687-1.718-.293-2.3-2.379-1.067-3.61L5 14.5"
115+
/>
116+
</svg>
117+
118+
FAQs
119+
</a>
120+
</li>
121+
</ul>
122+
</div>
123+
</div>
124+
</nav>
59125
</div>
60-
</nav>
61126
`;
62127

63128
export default animated_navbar;

0 commit comments

Comments
 (0)