diff --git a/src/pages/2x-grid.mdx b/src/pages/2x-grid.mdx index 9caf73057..cdd848e5d 100644 --- a/src/pages/2x-grid.mdx +++ b/src/pages/2x-grid.mdx @@ -380,7 +380,7 @@ within it. @@ -430,7 +430,7 @@ baseline grid to guide your content. @@ -507,24 +507,11 @@ interfaces, please visit -![carbon icon](../images/resource-cards/carbon.png) - - - - - - - ![carbon icon](../images/resource-cards/carbon.png) diff --git a/src/pages/animation/overview.mdx b/src/pages/animation/overview.mdx index 016b1796c..0bbcc35ad 100644 --- a/src/pages/animation/overview.mdx +++ b/src/pages/animation/overview.mdx @@ -238,7 +238,7 @@ complex, ambient loop to feature brand film. ![carbon Icon](../../images/resource-cards/carbon.png) diff --git a/src/pages/color.mdx b/src/pages/color.mdx index bc9340233..a701ee65d 100644 --- a/src/pages/color.mdx +++ b/src/pages/color.mdx @@ -250,7 +250,7 @@ are used sparingly and purposefully. ![CarbonIcon](../images/resource-cards/carbon.png) diff --git a/src/pages/data-visualization/design/basics.mdx b/src/pages/data-visualization/design/basics.mdx index 928a52493..3293eb614 100644 --- a/src/pages/data-visualization/design/basics.mdx +++ b/src/pages/data-visualization/design/basics.mdx @@ -307,7 +307,7 @@ elements and make changes in the data set or on the environment explicit, clear and unambiguous. Consider the entrance and exit motions to enhance the visual hierarchy of elements, orientation of axes and the data displayed. Be careful not to communicate contradicting information with different transitions. -[Learn more on Carbon](https://www.carbondesignsystem.com/guidelines/motion/overview). +[Learn more on Carbon](https://www.carbondesignsystem.com/elements/motion/overview). @@ -333,6 +333,3 @@ not to communicate contradicting information with different transitions. - - - diff --git a/src/pages/iconography/app-icons/design.mdx b/src/pages/iconography/app-icons/design.mdx index 5d5fe6a01..4fe5d264e 100644 --- a/src/pages/iconography/app-icons/design.mdx +++ b/src/pages/iconography/app-icons/design.mdx @@ -346,7 +346,7 @@ of the app with more simplicity and abstraction. These icons should focus on the bigger concepts of the product or service, such as scale, transaction, integration and so on.  Functionally, fill app icons work best in situations where you need to call attention to the app with more visual weight or a larger -color field, as opposed to the light, linear form of fill app icons. +color field, as opposed to the light, linear form of stroke app icons. diff --git a/src/pages/iconography/ui-icons/contribute.mdx b/src/pages/iconography/ui-icons/contribute.mdx index 9bb180ff1..19a4509f0 100644 --- a/src/pages/iconography/ui-icons/contribute.mdx +++ b/src/pages/iconography/ui-icons/contribute.mdx @@ -22,7 +22,7 @@ As visual symbols, IBM user interface icons represent ideas, objects or actions. Don’t see the icon you need in the library? Make your own! Follow these guidelines to ensure visual consistency and proper formatting. -- All icons should be unique and not redundant with any existing icons in the system. Search the [library](https://www.carbondesignsystem.com/guidelines/icons/library) for the keyword(s) associated with your proposed new icon to ensure that it is not already represented. +- All icons should be unique and not redundant with any existing icons in the system. Search the [library](https://www.carbondesignsystem.com/elements/icons/library) for the keyword(s) associated with your proposed new icon to ensure that it is not already represented. - All icons should adhere to the [IBM Design Language](/iconography/ui-icons/design) visual style. - All icons should comply with IBM [accessibility standards](https://www.carbondesignsystem.com/guidelines/accessibility/overview). - All icons should be usable across all supported platforms and devices. @@ -78,7 +78,7 @@ Does your icon have potential for other products at IBM? If so, please consider ### Getting started -Before submitting artwork, first review our [icons library](https://www.carbondesignsystem.com/guidelines/icons/library/) or download the [Carbon icon master .ai file](https://github.com/carbon-design-system/carbon/tree/master/packages/icons/master) to check your design for duplication against existing icons. +Before submitting artwork, first review our [icons library](https://www.carbondesignsystem.com/elements/icons/library) or download the [Carbon icon master .ai file](https://github.com/carbon-design-system/carbon/tree/master/packages/icons/master) to check your design for duplication against existing icons. ### Approval process diff --git a/src/pages/layout/tips-and-techniques.mdx b/src/pages/layout/tips-and-techniques.mdx index a2a0f24ec..1df5f063f 100644 --- a/src/pages/layout/tips-and-techniques.mdx +++ b/src/pages/layout/tips-and-techniques.mdx @@ -57,7 +57,7 @@ rhythm emerges. #### 2x Grid -[The 2x Grid](/elements/2x-grid) is the scaffolding on which IBM designers +The [2x Grid](/2x-grid) is the scaffolding on which IBM designers create structural rhythm. It provides structural, proportional, and spatial guidance for design within any media. Skillful use of it will yield harmonious spatial relationships between canvas and content while expressing our distinct @@ -68,7 +68,7 @@ point-of-view. #### Sizing scale In lieu of concrete vertical divisions, such as on a web page, the -[sizing scale](https://www.carbondesignsystem.com/guidelines/layout#sizing-scale) +[sizing scale](https://www.carbondesignsystem.com/elements/2x-grid/overview/#sizing-scale) is helpful in establishing vertical rhythm. Like a type scale, the sizing scale constrains the range of sizes to improve consistency and rhythm, while still allowing a wide range of sizes. @@ -153,7 +153,7 @@ Typographic hierarchy is the navigational system that renders complex information accessible. Think of a book outline; the size, style, and position of type not only informs what order it should be read, but also describes the parent-child relationships of the content. Effective use of the -[type scale](https://www.ibm.com/design/language/elements/type-specs-ui), along +[type scale](/typography/type-scale), along with an understanding of [Gestalt principles](https://www.interaction-design.org/literature/topics/gestalt-principles), will ensure your design can be easily navigated and understood. @@ -181,7 +181,7 @@ Facilitating eye movement through the composition creates a more interesting design. A focal point instantly attracts the eye to one area of the canvas. Secondary and tertiary elements then draw the eye across the canvas, creating more engagement between the viewer and the design. This is done best through -[asymmetric layouts](/elements/layout/tips-and-techniques/#master-asymmetry), +[asymmetric layouts](/layout/tips-and-techniques/#master-asymmetry), where thoughtful relationships between elements make for a more visually stimulating design. It's important to plan the movement of the eye in order to guide the viewer to the intended outcome. diff --git a/src/pages/resources.mdx b/src/pages/resources.mdx index 307ef8a4f..5a3db382c 100644 --- a/src/pages/resources.mdx +++ b/src/pages/resources.mdx @@ -164,7 +164,7 @@ the alternatives shown here. ![carbon Icon](../images/resource-cards/carbon.png) @@ -202,19 +202,7 @@ href="https://marijohannessen.github.io/color-contrast-checker/" - -![carbon icon](../images/resource-cards/carbon.png) - - - - - - ![carbon icon](../images/resource-cards/carbon.png) @@ -239,7 +227,7 @@ href="https://www.ibm.com/design/language/files/2x_video_grid.ai" ![carbon icon](../images/resource-cards/carbon.png) @@ -603,7 +591,7 @@ href="https://developer.apple.com/design/human-interface-guidelines/macos/icons- ![carbon Icon](../images/resource-cards/carbon.png)