From 60eab5a164fb6c749320e16a291542fdd98eacef Mon Sep 17 00:00:00 2001 From: Evan Date: Mon, 15 Jul 2024 16:21:31 -0400 Subject: [PATCH] chore(docs): remove unneeded/unused styles from home page --- .../patternfly-docs/pages/home.css | 152 +---------------- .../patternfly-docs/pages/home.js | 156 ++++++++++-------- 2 files changed, 85 insertions(+), 223 deletions(-) diff --git a/packages/documentation-site/patternfly-docs/pages/home.css b/packages/documentation-site/patternfly-docs/pages/home.css index 9f0b3808fd..01f718f883 100644 --- a/packages/documentation-site/patternfly-docs/pages/home.css +++ b/packages/documentation-site/patternfly-docs/pages/home.css @@ -1,155 +1,5 @@ -.ws-mdx-p { -/* font-size: var(--pf-v6-global--FontSize--lg); */ -} - -.pf-m-white, -.pf-m-white.ws-mdx-a { - color: white; -} - -#hello-were-patternfly+.ws-mdx-p { - margin-bottom: var(--pf-t--global--spacer--sm); -} - -#patternfly-principles { -/* font-size: var(--pf-v6-global--FontSize--4xl); */ -} - -#flyer-fundamentals .ws-heading-anchor { -/* color: var(--pf-v6-global--Color--100); */ -} - -.ws-pf-principle .pf-v6-l-flex { - align-items: flex-start; - flex-wrap: nowrap; -} - -.ws-pf-principle .pf-v6-l-flex>div:first-child { - margin-right: var(--pf-t--global--spacer--3xl); - flex-shrink: 0; - width: 93px; - text-align: center; -} - -@media (max-width: 767px) { - .ws-pf-principle .pf-v6-l-flex { - flex-wrap: wrap; - } - - .ws-pf-principle .ws-principles-img { - margin-bottom: var(--pf-t--global--spacer--lg); - } -} - -.v5-featured-posts, .v5-stay-informed { - --pf-v6-c-page__main-section--PaddingRight: var(--pf-t--global--spacer--2xl); - --pf-v6-c-page__main-section--PaddingLeft: var(--pf-t--global--spacer--2xl); -} - -.v5-featured-posts-cards, .v5-stay-informed-cards { - --pf-v6-c-page__main-section--PaddingTop: var(--pf-t--global--spacer--2xl); - --pf-v6-c-page__main-section--PaddingRight: var(--pf-t--global--spacer--2xl); - --pf-v6-c-page__main-section--PaddingBottom: var(--pf-t--global--spacer--2xl); - --pf-v6-c-page__main-section--PaddingLeft: var(--pf-t--global--spacer--2xl); -} - -.v5-featured-posts > div.pf-v6-c-page__main-body, -.v5-stay-informed > div.pf-v6-c-page__main-body { - padding-bottom: 0px; -} - -.v5-featured-posts-card-header-img { +.v6-featured-posts-card-header-img { background-position: center; background-size: cover; height: 300px; } - -.ws-homepage-main-section { - --pf-v6-c-page__main-section--PaddingTop: var(--pf-t--global--spacer--2xl); - --pf-v6-c-page__main-section--PaddingRight: 0px; - --pf-v6-c-page__main-section--PaddingBottom: var(--pf-t--global--spacer--2xl); - --pf-v6-c-page__main-section--PaddingLeft: var(--pf-t--global--spacer--2xl); -} - -@media (max-width: 992px) { - .ws-homepage-main-section { - --pf-v6-c-page__main-section--PaddingRight: var(--pf-t--global--spacer--2xl); - } -} - -.ws-homepage-main-section.pf4-c-background-image .pf4-site-c-hero { - margin-bottom: 0; - margin: var(--pf-t--global--spacer--xl) auto 0; -} - -.ws-mdx-a { -/* font-size: var(--pf-v6-global--FontSize--lg); */ -} - -@keyframes fadeIn { - from { - opacity: 0; - } - - to { - opacity: 1; - } -} - -.fadeIn { - animation-name: fadeIn; -} - -@keyframes fadeInDown { - from { - opacity: 0; - transform: translate3d(0, -100%, 0); - } - - to { - opacity: 1; - transform: translate3d(0, 0, 0); - } -} - -.fadeInDown { - animation-name: fadeInDown; -} - -@keyframes fadeInUp { - from { - opacity: 0; - transform: translate3d(0, 100%, 0); - } - - to { - opacity: 1; - transform: translate3d(0, 0, 0); - } -} - -.fadeInUp { - animation-name: fadeInUp; -} - -.animated { - animation-duration: 1s; - animation-fill-mode: both; -} - -.fadeInOne { - animation-delay: .2s; -} - -.fadeInTwo { - animation-delay: .6s; -} - -.fadeInThree { - animation-delay: 1s; -} - -.fadeInFour { - animation-delay: 1.4s; -} - diff --git a/packages/documentation-site/patternfly-docs/pages/home.js b/packages/documentation-site/patternfly-docs/pages/home.js index af7e10e55b..86800a39b1 100644 --- a/packages/documentation-site/patternfly-docs/pages/home.js +++ b/packages/documentation-site/patternfly-docs/pages/home.js @@ -1,5 +1,5 @@ -import React from "react"; -import {Link} from "@patternfly/documentation-framework/components"; +import React from 'react'; +import { Link } from '@patternfly/documentation-framework/components'; import { Banner, Button, @@ -18,60 +18,60 @@ import { Title, Text, TextVariants, -} from "@patternfly/react-core"; -import ArrowRightIcon from "@patternfly/react-icons/dist/esm/icons/arrow-right-icon"; -import ExternalLinkAltIcon from "@patternfly/react-icons/dist/esm/icons/external-link-alt-icon"; -import lightshowcase from "../images/light-showcase.png"; -import darkshowcase from "../images/dark-showcase.png"; -import "./home.css"; -import { featuredPostsData } from "./featured-posts-data"; +} from '@patternfly/react-core'; +import ArrowRightIcon from '@patternfly/react-icons/dist/esm/icons/arrow-right-icon'; +import ExternalLinkAltIcon from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon'; +import lightshowcase from '../images/light-showcase.png'; +import darkshowcase from '../images/dark-showcase.png'; +import './home.css'; +import { featuredPostsData } from './featured-posts-data'; const cardData = [ { - title: "Upgrade to PatternFly v5", - body: "Reference our upgrade guide to learn how you can update to the latest version of PatternFly.", - link: "/get-started/upgrade", - layout: "withSubtitle", + title: 'Upgrade to PatternFly v5', + body: 'Reference our upgrade guide to learn how you can update to the latest version of PatternFly.', + link: '/get-started/upgrade', + layout: 'withSubtitle', }, { - title: "Read our latest release highlights", - body: "Stay informed about every PatternFly release by reading through our highlights, which lay out important code changes and design updates.", - link: "/get-started/release-highlights", - layout: "withSubtitle", + title: 'Read our latest release highlights', + body: 'Stay informed about every PatternFly release by reading through our highlights, which lay out important code changes and design updates.', + link: '/get-started/release-highlights', + layout: 'withSubtitle', }, { - title: "Attend PatternFly community events", - body: "Join one of our regular meetings where we set time aside to share information and address questions or issues presented by the community.", - link: "https://calendar.google.com/calendar/embed?src=patternflyteam%40gmail.com&ctz=America%2FNew_York", - layout: "withSubtitle", + title: 'Attend PatternFly community events', + body: 'Join one of our regular meetings where we set time aside to share information and address questions or issues presented by the community.', + link: 'https://calendar.google.com/calendar/embed?src=patternflyteam%40gmail.com&ctz=America%2FNew_York', + layout: 'withSubtitle', hasExtLinkIcon: true, }, { - title: "Explore our roadmaps", - body: "Take a look at our issue boards on GitHub to see what we’re working on now and what we have planned next.", - link: "https://github.com/orgs/patternfly/projects/7", - layout: "withSubtitle", + title: 'Explore our roadmaps', + body: 'Take a look at our issue boards on GitHub to see what we’re working on now and what we have planned next.', + link: 'https://github.com/orgs/patternfly/projects/7', + layout: 'withSubtitle', hasExtLinkIcon: true, }, { - title: "Follow us on Twitter", - body: "Stay up to date on timely PatternFly news and updates through our Twitter.", - layout: "withSubtitle", - link: "https://twitter.com/patternfly", + title: 'Follow us on Twitter', + body: 'Stay up to date on timely PatternFly news and updates through our Twitter.', + layout: 'withSubtitle', + link: 'https://twitter.com/patternfly', hasExtLinkIcon: true, }, { - title: "Join the discussion", - body: "Visit our discussion board on GitHub to help drive future design and development plans.", - link: "https://github.com/orgs/patternfly/discussions", - layout: "withSubtitle", + title: 'Join the discussion', + body: 'Visit our discussion board on GitHub to help drive future design and development plans.', + link: 'https://github.com/orgs/patternfly/discussions', + layout: 'withSubtitle', hasExtLinkIcon: true, }, ]; const AggregateCards = () => { return ( - + {cardData.map((card, cardIndex) => { let cardAlign; const curCardCount = cardIndex + 1; @@ -83,7 +83,7 @@ const AggregateCards = () => { { selectableActionId: actionId, selectableActionAriaLabelledby: cardTitleId, name: 'homepage-card', - isExternalLink: card.hasExtLinkIcon + isExternalLink: card.hasExtLinkIcon, }} > @@ -103,11 +103,11 @@ const AggregateCards = () => { {card.title} {card.hasExtLinkIcon ? ( <> - {" "} + {' '} ) : ( - "" + '' )} @@ -121,7 +121,7 @@ const AggregateCards = () => { ); }; -const FeaturedBlogCard = ({postData, idx}) => { +const FeaturedBlogCard = ({ postData, idx }) => { const { URL, author, imageURL, length, title } = postData; const curCardCount = idx + 1; const cardId = `featured-blog-post-${curCardCount}`; @@ -131,13 +131,13 @@ const FeaturedBlogCard = ({postData, idx}) => { return ( { > - {" "} - - {title} - + {' '} + {title} {author} • {length} - ) + ); }; const HomePage = () => ( - Welcome to the PatternFly 6 staging website! PatternFly 6 is still under development, so documentation across this website will continue to change. + Welcome to the PatternFly 6 staging website! PatternFly 6 is{' '} + + still under development, so documentation across this website will + continue to change. + - {" "} + {' '} Design and build better product experiences in the <Text component="span" className="pf-v6-u-primary-color-100"> - {" "} - open{" "} + {' '} + open{' '} </Text> with PatternFly - + PatternFly is an open source design system that enables teams to create consistent and scalable enterprise products. PatternFly is sponsored and maintained by Red Hat, but is open to all. - + ( `} - + - - - + + + Featured blog posts @@ -262,16 +267,23 @@ const HomePage = () => ( - + {Object.values(featuredPostsData).map((post, idx) => ( - + ))} - - - + + + Stay informed @@ -289,7 +301,7 @@ const HomePage = () => ( - +