Skip to content

Commit 827d2d7

Browse files
sweetpea22sweetpea22
authored
Add/links and icons (#74)
This PR partially closes #68. It also closes #71 and #73. - Favicon changed - Links added - Layout optimized - Metadata added for SEO What this PR does not address from issue #68 because we need to wait for enhancements to be designed & copywritten: - We have a list of ambassadors and what they are, but no info on how to become one - Adding Web3.js social media buttons/links ( [x.com](http://x.com/), youtube, .. ) - Adding small section getting latest web3.js X posts and also some latest youtube videos for showing preview in a window on webpage - feedback form link/button
1 parent 493a365 commit 827d2d7

15 files changed

+82
-35
lines changed

‎public/favicons/android-chrome-192x192.png

17 KB
Loading

‎public/favicons/android-chrome-512x512.png

70.5 KB
Loading

‎public/favicons/apple-touch-icon.png

15.2 KB
Loading

‎public/favicons/favicon-16x16.png

721 Bytes
Loading

‎public/favicons/favicon-32x32.png

1.72 KB
Loading

‎public/favicons/favicon.ico

15 KB
Binary file not shown.

‎public/favicons/site.webmanifest

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

‎src/app/favicon.ico

-10.3 KB
Binary file not shown.

‎src/app/layout.tsx

Lines changed: 50 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,61 @@
11
import type { Metadata } from "next";
22
import localFont from 'next/font/local';
3-
import { Inter } from "next/font/google";
43
import "./globals.css";
4+
import Script from "next/script";
55

66
export const metadata: Metadata = {
77
title: "Web3js - The API to connect to Ethereum and any EVM Chain",
88
description: "web3js - the longest-running EVM API",
9+
icons: {
10+
icon: './favicon.ico',
11+
},
12+
keywords: [],
13+
twitter: {
14+
card: 'summary_large_image',
15+
title: 'Web3js',
16+
description: 'web3js - the longest-running EVM API',
17+
images: ['https://imagedelivery.net/qdx9xDn6TxxInQGWsuRsVg/f3f16fdc-3d9c-44af-eda3-49865a286f00'],
18+
},
19+
openGraph: {
20+
title: 'web3js',
21+
description: 'web3js - the longest-running EVM API',
22+
url: 'https://web3js.org',
23+
siteName: 'web3js',
24+
images: [
25+
{
26+
url: 'https://imagedelivery.net/qdx9xDn6TxxInQGWsuRsVg/f3f16fdc-3d9c-44af-eda3-49865a286f00',
27+
width: 800,
28+
height: 600,
29+
},
30+
],
31+
locale: 'en_US',
32+
type: 'website',
33+
},
34+
robots: {
35+
index: false,
36+
follow: true,
37+
nocache: true,
38+
googleBot: {
39+
index: true,
40+
follow: false,
41+
noimageindex: true,
42+
'max-video-preview': -1,
43+
'max-image-preview': 'large',
44+
'max-snippet': -1,
45+
},
46+
},
47+
48+
metadataBase: new URL('https://web3js.org'),
49+
alternates: {
50+
canonical: '/',
51+
languages: {
52+
'en-US': '/en-US',
53+
'de-DE': '/de-DE',
54+
},
55+
},
956
};
1057

58+
1159
const neueMontreal = localFont({
1260
weight: '400',
1361
src: [
@@ -37,6 +85,7 @@ export default function RootLayout({
3785
}>) {
3886
return (
3987
<html lang="en">
88+
<Script defer data-domain="web3js.org" src="https://plausible.io/js/script.js"/>
4089
<body className={`${neueMontreal.variable}`}>{children}</body>
4190
</html>
4291
);

‎src/components/Navbar.tsx

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,22 @@
22

33
/* eslint-disable @next/next/no-img-element */
44
import { Disclosure, DisclosureButton, DisclosurePanel, Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/react'
5-
import { Bars3Icon, BellIcon, XMarkIcon } from '@heroicons/react/24/outline'
5+
import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
66
import { useState } from 'react'
7+
import { docsUrl } from './urls'
78

89
const navigation = [
910
{ name: 'About', href: '/', current: true },
1011
{ name: 'Plugins', href: '/plugins', current: false },
11-
// { name: 'History', href: '#', current: false },
12+
{ name: 'Docs', href: docsUrl, current: false }
1213
]
1314

1415
function classNames(...classes: string[]) {
1516
return classes.filter(Boolean).join(' ')
1617
}
1718

1819
export default function Navbar() {
19-
// useEffect?
2020
const [isCurrentPage, setIsCurrentPage] = useState('');
21-
// check history
22-
// set navigation.name === [match] to currentPage
23-
// check currentPage === item.name ? bg : null
24-
2521
return (
2622
<Disclosure as="nav" className="">
2723
<div className="mx-auto max-w-9xl px-2 sm:px-6 lg:px-8">

‎src/components/PluginCard.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -20,18 +20,18 @@ export default function PluginCard({isFeatured, name, description, authors, down
2020
<StarIcon className='text-brand-400 h-6 w-6' />
2121
</div>
2222
</div> : null }
23-
<h2 className='mt-2 md:mt-7 text-gray-100 text-2xl font-semibold leading-7'>{name}</h2>
23+
<a href={downloadUrl} target="_blank" rel="noopener noreferrer" className='mt-2 md:mt-7 text-gray-100 text-2xl font-semibold leading-7 hover:brightness-50'>{name}</a>
2424
{description ? <h3 className='mt-2 text-gray-300 text-md leading-6'>{description}</h3> : null }
2525
</div>
2626
{!error && (
2727
<div className='flex justify-between mt-2 mx-2'>
2828
<div className="flex flex-col">
29-
{authors && <p className='text-lg text-gray-50 font-semibold mb-1'>{authors}</p>}
30-
<p className='text-md text-zinc-400'>{downloadsCount} Downloads</p>
29+
{authors ? <p className='text-lg text-gray-50 font-semibold mb-1'>{authors}</p> : <p>Unknown</p>}
30+
{/* <p className='text-md text-zinc-400'>{downloadsCount} Downloads</p> */}
3131
</div>
32-
{/* <div className='cursor-pointer mt-1'>
32+
<div className='cursor-pointer mt-1'>
3333
<Button type="pluginDownload" href={downloadUrl}>Download</Button>
34-
</div> */}
34+
</div>
3535
</div>
3636
)}
3737
</div>

‎src/components/sections/Hero.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import SectionHeading from '../SectionHeading';
44

55
export default function Hero() {
66
return (
7-
<div className="relative py-24 md:py-0 lg:h-screen w-full px-4 md:px-8 ">
7+
<div className="relative py-24 md:py-0 lg:h-screen xl:h-full w-full px-4 md:px-8 ">
88
<div className="relative flex flex-col max-w-7xl lg:py-48">
99
<div className='mt-10 flex flex-col md:grid md:grid-cols-1 lg:grid-cols-2 justify-start items-start lg:mt-0'>
1010
<div className='flex flex-col gap-y-5'>

‎src/components/sections/WhyBeAmbassador.tsx

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1+
"use client"
12

2-
// import { IconArrowUpRight } from "@tabler/icons-react"
3-
// import { useInView } from 'react-intersection-observer';
4-
// import { sentenceVariant, letterVariant, splitText } from "@/styles/animations";
5-
// import { motion, useAnimation } from 'framer-motion';
3+
import { useInView } from 'react-intersection-observer';
4+
import { motion, useAnimation } from 'framer-motion';
65
import { ChatBubbleLeftRightIcon, StarIcon, FaceSmileIcon, HeartIcon, ArrowTrendingUpIcon, BoltIcon } from '@heroicons/react/24/outline';
76

87
import { useEffect } from "react";
@@ -38,6 +37,9 @@ const cards = [
3837
icon: <ChatBubbleLeftRightIcon />,
3938
title: 'Advance your career',
4039
desc: 'and establish yourself as a leader in blockchain technology.',
40+
},
41+
{
42+
4143
},
4244
{
4345
icon: <StarIcon />,
@@ -47,31 +49,31 @@ const cards = [
4749
]
4850

4951
export default function WhyBeAmbassador() {
50-
// const controls = useAnimation();
52+
const controls = useAnimation();
5153

52-
// const [ref, inView] = useInView();
54+
const [ref, inView] = useInView();
5355

54-
// useEffect(() => {
55-
// if (inView) {
56-
// controls.start('visible');
57-
// }
58-
// }, [controls, inView]);
56+
useEffect(() => {
57+
if (inView) {
58+
controls.start('visible');
59+
}
60+
}, [controls, inView]);
5961

6062

6163
return (
62-
<div className="relative w-full md:min-h-[70vh]" id="beta-program">
64+
<motion.div className="relative w-full md:min-h-[70vh]" id="beta-program">
6365
<div className="relative flex flex-col justify-center items-center py-14 lg:pt-32 px-8">
6466
<SectionHeading type="primary">Why be an ambassador</SectionHeading>
65-
<div className='grid md:grid-cols-2 gap-y-2 lg:grid-cols-3 py-8 gap-x-2 z-10 max-w-[85%] '>
67+
<div className='grid md:grid-cols-2 gap-y-2 lg:grid-cols-3 py-8 gap-x-2 z-10 max-w-[85%] content-center '>
6668
{cards.map((card, index) => (
67-
<div key={index} className='transition-all py-4 flex flex-col justify-center items-center px-5'>
69+
<motion.div initial="hidden" key={index} className='transition-all py-4 flex flex-col justify-center items-center px-5'>
6870
<div className='h-6 w-6 text-brand-400'>{card.icon}</div>
6971
<h2 className='mt-2 md:mt-7 text-center text-zinc-100 text-xl leading-6 max-w-[80%]'>{card.title}</h2>
7072
<h3 className='mt-1 md:mt-2 text-center text-zinc-500 text-lg leading-6 max-w-[80%]'>{card.desc}</h3>
71-
</div>
73+
</motion.div>
7274
))}
7375
</div>
7476
</div>
75-
</div>
77+
</motion.div>
7678
)
7779
}

‎src/components/sections/YouCan.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@ import SectionHeading from "../SectionHeading"
22
import TextWithCheckIcon from "../TextWithCheckIcon"
33

44
const stats = [
5-
'Deploy and interact with smart contracts as TS/JS objects.',
5+
'Deploy and interact with smart contracts as TS/JS objects',
66
'Subscribe to specific on-chain or smart contract events',
77
'Interact with the Ethereum Name Service (ENS)',
8-
'Create and import accounts, sign data and transactions.',
9-
'Get block and state information from Ethereum nodes.',
8+
'Create and import accounts, sign data and transactions',
9+
'Get block and state information from Ethereum nodes',
1010
'Have access to utilities with built-in helpers for Ethereum dApps and web3 packages',
1111
]
1212

@@ -21,7 +21,6 @@ const stats = [
2121
<dl className="mt-16 grid grid-cols-1 gap-0.5 overflow-hidden text-center sm:grid-cols-2 lg:grid-cols-3">
2222
{stats.map((stat, index) => (
2323
<div key={index} className="flex flex-col py-4 px-5">
24-
{/* <dt className="text-sm font-semibold leading-6 text-gray-300">{stat}</dt> */}
2524
<TextWithCheckIcon>{stat}</TextWithCheckIcon>
2625
</div>
2726
))}

‎src/components/urls.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export const discordUrl = "https://discord.gg/yhHVtK5Wqt"
22
export const docsUrl = "https://docs.web3js.org/"
33
export const npmUrl = "https://www.npmjs.com/package/web3"
4-
export const blogUrl = "https://blog.chainsafe.io/tagged/web3js"
4+
export const blogUrl = "https://blog.chainsafe.io/web3js/"
55
export const blogPostv4 = "https://blog.chainsafe.io/announcing-the-full-release-of-web3-js-v4-e9e26275a3dc";
66
export const githubUrl = "https://github.com/web3/web3.js";

0 commit comments

Comments
 (0)