From 847771422f5c4e3159f8892ee6ade7796de3546f Mon Sep 17 00:00:00 2001 From: Anna Wen <54281166+annawen1@users.noreply.github.com> Date: Fri, 29 Sep 2023 10:47:19 -0400 Subject: [PATCH] chore(deprecated): remove v1 deprecated components (#10979) * chore(deprecated): removing deprecated components from v1 * chore(migration): update migration docs --- docs/dotcom-v2-migration.md | 6 +- packages/styles/carbon.yml | 292 +++++++++++++----- .../_content-block-horizontal.scss | 17 +- .../_content-group-horizontal.scss | 37 --- .../content-group-horizontal/_index.scss | 11 - .../_feature-card-block-large.scss | 212 ------------- .../feature-card-block-large/_index.scss | 11 - .../_feature-card-block-medium.scss | 51 --- .../feature-card-block-medium/_index.scss | 11 - packages/styles/scss/ibm-dotcom-styles.scss | 3 - .../content-block/_content-block.scss | 9 +- .../_content-group-horizontal.scss | 32 -- .../_card-section-images.scss | 10 - packages/web-components/carbon.yml | 13 +- .../content-group-horizontal/.babelrc | 22 -- .../content-group-horizontal/.gitignore | 2 - .../content-group-horizontal/.sassrc | 3 - .../content-group-horizontal/cdn.html | 51 --- .../content-group-horizontal/index.html | 51 --- .../content-group-horizontal/package.json | 23 -- .../sandbox.config.json | 3 - .../content-group-horizontal/src/index.js | 11 - .../content-group-horizontal/src/index.scss | 16 - .../src/components/card-group/index.ts | 1 - .../card-section-images.scss | 24 -- .../card-section-images.ts | 39 --- .../components/card-section-images/index.ts | 17 - .../content-group-horizontal.ts | 34 -- .../content-group-horizontal/index.ts | 13 - .../feature-card-block-large-footer.ts | 27 -- .../feature-card-block-large.scss | 20 -- .../feature-card-block-large.ts | 56 ---- .../feature-card-block-large/index.ts | 14 - ...feature-card-block-medium-block-heading.ts | 49 --- .../feature-card-block-medium.scss | 20 -- .../feature-card-block-medium.ts | 59 ---- .../feature-card-block-medium/index.ts | 15 - .../__stories__/scroll-animations.stories.ts | 1 - .../tests/cdn-build/app/canary.html | 9 - .../tests/cdn-build/app/latest.html | 9 - .../tests/cdn-build/app/next.html | 9 - .../tests/cdn-build/app/version.html | 9 - .../content-group-horizontal.cdn.e2e.js | 17 - .../content-group-horizontal.e2e.js | 17 - thumbnails/card-section-images.svg | 38 --- thumbnails/image-with-caption.svg | 27 -- 46 files changed, 235 insertions(+), 1186 deletions(-) delete mode 100644 packages/styles/scss/components/content-group-horizontal/_content-group-horizontal.scss delete mode 100644 packages/styles/scss/components/content-group-horizontal/_index.scss delete mode 100644 packages/styles/scss/components/feature-card-block-large/_feature-card-block-large.scss delete mode 100644 packages/styles/scss/components/feature-card-block-large/_index.scss delete mode 100644 packages/styles/scss/components/feature-card-block-medium/_feature-card-block-medium.scss delete mode 100644 packages/styles/scss/components/feature-card-block-medium/_index.scss delete mode 100644 packages/styles/scss/patterns/blocks/content-group-horizontal/_content-group-horizontal.scss delete mode 100644 packages/styles/scss/patterns/sections/card-section-images/_card-section-images.scss delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/.babelrc delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/.gitignore delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/.sassrc delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/cdn.html delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/index.html delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/package.json delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/sandbox.config.json delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/src/index.js delete mode 100644 packages/web-components/examples/codesandbox/components/content-group-horizontal/src/index.scss delete mode 100644 packages/web-components/src/components/card-section-images/card-section-images.scss delete mode 100644 packages/web-components/src/components/card-section-images/card-section-images.ts delete mode 100644 packages/web-components/src/components/card-section-images/index.ts delete mode 100644 packages/web-components/src/components/content-group-horizontal/content-group-horizontal.ts delete mode 100644 packages/web-components/src/components/content-group-horizontal/index.ts delete mode 100644 packages/web-components/src/components/feature-card-block-large/feature-card-block-large-footer.ts delete mode 100644 packages/web-components/src/components/feature-card-block-large/feature-card-block-large.scss delete mode 100644 packages/web-components/src/components/feature-card-block-large/feature-card-block-large.ts delete mode 100644 packages/web-components/src/components/feature-card-block-large/index.ts delete mode 100644 packages/web-components/src/components/feature-card-block-medium/feature-card-block-medium-block-heading.ts delete mode 100644 packages/web-components/src/components/feature-card-block-medium/feature-card-block-medium.scss delete mode 100644 packages/web-components/src/components/feature-card-block-medium/feature-card-block-medium.ts delete mode 100644 packages/web-components/src/components/feature-card-block-medium/index.ts delete mode 100644 packages/web-components/tests/e2e/cypress/integration/content-group-horizontal/content-group-horizontal.cdn.e2e.js delete mode 100644 packages/web-components/tests/e2e/cypress/integration/content-group-horizontal/content-group-horizontal.e2e.js delete mode 100644 thumbnails/card-section-images.svg delete mode 100644 thumbnails/image-with-caption.svg diff --git a/docs/dotcom-v2-migration.md b/docs/dotcom-v2-migration.md index 777a68a830a..03e41f0a3d5 100644 --- a/docs/dotcom-v2-migration.md +++ b/docs/dotcom-v2-migration.md @@ -25,6 +25,7 @@ For Carbon v11 migration guidance, see their | card-group-card-link-item | This component is deprecated in v2 in favor for default card or with content-item | | card-link | This component is deprecated in v2 in favor for [card](#card) (link variant) component | | card-section-carousel | This component is deprecated in v2 in favor for content-section/block component combined with carousel | +| card-section-images | This component is deprecated in v1 and has been removed in v2 in favor of the card-section component. | | card-section-simple | This component is deprecated in v2 in facor for content-section/block component combined with card-group | | content-block-cards | This component is deprecated in v2 in favor for content-section/block & card-group components | | content-block-horizontal | This component is deprecated in v2 in favor for content-section/block & content-item-horizontal components | @@ -32,16 +33,19 @@ For Carbon v11 migration guidance, see their | content-block-mixed | This component is deprecated in v2 in favor for content-section/block, video-player/image, pictogram-items, and other content-group components | | content-block-segmented | This component is deprecated in v2 in favor for content-section/block component | | content-block-simple | This component is deprecated in v2 in favor for content-section/block component | +| content-group-horizontal | This component is deprecated in v1 and has been removed in v2 in favor of the content-block-horizontal component. | | content-group-cards | This component is deprecated in v2 in favor for content-section/block & card-group components | | content-group-pictograms | This component is deprecated in v2 in favor for content-section/block content-item (pictogram variant) components | | content-group-simple | This component is deprecated in v2 in favor for content-group, image, & content-item components | | cta | View changes [here](#cta) | | cta-block | This component is deprecated in v2 in favor for content-section/block & content-item components | | cta-section | This component is deprecated in v2 in favor for content-section/block & content-item components | +| feature-card-block-large | This component is deprecated in v1 and has been removed in v2 in favor of the feature-card component. | +| feature-card-block-medium | This component is deprecated in v1 and has been removed in v2 in favor of the feature-card component. | | footer | No API changes. | | hr | View changes [here](#horizontal-rule) | | image | View changes [here](#image) | -| image-with-caption | Replaced by `image` | +| image-with-caption | This component is deprecated in v1 and has been removed in v2 in favor of the image component | | link-list-section | This component is deprecated in v2 in favor for content-section/block & link-list end of section variant components | | logo-grid | This component is deprecated in v2 in favor for content-section/block & image-group components | | pictogram-item | This component is deprecated in v2 in favor for content-item (pictogram variation) componet | diff --git a/packages/styles/carbon.yml b/packages/styles/carbon.yml index b0412ea8346..a46c9f1e841 100644 --- a/packages/styles/carbon.yml +++ b/packages/styles/carbon.yml @@ -17,7 +17,9 @@ library: assets: back-to-top: name: Back to top - description: Back to top is a sticky button that appears on long form pages. When triggered it scrolls the the user back to the top of the page. + description: + Back to top is a sticky button that appears on long form pages. When + triggered it scrolls the the user back to the top of the page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/back-to-top status: stable type: component @@ -28,7 +30,10 @@ assets: - contextual-navigation button-group: name: Button group - description: The Button group component is to be utilized within IBM.com for grouping two or more Button components together and sets all buttons to the same width. + description: + The Button group component is to be utilized within IBM.com for grouping + two or more Button components together and sets all buttons to the same + width. externalDocsUrl: https://www.ibm.com/standards/carbon/components/button-group status: key: stable @@ -42,7 +47,9 @@ assets: - contextual-navigation callout-quote: name: Callout quote - description: Callout quote is a typographic layout that is used to highlight an impactful client statement or user testimonial. + description: + Callout quote is a typographic layout that is used to highlight an + impactful client statement or user testimonial. externalDocsUrl: https://www.ibm.com/standards/carbon/components/callout-quote status: stable type: component @@ -54,7 +61,9 @@ assets: - content-block callout-with-media: name: Callout with media - description: Callout with media is used to feature a high value media asset such as a customer story. + description: + Callout with media is used to feature a high value media asset such as a + customer story. externalDocsUrl: https://www.ibm.com/standards/carbon/components/callout-with-media status: stable type: component @@ -67,7 +76,11 @@ assets: - content-element card: name: Card - description: The Card component can be used in many different page types. The default design includes a heading and a call to action, and optional extras include an eyebrow, copy, and media. By adding and removing optional content, the card offers a wide range of design possibilities. + description: + The Card component can be used in many different page types. The default + design includes a heading and a call to action, and optional extras + include an eyebrow, copy, and media. By adding and removing optional + content, the card offers a wide range of design possibilities. externalDocsUrl: https://www.ibm.com/standards/carbon/components/cards#card status: stable type: component @@ -79,7 +92,10 @@ assets: - contextual-navigation card-in-card: name: Card in card - description: Card in card shares the same functionality and text content requirements of a standard card, but requires a large media element. Card in card is often used in a Card group to as a featured card. + description: + Card in card shares the same functionality and text content requirements + of a standard card, but requires a large media element. Card in card is + often used in a Card group to as a featured card. externalDocsUrl: https://www.ibm.com/standards/carbon/components/cards#card-in-card status: stable type: component @@ -91,7 +107,11 @@ assets: - contextual-navigation card-link: name: Card link - description: Unlike Card, which can be used as a standalone component, Card link should always be accompanied by contextual copy on the page. Card links contain a heading, an optional CTA (call-to-action), and optional body copy. The entire card is clickable. + description: + Unlike Card, which can be used as a standalone component, Card link should + always be accompanied by contextual copy on the page. Card links contain a + heading, an optional CTA (call-to-action), and optional body copy. The + entire card is clickable. externalDocsUrl: https://www.ibm.com/standards/carbon/components/cards#card-link status: stable type: component @@ -103,7 +123,10 @@ assets: - contextual-navigation feature-card: name: Feature card - description: "Feature card is used for highlighting a piece of content on page. It should be used sparingly to be effective. Feature card has two sizes: medium and large." + description: + 'Feature card is used for highlighting a piece of content on page. It + should be used sparingly to be effective. Feature card has two sizes: + medium and large.' externalDocsUrl: https://www.ibm.com/standards/carbon/components/cards#feature-card status: stable type: component @@ -117,7 +140,9 @@ assets: - contextual-navigation card-group: name: Card group - description: Card group arranges cards in a grid and offers useful features that are applied to the group as a whole. + description: + Card group arranges cards in a grid and offers useful features that are + applied to the group as a whole. externalDocsUrl: https://www.ibm.com/standards/carbon/components/card-group status: stable type: component @@ -130,7 +155,9 @@ assets: - content-element card-section: name: Card section - description: Card section is a collection of cards presented in a full-width section with a left-column header that responds to the grid. + description: + Card section is a collection of cards presented in a full-width section + with a left-column header that responds to the grid. externalDocsUrl: https://www.ibm.com/standards/carbon/components/card-section status: stable type: component @@ -139,22 +166,12 @@ assets: thumbnailPath: ../../thumbnails/card-section.svg tags: - content-block - card-section-images: - name: Card section with images - description: Card section with images brings images into each card in the section. Like Card section, this component is used for presenting resources or links, but presents images instead of body copy in each card. - externalDocsUrl: https://www.ibm.com/standards/carbon/components/card-section#card-section-with-images - status: stable - type: component - platform: web - noIndex: true - thumbnailPath: ../../thumbnails/card-section-images.svg - tags: - - content-block - - media - - contextual-navigation card-section-carousel: name: Card section carousel - description: Card section carousel is an exploratory component, meaning it allows users to browse or explore multiple pieces of content within the same area of the page. + description: + Card section carousel is an exploratory component, meaning it allows users + to browse or explore multiple pieces of content within the same area of + the page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/card-section-carousel status: stable type: component @@ -167,7 +184,10 @@ assets: - contextual-navigation carousel: name: Carousel - description: The carousel is an exploratory component, meaning it allows users to browse or explore multiple pieces of content within the same area of the page. + description: + The carousel is an exploratory component, meaning it allows users to + browse or explore multiple pieces of content within the same area of the + page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/carousel status: stable type: component @@ -181,7 +201,12 @@ assets: - content-element content-block: name: Content block - description: Content block is a high-level layout component that acts as the main content unit used inside of a Content section to build web experiences on IBM dotcom. It encapsulates other content components (one or multiple content groups) and brings them together into a custom visual, which solves a specific problem for the user. + description: + Content block is a high-level layout component that acts as the main + content unit used inside of a Content section to build web experiences on + IBM dotcom. It encapsulates other content components (one or multiple + content groups) and brings them together into a custom visual, which + solves a specific problem for the user. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-block status: stable type: component @@ -193,7 +218,9 @@ assets: - content-element content-block-cards: name: Content block cards - description: Content block cards is used to present small self-contained pieces of information as cards. + description: + Content block cards is used to present small self-contained pieces of + information as cards. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-block-cards status: stable type: component @@ -204,7 +231,9 @@ assets: - content-block content-block-horizontal: name: Content block horizontal - description: Content block horizontal is used to highlight a group of more important pieces of content, such as products or solutions, with more visual weight. + description: + Content block horizontal is used to highlight a group of more important + pieces of content, such as products or solutions, with more visual weight. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-block-horizontal status: stable type: component @@ -215,7 +244,9 @@ assets: - content-block content-block-media: name: Content block media - description: Content block media is used to present information with images in a group setting. + description: + Content block media is used to present information with images in a group + setting. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-block-media status: stable type: component @@ -227,7 +258,9 @@ assets: - media content-block-segmented: name: Content block segmented - description: Content block segmented is a variation of Content block simple with the added ability to add subsections. + description: + Content block segmented is a variation of Content block simple with the + added ability to add subsections. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-block-segmented status: stable type: component @@ -238,7 +271,9 @@ assets: - content-block content-block-simple: name: Content block simple - description: Content block simple is typically used for the introductory section on a page. + description: + Content block simple is typically used for the introductory section on a + page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-block-simple status: stable type: component @@ -249,7 +284,11 @@ assets: - content-block content-group: name: Content group - description: Content group acts as a content unit, and is used inside a Content section or a Content block. It can contain basic content components (one or multiple content items of the same kind), bringing them together into highly-customized solutions for the user. + description: + Content group acts as a content unit, and is used inside a Content section + or a Content block. It can contain basic content components (one or + multiple content items of the same kind), bringing them together into + highly-customized solutions for the user. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-group status: stable type: component @@ -261,7 +300,10 @@ assets: - content-element content-group-banner: name: Content group banner - description: Content group banner is designed as a subtle callout, intended for tangential information or announcements that are supplementary to the page’s main focus. + description: + Content group banner is designed as a subtle callout, intended for + tangential information or announcements that are supplementary to the + page’s main focus. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-group-banner status: stable type: component @@ -272,7 +314,11 @@ assets: - content-block content-group-cards: name: Content group cards - description: Content group cards is used to present information through a group of cards with each acting as a call to action that drives to additional or supporting destinations. It is suitable for adding concise buckets of content and links to a long-form reading experience. + description: + Content group cards is used to present information through a group of + cards with each acting as a call to action that drives to additional or + supporting destinations. It is suitable for adding concise buckets of + content and links to a long-form reading experience. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-group-cards status: stable type: component @@ -283,7 +329,9 @@ assets: - content-block content-group-pictograms: name: Content group pictograms - description: Content group pictograms is used to present a group of information, each with a supporting pictogram. + description: + Content group pictograms is used to present a group of information, each + with a supporting pictogram. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-group-pictograms status: stable type: component @@ -295,7 +343,9 @@ assets: - media content-group-simple: name: Content group simple - description: Content group simple is an alternative form of a narrative layout where the content is broken up into smaller pieces to make it more digestible. + description: + Content group simple is an alternative form of a narrative layout where + the content is broken up into smaller pieces to make it more digestible. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-group-simple status: stable type: component @@ -306,7 +356,13 @@ assets: - content-block content-item: name: Content item - description: The Content item is a basic-level content component that acts as a primary content unit, and it is used inside a Content group to build web experiences on IBM dotcom pages. It can encapsulate basic content (a heading, a description, a media element – image or video – and a CTA) and brings them all together into a content component which solves a specific problem for the user. + description: + The Content item is a basic-level content component that acts as a primary + content unit, and it is used inside a Content group to build web + experiences on IBM dotcom pages. It can encapsulate basic content (a + heading, a description, a media element – image or video – and a CTA) and + brings them all together into a content component which solves a specific + problem for the user. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-item status: stable type: component @@ -317,7 +373,9 @@ assets: - content-element content-item-horizontal: name: Content item horizontal - description: Content item horizontal component displays information in a horizontal orientation. + description: + Content item horizontal component displays information in a horizontal + orientation. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-item-horizontal status: stable type: component @@ -329,7 +387,12 @@ assets: - content-element content-section: name: Content section - description: Content section is a high-level content component that acts as the main content unit to build web page experiences for IBM.com. It encapsulates other content components (one or multiple Content blocks and/or Content groups) and brings them together, providing flexibility to create many different solutions for users. + description: + Content section is a high-level content component that acts as the main + content unit to build web page experiences for IBM.com. It encapsulates + other content components (one or multiple Content blocks and/or Content + groups) and brings them together, providing flexibility to create many + different solutions for users. externalDocsUrl: https://www.ibm.com/standards/carbon/components/content-section status: stable type: component @@ -340,7 +403,9 @@ assets: - content-block cta: name: CTA - description: CTA stands for call to action. A CTA refers to the use of words or phrases that can compel an audience to act in a specific way. + description: + CTA stands for call to action. A CTA refers to the use of words or phrases + that can compel an audience to act in a specific way. externalDocsUrl: https://www.ibm.com/standards/carbon/components/cta status: stable type: component @@ -352,7 +417,10 @@ assets: - contextual-navigation cta-section: name: CTA section - description: CTA section builds off of CTA block and adds a content section heading in the left most columns. This component is typically used with the Table of contents horizontal. + description: + CTA section builds off of CTA block and adds a content section heading in + the left most columns. This component is typically used with the Table of + contents horizontal. externalDocsUrl: https://www.ibm.com/standards/carbon/components/cta-block-and-section#cta-section status: stable type: component @@ -364,7 +432,10 @@ assets: - contextual-navigation cta-block: name: CTA block - description: CTA block combines a heading, copy and CTA(s), this component is typically used at the bottom of a page to guide the user towards the next step in their journey. + description: + CTA block combines a heading, copy and CTA(s), this component is typically + used at the bottom of a page to guide the user towards the next step in + their journey. externalDocsUrl: https://www.ibm.com/standards/carbon/components/cta-block-and-section#cta-block status: stable type: component @@ -376,7 +447,9 @@ assets: - contextual-navigation dotcom-shell: name: Dotcom shell - description: Dotcom shell includes the Masthead, and Footer components, all wrapped in a UI shell using Carbon’s grid. + description: + Dotcom shell includes the Masthead, and Footer components, all wrapped in + a UI shell using Carbon’s grid. externalDocsUrl: https://www.ibm.com/standards/carbon/components/dotcom-shell status: stable type: component @@ -387,7 +460,9 @@ assets: - shell expressive-modal: name: Expressive modal - description: Expressive modal is based on the Carbon modal component with slight styling updates to increase the padding and uses fixed buttons. + description: + Expressive modal is based on the Carbon modal component with slight + styling updates to increase the padding and uses fixed buttons. externalDocsUrl: https://www.ibm.com/standards/carbon/components/expressive-modal status: stable type: component @@ -411,7 +486,10 @@ assets: - media filter-panel: name: Filter panel - description: The filter panel is a component that can be customized to provide categorized filters to help users trim down large amounts of content, data and/or search results. + description: + The filter panel is a component that can be customized to provide + categorized filters to help users trim down large amounts of content, data + and/or search results. externalDocsUrl: https://www.ibm.com/standards/carbon/components/filter-panel status: stable type: component @@ -423,7 +501,10 @@ assets: - input-control footer: name: Footer - description: The Footer is required on all IBM.com pages, it is placed at the bottom of a page and acts as the catch-all section that helps users navigate and provides corporate level general and legal information. + description: + The Footer is required on all IBM.com pages, it is placed at the bottom of + a page and acts as the catch-all section that helps users navigate and + provides corporate level general and legal information. externalDocsUrl: https://www.ibm.com/standards/carbon/components/footer status: stable type: component @@ -435,7 +516,9 @@ assets: - shell horizontal-rule: name: Horizontal rule - description: The horizontal rule component is utilized for thematic breaks within the content. + description: + The horizontal rule component is utilized for thematic breaks within the + content. externalDocsUrl: https://www.ibm.com/standards/carbon/components/horizontal-rule status: stable type: component @@ -446,7 +529,11 @@ assets: - content-element image: name: Image - description: Image, at its core, is a wrapper that adds an image to the page. You have the option to pass multiple images to the image component to render at the various breakpoints. This is particularly useful if you want to render different images at different screen sizes. + description: + Image, at its core, is a wrapper that adds an image to the page. You have + the option to pass multiple images to the image component to render at the + various breakpoints. This is particularly useful if you want to render + different images at different screen sizes. externalDocsUrl: https://www.ibm.com/standards/carbon/components/images#image status: stable type: component @@ -458,7 +545,11 @@ assets: - media image-with-caption: name: Image with caption - description: With the Image with caption component, an image can include a caption beneath to provide more context. In addition, the image can be clicked to open a larger version of the image, using the Lightbox media viewer overlay. + description: + With the Image with caption component, an image can include a caption + beneath to provide more context. In addition, the image can be clicked to + open a larger version of the image, using the Lightbox media viewer + overlay. externalDocsUrl: https://www.ibm.com/standards/carbon/components/images#image-with-caption status: stable type: component @@ -470,7 +561,12 @@ assets: - media language-selector: name: Language selector - description: Language selector is for users to select their preferred language on a website. The content on the website will appear in the default language until the users reselect their preferred language then the page content will reload in the reselected language provided a translation is available. + description: + Language selector is for users to select their preferred language on a + website. The content on the website will appear in the default language + until the users reselect their preferred language then the page content + will reload in the reselected language provided a translation is + available. externalDocsUrl: https://www.ibm.com/standards/carbon/components/language-selector status: stable type: component @@ -481,7 +577,9 @@ assets: - input-control layout: name: Layout - description: The layout component is to be utilized within IBM.com for various abstract layout configurations. + description: + The layout component is to be utilized within IBM.com for various abstract + layout configurations. externalDocsUrl: https://www.ibm.com/standards/carbon/components/layout status: stable type: component @@ -492,7 +590,10 @@ assets: - content-block lead-space: name: Lead space - description: Lead space sets the context and also helps users understand what type of content they are going to find on the page. It is always positioned at the top. + description: + Lead space sets the context and also helps users understand what type of + content they are going to find on the page. It is always positioned at the + top. externalDocsUrl: https://www.ibm.com/standards/carbon/components/leadspace status: stable type: component @@ -503,7 +604,13 @@ assets: - content-block lead-space-block: name: Lead space block - description: Lead space block is an alternative to the Lead space, enabling a more productive first site of viewer engagement. Lead space — block is positioned at the top of a web page, with a purpose to orient the user when they land on a page, inform them of the content, and guide them to the first key piece of content on the page, whether it’s a crucial piece of information or a call-to-action button. + description: + Lead space block is an alternative to the Lead space, enabling a more + productive first site of viewer engagement. Lead space — block is + positioned at the top of a web page, with a purpose to orient the user + when they land on a page, inform them of the content, and guide them to + the first key piece of content on the page, whether it’s a crucial piece + of information or a call-to-action button. externalDocsUrl: https://www.ibm.com/standards/carbon/components/lead-space-block status: stable type: component @@ -514,7 +621,11 @@ assets: - content-block lead-space-search: name: Lead space search - description: Lead space search provides a fast route to information discovery by including a prominent search option in the lead space. As the search is always positioned at the top, it is discoverable by users the moment they land on the page. + description: + Lead space search provides a fast route to information discovery by + including a prominent search option in the lead space. As the search is + always positioned at the top, it is discoverable by users the moment they + land on the page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/lead-space-search status: stable type: component @@ -526,7 +637,9 @@ assets: - content-block leaving-ibm-modal: name: Leaving IBM modal - description: The Leaving IBM notice displays as an overlay when a user clicks an external link. + description: + The Leaving IBM notice displays as an overlay when a user clicks an + external link. externalDocsUrl: https://www.ibm.com/standards/carbon/components/leaving-ibm-modal status: stable type: component @@ -537,7 +650,9 @@ assets: - system-feedback lightbox-media-viewer: name: Lightbox media viewer - description: Lightbox media viewer allows the user to view an image or video at a larger size within a modal. + description: + Lightbox media viewer allows the user to view an image or video at a + larger size within a modal. externalDocsUrl: https://www.ibm.com/standards/carbon/components/lightbox-media-viewer status: stable type: component @@ -548,7 +663,9 @@ assets: - media link-list: name: Link list - description: Link list is used for multiple CTAs, with options for vertical and horizontal lists and varying CTA styling. + description: + Link list is used for multiple CTAs, with options for vertical and + horizontal lists and varying CTA styling. externalDocsUrl: https://www.ibm.com/standards/carbon/components/link-list status: stable type: component @@ -559,7 +676,9 @@ assets: - contextual-navigation link-list-section: name: Link list section - description: Link list section is used for multiple CTAs, with options for vertical and horizontal lists and varying CTA styling. + description: + Link list section is used for multiple CTAs, with options for vertical and + horizontal lists and varying CTA styling. externalDocsUrl: https://www.ibm.com/standards/carbon/components/link-list-section status: stable type: component @@ -571,7 +690,10 @@ assets: - content-element link-with-icon: name: Link with icon - description: Link with icon is primarily used as a navigational element with an icon as an indicator to the destination or type of content being referenced. Link with icon should not be used within a paragraph. + description: + Link with icon is primarily used as a navigational element with an icon as + an indicator to the destination or type of content being referenced. Link + with icon should not be used within a paragraph. externalDocsUrl: https://www.ibm.com/standards/carbon/components/link-with-icon status: stable type: component @@ -582,7 +704,9 @@ assets: - contextual-navigation locale-modal: name: Locale modal - description: Locale modal is triggered after selecting the locale button and allows users to change geographic regions and languages, if available. + description: + Locale modal is triggered after selecting the locale button and allows + users to change geographic regions and languages, if available. externalDocsUrl: https://www.ibm.com/standards/carbon/components/localemodal status: stable type: component @@ -594,7 +718,9 @@ assets: - contextual-navigation logo-grid: name: Logo grid - description: Logo grid is used to present a group of client or partner logos. Currently the logos are not clickable. + description: + Logo grid is used to present a group of client or partner logos. Currently + the logos are not clickable. externalDocsUrl: https://www.ibm.com/standards/carbon/components/logo-grid status: stable type: component @@ -605,7 +731,10 @@ assets: - content-block masthead: name: Masthead - description: Masthead is a fundamental navigational component for IBM.com that displays consistently at the top of each page. It also includes search and profile services for IBM.com. + description: + Masthead is a fundamental navigational component for IBM.com that displays + consistently at the top of each page. It also includes search and profile + services for IBM.com. externalDocsUrl: https://www.ibm.com/standards/carbon/components/masthead status: stable type: component @@ -616,7 +745,9 @@ assets: - structural-navigation pictogram-item: name: Pictogram item - description: Pictogram item is used to communicate messages at a glance, afford interactivity, and simplify complex ideas. + description: + Pictogram item is used to communicate messages at a glance, afford + interactivity, and simplify complex ideas. externalDocsUrl: https://www.ibm.com/standards/carbon/components/pictogram-item status: stable type: component @@ -627,7 +758,9 @@ assets: - media quote: name: Quote - description: Quote is used to highlight an impactful client statement or user testimonial. + description: + Quote is used to highlight an impactful client statement or user + testimonial. externalDocsUrl: https://www.ibm.com/standards/carbon/components/quote status: stable type: component @@ -638,7 +771,10 @@ assets: - content-element table-of-contents: name: Table of contents - description: The table of contents component allows users to quickly navigate through long pages by providing jump links to different sections of the content within a single page. + description: + The table of contents component allows users to quickly navigate through + long pages by providing jump links to different sections of the content + within a single page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/table-of-contents status: stable type: component @@ -650,7 +786,10 @@ assets: - contextual-navigation tabs-extended: name: Tabs extended - description: On desktop, Tabs extended renders as tabs. On mobile, the component renders as an accordion, making it easy to read and access each section while scrolling. + description: + On desktop, Tabs extended renders as tabs. On mobile, the component + renders as an accordion, making it easy to read and access each section + while scrolling. externalDocsUrl: https://www.ibm.com/standards/carbon/components/tabs-extended#tabs-extended status: stable type: component @@ -662,7 +801,13 @@ assets: - content-block tabs-extended-media: name: Tabs extended media - description: Tabs extended provides an option to include media. It uses Content item horizontal with media to create an organized section for displaying content with media. This is useful especially when reducing page length is desired. Keep in mind that when using tabs, some content will be hidden until the user interacts with the component, so they should not be used for information that is considered critical. + description: + Tabs extended provides an option to include media. It uses Content item + horizontal with media to create an organized section for displaying + content with media. This is useful especially when reducing page length is + desired. Keep in mind that when using tabs, some content will be hidden + until the user interacts with the component, so they should not be used + for information that is considered critical. externalDocsUrl: https://www.ibm.com/standards/carbon/components/tabs-extended#tabs-extended-media status: stable type: component @@ -675,7 +820,9 @@ assets: - media tag-link: name: Tag link - description: Tag link is a clickable tag that links the topic to another page with more information. + description: + Tag link is a clickable tag that links the topic to another page with more + information. externalDocsUrl: https://www.ibm.com/standards/carbon/components/tag-link status: stable type: component @@ -687,7 +834,10 @@ assets: - structural-navigation universal-banner: name: Universal banner - description: Universal banner is used exclusively to feature global and critical announcements. It is the only component that can be positioned above the masthead. + description: + Universal banner is used exclusively to feature global and critical + announcements. It is the only component that can be positioned above the + masthead. externalDocsUrl: https://www.ibm.com/standards/carbon/components/universal-banner status: key: draft @@ -701,7 +851,9 @@ assets: - content-block video: name: Video - description: Video allows you to embed Kaltura videos from the media center in various ways throughout a page. + description: + Video allows you to embed Kaltura videos from the media center in various + ways throughout a page. externalDocsUrl: https://www.ibm.com/standards/carbon/components/video status: stable type: component diff --git a/packages/styles/scss/components/content-block-horizontal/_content-block-horizontal.scss b/packages/styles/scss/components/content-block-horizontal/_content-block-horizontal.scss index 57d22942065..4a2ac664dd3 100644 --- a/packages/styles/scss/components/content-block-horizontal/_content-block-horizontal.scss +++ b/packages/styles/scss/components/content-block-horizontal/_content-block-horizontal.scss @@ -13,8 +13,7 @@ @use '../../globals/vars' as *; @mixin content-block-horizontal { - :host(#{$c4d-prefix}-content-block-horizontal), - :host(#{$c4d-prefix}-content-group-horizontal) { + :host(#{$c4d-prefix}-content-block-horizontal) { padding-top: $spacing-07; padding-bottom: $spacing-07; @@ -28,8 +27,7 @@ } } - .#{$prefix}--content-block-horizontal, - .#{$prefix}--content-group-horizontal { + .#{$prefix}--content-block-horizontal { .#{$prefix}--content-block { padding-top: $spacing-07; padding-bottom: $spacing-05; @@ -40,23 +38,14 @@ } } } - .#{$prefix}--content-group-horizontal { - .#{$prefix}--content-item-horizontal__item--cta { - margin-top: 0; - } - } :host(#{$c4d-prefix}-content-block-horizontal) ::slotted([slot='heading']), - :host(#{$c4d-prefix}-content-group-horizontal) ::slotted([slot='heading']), - .#{$prefix}--content-block-horizontal .#{$prefix}--content-block__heading, - .#{$prefix}--content-group-horizontal .#{$prefix}--content-block__heading { + .#{$prefix}--content-block-horizontal .#{$prefix}--content-block__heading { margin-bottom: $spacing-07; } :host(#{$c4d-prefix}-content-item-horizontal):last-child, .#{$prefix}--content-block-horizontal - .#{$prefix}--content-item-horizontal__item:last-child, - .#{$prefix}--content-group-horizontal .#{$prefix}--content-item-horizontal__item:last-child { @include breakpoint(max) { padding-bottom: $spacing-13; diff --git a/packages/styles/scss/components/content-group-horizontal/_content-group-horizontal.scss b/packages/styles/scss/components/content-group-horizontal/_content-group-horizontal.scss deleted file mode 100644 index ad9bd7595d5..00000000000 --- a/packages/styles/scss/components/content-group-horizontal/_content-group-horizontal.scss +++ /dev/null @@ -1,37 +0,0 @@ -/** - * Copyright IBM Corp. 2016, 2021 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ - -/// @deprecated Remap import to "@carbon/ibmdotcom-styles/scss/components/content-block-horizontal/content-block-horizontal" -@warn 'Deprecated scss import for `content-group-horizontal`, remap to `@carbon/ibmdotcom-styles/scss/components/content-block-horizontal/content-block-horizontal`'; -@use '../content-block-horizontal'; - -@mixin content-group-horizontal { - :host(#{$c4d-prefix}-content-group-horizontal) ::slotted([slot='heading']), - .#{$prefix}--content-group-horizontal .#{$prefix}--content-block__heading { - margin-bottom: $spacing-10; - @include breakpoint(lg) { - margin-bottom: $spacing-07; - } - } - - :host(#{$c4d-prefix}-content-item-horizontal):last-child, - .#{$prefix}--content-group-horizontal - .#{$prefix}--content-item-horizontal__item:last-child { - @include breakpoint(max) { - padding-bottom: $spacing-13; - } - @include breakpoint(lg) { - padding-bottom: $spacing-13; - } - @include breakpoint(md) { - padding-bottom: $spacing-12; - } - @include breakpoint(sm) { - padding-bottom: $spacing-10; - } - } -} diff --git a/packages/styles/scss/components/content-group-horizontal/_index.scss b/packages/styles/scss/components/content-group-horizontal/_index.scss deleted file mode 100644 index 2fc4efe435c..00000000000 --- a/packages/styles/scss/components/content-group-horizontal/_index.scss +++ /dev/null @@ -1,11 +0,0 @@ -// -// Copyright IBM Corp. 2018, 2023 -// -// This source code is licensed under the Apache-2.0 license found in the -// LICENSE file in the root directory of this source tree. -// - -@forward 'content-group-horizontal'; -@use 'content-group-horizontal'; - -@include content-group-horizontal.content-group-horizontal; diff --git a/packages/styles/scss/components/feature-card-block-large/_feature-card-block-large.scss b/packages/styles/scss/components/feature-card-block-large/_feature-card-block-large.scss deleted file mode 100644 index 421c3302842..00000000000 --- a/packages/styles/scss/components/feature-card-block-large/_feature-card-block-large.scss +++ /dev/null @@ -1,212 +0,0 @@ -/** - * Copyright IBM Corp. 2016, 2021 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ - -@use 'sass:map'; - -@use '@carbon/styles/scss/breakpoint' as *; -@use '@carbon/styles/scss/config' as *; -@use '@carbon/styles/scss/grid' as *; -@use '@carbon/styles/scss/spacing' as *; -@use '@carbon/styles/scss/theme' as *; -@use '@carbon/styles/scss/themes' as *; -@use '@carbon/styles/scss/type' as *; -@use '../../globals/utils/aspect-ratio'; -@use '../../globals/utils/hang' as *; -@use '../../globals/vars' as *; -@use '../image'; -@use '../card'; - -$fcb-large-custom-bp-copy: 992px; -$fcb-large-custom-bp-nocopy: 752px; -$fcb-breakpoint-up--lg: map.get(map.get($grid-breakpoints, 'lg'), 'width') - - rem(1px); - -@mixin feature-card-block-large { - :host(#{$c4d-prefix}-feature-card-block-large), - .#{$prefix}--feature-card-block-large { - margin-bottom: $spacing-07; - - @include breakpoint(md) { - margin-bottom: $spacing-10; - } - - @include breakpoint(lg) { - margin-bottom: $spacing-12; - } - - :hover { - .#{$prefix}--card__wrapper { - background: $background-hover; - } - } - - .#{$prefix}--card { - background: none; - height: 100%; - - &:focus-within { - outline-width: 3px; - outline-offset: 1px; - } - - @include breakpoint-between( - $fcb-large-custom-bp-copy, - $fcb-breakpoint-up--lg - ) { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - flex-direction: row; - } - @include breakpoint(xlg) { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - flex-direction: row; - } - - ::slotted([slot='image']), - &__wrapper, - .#{$prefix}--image { - @include breakpoint-between( - $fcb-large-custom-bp-copy, - $fcb-breakpoint-up--lg - ) { - width: 50%; - height: 100%; - } - @include breakpoint(xlg) { - width: 50%; - height: 100%; - } - } - - .#{$prefix}--image { - overflow-y: hidden; - } - } - - .#{$prefix}--card__wrapper { - @include theme($g90, true); - - background-color: $layer-01; - min-height: 50%; - height: auto; - padding: $spacing-07 $spacing-05; - - @include breakpoint(md) { - padding: $spacing-07; - } - - @include breakpoint(max) { - padding: $spacing-10; - } - - .#{$prefix}--card__eyebrow, - .#{$prefix}--card__heading, - .#{$prefix}--card__copy, - ::slotted(#{$c4d-prefix}-card-eyebrow), - ::slotted(#{$c4d-prefix}-card-heading) { - width: 100%; - max-width: rem(480px); - @include breakpoint(md) { - width: 90%; - } - } - - .#{$prefix}--card__content { - padding: 0; - } - - .#{$prefix}--card__eyebrow, - ::slotted(#{$c4d-prefix}-card-eyebrow) { - margin: 0 0 $spacing-05 0; - } - - .#{$prefix}--card__heading, - ::slotted(#{$c4d-prefix}-card-heading) { - @include type-style('fluid-heading-04', true); - - margin-bottom: $spacing-07; - } - - .#{$prefix}--card__copy { - @include type-style('body-02'); - @include breakpoint-down(md) { - margin-bottom: $spacing-07; - } - } - } - - .#{$prefix}--card__footer { - flex-direction: row; - } - - // special breakpoint for no copy present - &.#{$prefix}--feature-card-block-large_no-copy-text { - @include breakpoint($fcb-large-custom-bp-nocopy) { - padding-top: aspect-ratio(2, 1); - } - - .#{$prefix}--card { - @include breakpoint($fcb-large-custom-bp-nocopy) { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - flex-direction: row; - - &__wrapper, - .#{$prefix}--image { - width: 50%; - height: 100%; - } - } - } - } - } - - :host(#{$c4d-prefix}-feature-card-block-large-footer) - .#{$c4d-prefix}-ce--card__footer - ::slotted(svg[slot='icon']), - .#{$prefix}--feature-card-block-large - .#{$prefix}--feature-card-block-large__card.#{$prefix}--tile - .#{$prefix}--card__cta, - .#{$prefix}--feature-card-block-large - .#{$prefix}--feature-card-block-large__card.#{$prefix}--tile - .#{$prefix}--card__cta:visited { - margin-top: auto; - float: none; - width: $spacing-07; - height: $spacing-07; - - @include type-style('productive-heading-05'); - } -} - -.#{$prefix}--feature-card-block-large__container { - color: $text-primary; - background: $background; - position: relative; - height: 100%; - @include hang; - - @include breakpoint-between( - $fcb-large-custom-bp-copy, - $fcb-breakpoint-up--lg - ) { - padding-top: aspect-ratio(2, 1); - } - @include breakpoint(xlg) { - padding-top: aspect-ratio(2, 1); - } -} diff --git a/packages/styles/scss/components/feature-card-block-large/_index.scss b/packages/styles/scss/components/feature-card-block-large/_index.scss deleted file mode 100644 index 0f28097ebcf..00000000000 --- a/packages/styles/scss/components/feature-card-block-large/_index.scss +++ /dev/null @@ -1,11 +0,0 @@ -// -// Copyright IBM Corp. 2018, 2023 -// -// This source code is licensed under the Apache-2.0 license found in the -// LICENSE file in the root directory of this source tree. -// - -@forward 'feature-card-block-large'; -@use 'feature-card-block-large'; - -@include feature-card-block-large.feature-card-block-large; diff --git a/packages/styles/scss/components/feature-card-block-medium/_feature-card-block-medium.scss b/packages/styles/scss/components/feature-card-block-medium/_feature-card-block-medium.scss deleted file mode 100644 index 6603b38d674..00000000000 --- a/packages/styles/scss/components/feature-card-block-medium/_feature-card-block-medium.scss +++ /dev/null @@ -1,51 +0,0 @@ -/** - * Copyright IBM Corp. 2016, 2021 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ - -@use '@carbon/styles/scss/breakpoint' as *; -@use '@carbon/styles/scss/config' as *; -@use '@carbon/styles/scss/spacing' as *; -@use '@carbon/styles/scss/theme' as *; -@use '@carbon/styles/scss/type' as *; -@use '../../globals/vars' as *; -@use '../../internal/content-group'; -@use '../feature-card'; - -@mixin feature-card-block-medium { - .#{$prefix}--feature-card-block-medium, - :host(#{$c4d-prefix}-feature-card-block-medium) { - color: $text-primary; - background: $background; - margin: $spacing-10 0; - - @include breakpoint(lg) { - margin: $spacing-12 0; - } - - &:focus { - outline: none; - } - } - - // There is no content under `.#{$prefix}--card__heading` in feature card block medium, - // because `.#{$prefix}--card__heading` actually is a copy content and the heading content goes outside the card - .#{$prefix}--feature-card-block-medium - .#{$prefix}--card - .#{$prefix}--card__heading, - :host(#{$c4d-prefix}-feature-card-block-medium) - .#{$prefix}--card - ::slotted(#{$c4d-prefix}-card-heading) { - margin-bottom: 0; - } - - .#{$prefix}--feature-card-block-medium__heading, - ::slotted(#{$c4d-prefix}-feature-card-block-medium-block-heading) { - @include type-style('fluid-heading-04', true); - - display: block; - margin-bottom: $spacing-07; - } -} diff --git a/packages/styles/scss/components/feature-card-block-medium/_index.scss b/packages/styles/scss/components/feature-card-block-medium/_index.scss deleted file mode 100644 index 4f60aaa8ca7..00000000000 --- a/packages/styles/scss/components/feature-card-block-medium/_index.scss +++ /dev/null @@ -1,11 +0,0 @@ -// -// Copyright IBM Corp. 2018, 2023 -// -// This source code is licensed under the Apache-2.0 license found in the -// LICENSE file in the root directory of this source tree. -// - -@forward 'feature-card-block-medium'; -@use 'feature-card-block-medium'; - -@include feature-card-block-medium.feature-card-block-medium; diff --git a/packages/styles/scss/ibm-dotcom-styles.scss b/packages/styles/scss/ibm-dotcom-styles.scss index dc5a4307c06..b154395c8c7 100644 --- a/packages/styles/scss/ibm-dotcom-styles.scss +++ b/packages/styles/scss/ibm-dotcom-styles.scss @@ -18,7 +18,6 @@ @use 'components/card'; @use 'components/card-group'; @use 'components/card-link'; -@use 'components/card-section-images'; @use 'components/card-section-offset'; @use 'components/card-section-simple'; @use 'components/content-block-cards'; @@ -36,8 +35,6 @@ @use 'components/dotcom-shell'; @use 'components/expressive-modal'; @use 'components/feature-card'; -@use 'components/feature-card-block-large'; -@use 'components/feature-card-block-medium'; @use 'components/filter-panel'; @use 'components/footer'; @use 'components/horizontal-rule'; diff --git a/packages/styles/scss/internal/content-block/_content-block.scss b/packages/styles/scss/internal/content-block/_content-block.scss index e5ac16635cd..5a032b1433f 100644 --- a/packages/styles/scss/internal/content-block/_content-block.scss +++ b/packages/styles/scss/internal/content-block/_content-block.scss @@ -21,7 +21,6 @@ :host(#{$c4d-prefix}-content-block-media), :host(#{$c4d-prefix}-content-block-mixed), :host(#{$c4d-prefix}-content-block-horizontal), - :host(#{$c4d-prefix}-content-group-horizontal), :host(#{$c4d-prefix}-leadspace-block-content), :host(#{$c4d-prefix}-leadspace-with-search-content), :host(#{$c4d-prefix}-content-block-segmented), @@ -162,8 +161,7 @@ } } - :host(#{$c4d-prefix}-content-block-horizontal) #{$c4d-prefix}-hr, - :host(#{$c4d-prefix}-content-group-horizontal) #{$c4d-prefix}-hr { + :host(#{$c4d-prefix}-content-block-horizontal) #{$c4d-prefix}-hr { margin: 0; margin-top: $layout-03; @@ -175,10 +173,7 @@ } } - .#{$prefix}--content-block .#{$prefix}--hr, - .#{$prefix}--content-group-horizontal - .#{$prefix}--content-block - .#{$prefix}--hr { + .#{$prefix}--content-block .#{$prefix}--hr { margin-top: $layout-03; @include hang; diff --git a/packages/styles/scss/patterns/blocks/content-group-horizontal/_content-group-horizontal.scss b/packages/styles/scss/patterns/blocks/content-group-horizontal/_content-group-horizontal.scss deleted file mode 100644 index 1af257138c1..00000000000 --- a/packages/styles/scss/patterns/blocks/content-group-horizontal/_content-group-horizontal.scss +++ /dev/null @@ -1,32 +0,0 @@ -/** - * Copyright IBM Corp. 2016, 2021 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ - -/// @deprecated Remap import to "@carbon/ibmdotcom-styles/scss/components/content-block-horizontal/content-block-horizontal" -@warn 'Deprecated scss import for `content-group-horizontal`, remap to `@carbon/ibmdotcom-styles/scss/components/content-block-horizontal/content-block-horizontal`'; -@use '../../../components/content-block-horizontal'; - -@mixin content-group-horizontal { - .#{$prefix}--content-group-horizontal { - .#{$prefix}--content-item-horizontal__item:last-child { - @include breakpoint(max) { - padding-bottom: $layout-07; - } - @include breakpoint(lg) { - padding-bottom: $layout-07; - } - @include breakpoint(md) { - padding-bottom: $layout-06; - } - @include breakpoint(sm) { - padding-bottom: $layout-05; - } - } - .#{$prefix}--content-block { - padding-bottom: 0; - } - } -} diff --git a/packages/styles/scss/patterns/sections/card-section-images/_card-section-images.scss b/packages/styles/scss/patterns/sections/card-section-images/_card-section-images.scss deleted file mode 100644 index b3daef62392..00000000000 --- a/packages/styles/scss/patterns/sections/card-section-images/_card-section-images.scss +++ /dev/null @@ -1,10 +0,0 @@ -/** - * Copyright IBM Corp. 2016, 2020 - * - * This source code is licensed under the Apache-2.0 license found in the - * LICENSE file in the root directory of this source tree. - */ - -/// @deprecated Remap import to "@carbon/ibmdotcom-styles/scss/components/card-section-images/card-section-images" -@warn 'Deprecated scss import for `card-section-images`, remap to `@carbon/ibmdotcom-styles/scss/components/card-section-images/card-section-images`'; -@use '../../../components/card-section-images'; diff --git a/packages/web-components/carbon.yml b/packages/web-components/carbon.yml index 35f72630c6d..038a73f7b00 100644 --- a/packages/web-components/carbon.yml +++ b/packages/web-components/carbon.yml @@ -2,7 +2,9 @@ library: id: ibmdotcom-web-components name: IBM.com Web Components - description: Create web experiences that adhere to IBM’s web standards using this primary component library. + description: + Create web experiences that adhere to IBM’s web standards using this primary + component library. externalDocsUrl: https://www.ibm.com/standards/web/carbon-for-ibm-dotcom inherits: ibmdotcom-styles demoLinks: @@ -103,15 +105,6 @@ assets: name: Storybook action: link url: https://www.ibm.com/standards/carbon/web-components/?path=/docs/components-card-section-simple - card-section-images: - externalDocsUrl: https://www.ibm.com/standards/carbon/components/card-section#card-section-with-images - status: stable - framework: web-component - demoLinks: - - type: storybook - name: Storybook - action: link - url: https://www.ibm.com/standards/carbon/web-components/?path=/docs/components-card-section-images card-section-carousel: externalDocsUrl: https://www.ibm.com/standards/carbon/components/card-section-carousel status: stable diff --git a/packages/web-components/examples/codesandbox/components/content-group-horizontal/.babelrc b/packages/web-components/examples/codesandbox/components/content-group-horizontal/.babelrc deleted file mode 100644 index 74450eed94b..00000000000 --- a/packages/web-components/examples/codesandbox/components/content-group-horizontal/.babelrc +++ /dev/null @@ -1,22 +0,0 @@ -{ - "presets": [ - [ - "@babel/preset-env", - { - "modules": false, - "targets": [ - "last 1 version", - "Firefox ESR", - "not opera > 0", - "not op_mini > 0", - "not op_mob > 0", - "not android > 0", - "not edge > 0", - "not ie > 0", - "not ie_mob > 0" - ] - } - ] - ], - "plugins": [["@babel/plugin-transform-runtime", { "version": "7.3.0" }]] -} diff --git a/packages/web-components/examples/codesandbox/components/content-group-horizontal/.gitignore b/packages/web-components/examples/codesandbox/components/content-group-horizontal/.gitignore deleted file mode 100644 index 7d5b7a94f4d..00000000000 --- a/packages/web-components/examples/codesandbox/components/content-group-horizontal/.gitignore +++ /dev/null @@ -1,2 +0,0 @@ -/build -/node_modules diff --git a/packages/web-components/examples/codesandbox/components/content-group-horizontal/.sassrc b/packages/web-components/examples/codesandbox/components/content-group-horizontal/.sassrc deleted file mode 100644 index e3e73a6014b..00000000000 --- a/packages/web-components/examples/codesandbox/components/content-group-horizontal/.sassrc +++ /dev/null @@ -1,3 +0,0 @@ -{ - "includePaths": ["node_modules", "../../node_modules"], -} diff --git a/packages/web-components/examples/codesandbox/components/content-group-horizontal/cdn.html b/packages/web-components/examples/codesandbox/components/content-group-horizontal/cdn.html deleted file mode 100644 index d2d02c20fd8..00000000000 --- a/packages/web-components/examples/codesandbox/components/content-group-horizontal/cdn.html +++ /dev/null @@ -1,51 +0,0 @@ - - - -
-