Skip to content

Commit

Permalink
fix(link-with-icon): fix icon placement (#12159)
Browse files Browse the repository at this point in the history
### Related Ticket(s)

[ADCMS-7258](https://jsw.ibm.com/browse/ADCMS-7258)

### Description

This corrects a bad prefix conversion from v1 to v2 that meant that the necessary styles required to correctly reflect the `icon-placement="left"` on a `<c4d-link-with-icon>` component were not present. Note that the way Storybook knobs work was hiding this issue in the Link with Icon story. The bug can be reproduced by going to the [Link with icon story in the v2 Storybook](https://carbon-design-system.github.io/carbon-for-ibm-dotcom/next/web-components/?path=/story/components-link-with-icon--default), setting "Icon Position" to left, then opening in a new tab. Test in the deploy preview in the same way to ensure the bug is fixed.

### Testing instructions

* Open the Link with Icon > Default story
* Set the "Icon Position" knob to left
* Open in a new tab
* Icon should now appear as expected
* Also go through the Footer and Locale Modal stories to check the reported link icon is in the right spot.

### Changelog

**Changed**

- Fixed left icon placement in Link with icon component

<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "test: e2e": Codesandbox examples and e2e integration tests -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->
  • Loading branch information
m4olivei authored Dec 11, 2024
1 parent 3e7bcc9 commit 8459cc7
Showing 1 changed file with 2 additions and 2 deletions.
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/**
* Copyright IBM Corp. 2016, 2023
* Copyright IBM Corp. 2016, 2024
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
Expand All @@ -15,7 +15,7 @@
@use '../lightbox-media-viewer/lightbox-media-viewer';

@mixin link-with-icon {
.#{$c4d-prefix}--link-with-icon,
.#{$prefix}--link-with-icon,
:host(#{$c4d-prefix}-link-with-icon),
:host(#{$c4d-prefix}-link-list-item),
:host(#{$c4d-prefix}-link-list-item-cta),
Expand Down

0 comments on commit 8459cc7

Please sign in to comment.