diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 6cb0c35b..c5e9a6fe 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -1,6 +1,6 @@ module.exports = { root: true, - env: { browser: true, es2020: true }, + env: { browser: true, es2020: true, node: true }, extends: [ "eslint:recommended", "plugin:react/recommended", diff --git a/package.json b/package.json index 068a57bc..22f6a9d8 100755 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "version": "0.1.0", "private": true, "homepage": "https://udlbook.github.io/udlbook", + "type": "module", "scripts": { "dev": "vite", "build": "vite build", diff --git a/src/components/Footer/index.jsx b/src/components/Footer/index.jsx index 461ae547..3507b277 100755 --- a/src/components/Footer/index.jsx +++ b/src/components/Footer/index.jsx @@ -33,7 +33,7 @@ const socials = [ ]; export default function Footer() { - const toggleHome = () => { + const scrollToHome = () => { scroll.scrollToTop(); }; @@ -43,7 +43,7 @@ export default function Footer() { - + Understanding Deep Learning diff --git a/src/components/HeroSection/HeroElements.jsx b/src/components/HeroSection/HeroElements.jsx index eeabca04..cf48e2fb 100755 --- a/src/components/HeroSection/HeroElements.jsx +++ b/src/components/HeroSection/HeroElements.jsx @@ -274,3 +274,21 @@ export const HeroFollowBlock = styled.div` font-size: 14px; } `; + +export const HeroNewsMoreButton = styled.button` + background: #fff; + color: #000; + font-size: 16px; + padding: 10px 24px; + border: none; + border-radius: 4px; + cursor: pointer; + margin-top: 20px; + margin-bottom: 20px; + align-self: center; + + &:hover { + background: #000; + color: #fff; + } +`; diff --git a/src/components/HeroSection/index.jsx b/src/components/HeroSection/index.jsx index 9a9721b8..8ca661e7 100755 --- a/src/components/HeroSection/index.jsx +++ b/src/components/HeroSection/index.jsx @@ -13,15 +13,16 @@ import { HeroNewsItem, HeroNewsItemContent, HeroNewsItemDate, + HeroNewsMoreButton, HeroNewsTitle, HeroRow, Img, UDLLink, } from "@/components/HeroSection/HeroElements"; -import img from "@/images/F23.prince.learning.turquoise.jpg"; +import img from "@/images/book_cover.jpg"; +import { useState } from "react"; -export default function HeroSection() { - const citation = ` +const citation = ` @book{prince2023understanding, author = "Simon J.D. Prince", title = "Understanding Deep Learning", @@ -31,6 +32,122 @@ export default function HeroSection() { } `; +const news = [ + { + date: "05/22/24", + content: ( + + New{" "} + + blog + {" "} + about the applications of the neural tangent kernel. + + ), + }, + { + date: "05/10/24", + content: ( + + Positive{" "} + + review + {" "} + in Nature Machine Intelligence. + + ), + }, + // { + // date: "03/12/24", + // content: Book now available again., + // }, + { + date: "02/21/24", + content: ( + + New blog about the{" "} + + Neural Tangent Kernel + + . + + ), + }, + // { + // date: "02/15/24", + // content: ( + // + // First printing of book has sold out in most places. Second printing available + // mid-March. + // + // ), + // }, + { + date: "01/29/24", + content: ( + + New blog about{" "} + + gradient flow + {" "} + published. + + ), + }, + { + date: "12/26/23", + content: ( + + Machine Learning Street Talk{" "} + podcast discussing + book. + + ), + }, + { + date: "12/19/23", + content: ( + + Deeper Insights{" "} + + podcast + {" "} + discussing book. + + ), + }, + { + date: "12/06/23", + content: ( + + + Interview + {" "} + with Borealis AI. + + ), + }, + { + date: "12/05/23", + content: ( + + Book released by{" "} + + The MIT Press + + . + + ), + }, +]; + +export default function HeroSection() { + const [showMoreNews, setShowMoreNews] = useState(false); + + const toggleShowMore = () => { + setShowMoreNews((p) => !p); + }; + return ( @@ -38,132 +155,20 @@ export default function HeroSection() { RECENT NEWS: - - 05/22/24 - - {" "} - New{" "} - - {" "} - blog{" "} - {" "} - about the applications of the neural tangent kernel. - - - - - 05/10/24 - - {" "} - Positive{" "} - - review - {" "} - in Nature Machine Intelligence. - - - - {/* - 03/12/24 - - {" "} - Book now available again. - - - - 02/21/24 - - New blog about the{" "} - - Neural Tangent Kernel. - - - Book now available again. - */} - - - 02/21/24 - - New blog about the{" "} - - Neural Tangent Kernel - - . - - - {/* - 02/15/24 - - {" "} - First printing of book has sold out in most places. Second - printing available mid-March. - - - First printing of book has sold out in most places. Second printing available mid-March. - */} - - - 01/29/24 - - {" "} - New blog about{" "} - - {" "} - gradient flow - {" "} - published. - - - - 12/26/23 - - {" "} - Machine Learning Street Talk{" "} - - {" "} - podcast{" "} - {" "} - discussing book. - - - - 12/19/23 - - Deeper Insights{" "} - - podcast - {" "} - discussing book. - - - - 12/06/23 - - {" "} - - Interview - {" "} - with Borealis AI. - - - - 12/05/23 - - {" "} - Book released by{" "} - - The MIT Press - - . - - + {(showMoreNews ? news : news.slice(0, 7)).map((item, index) => ( + + {item.date} + {item.content} + + ))} + + {showMoreNews ? "Show less" : "Show more"} + CITATION: 
-                                
-                                    <>{citation}
-                                
+                                {citation}
@@ -177,11 +182,12 @@ export default function HeroSection() { - UDL Book + Book Cover - Download full pdf (27 May 2024) + Download full PDF (27 May 2024) +
{ const changeNav = () => { - if (window.scrollY >= 80) { - setScrollNav(true); - } else { - setScrollNav(false); - } + setScrollNav(window.scrollY >= 80); }; window.addEventListener("scroll", changeNav); @@ -31,7 +27,7 @@ export default function Navbar({ toggle }) { }; }, []); - const toggleHome = () => { + const scrollToHome = () => { scroll.scrollToTop(); }; @@ -40,7 +36,7 @@ export default function Navbar({ toggle }) {