Merge branch 'main' into 1605-feat/v2-hr-updates

src/gatsby-theme-carbon/components/Footer/index.js

@@ -21,7 +21,7 @@ const CustomFooter = () => {
         !
       </p>
       <p>
-        Last updated Dec 29, 2023
+        Last updated Feb 19, 2024
         <br />
         Copyright &copy; 2022 IBM
       </p>

src/gatsby-theme-carbon/templates/Homepage.js

@@ -1,14 +1,13 @@
 import React from 'react';
 import { Column } from 'gatsby-theme-carbon';
 import HomepageTemplate from 'gatsby-theme-carbon/src/templates/Homepage';
-import { ArrowDown32 } from '@carbon/icons-react';
 import { leadspaceText } from './Homepage.module.scss';
 
 const LeadSpaceText = () => (
   <p className={leadspaceText}>
     Carbon for IBM.com is the design system for the IBM website, providing
     components, resources, and guidelines for everyone creating IBM.com pages.
-    <ArrowDown32 />
+    <span style={{ paddingTop: '1.25rem', display: 'flex' }}>↓</span>
   </p>
 );
 

src/pages/about-carbon-for-ibm.com/releases.mdx

@@ -13,11 +13,9 @@ Learn about our latest updates, our release history, and what the team has plann
 
 Each Carbon for IBM.com release includes package releases that are independently versioned following the industry-standard semantic versioning specification.
 
-The Carbon for IBM.com team also ships package minor releases every other week and when necessary, patch releases between minor versions to address bugs. 
+Carbon for IBM.com follows a bi-weekly release schedule, with patch releases when necessary.
 
-### Carbon for IBM.com v2
-
-Carbon for IBM.com focuses on implimenting Carbon Design System v11. Along with simplifying our content authoring and number of pre-constructed components, adding flexibility to our content components, and accessibility improvements. 
+A primary focus of Carbon for IBM.com is always using the latest version of the Carbon Design System. This allows simplifying our content authoring and number of pre-constructed components, adding flexibility to our content components, and accessibility improvements.
 
 <Row className="resource-card-group">
   <Column colMd={4} colLg={4} noGutterSm>
@@ -50,7 +48,7 @@ Carbon for IBM.com focuses on implimenting Carbon Design System v11. Along with
 
 ### Carbon for IBM.com v1
 
-Carbon for IBM.com v1 implemented Carbon Design System v10 and our newly-updated brand expression (IBM Design Language) into our components. 
+Carbon for IBM.com v1 implemented Carbon Design System v10 and our newly-updated brand expression (IBM Design Language) into our components.
 
 <Row className="resource-card-group">
   <Column colMd={4} colLg={4} noGutterSm>

src/pages/components/content-block.mdx

@@ -16,6 +16,7 @@ import ResourceLinks from 'components/ResourceLinks';
 <AnchorLink>Behaviors</AnchorLink>
 <AnchorLink>Gallery</AnchorLink>
 <AnchorLink>Resources</AnchorLink>
+<AnchorLink>Spacing</AnchorLink>
 <AnchorLink>Content guidance</AnchorLink>
 <AnchorLink>Related components</AnchorLink>
 <AnchorLink>Feedback</AnchorLink>
@@ -34,12 +35,17 @@ The content block acts as the heading level two on pages after the lead space co
 
 ![Anatomy image of the content block](../../images/component/content-block/content-block-anatomy.png)
 
-1. **Content block heading:** An optional, customizable heading for the content block.
-2. **Sub heading:** An optional, customizable sub heading for the content block.
+1. **Content block heading:** An optional, customizable heading for the content section.
+2. **Sub heading:** An optional, customizable sub heading for the content section.
 3. **Copy:** An optional short description.
 4. **Child container:** Insert additional components to enhance the narrative, such as content group, content item or card group.
-5. **CTA:** Use this as a general call to action, typically used to encompass the entire content block.
-6. **Border:** An optional bottom border.
+5. **CTA:** Use this as a general call to action, typically used to encompass the entire content section.
+6. **Content block heading:** An optional, customizable heading for the content block.
+7. **Sub heading:** An optional, customizable sub heading for the content block.
+8. **Copy:** An optional short description.
+9. **Child container:** Insert additional components to enhance the narrative, such as content group, content item or card group.
+10. **CTA:** Use this as a general call to action, typically used to encompass the entire content block.
+11. **Border:** An optional bottom border.
 
 ### Usage
 
@@ -72,7 +78,6 @@ Content block is often paired with the [content section](../components/content-s
 
 ## Modifiers
 
-
 ### Children
 
 Similar to the content section, the content block can accept child components which allows designers and authors maximum flexibility when creating page layouts. The most common layouts on IBM.com are 8 column and 12 column components.
@@ -170,6 +175,16 @@ The content block is one of the main layout components for designing pages of th
 
 <ResourceLinks name="Content block" type="layout" />
 
+### Spacing
+
+| Breakpoint                   | `max`              | `xlg`              | `lg`               | `md`              | `sm`              |
+| ---------------------------- | ------------------ | ------------------ | ------------------ | ----------------- | ----------------- |
+| Margin top                   | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-07` 32px | `spacing-07` 32px |
+| Margin bottom with border    | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-07` 32px | `spacing-07` 32px |
+| Margin bottom without border | `spacing-10` 160px | `spacing-10` 160px | `spacing-10` 160px | `spacing-10` 64px | `spacing-10` 64px |
+
+For more information, see the [spacing guidelines](../guidelines/spacing)
+
 ## Content guidance
 
 | Element                                                    | Content type | Required | Instances | Character limit <br/>(English / translated) | Notes                                                                                        |

src/pages/components/content-group.mdx

@@ -18,6 +18,7 @@ import ResourceLinks from 'components/ResourceLinks';
 <AnchorLink>Behaviors</AnchorLink>
 <AnchorLink>Tips and techniques</AnchorLink>
 <AnchorLink>Resources</AnchorLink>
+<AnchorLink>Spacing</AnchorLink>
 <AnchorLink>Content guidance</AnchorLink>
 <AnchorLink>Related components</AnchorLink>
 <AnchorLink>Feedback</AnchorLink>
@@ -80,6 +81,15 @@ Content group can contain multiple [content items](../components/content-item) a
 
 <ResourceLinks name="Content group" type="layout" />
 
+### Spacing
+
+| Breakpoint    | `max`             | `xlg`             | `lg`              | `md`              | `sm`              |
+| ------------- | ----------------- | ----------------- | ----------------- | ----------------- | ----------------- |
+| Margin top    | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px |
+| Margin bottom | `spacing-09` 48px | `spacing-09` 48px | `spacing-09` 48px | `spacing-09` 48px | `spacing-07` 32px |
+
+For more information, see the [spacing guidelines](../guidelines/spacing)
+
 ## Content guidance
 
 | Element                                                    | Content type | Required | Instances | Character limit <br/>(English / translated) | Notes                                                                               |

src/pages/components/content-item.mdx

@@ -17,6 +17,7 @@ import ResourceLinks from 'components/ResourceLinks';
 <AnchorLink>Modifiers</AnchorLink>
 <AnchorLink>Behaviors</AnchorLink>
 <AnchorLink>Resources</AnchorLink>
+<AnchorLink>Spacing</AnchorLink>
 <AnchorLink>Content guidance</AnchorLink>
 <AnchorLink>Related components</AnchorLink>
 <AnchorLink>Feedback</AnchorLink>
@@ -117,6 +118,15 @@ The vertically oriented content items span 8 columns of the 16 column grid, whil
 
 <ResourceLinks name="Content item" type="layout" />
 
+### Spacing
+
+| Breakpoint    | `max`             | `xlg`             | `lg`              | `md`              | `sm`              |
+| ------------- | ----------------- | ----------------- | ----------------- | ----------------- | ----------------- |
+| Margin top    | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px |
+| Margin bottom | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px | `spacing-07` 32px |
+
+For more information, see the [spacing guidelines](../guidelines/spacing)
+
 ## Content guidance
 
 | Element                                                    | Content type                                                                                                                                   | Required | Instances | Character limit <br/>(English / translated) | Notes                                |

src/pages/components/content-section.mdx

@@ -16,6 +16,7 @@ import ResourceLinks from 'components/ResourceLinks';
 <AnchorLink>Behaviors</AnchorLink>
 <AnchorLink>Gallery</AnchorLink>
 <AnchorLink>Resources</AnchorLink>
+<AnchorLink>Spacing</AnchorLink>
 <AnchorLink>Content guidance</AnchorLink>
 <AnchorLink>Related components</AnchorLink>
 <AnchorLink>Feedback</AnchorLink>
@@ -135,6 +136,16 @@ The content section is the main building block for establishing sections through
 
 <ResourceLinks name="Content section" type="layout" />
 
+### Spacing
+
+| Breakpoint                   | `max`              | `xlg`              | `lg`               | `md`              | `sm`              |
+| ---------------------------- | ------------------ | ------------------ | ------------------ | ----------------- | ----------------- |
+| Margin top                   | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-07` 32px | `spacing-07` 32px |
+| Margin bottom with border    | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-10` 64px  | `spacing-07` 32px | `spacing-07` 32px |
+| Margin bottom without border | `spacing-10` 160px | `spacing-10` 160px | `spacing-10` 160px | `spacing-10` 64px | `spacing-10` 64px |
+
+For more information, see the [spacing guidelines](../guidelines/spacing)
+
 ## Content guidance
 
 | Element                 | Content type | Required | Instances | Character limit <br/>(English / translated) | Notes                                                                                        |