Skip to content

Include the type of video in the video card pill - #8091

Closed
sophie-macmillan wants to merge 2 commits into
mainfrom
sophie-m/include-video-type-on-card
Closed

Include the type of video in the video card pill#8091
sophie-macmillan wants to merge 2 commits into
mainfrom
sophie-m/include-video-type-on-card

Conversation

@sophie-macmillan

@sophie-macmillan sophie-macmillan commented Jun 29, 2023

Copy link
Copy Markdown
Contributor

What does this change?

This work builds on #7972. It updates the new duration pill on video cards on the fronts, so that if they are an Explainer, a Documentary, or a live video then the pill will show that

Why?

This makes it clearer what content the video is, some information was lost in the redesign as we lost the pillar colour from the video cards

Screenshots

Before After
Explainer cards image image
Documentary cards image image
Live cards image image
All other cards (no change) image image

@sophie-macmillan
sophie-macmillan changed the base branch from main to ab/video-card-redesign June 29, 2023 09:41
@github-actions

github-actions Bot commented Jun 29, 2023 •
edited
Loading

Copy link
Copy Markdown

Size Change: -10.8 kB (-2%)

Total Size: 627 kB

Filename Size Change
dotcom-rendering/dist/9875.modern.********************.js 0 B -10.9 kB (removed) 🏆
ℹ️ View Unchanged
Filename Size Change
dotcom-rendering/dist/1061.modern.********************.js 689 B 0 B
dotcom-rendering/dist/1266.modern.********************.js 3.97 kB 0 B
dotcom-rendering/dist/1511.modern.********************.js 688 B 0 B
dotcom-rendering/dist/1591.modern.********************.js 11.2 kB 0 B
dotcom-rendering/dist/1813.modern.********************.js 6.52 kB 0 B
dotcom-rendering/dist/1816.modern.********************.js 780 B 0 B
dotcom-rendering/dist/1860.modern.********************.js 815 B 0 B
dotcom-rendering/dist/2006.modern.********************.js 3.84 kB 0 B
dotcom-rendering/dist/2238.modern.********************.js 619 B 0 B
dotcom-rendering/dist/2286.modern.********************.js 639 B 0 B
dotcom-rendering/dist/2429.modern.********************.js 760 B 0 B
dotcom-rendering/dist/2476.modern.********************.js 901 B 0 B
dotcom-rendering/dist/2478.modern.********************.js 491 B 0 B
dotcom-rendering/dist/2630.modern.********************.js 479 B 0 B
dotcom-rendering/dist/2843.modern.********************.js 859 B 0 B
dotcom-rendering/dist/2854.modern.********************.js 3.3 kB 0 B
dotcom-rendering/dist/2964.modern.********************.js 745 B 0 B
dotcom-rendering/dist/320.modern.********************.js 778 B 0 B
dotcom-rendering/dist/3250.modern.********************.js 3.56 kB 0 B
dotcom-rendering/dist/3398.modern.********************.js 20.4 kB 0 B
dotcom-rendering/dist/3547.modern.********************.js 942 B 0 B
dotcom-rendering/dist/3577.modern.********************.js 4.77 kB 0 B
dotcom-rendering/dist/3697.modern.********************.js 745 B 0 B
dotcom-rendering/dist/3702.modern.********************.js 829 B 0 B
dotcom-rendering/dist/375.modern.********************.js 711 B 0 B
dotcom-rendering/dist/3993.modern.********************.js 6.21 kB 0 B
dotcom-rendering/dist/40.modern.********************.js 812 B 0 B
dotcom-rendering/dist/4188.modern.********************.js 758 B 0 B
dotcom-rendering/dist/4249.modern.********************.js 556 B 0 B
dotcom-rendering/dist/4295.modern.********************.js 574 B 0 B
dotcom-rendering/dist/4331.modern.********************.js 3.36 kB 0 B
dotcom-rendering/dist/4381.modern.********************.js 622 B 0 B
dotcom-rendering/dist/4415.modern.********************.js 888 B 0 B
dotcom-rendering/dist/4738.modern.********************.js 699 B 0 B
dotcom-rendering/dist/4755.modern.********************.js 25.4 kB 0 B
dotcom-rendering/dist/4970.modern.********************.js 682 B 0 B
dotcom-rendering/dist/5153.modern.********************.js 2.29 kB 0 B
dotcom-rendering/dist/5162.modern.********************.js 2.5 kB 0 B
dotcom-rendering/dist/5182.modern.********************.js 3.9 kB 0 B
dotcom-rendering/dist/5194.modern.********************.js 748 B 0 B
dotcom-rendering/dist/5237.modern.********************.js 2.44 kB 0 B
dotcom-rendering/dist/5556.modern.********************.js 927 B 0 B
dotcom-rendering/dist/5593.modern.********************.js 2.3 kB 0 B
dotcom-rendering/dist/5676.modern.********************.js 828 B 0 B
dotcom-rendering/dist/5743.modern.********************.js 3.25 kB 0 B
dotcom-rendering/dist/5936.modern.********************.js 762 B 0 B
dotcom-rendering/dist/5959.modern.********************.js 776 B 0 B
dotcom-rendering/dist/6297.modern.********************.js 21.3 kB 0 B
dotcom-rendering/dist/6633.modern.********************.js 3.22 kB 0 B
dotcom-rendering/dist/6663.modern.********************.js 645 B 0 B
dotcom-rendering/dist/6814.modern.********************.js 5.56 kB 0 B
dotcom-rendering/dist/6939.modern.********************.js 5.36 kB 0 B
dotcom-rendering/dist/7044.modern.********************.js 887 B 0 B
dotcom-rendering/dist/7392.modern.********************.js 2.49 kB 0 B
dotcom-rendering/dist/7465.modern.********************.js 621 B 0 B
dotcom-rendering/dist/7515.modern.********************.js 745 B 0 B
dotcom-rendering/dist/7601.modern.********************.js 699 B 0 B
dotcom-rendering/dist/7844.modern.********************.js 4.98 kB 0 B
dotcom-rendering/dist/7872.modern.********************.js 1.89 kB 0 B
dotcom-rendering/dist/8012.modern.********************.js 4.66 kB 0 B
dotcom-rendering/dist/8326.modern.********************.js 2.61 kB 0 B
dotcom-rendering/dist/8452.modern.********************.js 4.28 kB 0 B
dotcom-rendering/dist/8602.modern.********************.js 868 B 0 B
dotcom-rendering/dist/8780.modern.********************.js 3.16 kB 0 B
dotcom-rendering/dist/8862.modern.********************.js 964 B 0 B
dotcom-rendering/dist/8888.modern.********************.js 2.75 kB 0 B
dotcom-rendering/dist/9328.modern.********************.js 964 B 0 B
dotcom-rendering/dist/9370.modern.********************.js 3.13 kB 0 B
dotcom-rendering/dist/9456.modern.********************.js 870 B 0 B
dotcom-rendering/dist/9463.modern.********************.js 635 B 0 B
dotcom-rendering/dist/9571.modern.********************.js 3.91 kB 0 B
dotcom-rendering/dist/9861.modern.********************.js 3.5 kB 0 B
dotcom-rendering/dist/9874.modern.********************.js 4.96 kB 0 B
dotcom-rendering/dist/9959.modern.********************.js 834 B 0 B
dotcom-rendering/dist/AlreadyVisited-importable.modern.********************.js 412 B 0 B
dotcom-rendering/dist/AnimatePulsingDots-importable.modern.********************.js 389 B 0 B
dotcom-rendering/dist/atomIframe.modern.********************.js 516 B 0 B
dotcom-rendering/dist/AudioAtomWrapper-importable.modern.********************.js 464 B 0 B
dotcom-rendering/dist/AustralianTerritorySwitcher-importable.modern.********************.js 4.43 kB 0 B
dotcom-rendering/dist/Branding-importable.modern.********************.js 2.18 kB 0 B
dotcom-rendering/dist/braze-web-sdk-core.modern.********************.js 36.9 kB 0 B
dotcom-rendering/dist/BrazeMessaging-importable.modern.********************.js 5.5 kB 0 B
dotcom-rendering/dist/CalloutBlockComponent-importable.modern.********************.js 6.47 kB 0 B
dotcom-rendering/dist/CalloutEmbedBlockComponent-importable.modern.********************.js 6.59 kB 0 B
dotcom-rendering/dist/Carousel-importable.modern.********************.js 5.94 kB 0 B
dotcom-rendering/dist/CarouselForNewsletters-importable.modern.********************.js 7.88 kB 0 B
dotcom-rendering/dist/ChartAtomWrapper-importable.modern.********************.js 474 B 0 B
dotcom-rendering/dist/CommentCount-importable.modern.********************.js 2.77 kB 0 B
dotcom-rendering/dist/discussion.modern.********************.js 393 B 0 B
dotcom-rendering/dist/DiscussionContainer-importable.modern.********************.js 22.2 kB 0 B
dotcom-rendering/dist/DiscussionMeta-importable.modern.********************.js 3.73 kB 0 B
dotcom-rendering/dist/DocumentBlockComponent-importable.modern.********************.js 2.71 kB 0 B
dotcom-rendering/dist/EmbedBlockComponent-importable.modern.********************.js 3.25 kB 0 B
dotcom-rendering/dist/embedIframe.modern.********************.js 520 B 0 B
dotcom-rendering/dist/EnhancePinnedPost-importable.modern.********************.js 1.95 kB 0 B
dotcom-rendering/dist/FetchCommentCounts-importable.modern.********************.js 2.97 kB 0 B
dotcom-rendering/dist/FetchOnwardsData-importable.modern.********************.js 1.97 kB 0 B
dotcom-rendering/dist/FilterKeyEventsToggle-importable.modern.********************.js 3.41 kB 0 B
dotcom-rendering/dist/FocusStyles-importable.modern.********************.js 511 B 0 B
dotcom-rendering/dist/frameworks.modern.********************.js 20.5 kB 0 B
dotcom-rendering/dist/GetCricketScoreboard-importable.modern.********************.js 3.36 kB 0 B
dotcom-rendering/dist/GetMatchNav-importable.modern.********************.js 11.4 kB 0 B
dotcom-rendering/dist/GetMatchStats-importable.modern.********************.js 6.32 kB 0 B
dotcom-rendering/dist/GetMatchTabs-importable.modern.********************.js 2.42 kB 0 B
dotcom-rendering/dist/guardian-braze-components-banner.modern.********************.js 13.3 kB 0 B
dotcom-rendering/dist/guardian-braze-components-end-of-article.modern.********************.js 10.3 kB 0 B
dotcom-rendering/dist/GuideAtomWrapper-importable.modern.********************.js 476 B 0 B
dotcom-rendering/dist/HeaderTopBar-importable.modern.********************.js 10.8 kB 0 B
dotcom-rendering/dist/index.modern.********************.js 34.3 kB +1 B (0%)
dotcom-rendering/dist/InstagramBlockComponent-importable.modern.********************.js 2.79 kB 0 B
dotcom-rendering/dist/InteractiveBlockComponent-importable.modern.********************.js 5.8 kB 0 B
dotcom-rendering/dist/InteractiveContentsBlockComponent-importable.modern.********************.js 4.09 kB 0 B
dotcom-rendering/dist/InteractiveSupportButton-importable.modern.********************.js 4.14 kB 0 B
dotcom-rendering/dist/KeyEventsCarousel-importable.modern.********************.js 2.21 kB 0 B
dotcom-rendering/dist/KnowledgeQuizAtomWrapper-importable.modern.********************.js 481 B 0 B
dotcom-rendering/dist/LatestLinks-importable.modern.********************.js 1.85 kB 0 B
dotcom-rendering/dist/LiveBlogEpic-importable.modern.********************.js 5.16 kB 0 B
dotcom-rendering/dist/Liveness-importable.modern.********************.js 5.53 kB 0 B
dotcom-rendering/dist/ManyNewsletterSignUp-importable.modern.********************.js 6.89 kB 0 B
dotcom-rendering/dist/MapEmbedBlockComponent-importable.modern.********************.js 5.32 kB 0 B
dotcom-rendering/dist/Metrics-importable.modern.********************.js 2.32 kB 0 B
dotcom-rendering/dist/MostViewedFooter-importable.modern.********************.js 5.36 kB 0 B
dotcom-rendering/dist/MostViewedFooterData-importable.modern.********************.js 7.57 kB 0 B
dotcom-rendering/dist/MostViewedRightWrapper-importable.modern.********************.js 3.79 kB 0 B
dotcom-rendering/dist/newsletterEmbedIframe.modern.********************.js 621 B 0 B
dotcom-rendering/dist/OnwardsUpper-importable.modern.********************.js 3.86 kB 0 B
dotcom-rendering/dist/PersonalityQuizAtomWrapper-importable.modern.********************.js 483 B 0 B
dotcom-rendering/dist/ProfileAtomWrapper-importable.modern.********************.js 478 B 0 B
dotcom-rendering/dist/QandaAtomWrapper-importable.modern.********************.js 475 B 0 B
dotcom-rendering/dist/ReaderRevenueDev-importable.modern.********************.js 461 B 0 B
dotcom-rendering/dist/readerRevenueDevUtils.modern.********************.js 3.03 kB 0 B
dotcom-rendering/dist/ReaderRevenueLinks-importable.modern.********************.js 5.82 kB 0 B
dotcom-rendering/dist/RecipeMultiplier-importable.modern.********************.js 3.26 kB 0 B
dotcom-rendering/dist/relativeTime.modern.********************.js 976 B 0 B
dotcom-rendering/dist/RichLinkComponent-importable.modern.********************.js 5.05 kB 0 B
dotcom-rendering/dist/SecureSignupIframe-importable.modern.********************.js 2.57 kB 0 B
dotcom-rendering/dist/SendAMessage-importable.modern.********************.js 4.37 kB 0 B
dotcom-rendering/dist/sentry.modern.********************.js 766 B 0 B
dotcom-rendering/dist/SetABTests-importable.modern.********************.js 3.75 kB 0 B
dotcom-rendering/dist/SetAdTargeting-importable.modern.********************.js 537 B 0 B
dotcom-rendering/dist/ShareCount-importable.modern.********************.js 2.91 kB 0 B
dotcom-rendering/dist/shimport.modern.********************.js 2.78 kB 0 B
dotcom-rendering/dist/ShowHideContainers-importable.modern.********************.js 720 B 0 B
dotcom-rendering/dist/ShowMore-importable.modern.********************.js 5.26 kB +94 B (+2%)
dotcom-rendering/dist/SignInGateMain.modern.********************.js 2.96 kB 0 B
dotcom-rendering/dist/SignInGateMainCheckoutComplete.modern.********************.js 3.86 kB 0 B
dotcom-rendering/dist/SignInGateSelector-importable.modern.********************.js 3.92 kB 0 B
dotcom-rendering/dist/SlotBodyEnd-importable.modern.********************.js 2.91 kB 0 B
dotcom-rendering/dist/Snow-importable.modern.********************.js 4.26 kB 0 B
dotcom-rendering/dist/SpotifyBlockComponent-importable.modern.********************.js 5.17 kB 0 B
dotcom-rendering/dist/StickyBottomBanner-importable.modern.********************.js 4 kB 0 B
dotcom-rendering/dist/SubNav-importable.modern.********************.js 2.34 kB 0 B
dotcom-rendering/dist/SupportTheG-importable.modern.********************.js 5.94 kB 0 B
dotcom-rendering/dist/TableOfContents-importable.modern.********************.js 3.08 kB 0 B
dotcom-rendering/dist/TimelineAtomWrapper-importable.modern.********************.js 476 B 0 B
dotcom-rendering/dist/TopRightAdSlot-importable.modern.********************.js 631 B 0 B
dotcom-rendering/dist/TweetBlockComponent-importable.modern.********************.js 1 kB 0 B
dotcom-rendering/dist/UnsafeEmbedBlockComponent-importable.modern.********************.js 2.8 kB 0 B
dotcom-rendering/dist/VideoFacebookBlockComponent-importable.modern.********************.js 5.33 kB 0 B
dotcom-rendering/dist/VineBlockComponent-importable.modern.********************.js 2.64 kB 0 B
dotcom-rendering/dist/WeatherData-importable.modern.********************.js 4.33 kB 0 B
dotcom-rendering/dist/YoutubeBlockComponent-importable.modern.********************.js 4.22 kB 0 B

