fix(link-with-icon): adjust left icon placement style & clean up (#8238)

### Related Ticket(s)

#7074

### Description

- This PR fixes the issue where the `left` icon placement is not aligning to the left-hand side.

### Changelog

**Changed**

- Adjust styling in the shared `_link-with-icon.scss` style and clean up duplicate styling.

### Testing Instruction

- Visit the "Link with Icon" component
- Adjust the "Icon Position (icon-placement)" knob to `left`
- Ensure that the placement of the icon is in alignment with the design specs.

<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->

packages/styles/scss/components/link-with-icon/_link-with-icon.scss

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2021
+ * Copyright IBM Corp. 2016, 2022
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -43,18 +43,21 @@
         }
       }
     }
-  }
 
-  .#{$prefix}--link-with-icon.#{$prefix}--link-with-icon__icon-left {
-    justify-content: flex-end;
-    flex-direction: row-reverse;
+    &.#{$prefix}--link-with-icon__icon-left,
+    .#{$prefix}--link-with-icon.#{$prefix}--link-with-icon--inline-icon.#{$prefix}--link-with-icon__icon-left {
+      display: flex;
+      justify-content: flex-end;
+      flex-direction: row-reverse;
 
-    svg {
-      align-self: start;
-      position: relative;
-      top: 1px;
-      margin-left: 0;
-      margin-right: $carbon--spacing-03;
+      svg,
+      ::slotted(svg[slot='icon']) {
+        align-self: start;
+        position: relative;
+        margin-left: 0;
+        margin-right: $carbon--spacing-03;
+        top: 1px;
+      }
     }
   }
 

packages/web-components/src/components/link-with-icon/link-with-icon.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2020, 2021
+// Copyright IBM Corp. 2020, 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -17,16 +17,6 @@
   .#{$prefix}--link--disabled {
     color: $disabled-02;
   }
-
-  .#{$prefix}--link-with-icon__icon-left ::slotted(svg[slot='icon']) {
-    margin-right: $carbon--spacing-03;
-    margin-left: 0;
-  }
-
-  .#{$prefix}--link-with-icon__icon-right ::slotted(svg[slot='icon']) {
-    margin-left: $carbon--spacing-03;
-    margin-right: 0;
-  }
 }
 
 :host(#{$dds-prefix}-link-list-item) {