dr_domi/udlbook
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #203 from tomheaton/more-news

Browse Source 
website: changes to news section
This commit is contained in:
udlbook
2024-06-21 09:51:51 -04:00
committed by GitHub
parent c3ce38410c d1df6426b2
commit 9aeda14efa
8 changed files with 160 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.cjs
View File

@@ -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",

1
package.json
View File

@@ -3,6 +3,7 @@
"version": "0.1.0",
"private": true,
"homepage": "https://udlbook.github.io/udlbook",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",

4
src/components/Footer/index.jsx
View File

@@ -33,7 +33,7 @@ const socials = [
];
export default function Footer() {
const toggleHome = () => {
const scrollToHome = () => {
scroll.scrollToTop();
};
@@ -43,7 +43,7 @@ export default function Footer() {
<FooterWrap>
<SocialMedia>
<SocialMediaWrap>
<SocialLogo to="/udlbook" onClick={toggleHome}>
<SocialLogo to="/udlbook" onClick={scrollToHome}>
Understanding Deep Learning
</SocialLogo>
<WebsiteRights>

18
src/components/HeroSection/HeroElements.jsx
View File

@@ -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;
}
`;

178
src/components/HeroSection/index.jsx
View File

@@ -13,14 +13,15 @@ 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 = `
@book{prince2023understanding,
author = "Simon J.D. Prince",
@@ -31,103 +32,81 @@ export default function HeroSection() {
}
`;
return (
<HeroContainer id="home">
<HeroContent>
<HeroRow>
<HeroColumn1>
<HeroNewsBlock>
<HeroNewsTitle>RECENT NEWS:</HeroNewsTitle>
<HeroNewsItem>
<HeroNewsItemDate>05/22/24</HeroNewsItemDate>
const news = [
{
date: "05/22/24",
content: (
<HeroNewsItemContent>
{" "}
New{" "}
<UDLLink href="https://www.borealisai.com/research-blogs/neural-tangent-kernel-applications/">
{" "}
blog{" "}
<UDLLink href="https://borealisai.com/research-blogs/neural-tangent-kernel-applications/">
blog
</UDLLink>{" "}
about the applications of the neural tangent kernel.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItem>
<HeroNewsItemDate>05/10/24</HeroNewsItemDate>
),
},
{
date: "05/10/24",
content: (
<HeroNewsItemContent>
{" "}
Positive{" "}
<UDLLink href="https://github.com/udlbook/udlbook/blob/main/public/NMI_Review.pdf">
review
</UDLLink>{" "}
in Nature Machine Intelligence.
</HeroNewsItemContent>
</HeroNewsItem>
{/* <HeroNewsItem>
<HeroNewsItemDate>03/12/24</HeroNewsItemDate>
<HeroNewsItemContent>
{" "}
Book now available again.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItem>
<HeroNewsItemDate>02/21/24</HeroNewsItemDate>
),
},
// {
// date: "03/12/24",
// content: <HeroNewsItemContent>Book now available again.</HeroNewsItemContent>,
// },
{
date: "02/21/24",
content: (
<HeroNewsItemContent>
New blog about the{" "}
<UDLLink href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/">
Neural Tangent Kernel.
</UDLLink>
</HeroNewsItemContent>
<HeroNewsItemContent> Book now available again.</HeroNewsItemContent>
</HeroNewsItem> */}
<HeroNewsItem>
<HeroNewsItemDate>02/21/24</HeroNewsItemDate>
<HeroNewsItemContent>
New blog about the{" "}
<UDLLink href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/">
<UDLLink href="https://borealisai.com/research-blogs/the-neural-tangent-kernel/">
Neural Tangent Kernel
</UDLLink>
.
</HeroNewsItemContent>
</HeroNewsItem>
{/* <HeroNewsItem>
<HeroNewsItemDate>02/15/24</HeroNewsItemDate>
),
},
// {
// date: "02/15/24",
// content: (
// <HeroNewsItemContent>
// First printing of book has sold out in most places. Second printing available
// mid-March.
// </HeroNewsItemContent>
// ),
// },
{
date: "01/29/24",
content: (
<HeroNewsItemContent>
{" "}
First printing of book has sold out in most places. Second
printing available mid-March.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItemContent> First printing of book has sold out in most places. Second printing available mid-March.</HeroNewsItemContent>
</HeroNewsItem> */}
<HeroNewsItem>
<HeroNewsItemDate>01/29/24</HeroNewsItemDate>
<HeroNewsItemContent>
{" "}
New blog about{" "}
<UDLLink href="https://www.borealisai.com/research-blogs/gradient-flow/">
{" "}
<UDLLink href="https://borealisai.com/research-blogs/gradient-flow/">
gradient flow
</UDLLink>{" "}
published.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItem>
<HeroNewsItemDate>12/26/23</HeroNewsItemDate>
),
},
{
date: "12/26/23",
content: (
<HeroNewsItemContent>
{" "}
Machine Learning Street Talk{" "}
<UDLLink href="https://www.youtube.com/watch?v=sJXn4Cl4oww">
{" "}
podcast{" "}
</UDLLink>{" "}
discussing book.
<UDLLink href="https://youtube.com/watch?v=sJXn4Cl4oww">podcast</UDLLink> discussing
book.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItem>
<HeroNewsItemDate>12/19/23</HeroNewsItemDate>
),
},
{
date: "12/19/23",
content: (
<HeroNewsItemContent>
Deeper Insights{" "}
<UDLLink href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385">
@@ -135,35 +114,61 @@ export default function HeroSection() {
</UDLLink>{" "}
discussing book.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItem>
<HeroNewsItemDate>12/06/23</HeroNewsItemDate>
),
},
{
date: "12/06/23",
content: (
<HeroNewsItemContent>
{" "}
<UDLLink href="https://www.borealisai.com/news/understanding-deep-learning/">
<UDLLink href="https://borealisai.com/news/understanding-deep-learning/">
Interview
</UDLLink>{" "}
with Borealis AI.
</HeroNewsItemContent>
</HeroNewsItem>
<HeroNewsItem>
<HeroNewsItemDate>12/05/23</HeroNewsItemDate>
),
},
{
date: "12/05/23",
content: (
<HeroNewsItemContent>
{" "}
Book released by{" "}
<UDLLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">
The MIT Press
</UDLLink>
.
</HeroNewsItemContent>
),
},
];
export default function HeroSection() {
const [showMoreNews, setShowMoreNews] = useState(false);
const toggleShowMore = () => {
setShowMoreNews((p) => !p);
};
return (
<HeroContainer id="home">
<HeroContent>
<HeroRow>
<HeroColumn1>
<HeroNewsBlock>
<HeroNewsTitle>RECENT NEWS:</HeroNewsTitle>
{(showMoreNews ? news : news.slice(0, 7)).map((item, index) => (
<HeroNewsItem key={index}>
<HeroNewsItemDate>{item.date}</HeroNewsItemDate>
{item.content}
</HeroNewsItem>
))}
<HeroNewsMoreButton onClick={toggleShowMore}>
{showMoreNews ? "Show less" : "Show more"}
</HeroNewsMoreButton>
</HeroNewsBlock>
<HeroCitationTitle>CITATION:</HeroCitationTitle>
<HeroCitationBlock>
<pre>
<code>
<>{citation}</>
</code>
<code>{citation}</code>
</pre>
</HeroCitationBlock>
<HeroFollowBlock>
@@ -177,11 +182,12 @@ export default function HeroSection() {
</HeroColumn1>
<HeroColumn2>
<HeroImgWrap>
<Img src={img} alt="UDL Book" />
<Img src={img} alt="Book Cover" />
</HeroImgWrap>
<HeroLink href="https://github.com/udlbook/udlbook/releases/download/v4.0.1/UnderstandingDeepLearning_05_27_24_C.pdf">
Download full pdf (27 May 2024)
Download full PDF (27 May 2024)
</HeroLink>
<br />
<HeroDownloadsImg
src="https://img.shields.io/github/downloads/udlbook/udlbook/total"
alt="download stats shield"

12
src/components/Navbar/index.jsx
View File

@@ -6,7 +6,7 @@ import {
NavLinks,
NavLogo,
NavMenu,
} from "./NavbarElements";
} from "@/components/Navbar/NavbarElements";
import { useEffect, useState } from "react";
import { FaBars } from "react-icons/fa";
import { IconContext } from "react-icons/lib";
@@ -17,11 +17,7 @@ export default function Navbar({ toggle }) {
useEffect(() => {
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 }) {
<IconContext.Provider value={{ color: "#fff" }}>
<Nav scrollNav={scrollNav}>
<NavbarContainer>
<NavLogo to="/udlbook/" onClick={toggleHome}>
<NavLogo to="/udlbook/" onClick={scrollToHome}>
<h1> Understanding Deep Learning </h1>
</NavLogo>
<MobileIcon onClick={toggle}>

0
src/images/F23.prince.learning.turquoise.jpg → src/images/book_cover.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 282 KiB

After

Width:  |  Height:  |  Size: 282 KiB

2
src/pages/index.jsx
View File

@@ -12,7 +12,7 @@ export default function Index() {
const [isOpen, setIsOpen] = useState(false);
const toggle = () => {
setIsOpen(!isOpen);
setIsOpen((p) => !p);
};
return (