dynamic rendering for news items

This commit is contained in:
Tom Heaton
2024-06-20 10:39:17 +01:00
parent 251aef1876
commit 735947b728
2 changed files with 120 additions and 126 deletions

View File

@@ -18,10 +18,9 @@ import {
Img, Img,
UDLLink, UDLLink,
} from "@/components/HeroSection/HeroElements"; } from "@/components/HeroSection/HeroElements";
import img from "@/images/F23.prince.learning.turquoise.jpg"; import img from "@/images/book_cover.jpg";
export default function HeroSection() { const citation = `
const citation = `
@book{prince2023understanding, @book{prince2023understanding,
author = "Simon J.D. Prince", author = "Simon J.D. Prince",
title = "Understanding Deep Learning", title = "Understanding Deep Learning",
@@ -31,103 +30,81 @@ export default function HeroSection() {
} }
`; `;
return ( const news = [
<HeroContainer id="home"> {
<HeroContent> date: "05/22/24",
<HeroRow> content: (
<HeroColumn1>
<HeroNewsBlock>
<HeroNewsTitle>RECENT NEWS:</HeroNewsTitle>
<HeroNewsItem>
<HeroNewsItemDate>05/22/24</HeroNewsItemDate>
<HeroNewsItemContent> <HeroNewsItemContent>
{" "}
New{" "} New{" "}
<UDLLink href="https://www.borealisai.com/research-blogs/neural-tangent-kernel-applications/"> <UDLLink href="https://borealisai.com/research-blogs/neural-tangent-kernel-applications/">
{" "} blog
blog{" "}
</UDLLink>{" "} </UDLLink>{" "}
about the applications of the neural tangent kernel. about the applications of the neural tangent kernel.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
},
<HeroNewsItem> {
<HeroNewsItemDate>05/10/24</HeroNewsItemDate> date: "05/10/24",
content: (
<HeroNewsItemContent> <HeroNewsItemContent>
{" "}
Positive{" "} Positive{" "}
<UDLLink href="https://github.com/udlbook/udlbook/blob/main/public/NMI_Review.pdf"> <UDLLink href="https://github.com/udlbook/udlbook/blob/main/public/NMI_Review.pdf">
review review
</UDLLink>{" "} </UDLLink>{" "}
in Nature Machine Intelligence. in Nature Machine Intelligence.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
},
{/* <HeroNewsItem> {
<HeroNewsItemDate>03/12/24</HeroNewsItemDate> date: "03/12/24",
<HeroNewsItemContent> content: <HeroNewsItemContent>Book now available again.</HeroNewsItemContent>,
{" "} },
Book now available again. {
</HeroNewsItemContent> date: "02/21/24",
</HeroNewsItem> content: (
<HeroNewsItem>
<HeroNewsItemDate>02/21/24</HeroNewsItemDate>
<HeroNewsItemContent> <HeroNewsItemContent>
New blog about the{" "} 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>
<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/">
Neural Tangent Kernel Neural Tangent Kernel
</UDLLink> </UDLLink>
. .
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
{/* <HeroNewsItem> },
<HeroNewsItemDate>02/15/24</HeroNewsItemDate> {
date: "02/15/24",
content: (
<HeroNewsItemContent> <HeroNewsItemContent>
{" "} First printing of book has sold out in most places. Second printing available
First printing of book has sold out in most places. Second mid-March.
printing available mid-March.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
<HeroNewsItemContent> First printing of book has sold out in most places. Second printing available mid-March.</HeroNewsItemContent> },
</HeroNewsItem> */} {
date: "01/29/24",
<HeroNewsItem> content: (
<HeroNewsItemDate>01/29/24</HeroNewsItemDate>
<HeroNewsItemContent> <HeroNewsItemContent>
{" "}
New blog about{" "} New blog about{" "}
<UDLLink href="https://www.borealisai.com/research-blogs/gradient-flow/"> <UDLLink href="https://borealisai.com/research-blogs/gradient-flow/">
{" "}
gradient flow gradient flow
</UDLLink>{" "} </UDLLink>{" "}
published. published.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
<HeroNewsItem> },
<HeroNewsItemDate>12/26/23</HeroNewsItemDate> {
date: "12/26/23",
content: (
<HeroNewsItemContent> <HeroNewsItemContent>
{" "}
Machine Learning Street Talk{" "} Machine Learning Street Talk{" "}
<UDLLink href="https://www.youtube.com/watch?v=sJXn4Cl4oww"> <UDLLink href="https://youtube.com/watch?v=sJXn4Cl4oww">podcast</UDLLink> discussing
{" "} book.
podcast{" "}
</UDLLink>{" "}
discussing book.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
<HeroNewsItem> },
<HeroNewsItemDate>12/19/23</HeroNewsItemDate> {
date: "12/19/23",
content: (
<HeroNewsItemContent> <HeroNewsItemContent>
Deeper Insights{" "} Deeper Insights{" "}
<UDLLink href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385"> <UDLLink href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385">
@@ -135,35 +112,52 @@ export default function HeroSection() {
</UDLLink>{" "} </UDLLink>{" "}
discussing book. discussing book.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
<HeroNewsItem> },
<HeroNewsItemDate>12/06/23</HeroNewsItemDate> {
date: "12/06/23",
content: (
<HeroNewsItemContent> <HeroNewsItemContent>
{" "} <UDLLink href="https://borealisai.com/news/understanding-deep-learning/">
<UDLLink href="https://www.borealisai.com/news/understanding-deep-learning/">
Interview Interview
</UDLLink>{" "} </UDLLink>{" "}
with Borealis AI. with Borealis AI.
</HeroNewsItemContent> </HeroNewsItemContent>
</HeroNewsItem> ),
<HeroNewsItem> },
<HeroNewsItemDate>12/05/23</HeroNewsItemDate> {
date: "12/05/23",
content: (
<HeroNewsItemContent> <HeroNewsItemContent>
{" "}
Book released by{" "} Book released by{" "}
<UDLLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/"> <UDLLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">
The MIT Press The MIT Press
</UDLLink> </UDLLink>
. .
</HeroNewsItemContent> </HeroNewsItemContent>
),
},
];
export default function HeroSection() {
return (
<HeroContainer id="home">
<HeroContent>
<HeroRow>
<HeroColumn1>
<HeroNewsBlock>
<HeroNewsTitle>RECENT NEWS:</HeroNewsTitle>
{news.map((item, index) => (
<HeroNewsItem key={index}>
<HeroNewsItemDate>{item.date}</HeroNewsItemDate>
{item.content}
</HeroNewsItem> </HeroNewsItem>
))}
</HeroNewsBlock> </HeroNewsBlock>
<HeroCitationTitle>CITATION:</HeroCitationTitle> <HeroCitationTitle>CITATION:</HeroCitationTitle>
<HeroCitationBlock> <HeroCitationBlock>
<pre> <pre>
<code> <code>{citation}</code>
<>{citation}</>
</code>
</pre> </pre>
</HeroCitationBlock> </HeroCitationBlock>
<HeroFollowBlock> <HeroFollowBlock>
@@ -177,7 +171,7 @@ export default function HeroSection() {
</HeroColumn1> </HeroColumn1>
<HeroColumn2> <HeroColumn2>
<HeroImgWrap> <HeroImgWrap>
<Img src={img} alt="UDL Book" /> <Img src={img} alt="Book Cover" />
</HeroImgWrap> </HeroImgWrap>
<HeroLink href="https://github.com/udlbook/udlbook/releases/download/v4.0.1/UnderstandingDeepLearning_05_27_24_C.pdf"> <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)

View File

Before

Width:  |  Height:  |  Size: 282 KiB

After

Width:  |  Height:  |  Size: 282 KiB