From 1dc940fefab87b74e4f68868489e1a9c1dab2d79 Mon Sep 17 00:00:00 2001
From: andysherman2121 <56688604+andysherman2121@users.noreply.github.com>
Date: Wed, 20 Jan 2021 13:36:51 -0500
Subject: [PATCH] fix(content-block-mixed): fixed pictogram color on g90 and
 g100 theme (#4949)

### Related Ticket(s)

#4933

### Description

For web components, the pictograms on content block mixed weren't switching to white when on g90 and g100 theme

<!-- 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 -->
<!-- *** "package: styles": Carbon Expressive -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->
---
 .../__stories__/content-block-mixed.stories.scss    | 13 +++++++++++++
 .../__stories__/content-block-mixed.stories.ts      |  6 +++++-
 2 files changed, 18 insertions(+), 1 deletion(-)
 create mode 100644 packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.scss

diff --git a/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.scss b/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.scss
new file mode 100644
index 00000000000..2ed321dddcc
--- /dev/null
+++ b/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.scss
@@ -0,0 +1,13 @@
+//
+// Copyright IBM Corp. 2020, 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.
+//
+
+@import 'carbon-components/scss/globals/scss/theme-tokens';
+
+/* stylelint-disable-next-line selector-type-no-unknown */
+dds-pictogram-item svg g {
+  stroke: $text-01;
+}
diff --git a/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.ts b/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.ts
index 6bcadfa8262..0f8828d9332 100644
--- a/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.ts
+++ b/packages/web-components/src/components/content-block-mixed/__stories__/content-block-mixed.stories.ts
@@ -19,6 +19,7 @@ import imgMd16x9 from '../../../../../storybook-images/assets/480/fpo--16x9--480
 import imgSm16x9 from '../../../../../storybook-images/assets/320/fpo--16x9--320x180--001.jpg';
 import readme from './README.stories.mdx';
 import textNullable from '../../../../.storybook/knob-text-nullable';
+import styles from './content-block-mixed.stories.scss';
 
 const copy = `Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 Aenean et ultricies est. Mauris iaculis eget dolor nec hendrerit.
@@ -67,6 +68,9 @@ export default {
   title: 'Components/Content Block Mixed',
   decorators: [
     story => html`
+      <style>
+        ${styles}
+      </style>
       <div class="bx--grid">
         <div class="bx--row">
           <div class="bx--col-sm-4 bx--col-lg-8 bx--offset-lg-4">
@@ -145,7 +149,7 @@ export const Default = ({ parameters }) => {
                 <g id="touch_screen">
                   <g id="touch_screen_1_">
                     <path
-                      style="fill:none;stroke:#000000;stroke-width:0.72;stroke-linejoin:round;stroke-miterlimit:10;"
+                      style="fill:none;stroke-width:0.72;stroke-linejoin:round;stroke-miterlimit:10;"
                       d="M15,29H9V10h25v19h-7
                       M34,26h-7 M15,26H9 M30,29v8h9V21h-5 M30,34h9 M20.998,27.621c0-0.573-0.447-1.037-0.998-1.037s-0.998,0.464-0.998,1.037v2.378
                       l-0.005-6.962c0-0.573-0.447-1.037-0.998-1.037S17,22.464,17,23.037v5.882v4.924C17,36.139,18.792,38,21.002,38