Skip to content

Commit e8f3bfe

Browse files
vinzvincivinzvinci
authored
Merge pull request WebXDAO#520 from Anmol-Baranwal/hack_link_component
feat: use Link component rather than anchor tag
2 parents 76191ed + ce1de1f commit e8f3bfe

File tree

18 files changed

+328
-264
lines changed

18 files changed

+328
-264
lines changed

‎backup src/components/Global/Blogs.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,11 +55,11 @@ const Blogs = ({ articles, contentOnly = false, show = articles.length }) => {
5555
</div>
5656
{!contentOnly && (
5757
<div className="flex justify-center">
58-
<a href="https://dev.to/WebXDAO" target="_blank" rel="noreferrer">
58+
<Link href="https://dev.to/WebXDAO" target="_blank" rel="noreferrer">
5959
<button className="bg-gray-700 text-white mx-auto lg:mx-0 rounded-md py-2 px-8 shadow transform transition hover:scale-85 hover:shadow-lg duration-300 ease-in-out">
6060
See All
6161
</button>
62-
</a>
62+
</Link>
6363
</div>
6464
)}
6565
</section>

‎backup src/components/Global/Footer.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { SiGithubsponsors } from "react-icons/si";
21
import Link from "next/link";
2+
import { SiGithubsponsors } from "react-icons/si";
33

44
const navigation = [
55
{
@@ -39,33 +39,33 @@ const navigation = [
3939
const Footer = () => {
4040
return (
4141
<footer className="bg-transparent">
42-
<div className="max-w-screen-xl px-4 pt-16 pb-6 mx-auto sm:px-6 lg:px-8 lg:pt-24">
42+
<div className="mx-auto max-w-screen-xl px-4 pb-6 pt-16 sm:px-6 lg:px-8 lg:pt-24">
4343
<div className="grid grid-cols-1 gap-8 lg:grid-cols-3">
4444
<div>
4545
<div className="flex justify-center text-teal-600 sm:justify-start">
46-
<a href="https://webxdao.xyz">
46+
<Link href="https://webxdao.xyz">
4747
<span className="sr-only">WebX DAO</span>
48-
<img className="w-auto sm:h-14 md:h-16 h-12" src="/images/logo/logo.png" alt="" />
49-
</a>
48+
<img className="h-12 w-auto sm:h-14 md:h-16" src="/images/logo/logo.png" alt="" />
49+
</Link>
5050
</div>
5151
{/*
5252
<p className="max-w-md mx-auto mt-6 leading-relaxed text-center text-white/80 sm:max-w-xs sm:mx-0 sm:text-left">
5353
Add organization description here!
5454
</p> */}
5555
</div>
5656

57-
<div className="grid grid-cols-1 gap-8 sm:grid-cols-2 lg:col-span-2 md:grid-cols-4">
57+
<div className="grid grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-4 lg:col-span-2">
5858
{navigation.map((item) => (
5959
<>
6060
<div key={item.name + "_footer"} className="sm:text-left">
61-
<p className="text-lg sm:text-sm font-medium text-white/90">{item.name}</p>
61+
<p className="text-lg font-medium text-white/90 sm:text-sm">{item.name}</p>
6262

6363
<nav className="mt-4 sm:mt-3" aria-label={item.name}>
6464
<ul className="space-y-4 text-sm">
6565
{item.children.map((child) => (
6666
<li key={child.name}>
6767
<Link href="/">
68-
<span className="text-white/60 hover:text-white/95 transition cursor-pointer">
68+
<span className="cursor-pointer text-white/60 transition hover:text-white/95">
6969
{child.name}
7070
</span>
7171
</Link>
@@ -79,7 +79,7 @@ const Footer = () => {
7979
</div>
8080
</div>
8181

82-
<div className="pt-6 mt-5 sm:mt-12">
82+
<div className="mt-5 pt-6 sm:mt-12">
8383
<div className="text-center sm:flex sm:justify-between sm:text-left">
8484
<p className="text-sm text-gray-500">
8585
<span className="block sm:inline">All rights reserved.</span>
@@ -88,7 +88,7 @@ const Footer = () => {
8888
<p className="mt-1 text-sm text-gray-500 sm:order-first sm:mt-0">
8989
<span className="flex items-center justify-center">
9090
&copy; {new Date().getFullYear()} Made with
91-
<SiGithubsponsors className="w-3 h-3 m-2 text-pink-600" aria-hidden="true" />
91+
<SiGithubsponsors className="m-2 h-3 w-3 text-pink-600" aria-hidden="true" />
9292
by WebX DAO
9393
</span>
9494
</p>

‎backup src/components/Global/Navbar.js

Lines changed: 34 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import Link from "next/link";
2-
import { Fragment } from "react";
31
import { Popover, Transition } from "@headlessui/react";
42
import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
3+
import Link from "next/link";
4+
import { Fragment } from "react";
55
import { SiGithubsponsors } from "react-icons/si";
66

77
const navigation = [
@@ -21,47 +21,45 @@ const Navbar = () => {
2121
className="relative mx-auto mb-4 flex max-w-7xl items-center justify-between px-4 sm:px-6"
2222
aria-label="Global"
2323
>
24-
<div className="flex items-center flex-1">
25-
<div className="flex items-center justify-between w-full lg:w-auto">
24+
<div className="flex flex-1 items-center">
25+
<div className="flex w-full items-center justify-between lg:w-auto">
2626
<Link href="/">
27-
<a>
28-
<>
29-
<span className="sr-only ">WebX DAO</span>
30-
<img
31-
className="h-12 w-auto sm:h-12 md:h-[4.2rem] cursor-pointer"
32-
src="/images/logo/logo.png"
33-
alt="WebX DAO White Logo"
34-
/>
35-
</>
36-
</a>
27+
<span className="sr-only ">WebX DAO</span>
28+
<img
29+
className="h-12 w-auto cursor-pointer sm:h-12 md:h-[4.2rem]"
30+
src="/images/logo/logo.png"
31+
alt="WebX DAO White Logo"
32+
/>
3733
</Link>
38-
<div className="flex items-center justify-between -mr-2 lg:hidden ">
39-
<Popover.Button className="inline-flex items-center justify-center p-2 text-gray-400 bg-transparent rounded-md focus-ring-inset hover:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-white">
34+
<div className="-mr-2 flex items-center justify-between lg:hidden ">
35+
<Popover.Button className="focus-ring-inset inline-flex items-center justify-center rounded-md bg-transparent p-2 text-gray-400 hover:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-white">
4036
<span className="sr-only">Open main menu</span>
41-
<Bars3Icon className="w-6 h-6" aria-hidden="true" />
37+
<Bars3Icon className="h-6 w-6" aria-hidden="true" />
4238
</Popover.Button>
4339
</div>
4440
</div>
4541
{/* Add content here to get menu next to icon */}
4642
</div>
47-
<div className="hidden lg:flex lg:items-center md:space-x-6">
43+
<div className="hidden md:space-x-6 lg:flex lg:items-center">
4844
<div className="hidden space-x-8 lg:ml-10 lg:flex">
4945
{navigation.map((item) => (
50-
<Link href={item.href} key={item.name}>
51-
<a className="text-base font-medium text-white hover:text-gray-300">
52-
{item.name}
53-
</a>
46+
<Link
47+
href={item.href}
48+
key={item.name}
49+
className="text-base font-medium text-white hover:text-gray-300"
50+
>
51+
{item.name}
5452
</Link>
5553
))}
5654
</div>
5755

58-
<a
56+
<Link
5957
href="https://github.com/sponsors/WebXDAO"
60-
className="inline-flex items-center px-4 py-2 text-base font-medium text-gray-600 bg-gray-100 border border-transparent rounded-md hover:text-white/80 hover:bg-gray-700"
58+
className="inline-flex items-center rounded-md border border-transparent bg-gray-100 px-4 py-2 text-base font-medium text-gray-600 hover:bg-gray-700 hover:text-white/80"
6159
>
6260
GitHub
63-
<SiGithubsponsors className="w-5 h-5 ml-3 text-pink-600" aria-hidden="true" />
64-
</a>
61+
<SiGithubsponsors className="ml-3 h-5 w-5 text-pink-600" aria-hidden="true" />
62+
</Link>
6563
</div>
6664
</nav>
6765
</div>
@@ -77,34 +75,34 @@ const Navbar = () => {
7775
>
7876
<Popover.Panel
7977
focus
80-
className="absolute inset-x-0 top-0 z-10 p-2 transition origin-top transform lg:hidden"
78+
className="absolute inset-x-0 top-0 z-10 origin-top transform p-2 transition lg:hidden"
8179
>
82-
<div className="overflow-hidden rounded-lg shadow-xl backdrop-blur-sm bg-gradient1/50 ring-1 ring-white ring-opacity-5">
80+
<div className="bg-gradient1/50 overflow-hidden rounded-lg shadow-xl ring-1 ring-white ring-opacity-5 backdrop-blur-sm">
8381
<div className="flex items-center justify-between px-5 pt-4">
8482
<div>
8583
<img
86-
className="w-auto h-10 sm:h-12 md:h-14 lg:h-16"
84+
className="h-10 w-auto sm:h-12 md:h-14 lg:h-16"
8785
src="/images/logo/logo.png"
8886
alt="WebX DAO"
8987
/>
9088
</div>
9189
<div className="-mr-2">
92-
<Popover.Button className="inline-flex items-center justify-center p-2 text-gray-400 rounded-md bg-white/20 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-cyber-webx">
90+
<Popover.Button className="focus:ring-cyber-webx inline-flex items-center justify-center rounded-md bg-white/20 p-2 text-gray-400 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset">
9391
<span className="sr-only">Close menu</span>
94-
<XMarkIcon className="w-6 h-6" aria-hidden="true" />
92+
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
9593
</Popover.Button>
9694
</div>
9795
</div>
98-
<div className="pt-5 pb-6">
99-
<div className="px-2 space-y-1">
96+
<div className="pb-6 pt-5">
97+
<div className="space-y-1 px-2">
10098
{navigation.map((item) => (
101-
<a
99+
<Link
102100
key={item.name}
103101
href={item.href}
104-
className="block px-3 py-2 text-base font-medium text-gray-100 rounded-md hover:bg-gray-600"
102+
className="block rounded-md px-3 py-2 text-base font-medium text-gray-100 hover:bg-gray-600"
105103
>
106104
{item.name}
107-
</a>
105+
</Link>
108106
))}
109107
</div>
110108
{/* Add button here */}

‎backup src/components/Home/DeveloperPath.jsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { prefix } from "../../constants";
2+
import Link from "next/link";
23

34
const DeveloperPath = () => {
45
const devPaths = [
@@ -64,11 +65,11 @@ const DeveloperPath = () => {
6465
{text}
6566
</p>
6667
<div id="label" className="flex text-sm gap-x-3">
67-
<a href={url}>
68+
<Link href={url}>
6869
<button className="cursor-pointer font-semibold bg-blue-100 text-blue-600 rounded-md py-2 px-4 focus:outline-none">
6970
Take me there!
7071
</button>
71-
</a>
72+
</Link>
7273
<button className="font-semibold bg-blue-100 text-blue-600 rounded-md py-2 px-4 focus:outline-none">
7374
Development
7475
</button>
@@ -80,15 +81,15 @@ const DeveloperPath = () => {
8081
</div>
8182

8283
<div className="flex justify-center items-center py-5">
83-
<a
84+
<Link
8485
href="https://github.com/WebXDAO/blockchain-dev-path"
8586
target="_blank"
8687
rel="noreferrer"
8788
>
8889
<button className="bg-gray-700 text-white rounded-md py-2 px-8 shadow transform transition hover:scale-85 hover:shadow-lg duration-300 ease-in-out">
8990
See All
9091
</button>
91-
</a>
92+
</Link>
9293
</div>
9394
</div>
9495
</section>

‎backup src/components/Home/HeroSection/Hero.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1+
import Link from "next/link";
12
import CallToActionHero from "./CallToActionHero";
2-
import DiscordButton from "./DiscordButton";
33
import ContributeButton from "./ContributeButton";
4-
import Link from "next/link";
4+
import DiscordButton from "./DiscordButton";
55

66
export default function Hero() {
77
return (
88
<>
99
<div className="relative h-screen overflow-hidden">
1010
<section className="h-full">
11-
<div className="h-full pt-10 bg-transparent sm:pt-16 lg:overflow-hidden lg:pt-16 lg:pb-14">
11+
<div className="h-full bg-transparent pt-10 sm:pt-16 lg:overflow-hidden lg:pb-14 lg:pt-16">
1212
<div className="mx-auto max-w-7xl lg:px-8">
1313
<div className="lg:grid lg:grid-cols-2 lg:gap-8">
14-
<div className="max-w-md px-4 mx-auto text-center sm:max-w-2xl sm:px-6 sm:text-center lg:flex lg:items-center lg:px-0 lg:text-left">
14+
<div className="mx-auto max-w-md px-4 text-center sm:max-w-2xl sm:px-6 sm:text-center lg:flex lg:items-center lg:px-0 lg:text-left">
1515
<div className="lg:py-24">
1616
<h1 className="mt-4 text-5xl font-bold tracking-tight text-white sm:mt-5 sm:text-6xl lg:mt-6 xl:text-7xl">
1717
<span className="block">Build with us,</span>
@@ -24,7 +24,7 @@ export default function Hero() {
2424
<div className="mt-8 sm:mt-6">
2525
<div className="sm:mx-auto sm:max-w-7xl">
2626
<div className="sm:flex">
27-
<div className="flex flex-col md:items-center md:justify-center lg:items-start lg:justify-start w-full mb-6 sm:mt-0 md:flex-row gap-x-4 gap-y-4">
27+
<div className="mb-6 flex w-full flex-col gap-x-4 gap-y-4 sm:mt-0 md:flex-row md:items-center md:justify-center lg:items-start lg:justify-start">
2828
<DiscordButton></DiscordButton>
2929
<ContributeButton></ContributeButton>
3030
</div>
@@ -33,17 +33,17 @@ export default function Hero() {
3333
<p className="mt-3 text-sm text-white/70 sm:mt-4">
3434
We are an opensource community working around the future of the web. Learn
3535
blockchain technology together. The community is powered by{" "}
36-
<Link href="https://devprotocol.xyz/">
37-
<a className="font-medium text-white">Dev Protocol</a>
36+
<Link href="https://devprotocol.xyz/" className="font-medium text-white">
37+
Dev Protocol
3838
</Link>
3939
.
4040
</p>
4141
</div>
4242
</div>
4343
</div>
4444
</div>
45-
<div className="mt-12 -mb-16 sm:-mb-48 lg:relative lg:m-0">
46-
<div className="max-w-md px-4 mx-auto sm:max-w-2xl sm:px-6 lg:max-w-none lg:px-0">
45+
<div className="-mb-16 mt-12 sm:-mb-48 lg:relative lg:m-0">
46+
<div className="mx-auto max-w-md px-4 sm:max-w-2xl sm:px-6 lg:max-w-none lg:px-0">
4747
<img
4848
className="w-full lg:absolute lg:inset-y-0 lg:left-0 lg:h-full lg:w-auto lg:max-w-none"
4949
src="/images/shapes/12.png"

‎backup src/components/Home/Projects.jsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import Link from "next/link";
2+
13
const Projects = () => {
24
const projectsData = [
35
{
@@ -32,7 +34,7 @@ const Projects = () => {
3234
className="w-full md:w-1/3 p-6 flex flex-col flex-grow flex-shrink text-center"
3335
>
3436
<div className="flex-1 bg-white overflow-hidden">
35-
<a
37+
<Link
3638
href="#"
3739
className="flex flex-wrap no-underline hover:no-underline"
3840
>
@@ -45,7 +47,7 @@ const Projects = () => {
4547
<p className="text-gray-800 text-base px-6 mb-5 text-center mx-10">
4648
{item.text}
4749
</p>
48-
</a>
50+
</Link>
4951
</div>
5052
</div>
5153
))}

‎backup src/components/Projects/_RepoCard.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import { FaStar } from "react-icons/fa";
2+
import Link from "next/link";
23

34
const RepoCard = ({ repo }) => {
45
const { name, html_url, stargazers_count, language, owner, description, forks_count, open_issues, topics } = repo;
56
return (
6-
<a href={html_url} target="_blank" rel="noopener noreferrer"
7+
<Link href={html_url} target="_blank" rel="noopener noreferrer"
78
className="bg-slate-900/60 border flex flex-col justify-between rounded-lg border-gray-700 p-5 shadow delay-100 h-full duration-200 w-full">
89
<div>
910
<div className="flex flex-row">
@@ -67,7 +68,7 @@ const RepoCard = ({ repo }) => {
6768
</div>
6869
</div>
6970
</div>
70-
</a>
71+
</Link>
7172
)
7273
}
7374

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy