Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 20, 2025. It is now read-only.

Kevin/refactor recent featured #2073

Merged
3 commits merged into from
Sep 6, 2021
Merged

Kevin/refactor recent featured #2073

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3680fa8
refactor main article image
virtualpowwa Sep 6, 2021
047e3e8
pull upstream
virtualpowwa Sep 6, 2021
d3ef5c7
fix small articles
virtualpowwa Sep 6, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 3 additions & 15 deletions src/pages/academy/_recent-featured-posts.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ import {
MobileDotIcon,
MobileHeader,
} from './components/recent-featured-posts/_style'
import { convertDate, truncateString } from 'common/utility'
import { convertDate, truncateString, getAssetUrl } from 'common/utility'
import { Flex } from 'components/containers'
import { QueryImage, Carousel, Tabs, Header } from 'components/elements'
import { localize, WithIntl, Localize } from 'components/localization'
Expand Down Expand Up @@ -73,13 +73,7 @@ const RecentFeaturedPosts = ({ recent_data, featured_data }) => {
<ArticleContentWrapper>
<LeftContent>
<RedirectLink to={`/academy/blog/posts/${headline_recent.slug}`}>
<MainArticle>
<QueryImage
className="main-article-bg"
data={headline_recent.main_image.imageFile}
alt={headline_recent.main_image.description || ''}
height="464px"
/>
<MainArticle image={getAssetUrl(headline_recent.main_image.id)}>
<Description>
<TagParentWrapper>
{headline_recent.tags.map((article) => {
Expand Down Expand Up @@ -190,13 +184,7 @@ const RecentFeaturedPosts = ({ recent_data, featured_data }) => {
<ArticleContentWrapper>
<LeftContent>
<RedirectLink to={`/academy/blog/posts/${headline_featured.slug}`}>
<MainArticle>
<QueryImage
className="main-article-bg"
data={headline_featured.main_image.imageFile}
alt={headline_featured.main_image.description || ''}
height="464px"
/>
<MainArticle image={getAssetUrl(headline_featured.main_image.id)}>
<Description>
<TagParentWrapper>
{headline_featured.tags.map((article) => {
Expand Down
4 changes: 2 additions & 2 deletions src/pages/academy/blog/_first-article.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ const ImageWrapper = styled.div`
height: unset;
}

> .main-article-bg {
> .first-article-image {
display: contents;
}
`
Expand Down Expand Up @@ -78,7 +78,7 @@ const FirstArticle = ({ item }) => {
data={getImage(item.main_image.imageFile)}
alt={item.main_image.description || ''}
width="100%"
className="main-article-bg"
className="first-article-image"
/>
</ImageWrapper>
<FirstContentWrapper fd="column" p="35px 40px" width="45%">
Expand Down
8 changes: 1 addition & 7 deletions src/pages/academy/components/recent-featured-posts/_style.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,14 +76,8 @@ export const MainArticle = styled(Flex)`
}

@media ${device.tablet} {
width: 88vw;
min-width: 270px;
}

> .main-article-bg {
display: contents;
opacity: 0.8;
}
`

export const Description = styled.div`
Expand Down Expand Up @@ -160,6 +154,7 @@ export const SmallArticle = styled(Flex)`
@media ${device.laptopM} {
height: 82px;
margin-bottom: 16px;
min-width: unset;
}
`

Expand Down Expand Up @@ -234,7 +229,6 @@ export const SmallArticleRightContent = styled(Flex)`
}

@media (max-width: 425px) {
width: 185px;
margin-left: 0;
}
`
Expand Down