Skip to content

Commit 4256ddb

Browse files
arghyaxcodesarghyaxcodes
authored
Merge pull request #48 from javaistic/Add-Menu-Component
Add Menu component in Homepage
2 parents a903529 + 7a29808 commit 4256ddb

File tree

5 files changed

+144
-6
lines changed

5 files changed

+144
-6
lines changed

‎package.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "javaistic",
3-
"version": "1.4.0",
3+
"version": "1.5.0",
44
"description": "The official website for Javaistic.",
55
"private": true,
66
"main": "index.js",
@@ -21,6 +21,8 @@
2121
"@badrap/bar-of-progress": "^0.1.2",
2222
"@docsearch/react": "^1.0.0-alpha.28",
2323
"@formspree/react": "^2.2.4",
24+
"@headlessui/react": "^1.4.2",
25+
"@heroicons/react": "^1.0.5",
2426
"@juggle/resize-observer": "^3.3.1",
2527
"@mdx-js/loader": "^1.6.22",
2628
"@mdx-js/react": "^1.6.22",
@@ -75,4 +77,4 @@
7577
"prettier": "^2.5.0",
7678
"typescript": "^4.5.2"
7779
}
78-
}
80+
}

‎redirects.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@
77
},
88
{ "source": "/docs/slug", "destination": "/docs/slug", "permanent": false },
99
{ "source": "/community", "destination": "https://discord.gg/RkHJqvK9r8", "permanent": false },
10+
{ "source": "/changelog", "destination":"https://javaistic-changelog.vercel.app/", "permanent": false },
11+
{ "source": "/license", "destination":" https://raw.githubusercontent.com/javaistic/javaistic/main/LICENSE", "permanent": false },
1012
{ "source": "/discord", "destination": "https://discord.gg/RkHJqvK9r8", "permanent": false },
1113
{ "source": "/status", "destination": "https://javaistic.betteruptime.com/", "permanent": false },
1214
{ "source": "/stats", "destination": "https://javaistic.betteruptime.com/", "permanent": false }

‎src/components/home/Menu.js‎

Lines changed: 123 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
import { Menu, Transition } from '@headlessui/react'
2+
import { ChevronDownIcon } from '@heroicons/react/solid'
3+
import { Fragment } from 'react'
4+
5+
function classNames(...classes) {
6+
return classes.filter(Boolean).join(' ')
7+
}
8+
9+
export default function MenuButton() {
10+
return (
11+
<Menu as="div" className="relative inline-block text-left">
12+
<div>
13+
<Menu.Button className="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-100">
14+
Menu
15+
<ChevronDownIcon className="-mr-1 ml-2 h-6 w-6" aria-hidden="true" />
16+
</Menu.Button>
17+
</div>
18+
19+
<Transition
20+
as={Fragment}
21+
enter="transition ease-out duration-100"
22+
enterFrom="transform opacity-0 scale-95"
23+
enterTo="transform opacity-100 scale-100"
24+
leave="transition ease-in duration-75"
25+
leaveFrom="transform opacity-100 scale-100"
26+
leaveTo="transform opacity-0 scale-95"
27+
>
28+
<Menu.Items className="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none">
29+
<div className="py-1">
30+
<Menu.Item>
31+
{({ active }) => (
32+
<a
33+
href="#"
34+
className={classNames(
35+
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
36+
'block px-4 py-2 text-base sm:hidden'
37+
)}
38+
>
39+
Documentation
40+
</a>
41+
)}
42+
</Menu.Item>
43+
<Menu.Item>
44+
{({ active }) => (
45+
<a
46+
href="#"
47+
className={classNames(
48+
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
49+
'block px-4 py-2 text-base'
50+
)}
51+
>
52+
About
53+
</a>
54+
)}
55+
</Menu.Item>
56+
<Menu.Item>
57+
{({ active }) => (
58+
<a
59+
href="/sponsors"
60+
className={classNames(
61+
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
62+
'block px-4 py-2 text-base'
63+
)}
64+
>
65+
Sponsors
66+
</a>
67+
)}
68+
</Menu.Item>
69+
<Menu.Item>
70+
{({ active }) => (
71+
<a
72+
href="/license"
73+
className={classNames(
74+
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
75+
'block px-4 py-2 text-base'
76+
)}
77+
>
78+
License
79+
</a>
80+
)}
81+
</Menu.Item>
82+
<Menu.Item>
83+
{({ active }) => (
84+
<a
85+
href="/changelog"
86+
className={classNames(
87+
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
88+
'block w-full text-left px-4 py-2 text-base'
89+
)}
90+
>
91+
Change Log
92+
</a>
93+
)}
94+
</Menu.Item>
95+
<Menu.Item>
96+
{({ active }) => (
97+
<a
98+
href="https://github.com/javaistic/javaistic"
99+
className={classNames(
100+
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
101+
'block px-4 py-2 text-base sm:hidden'
102+
)}
103+
>
104+
<div className="flex">
105+
<span className="sr-only">Javaistic on GitHub</span>
106+
<svg className="w-6 h-6 mr-2" viewBox="0 0 16 16" fill="currentColor">
107+
<path
108+
fillRule="evenodd"
109+
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"
110+
/>
111+
</svg>
112+
GitHub
113+
</div>
114+
</a>
115+
)}
116+
</Menu.Item>
117+
118+
</div>
119+
</Menu.Items>
120+
</Transition>
121+
</Menu>
122+
)
123+
}

