diff --git a/src/pages/academy/_recent-featured-posts.js b/src/pages/academy/_recent-featured-posts.js index 61b7ca31e35..ab9f140540c 100644 --- a/src/pages/academy/_recent-featured-posts.js +++ b/src/pages/academy/_recent-featured-posts.js @@ -26,26 +26,9 @@ import { } from './components/recent-featured-posts/_style' import { StandardImgWrapper } from './common/_styles' import { convertDate, getAssetUrl } from 'common/utility' -import { QueryImage, Carousel, Tabs, Header } from 'components/elements' +import { QueryImage, Tabs, Header } from 'components/elements' import { localize, WithIntl, Localize } from 'components/localization' -// Settings for carousel -const settings = { - options: { - axis: 'y', - align: 'start', - slidesToScroll: 3, - }, - view_port: { - height: 'auto', - }, - vertical_container: { - flexDirection: 'column', - height: '464px', - width: '100%', - }, -} - const RecentFeaturedPosts = ({ recent_data, featured_data }) => { const recents = recent_data.slice(1) const headline_recent = recent_data[0] @@ -105,50 +88,45 @@ const RecentFeaturedPosts = ({ recent_data, featured_data }) => { - - {recents.map((article) => { - return ( - - - - - - - - - -
- {article.blog_title} -
-
- - {article?.published_date && - convertDate(article?.published_date)} - - {article.read_time_in_minutes}{' '} - - -
-
-
- ) - })} -
+ {recents.map((article) => { + return ( + + + + + + + + + +
+ {article.blog_title} +
+
+ + {article?.published_date && + convertDate(article?.published_date)} + + {article.read_time_in_minutes}{' '} + + +
+
+
+ ) + })}
@@ -192,50 +170,45 @@ const RecentFeaturedPosts = ({ recent_data, featured_data }) => { - - {featureds.map((article) => { - return ( - - - - - - - - - -
- {article.blog_title} -
-
- - {article?.published_date && - convertDate(article?.published_date)} - - {article.read_time_in_minutes}{' '} - - -
-
-
- ) - })} -
+ {featureds.map((article) => { + return ( + + + + + + + + + +
+ {article.blog_title} +
+
+ + {article?.published_date && + convertDate(article?.published_date)} + + {article.read_time_in_minutes}{' '} + + +
+
+
+ ) + })}
diff --git a/src/pages/academy/components/recent-featured-posts/_style.js b/src/pages/academy/components/recent-featured-posts/_style.js index df224694c0f..c45444e0a5a 100644 --- a/src/pages/academy/components/recent-featured-posts/_style.js +++ b/src/pages/academy/components/recent-featured-posts/_style.js @@ -42,9 +42,17 @@ export const LeftContent = styled(Flex)` ` export const RightContent = styled(Flex)` + flex-direction: column; justify-content: start; - @media ${device.laptopM} { - flex-direction: column; + max-height: 464px; + padding-right: 8px; + overflow: hidden auto; + + @media ${device.desktopL} { + max-height: 600px; + } + @media (max-width: 1280px) { + max-height: 432px; } ` @@ -73,6 +81,11 @@ export const MainArticle = styled(Flex)` transform: scale(1.02); } + @media ${device.desktopL} { + width: 1000px; + max-height: 600px; + } + @media (max-width: 1280px) { width: 720px; } diff --git a/src/pages/academy/components/video-banner/_DBanner.js b/src/pages/academy/components/video-banner/_DBanner.js index 7dfa957f62a..b4e05bc289a 100644 --- a/src/pages/academy/components/video-banner/_DBanner.js +++ b/src/pages/academy/components/video-banner/_DBanner.js @@ -23,7 +23,6 @@ const ParentWrapper = styled(Flex)` background-size: cover; height: auto; padding: 160px 0 80px; - max-width: 1600px; @media ${device.tabletL} { /* prettier-ignore */ diff --git a/src/pages/academy/index.js b/src/pages/academy/index.js index b50542575c3..5734ad3b9cd 100644 --- a/src/pages/academy/index.js +++ b/src/pages/academy/index.js @@ -192,7 +192,7 @@ export const query = graphql` recent: blog( filter: { status: { _eq: "published" } } sort: "-published_date" - limit: 6 + limit: 8 ) { id main_image { @@ -220,7 +220,7 @@ export const query = graphql` recent_eu: blog( filter: { status: { _eq: "published" }, hide_for_eu: { _eq: false } } sort: "-published_date" - limit: 6 + limit: 8 ) { id main_image { @@ -249,7 +249,7 @@ export const query = graphql` featured: blog( filter: { status: { _eq: "published" }, featured: { _eq: true } } sort: "-published_date" - limit: 6 + limit: 8 ) { id main_image { @@ -281,7 +281,7 @@ export const query = graphql` hide_for_eu: { _eq: false } } sort: "-published_date" - limit: 6 + limit: 8 ) { id main_image {