Skip to content

Commit 4e3dd08

Browse files
amraniamrani
committed
update navigation
1 parent b6db0da commit 4e3dd08

File tree

4 files changed

+28
-102
lines changed

4 files changed

+28
-102
lines changed

‎components/Layout.jsx

-2
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,6 @@ const Layout = ({ children }) => (
1414
<main>
1515
<div className="w-full">{children}</div>
1616
</main>
17-
18-
<footer className="flex h-24 w-full items-center justify-center border-t"></footer>
1917
</div>
2018
</div>
2119
);

‎components/Nav.jsx

+27-99
Original file line numberDiff line numberDiff line change
@@ -7,126 +7,54 @@ const Nav = () => {
77

88
const navLinkClassNames = (active = false) => {
99
const defaults =
10-
"inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium";
10+
"inline-flex items-center rounded-md px-3 py-2 text-xs font-medium";
1111
return active
12-
? `${defaults} border-gray-400 text-gray-900`
13-
: `${defaults} border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700`;
12+
? `${defaults} bg-green-300 text-gray-900`
13+
: `${defaults} bg-gray-100 text-gray-900`;
1414
};
1515

1616
return (
1717
<nav className="bg-white shadow">
1818
<div className="mx-auto max-w-full px-4 sm:px-6 lg:px-8">
19-
<div className="flex h-16 justify-between">
20-
<div className="flex">
21-
<div className="hidden sm:flex flex-shrink-0 items-center">
19+
<div className="flex h-16">
20+
<div className="flex justify-between w-full items-center">
21+
<div className="hidden sm:flex">
2222
<img
2323
className="h-8 w-auto"
2424
src="/sample_logo.png"
2525
alt="Your Company"
2626
/>
2727
</div>
28-
<div className="ml-6 flex space-x-8">
29-
<a href="/" className={navLinkClassNames(router.asPath == "/")}>
30-
Dashboard
31-
</a>
32-
33-
<a
34-
href="/workflows"
35-
className={navLinkClassNames(
36-
router.asPath.startsWith("/workflows")
37-
)}
38-
>
39-
Workflows
40-
</a>
41-
42-
<a
43-
target="_blank"
44-
href="https://calendly.com/embedworkflow/connect"
45-
className={navLinkClassNames()}
46-
>
47-
Get Demo
48-
</a>
49-
</div>
50-
</div>
51-
52-
<div className="hidden sm:ml-6 sm:flex sm:items-center">
53-
<button
54-
type="button"
55-
className="relative rounded-full bg-white p-1 text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2"
56-
>
57-
<span className="absolute -inset-1.5"></span>
58-
<span className="sr-only">View notifications</span>
59-
<svg
60-
className="h-6 w-6"
61-
fill="none"
62-
viewBox="0 0 24 24"
63-
strokeWidth="1.5"
64-
stroke="currentColor"
65-
aria-hidden="true"
66-
>
67-
<path
68-
strokeLinecap="round"
69-
strokeLinejoin="round"
70-
d="M14.857 17.082a23.848 23.848 0 005.454-1.31A8.967 8.967 0 0118 9.75v-.7V9A6 6 0 006 9v.75a8.967 8.967 0 01-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 01-5.714 0m5.714 0a3 3 0 11-5.714 0"
71-
/>
72-
</svg>
73-
</button>
74-
75-
<div className="relative ml-3">
76-
<div>
77-
<button
78-
type="button"
79-
className="relative flex rounded-full bg-white text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2"
80-
id="user-menu-button"
81-
aria-expanded="false"
82-
aria-haspopup="true"
83-
>
84-
<span className="absolute -inset-1.5"></span>
85-
<span className="sr-only">Display for fake user menu</span>
86-
<img
87-
className="h-8 w-8 rounded-full"
88-
src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
89-
alt=""
90-
/>
91-
</button>
92-
</div>
93-
94-
<div
95-
className="hidden absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
96-
role="menu"
97-
aria-orientation="vertical"
98-
aria-labelledby="user-menu-button"
99-
tabIndex="-1"
100-
>
101-
<a
102-
href="#"
103-
className="block px-4 py-2 text-sm text-gray-700"
104-
role="menuitem"
105-
tabIndex="-1"
106-
id="user-menu-item-0"
107-
>
108-
Your Profile
28+
<div className="flex">
29+
<div className="flex space-x-3 lg:py-2">
30+
<a href="/" className={navLinkClassNames(router.asPath == "/")}>
31+
Dashboard
10932
</a>
33+
11034
<a
111-
href="#"
112-
className="block px-4 py-2 text-sm text-gray-700"
113-
role="menuitem"
114-
tabIndex="-1"
115-
id="user-menu-item-1"
35+
href="/workflows"
36+
className={navLinkClassNames(
37+
router.asPath.startsWith("/workflows")
38+
)}
11639
>
117-
Settings
40+
Workflows
11841
</a>
42+
11943
<a
120-
href="#"
121-
className="block px-4 py-2 text-sm text-gray-700"
122-
role="menuitem"
123-
tabIndex="-1"
124-
id="user-menu-item-2"
44+
target="_blank"
45+
href="https://calendly.com/embedworkflow/connect"
46+
className={navLinkClassNames()}
12547
>
126-
Sign out
48+
Get Demo
12749
</a>
12850
</div>
12951
</div>
52+
53+
<div className="hidden sm:flex">
54+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" className="text-green-900 h-6 w-6">
55+
<path fillRule="evenodd" d="M11.078 2.25c-.917 0-1.699.663-1.85 1.567L9.05 4.889c-.02.12-.115.26-.297.348a7.493 7.493 0 0 0-.986.57c-.166.115-.334.126-.45.083L6.3 5.508a1.875 1.875 0 0 0-2.282.819l-.922 1.597a1.875 1.875 0 0 0 .432 2.385l.84.692c.095.078.17.229.154.43a7.598 7.598 0 0 0 0 1.139c.015.2-.059.352-.153.43l-.841.692a1.875 1.875 0 0 0-.432 2.385l.922 1.597a1.875 1.875 0 0 0 2.282.818l1.019-.382c.115-.043.283-.031.45.082.312.214.641.405.985.57.182.088.277.228.297.35l.178 1.071c.151.904.933 1.567 1.85 1.567h1.844c.916 0 1.699-.663 1.85-1.567l.178-1.072c.02-.12.114-.26.297-.349.344-.165.673-.356.985-.57.167-.114.335-.125.45-.082l1.02.382a1.875 1.875 0 0 0 2.28-.819l.923-1.597a1.875 1.875 0 0 0-.432-2.385l-.84-.692c-.095-.078-.17-.229-.154-.43a7.614 7.614 0 0 0 0-1.139c-.016-.2.059-.352.153-.43l.84-.692c.708-.582.891-1.59.433-2.385l-.922-1.597a1.875 1.875 0 0 0-2.282-.818l-1.02.382c-.114.043-.282.031-.449-.083a7.49 7.49 0 0 0-.985-.57c-.183-.087-.277-.227-.297-.348l-.179-1.072a1.875 1.875 0 0 0-1.85-1.567h-1.843ZM12 15.75a3.75 3.75 0 1 0 0-7.5 3.75 3.75 0 0 0 0 7.5Z" clipRule="evenodd" />
56+
</svg>
57+
</div>
13058
</div>
13159
</div>
13260
</div>

‎pages/users/[id]/workflows.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ const Workflows = (props) => {
8585
<Layout>
8686
<UserNavigator userId={id} />
8787

88-
<div className="mx-auto">
88+
<div className="mx-auto" style={{height: "calc(100vh - 200px)"}}>
8989
<link
9090
rel="stylesheet"
9191
media="screen"

‎public/sample_logo.png

-10.6 KB
Loading

0 commit comments

Comments
 (0)