Merge branch 'main' of https://github.com/udlbook/udlbook
This commit is contained in:
Simon Prince
@@ -1,304 +1,304 @@
|
||||
import styled from "styled-components";
|
||||
|
||||
export const HeroContainer = styled.div`
|
||||
background: #57c6d1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 0px;
|
||||
position: static;
|
||||
z-index: 1;
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
|
||||
export const HeroContent = styled.div`
|
||||
z-index: 3;
|
||||
width: 100% ;
|
||||
max-width: 1100px;
|
||||
position: static;
|
||||
padding: 8px 24px;
|
||||
margin: 80px 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center ;
|
||||
`
|
||||
export const HeroH1 = styled.h1`
|
||||
color: #fff;
|
||||
font-size: 48px;
|
||||
text-align: center;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
`
|
||||
|
||||
export const HeroP = styled.p`
|
||||
margin-top: 24px;
|
||||
color: #fff;
|
||||
font-size: 24px ;
|
||||
text-align: center ;
|
||||
max-width: 600px ;
|
||||
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
export const HeroBtnWrapper = styled.div`
|
||||
margin-top: 32px ;
|
||||
display: flex;
|
||||
flex-direction: column ;
|
||||
align-items: center ;
|
||||
`
|
||||
|
||||
|
||||
export const HeroRow = styled.div`
|
||||
display: grid;
|
||||
grid-auto-columns: minmax(auto, 1fr);
|
||||
align-items: top;
|
||||
grid-template-areas: 'col1 col2' };
|
||||
|
||||
@media screen and (max-width: 768px){
|
||||
grid-template-areas: 'col2' 'col1';
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
export const HeroNewsItem = styled.div`
|
||||
margin-left: 4px;
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
// line-height: 16px;
|
||||
margin-bottom: 16px;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
|
||||
`
|
||||
export const HeroNewsItemDate = styled.div`
|
||||
width: 20%;
|
||||
margin-right: 20px ;
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
`
|
||||
|
||||
export const HeroNewsItemContent = styled.div`
|
||||
width: 80%;
|
||||
color: #000000;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
|
||||
export const HeroColumn1 = styled.div`
|
||||
margin-bottom: 15px;
|
||||
margin-left: 12px;
|
||||
margin-top: 60px;
|
||||
padding: 10px 15px;
|
||||
padding: 0 15px;
|
||||
grid-area: col1;
|
||||
align-items:left;
|
||||
display: flex;
|
||||
flex-direction:column;
|
||||
justify-content: space-between;
|
||||
`
|
||||
|
||||
|
||||
export const HeroColumn2 = styled.div`
|
||||
margin-bottom: 15px;
|
||||
padding: 0 15px;
|
||||
grid-area: col2;
|
||||
display: flex;
|
||||
align-items:center;
|
||||
flex-direction:column;
|
||||
`
|
||||
|
||||
export const TextWrapper = styled.div`
|
||||
max-width: 540px ;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
`
|
||||
export const HeroImgWrap = styled.div`
|
||||
max-width: 555px;
|
||||
height: 100%;
|
||||
`
|
||||
|
||||
export const Img = styled.img`
|
||||
width: 100%;
|
||||
margin-top: 0;
|
||||
margin-right: 0;
|
||||
margin-left: 10px;
|
||||
padding-right: 0;
|
||||
`;
|
||||
|
||||
export const HeroDownloadsImg = styled.img`
|
||||
margin-top: 5px;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
padding-right: 0;
|
||||
margin-bottom: 10px;
|
||||
`
|
||||
|
||||
export const HeroLink = styled.a`
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
padding: 0.6rem 0rem 0rem 0rem;
|
||||
cursor: pointer;
|
||||
position:relative ;
|
||||
|
||||
&:before{
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #fff;
|
||||
content: '';
|
||||
opacity: .3;
|
||||
-webkit-transform: scaleX(1);
|
||||
transition-property: opacity, -webkit-transform;
|
||||
transition-duration: .3s;
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
opacity: 1;
|
||||
-webkit-transform: scaleX(1.05);
|
||||
}
|
||||
`;
|
||||
|
||||
// color: #fff;
|
||||
// text-decoration: none;
|
||||
// padding: 0.1rem 0rem;
|
||||
// height: 100%;
|
||||
// cursor: pointer;
|
||||
// position:relative ;
|
||||
|
||||
// &:before{
|
||||
// position: absolute;
|
||||
// margin: 0 auto;
|
||||
// top: 100%;
|
||||
// left: 0;
|
||||
// width: 100%;
|
||||
// height: 2px;
|
||||
// background-color: #000;
|
||||
// content: '';
|
||||
// opacity: .3;
|
||||
// -webkit-transform: scaleX(1);
|
||||
// transition-property: opacity, -webkit-transform;
|
||||
// transition-duration: .3s;
|
||||
// }
|
||||
|
||||
// &:hover:before {
|
||||
// opacity: 1;
|
||||
// -webkit-transform: scaleX(1.05);
|
||||
// }
|
||||
// `;
|
||||
|
||||
export const UDLLink = styled.a`
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
font-weight: 300;
|
||||
margin: 0 2px;
|
||||
position: relative;
|
||||
|
||||
&:before{
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #000;
|
||||
content: '';
|
||||
opacity: .3;
|
||||
-webkit-transform: scaleX(1);
|
||||
transition-property: opacity, -webkit-transform;
|
||||
transition-duration: .3s;
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
opacity: 1;
|
||||
-webkit-transform: scaleX(1.05);
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
|
||||
|
||||
export const HeroNewsTitle = styled.div`
|
||||
margin-left: 0px;
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
margin-bottom: 36px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
export const HeroCitationTitle = styled.div`
|
||||
margin-left: 0px;
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
margin-top:36px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
export const HeroNewsBlock = styled.div`
|
||||
|
||||
`
|
||||
export const HeroCitationBlock = styled.div`
|
||||
font-size: 14px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 0px;
|
||||
|
||||
`
|
||||
|
||||
|
||||
|
||||
|
||||
export const HeroFollowBlock = styled.div`
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 14px;
|
||||
}
|
||||
`
|
||||
import styled from "styled-components";
|
||||
|
||||
export const HeroContainer = styled.div`
|
||||
background: #57c6d1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 0px;
|
||||
position: static;
|
||||
z-index: 1;
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
|
||||
export const HeroContent = styled.div`
|
||||
z-index: 3;
|
||||
width: 100% ;
|
||||
max-width: 1100px;
|
||||
position: static;
|
||||
padding: 8px 24px;
|
||||
margin: 80px 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center ;
|
||||
`
|
||||
export const HeroH1 = styled.h1`
|
||||
color: #fff;
|
||||
font-size: 48px;
|
||||
text-align: center;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
`
|
||||
|
||||
export const HeroP = styled.p`
|
||||
margin-top: 24px;
|
||||
color: #fff;
|
||||
font-size: 24px ;
|
||||
text-align: center ;
|
||||
max-width: 600px ;
|
||||
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
export const HeroBtnWrapper = styled.div`
|
||||
margin-top: 32px ;
|
||||
display: flex;
|
||||
flex-direction: column ;
|
||||
align-items: center ;
|
||||
`
|
||||
|
||||
|
||||
export const HeroRow = styled.div`
|
||||
display: grid;
|
||||
grid-auto-columns: minmax(auto, 1fr);
|
||||
align-items: top;
|
||||
grid-template-areas: 'col1 col2' };
|
||||
|
||||
@media screen and (max-width: 768px){
|
||||
grid-template-areas: 'col2' 'col1';
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
export const HeroNewsItem = styled.div`
|
||||
margin-left: 4px;
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
// line-height: 16px;
|
||||
margin-bottom: 16px;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
|
||||
`
|
||||
export const HeroNewsItemDate = styled.div`
|
||||
width: 20%;
|
||||
margin-right: 20px ;
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
`
|
||||
|
||||
export const HeroNewsItemContent = styled.div`
|
||||
width: 80%;
|
||||
color: #000000;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 12px;
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
|
||||
export const HeroColumn1 = styled.div`
|
||||
margin-bottom: 15px;
|
||||
margin-left: 12px;
|
||||
margin-top: 60px;
|
||||
padding: 10px 15px;
|
||||
padding: 0 15px;
|
||||
grid-area: col1;
|
||||
align-items:left;
|
||||
display: flex;
|
||||
flex-direction:column;
|
||||
justify-content: space-between;
|
||||
`
|
||||
|
||||
|
||||
export const HeroColumn2 = styled.div`
|
||||
margin-bottom: 15px;
|
||||
padding: 0 15px;
|
||||
grid-area: col2;
|
||||
display: flex;
|
||||
align-items:center;
|
||||
flex-direction:column;
|
||||
`
|
||||
|
||||
export const TextWrapper = styled.div`
|
||||
max-width: 540px ;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
`
|
||||
export const HeroImgWrap = styled.div`
|
||||
max-width: 555px;
|
||||
height: 100%;
|
||||
`
|
||||
|
||||
export const Img = styled.img`
|
||||
width: 100%;
|
||||
margin-top: 0;
|
||||
margin-right: 0;
|
||||
margin-left: 10px;
|
||||
padding-right: 0;
|
||||
`;
|
||||
|
||||
export const HeroDownloadsImg = styled.img`
|
||||
margin-top: 5px;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
padding-right: 0;
|
||||
margin-bottom: 10px;
|
||||
`
|
||||
|
||||
export const HeroLink = styled.a`
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
padding: 0.6rem 0rem 0rem 0rem;
|
||||
cursor: pointer;
|
||||
position:relative ;
|
||||
|
||||
&:before{
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #fff;
|
||||
content: '';
|
||||
opacity: .3;
|
||||
-webkit-transform: scaleX(1);
|
||||
transition-property: opacity, -webkit-transform;
|
||||
transition-duration: .3s;
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
opacity: 1;
|
||||
-webkit-transform: scaleX(1.05);
|
||||
}
|
||||
`;
|
||||
|
||||
// color: #fff;
|
||||
// text-decoration: none;
|
||||
// padding: 0.1rem 0rem;
|
||||
// height: 100%;
|
||||
// cursor: pointer;
|
||||
// position:relative ;
|
||||
|
||||
// &:before{
|
||||
// position: absolute;
|
||||
// margin: 0 auto;
|
||||
// top: 100%;
|
||||
// left: 0;
|
||||
// width: 100%;
|
||||
// height: 2px;
|
||||
// background-color: #000;
|
||||
// content: '';
|
||||
// opacity: .3;
|
||||
// -webkit-transform: scaleX(1);
|
||||
// transition-property: opacity, -webkit-transform;
|
||||
// transition-duration: .3s;
|
||||
// }
|
||||
|
||||
// &:hover:before {
|
||||
// opacity: 1;
|
||||
// -webkit-transform: scaleX(1.05);
|
||||
// }
|
||||
// `;
|
||||
|
||||
export const UDLLink = styled.a`
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
font-weight: 300;
|
||||
margin: 0 2px;
|
||||
position: relative;
|
||||
|
||||
&:before{
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #000;
|
||||
content: '';
|
||||
opacity: .3;
|
||||
-webkit-transform: scaleX(1);
|
||||
transition-property: opacity, -webkit-transform;
|
||||
transition-duration: .3s;
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
opacity: 1;
|
||||
-webkit-transform: scaleX(1.05);
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
|
||||
|
||||
export const HeroNewsTitle = styled.div`
|
||||
margin-left: 0px;
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
margin-bottom: 36px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
export const HeroCitationTitle = styled.div`
|
||||
margin-left: 0px;
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
margin-top:36px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
|
||||
export const HeroNewsBlock = styled.div`
|
||||
|
||||
`
|
||||
export const HeroCitationBlock = styled.div`
|
||||
font-size: 14px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 0px;
|
||||
|
||||
`
|
||||
|
||||
|
||||
|
||||
|
||||
export const HeroFollowBlock = styled.div`
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 14px;
|
||||
}
|
||||
`
|
||||
@@ -1,104 +1,104 @@
|
||||
import React from 'react'
|
||||
import { HeroContainer, HeroNewsBlock, HeroCitationBlock, HeroCitationTitle, HeroFollowBlock, HeroDownloadsImg, HeroLink, HeroRow, HeroColumn1, HeroColumn2, HeroContent, Img, HeroImgWrap, HeroNewsTitle, HeroNewsItem, HeroNewsItemDate, HeroNewsItemContent, UDLLink} from './HeroElements'
|
||||
import img from '../../images/F23.prince.learning.turquoise.jpg'
|
||||
|
||||
const HeroSection = () => {
|
||||
|
||||
|
||||
const citation = `
|
||||
@book{prince2023understanding,
|
||||
author = "Simon J.D. Prince",
|
||||
title = "Understanding Deep Learning",
|
||||
publisher = "The MIT Press",
|
||||
year = 2023,
|
||||
url = "http://udlbook.com"}
|
||||
`
|
||||
|
||||
return (
|
||||
<HeroContainer id="home">
|
||||
<HeroContent>
|
||||
<HeroRow>
|
||||
<HeroColumn1>
|
||||
<HeroNewsBlock>
|
||||
<HeroNewsTitle>RECENT NEWS:</HeroNewsTitle>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>05/22/24</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> New <UDLLink href="https://www.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>
|
||||
<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>
|
||||
<HeroNewsItemContent>New blog about the <UDLLink href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/">Neural Tangent Kernel</UDLLink>.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
{/* <HeroNewsItem>
|
||||
<HeroNewsItemDate>02/15/24</HeroNewsItemDate>
|
||||
<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/"> gradient flow </UDLLink> published.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/26/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> Machine Learning Street Talk <UDLLink href="https://www.youtube.com/watch?v=sJXn4Cl4oww"> podcast </UDLLink> discussing book.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/19/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent>Deeper Insights <UDLLink href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385">podcast</UDLLink> discussing book.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/06/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> <UDLLink href="https://www.borealisai.com/news/understanding-deep-learning/">Interview</UDLLink> with Borealis AI.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/05/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> Book released by <UDLLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">The MIT Press</UDLLink>.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
</HeroNewsBlock>
|
||||
<HeroCitationTitle>CITATION:</HeroCitationTitle>
|
||||
<HeroCitationBlock>
|
||||
<pre>
|
||||
<code>
|
||||
<React.Fragment>{citation}</React.Fragment>
|
||||
</code>
|
||||
</pre>
|
||||
</HeroCitationBlock>
|
||||
<HeroFollowBlock>
|
||||
Follow me on <UDLLink href="https://twitter.com/SimonPrinceAI">Twitter</UDLLink> or <UDLLink
|
||||
href="https://www.linkedin.com/in/simon-prince-615bb9165/">LinkedIn</UDLLink> for updates.
|
||||
</HeroFollowBlock>
|
||||
</HeroColumn1>
|
||||
<HeroColumn2>
|
||||
<HeroImgWrap>
|
||||
<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)</HeroLink>
|
||||
<HeroDownloadsImg src="https://img.shields.io/github/downloads/udlbook/udlbook/total" alt="download stats shield"/>
|
||||
<HeroLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">Buy the book</HeroLink>
|
||||
<HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Answer_Booklet_Students.pdf">Answers to selected questions</HeroLink>
|
||||
<HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Errata.pdf">Errata</HeroLink>
|
||||
</HeroColumn2>
|
||||
</HeroRow>
|
||||
</HeroContent>
|
||||
</HeroContainer>
|
||||
)
|
||||
}
|
||||
|
||||
export default HeroSection
|
||||
import React from 'react'
|
||||
import { HeroContainer, HeroNewsBlock, HeroCitationBlock, HeroCitationTitle, HeroFollowBlock, HeroDownloadsImg, HeroLink, HeroRow, HeroColumn1, HeroColumn2, HeroContent, Img, HeroImgWrap, HeroNewsTitle, HeroNewsItem, HeroNewsItemDate, HeroNewsItemContent, UDLLink} from './HeroElements'
|
||||
import img from '../../images/F23.prince.learning.turquoise.jpg'
|
||||
|
||||
const HeroSection = () => {
|
||||
|
||||
|
||||
const citation = `
|
||||
@book{prince2023understanding,
|
||||
author = "Simon J.D. Prince",
|
||||
title = "Understanding Deep Learning",
|
||||
publisher = "The MIT Press",
|
||||
year = 2023,
|
||||
url = "http://udlbook.com"}
|
||||
`
|
||||
|
||||
return (
|
||||
<HeroContainer id="home">
|
||||
<HeroContent>
|
||||
<HeroRow>
|
||||
<HeroColumn1>
|
||||
<HeroNewsBlock>
|
||||
<HeroNewsTitle>RECENT NEWS:</HeroNewsTitle>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>05/22/24</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> New <UDLLink href="https://www.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>
|
||||
<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>
|
||||
<HeroNewsItemContent>New blog about the <UDLLink href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/">Neural Tangent Kernel</UDLLink>.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
{/* <HeroNewsItem>
|
||||
<HeroNewsItemDate>02/15/24</HeroNewsItemDate>
|
||||
<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/"> gradient flow </UDLLink> published.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/26/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> Machine Learning Street Talk <UDLLink href="https://www.youtube.com/watch?v=sJXn4Cl4oww"> podcast </UDLLink> discussing book.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/19/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent>Deeper Insights <UDLLink href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385">podcast</UDLLink> discussing book.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/06/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> <UDLLink href="https://www.borealisai.com/news/understanding-deep-learning/">Interview</UDLLink> with Borealis AI.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
|
||||
<HeroNewsItem>
|
||||
<HeroNewsItemDate>12/05/23</HeroNewsItemDate>
|
||||
<HeroNewsItemContent> Book released by <UDLLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">The MIT Press</UDLLink>.</HeroNewsItemContent>
|
||||
</HeroNewsItem>
|
||||
</HeroNewsBlock>
|
||||
<HeroCitationTitle>CITATION:</HeroCitationTitle>
|
||||
<HeroCitationBlock>
|
||||
<pre>
|
||||
<code>
|
||||
<React.Fragment>{citation}</React.Fragment>
|
||||
</code>
|
||||
</pre>
|
||||
</HeroCitationBlock>
|
||||
<HeroFollowBlock>
|
||||
Follow me on <UDLLink href="https://twitter.com/SimonPrinceAI">Twitter</UDLLink> or <UDLLink
|
||||
href="https://www.linkedin.com/in/simon-prince-615bb9165/">LinkedIn</UDLLink> for updates.
|
||||
</HeroFollowBlock>
|
||||
</HeroColumn1>
|
||||
<HeroColumn2>
|
||||
<HeroImgWrap>
|
||||
<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)</HeroLink>
|
||||
<HeroDownloadsImg src="https://img.shields.io/github/downloads/udlbook/udlbook/total" alt="download stats shield"/>
|
||||
<HeroLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">Buy the book</HeroLink>
|
||||
<HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Answer_Booklet_Students.pdf">Answers to selected questions</HeroLink>
|
||||
<HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Errata.pdf">Errata</HeroLink>
|
||||
</HeroColumn2>
|
||||
</HeroRow>
|
||||
</HeroContent>
|
||||
</HeroContainer>
|
||||
)
|
||||
}
|
||||
|
||||
export default HeroSection
|
||||
Reference in New Issue
Block a user