diff --git a/apps/academy/public/D_Dfooter.png b/apps/academy/public/D_Dfooter.png new file mode 100644 index 00000000..f0797bc4 Binary files /dev/null and b/apps/academy/public/D_Dfooter.png differ diff --git a/apps/academy/public/bg_home.png b/apps/academy/public/bg_home.png index cbf41def..492e6e07 100644 Binary files a/apps/academy/public/bg_home.png and b/apps/academy/public/bg_home.png differ diff --git a/apps/academy/public/carbon_blog.svg b/apps/academy/public/carbon_blog.svg new file mode 100644 index 00000000..b6832cca --- /dev/null +++ b/apps/academy/public/carbon_blog.svg @@ -0,0 +1,3 @@ + + + diff --git a/apps/academy/public/dd_nft.png b/apps/academy/public/dd_nft.png new file mode 100644 index 00000000..a7212210 Binary files /dev/null and b/apps/academy/public/dd_nft.png differ diff --git a/apps/academy/public/dd_nft2.png b/apps/academy/public/dd_nft2.png new file mode 100644 index 00000000..a8df4447 Binary files /dev/null and b/apps/academy/public/dd_nft2.png differ diff --git a/apps/academy/public/home_bg.png b/apps/academy/public/home_bg.png new file mode 100644 index 00000000..eeca7a84 Binary files /dev/null and b/apps/academy/public/home_bg.png differ diff --git a/apps/academy/public/image_home_bg.png b/apps/academy/public/image_home_bg.png new file mode 100644 index 00000000..e7392733 Binary files /dev/null and b/apps/academy/public/image_home_bg.png differ diff --git a/apps/academy/src/components/Header.tsx b/apps/academy/src/components/Header.tsx index d497609a..81369f4d 100644 --- a/apps/academy/src/components/Header.tsx +++ b/apps/academy/src/components/Header.tsx @@ -23,6 +23,11 @@ const topbarNavMenus: NavItem[] = [ href: "/tracks", icon: "vector", }, + { + name: "Posts", + href: "https://blog.developerdao.com/", + icon: "states", + }, { name: "Community", href: "https://handbook.developerdao.com/", @@ -36,19 +41,17 @@ const PageHeader: FunctionComponent = () => { const { pathname } = router; return ( -
-
+
+
{pathname === "/" || pathname === "/tracks" || pathname === "/fundamentals" ? ( -
-
- - Academy Logo - - {/*
-
- -
+
+ + Academy Logo + + {/*
) : (
@@ -58,20 +61,27 @@ const PageHeader: FunctionComponent = () => {
)}
- {pathname === "/" || pathname === "/tracks" || pathname === "/fundamentals" ? ( -
- {/*
- ) : ( - <> - -
+ + + +
+ {pathname === "/" || pathname === "/tracks" || pathname === "/fundamentals" ? ( +
{/*
- - )} + ) : ( + <> + +
+ {/*
+ + )} +
{pathname === "/" || pathname === "/tracks" || pathname === "/fundamentals" ? ( = ({ children }) => { - const router = useRouter(); - const { pathname } = router; + // const router = useRouter(); + // const { pathname } = router; // const [requestEmail, setRequestEmail] = useState(false); // const [emailAlreadySent, setEmailAlreadySent] = useState(false); @@ -94,7 +94,7 @@ export const Layout: FunctionComponent = ({ children }) => { ) : null} */}
{children}
- {pathname !== "/tracks" && pathname !== "/fundamentals" ?
: null} +
); }; diff --git a/apps/academy/src/pages/_app.tsx b/apps/academy/src/pages/_app.tsx index 2b46bddd..a769c48a 100644 --- a/apps/academy/src/pages/_app.tsx +++ b/apps/academy/src/pages/_app.tsx @@ -130,7 +130,7 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout<{ session: Session | {getLayout()} - ; + diff --git a/apps/academy/src/pages/index.tsx b/apps/academy/src/pages/index.tsx index 98299cff..e89445e3 100644 --- a/apps/academy/src/pages/index.tsx +++ b/apps/academy/src/pages/index.tsx @@ -1,57 +1,68 @@ +import Image from "next/image"; import Link from "next/link"; import type { ReactElement } from "react"; import { Icons, LearnWeb3Banner, PartnerBanner } from "ui"; +// LearnWeb3Banner, PartnerBanner import PageSeoLayout from "@/components/PageSeoLayout"; import type { NextPageWithLayout } from "@/pages/_app"; const Home: NextPageWithLayout = () => { return ( <> -
-
-
-
-

- Learn -
- web3__ -
- with -
- friends -

+ {/* Background with Overlay */} +
+ {/* Overlay */} +
+ + {/* Hero Section */} +
+
+

+ LEArn +
+ WEB3__ +
+ WITH +
+ + FRIENDS + + devIcon + + +

+ +
+
+

Become a web3 developer with DeveloperDAO.

+
+
+ + + +
-
-

Become a web3 developer with Developer DAO.

-
-
- - - -
-
-
-
-

learn

-

web3__

-

with

-

friends

+ + {/* Banner Section */} +
+
+
+ +
+
+
+
+
-
-
- -
-
- -
+
); }; diff --git a/apps/academy/src/pages/tracks/arweave-101/index.tsx b/apps/academy/src/pages/tracks/arweave-101/index.tsx index c05a0d77..af109545 100644 --- a/apps/academy/src/pages/tracks/arweave-101/index.tsx +++ b/apps/academy/src/pages/tracks/arweave-101/index.tsx @@ -21,7 +21,7 @@ const Arweave101TrackPage = () => { ); return ( -
+
{ ); return ( -
+
{ ); return ( -
+
ReactElement

Tracks

diff --git a/apps/academy/src/pages/tracks/intro-to-ethereum/index.tsx b/apps/academy/src/pages/tracks/intro-to-ethereum/index.tsx index 0fc3bcd2..599cf26a 100644 --- a/apps/academy/src/pages/tracks/intro-to-ethereum/index.tsx +++ b/apps/academy/src/pages/tracks/intro-to-ethereum/index.tsx @@ -21,7 +21,7 @@ const IntroToEthereumTrackPage = () => { ); return ( -
+
{ ); return ( -
+
{ ); return ( -
+
{ ); return ( -
+
= ({ href }) => { return ( - -
-
-
1
-
-

- function submitVote( -

-

- - uint256 proposalIndex{" "} - - , -

-

- - uint8 uintVote - -

+
+ +
+
+
+
1
+
+

+ function submitVote( +

+

+ + uint256 proposalIndex{" "} + + , +

+

+ + uint8 uintVote + +

+
+
+
+
2
+
+

+ ) + + public nonReentrant onlyDelegate + + { +

+
+
+
+
3
+
+

+ address  + member Address = +

+

+ memberAddress[msg.sender]; +

+
+
+
+
4
+
+

+ Member  + storage member = members[memberAddress]; +

+
+
+
+
5
+
+

+ require + (proposalIndex <  + proposalQueue.length, +

+

+ "proposal does not exist"); +

+
+
+
+
6
+
+

+ Proposal  + storage proposal = +

+

proposals[proposalQueue[ proposalIndex ]];

+
+
+
+
7
+
+

+ require + (uintVote <  + 3, "must be less than 3"); +

+
+
+
+
8
+
+

+ Vote  + vote =  + Vote(uintVote); +

+

...

+
+
-
-
-
2
-
-

- ) - - public nonReentrant onlyDelegate - - { -

-
-
-
-
3
-
-

- address  - member Address = -

-

- memberAddress[msg.sender]; -

-
-
-
-
4
-
-

- Member  - storage member = members[memberAddress]; -

-
-
-
-
5
-
-

- require - (proposalIndex <  - proposalQueue.length, -

-

- "proposal does not exist"); -

+
+ + LEARN WEB3 + + +

+ DeveloperDAO offers learning
resources to help you build with web3
+ technologies. +

+ +
+ +
-
-
6
-
-

- Proposal  - storage proposal = -

-

proposals[proposalQueue[ proposalIndex ]];

-
-
-
-
7
-
-

- require - (uintVote <  - 3, "must be less than 3"); -

-
-
-
-
8
-
-

- Vote  - vote =  - Vote(uintVote); -

-

...

-
-
-
-
- - LEARN WEB3 - - -

Developer DAO offers learning resources to help you build with web3 technologies.

- -
- -
-
- + +
); }; diff --git a/packages/ui/src/components/Banners/PartnerBanner.tsx b/packages/ui/src/components/Banners/PartnerBanner.tsx index b062fdb0..799de5b0 100644 --- a/packages/ui/src/components/Banners/PartnerBanner.tsx +++ b/packages/ui/src/components/Banners/PartnerBanner.tsx @@ -11,55 +11,64 @@ export interface PartnerBannerProps extends HomePageBannerProps { export const PartnerBanner: FC = ({ href, imgSrc }) => { return ( - -
- - Partner with D_D Academy - - -

- Developer DAO is a community of builders creating a better internet. Help us educate the - next generation. -

- - -
-
-
- partner -
-
- {[ - "/partners/pokt.png", - "/partners/zerion.png", - "/partners/api3-logo.png", - "/partners/scroll.png", - ].map((logoPath, i) => ( +
+ +
+
+ + + Partner with D_D Academy + + + +

+ DeveloperDAO is a community of thousands of web3
builders creating a better + internet. Join us and help
educate the next generation of developers. +

+ + +
+
+
partner - ))} +
+
+ {[ + "/partners/pokt.png", + "/partners/zerion.png", + "/partners/api3-logo.png", + // "/partners/scroll.png", + ].map((logoPath, i) => ( + partner + ))} +
+
-
- + +
); }; diff --git a/packages/ui/src/components/Cards/TrackCard.tsx b/packages/ui/src/components/Cards/TrackCard.tsx index 159c4d08..35b55503 100644 --- a/packages/ui/src/components/Cards/TrackCard.tsx +++ b/packages/ui/src/components/Cards/TrackCard.tsx @@ -16,35 +16,37 @@ export interface TrackCardProps { const TrackCard: FC = ({ imgSrc, tags, title, description }) => { return ( - - eth_family -
- {tags.map((tag, i) => ( - - {tag} - - ))} -
- - {title} - {description} - - - +
+ + eth_family +
+ {tags.map((tag, i) => ( + + {tag} + + ))} +
+ + {title} + {description} + + + +
); }; diff --git a/packages/ui/src/components/Footer/Footer.tsx b/packages/ui/src/components/Footer/Footer.tsx index 5a66f02d..02c5862e 100644 --- a/packages/ui/src/components/Footer/Footer.tsx +++ b/packages/ui/src/components/Footer/Footer.tsx @@ -1,5 +1,7 @@ +"use client"; import Image from "next/image"; import Link from "next/link"; +import { useRouter } from "next/router"; import { Icons } from "../Icons"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/tooltip"; @@ -53,101 +55,137 @@ const socials: readonly SocialLinks[] = [ ]; export const Footer = () => { + const router = useRouter(); + const { pathname } = router; return ( - ); }; diff --git a/packages/ui/src/components/Icons.tsx b/packages/ui/src/components/Icons.tsx index 7b7661ef..08617eba 100644 --- a/packages/ui/src/components/Icons.tsx +++ b/packages/ui/src/components/Icons.tsx @@ -37,6 +37,7 @@ interface DDIcons { home_icon: (props: LucideProps) => JSX.Element; moon_light: (props: LucideProps) => JSX.Element; more_horizontal: (props: LucideProps) => JSX.Element; + states: (props: LucideProps) => JSX.Element; } export const Icons: DDIcons = { @@ -44,6 +45,21 @@ export const Icons: DDIcons = { moon: (props: LucideProps) => , info: (props: LucideProps) => , twitter: (props: LucideProps) => , + states: (props: LucideProps) => ( + + + + ), logo: (props: LucideProps) => ( { @@ -73,11 +74,17 @@ const TopBarItem: FC = ({ name, icon, href, subnavs }) => { ); }; -const TopBar: FC = ({ menus }) => { +const TopBar: FC = ({ menus, pathName }) => { return ( - - {renderMenus({ menus })} - + <> + {pathName === "/" || pathName === "/tracks" || pathName === "/fundamentals" ? ( + + {renderMenus({ menus })} + + ) : ( + <> + )} + ); }; diff --git a/packages/ui/src/components/ui/tooltip.tsx b/packages/ui/src/components/ui/tooltip.tsx index f9d04a47..e5c2a4ca 100644 --- a/packages/ui/src/components/ui/tooltip.tsx +++ b/packages/ui/src/components/ui/tooltip.tsx @@ -27,4 +27,4 @@ const TooltipContent = React.forwardRef< )); TooltipContent.displayName = TooltipPrimitive.Content.displayName; -export { Tooltip, TooltipContent, TooltipProvider,TooltipTrigger }; +export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }; diff --git a/packages/ui/src/styles.css b/packages/ui/src/styles.css index 4397b155..7985db04 100644 --- a/packages/ui/src/styles.css +++ b/packages/ui/src/styles.css @@ -199,11 +199,11 @@ } .main-container { - @apply container max-w-7xl; + @apply container w-full; } .app-container { - @apply mx-auto w-full max-w-[1440px]; + @apply mx-auto w-full; } .gradient-blur { @@ -229,7 +229,7 @@ } .top-nav { - @apply h-[62px] w-min max-w-lg rounded-[51px] border-2 border-[var(--academy-dark)] px-4 py-6; + @apply h-[62px] rounded-[51px] border border-[var(--academy-dark)] px-4 py-6; } .top-nav .nav { @@ -256,7 +256,6 @@ .track { @apply gradient-blur h-[446px] max-w-[285px] rounded-[51px] border-none shadow-sm hover:bg-zinc-900; - @apply ring-[2px] ring-inset ring-[#E9E9E930] ring-offset-0; overflow: hidden; } @@ -277,11 +276,11 @@ .banner { @apply gradient-neutral flex w-full items-start justify-between rounded-[51px]; @apply max-w-screen-2xl gap-x-6 gap-y-10 border-none border-[var(--gray-white)] p-2 shadow-sm md:p-4 lg:p-7; - @apply ring-[2px] ring-inset ring-[#E9E9E920] ring-offset-0; + /* @apply ring-[2px] ring-inset ring-red-500 ring-offset-0; */ } .banner .title { - @apply max-w-[220px] text-center text-4xl font-normal leading-normal tracking-wide text-white md:max-w-md; + @apply max-w-[220px] text-center text-[48px] font-normal leading-normal tracking-wide text-white md:max-w-md; font-family: var(--font-future); } @@ -295,7 +294,7 @@ } .terminal-text { - @apply mx-4 pt-8 text-left text-xs font-normal leading-5 text-[#e1e4e84a] md:text-sm lg:mx-auto lg:pb-8; + @apply mx-4 pt-8 text-left text-xs font-normal leading-5 text-[#e1e4e84a] md:text-[15px] lg:mx-auto lg:pb-8; font-family: var(--font-andale-mono); } @@ -316,9 +315,9 @@ } .footer { - @apply flex min-h-[224px] flex-col items-center gap-y-8 border-t sm:flex-row-reverse sm:justify-between; + @apply flex flex-col items-center gap-y-8 sm:flex-row-reverse sm:justify-between; @apply border-white text-white; - @apply mt-20 px-0 py-8 text-xs font-semibold md:text-sm; + @apply mt-[20px] px-0 text-xs font-semibold md:text-sm; } .footer nav {