‎src/pages/index.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { BigText, InlineCode, Paragraph, Widont } from '@/components/home/common'
22
import { Footer } from '@/components/home/Footer'
33
import { Hero } from '@/components/home/Hero'
4+
import MenuButton from '@/components/home/Menu'
45
import { Newsletter } from '@/components/home/Newsletter'
56
import { OpenSource } from '@/components/home/OpenSource'
67
import { Logo } from '@/components/Logo'
@@ -46,17 +47,17 @@ export default function Home() {
4647
</a>
4748
</NextLink>
4849
</div>
49-
<div className="flex items-center space-x-6 sm:space-x-10 ml-6 sm:ml-2">
50+
<div className="flex items-center space-x-4 sm:space-x-6 ml-6 sm:ml-2">
5051
<Search />
5152
<NextLink href="/docs">
52-
<a className="text-base leading-6 font-medium hover:text-gray-600 transition-colors duration-200 py-2">
53-
<span className="sm:hidden">Docs</span>
53+
<a className="hidden sm:inline text-base leading-4 font-medium hover:text-gray-600 px-4 py-3 rounded-md hover:bg-gray-100 transition-colors duration-200">
5454
<span className="hidden sm:inline">Documentation</span>
5555
</a>
5656
</NextLink>
57+
<MenuButton />
5758
<a
5859
href="https://github.com/javaistic/javaistic"
59-
className="text-gray-400 hover:text-gray-500 transition-colors duration-200"
60+
className="hidden sm:inline text-gray-400 hover:text-gray-500 transition-colors duration-200"
6061
>
6162
<span className="sr-only">Javaistic on GitHub</span>
6263
<svg width="24" height="24" viewBox="0 0 16 16" fill="currentColor">

‎yarn.lock‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1381,6 +1381,16 @@
13811381
resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-9.2.0.tgz#f3933a44e365864f4dad5db94158106d511e8131"
13821382
integrity sha512-sqKVVVOe5ivCaXDWivIJYVSaEgdQK9ul7a4Kity5Iw7u9+wBAPbX1RMSnLLmp7O4Vzj0WOWwMAJsTL00xwaNug==
13831383

1384+
"@headlessui/react@^1.4.2":
1385+
version "1.4.2"
1386+
resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-1.4.2.tgz#87e264f190dbebbf8dfdd900530da973dad24576"
1387+
integrity sha512-N8tv7kLhg9qGKBkVdtg572BvKvWhmiudmeEpOCyNwzOsZHCXBtl8AazGikIfUS+vBoub20Fse3BjawXDVPPdug==
1388+
1389+
"@heroicons/react@^1.0.5":
1390+
version "1.0.5"
1391+
resolved "https://registry.yarnpkg.com/@heroicons/react/-/react-1.0.5.tgz#2fe4df9d33eb6ce6d5178a0f862e97b61c01e27d"
1392+
integrity sha512-UDMyLM2KavIu2vlWfMspapw9yii7aoLwzI2Hudx4fyoPwfKfxU8r3cL8dEBXOjcLG0/oOONZzbT14M1HoNtEcg==
1393+
13841394
"@juggle/resize-observer@^3.3.1":
13851395
version "3.3.1"
13861396
resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.3.1.tgz#b50a781709c81e10701004214340f25475a171a0"

0 commit comments

Comments
 (0)