compressed-size-action

@sophie-macmillan
sophie-macmillan force-pushed the sophie-m/include-video-type-on-card branch from e7ad5a5 to 9ffc257 Compare June 29, 2023 09:49
@sophie-macmillan sophie-macmillan added the run_chromatic Runs chromatic when label is applied label Jun 29, 2023
@sophie-macmillan
sophie-macmillan marked this pull request as ready for review June 29, 2023 10:24
@sophie-macmillan
sophie-macmillan requested a review from a team as a code owner June 29, 2023 10:24
marjisound
marjisound approved these changes Jun 29, 2023
View reviewed changes

@marjisound marjisound left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great Sophie

@abeddow91
abeddow91 force-pushed the ab/video-card-redesign branch 4 times, most recently from ea61540 to 1a01a5b Compare July 4, 2023 14:57
Base automatically changed from ab/video-card-redesign to main July 4, 2023 15:36
@sophie-macmillan
sophie-macmillan force-pushed the sophie-m/include-video-type-on-card branch 2 times, most recently from 3e0256f to 3ed5fa7 Compare July 5, 2023 11:04
@sophie-macmillan
sophie-macmillan force-pushed the sophie-m/include-video-type-on-card branch from 3ed5fa7 to 3f9817f Compare July 5, 2023 11:05
@sophie-macmillan sophie-macmillan linked an issue Jul 6, 2023 that may be closed by this pull request
Release update to the new video card 'pill', so it contains the video category #8177
Closed
@sophie-macmillan

sophie-macmillan commented Jul 17, 2023

Copy link
Copy Markdown
Contributor Author

Closing as the logic for displaying the category was incorrect

@sophie-macmillan
sophie-macmillan deleted the sophie-m/include-video-type-on-card branch December 18, 2023 11:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@marjisound marjisound marjisound approved these changes
@abeddow91 abeddow91 Awaiting requested review from abeddow91

Assignees

No one assigned

Labels

dotcom-rendering run_chromatic Runs chromatic when label is applied

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Release update to the new video card 'pill', so it contains the video category

3 participants

@sophie-macmillan @marjisound @abeddow91