Remove default icon color for IconButton

This partially reverts https://crrev.com/c/3398895. Setting a default
icon color has side effects for colored icons. Instead colors are
assigned individually where necessary.

Fixed: 1290237, 1287923
Change-Id: I27d61fc70db52950c4fbee7e893ce1a6ef06e511
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3411496
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Simon Zünd <szuend@chromium.org>
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>

front_end/panels/application/AppManifestView.ts

@@ -617,7 +617,13 @@ export class AppManifestView extends UI.Widget.VBox implements SDK.TargetManager
         const copyButton = new IconButton.IconButton.IconButton();
         copyButton.title = i18nString(UIStrings.copyToClipboard);
         copyButton.data = {
-          groups: [{iconName: 'copy_icon', iconHeight: '12px', iconWidth: '12px', text: ''}],
+          groups: [{
+            iconName: 'copy_icon',
+            iconHeight: '12px',
+            iconWidth: '12px',
+            text: '',
+            iconColor: 'var(--color-text-primary)',
+          }],
           clickHandler: (): void => {
             Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(recommendedId);
           },

front_end/panels/application/components/FrameDetailsView.ts

@@ -342,6 +342,7 @@ export class FrameDetailsReportView extends HTMLElement {
         {
           iconName: 'refresh_12x12_icon',
           text: i18nString(UIStrings.refresh),
+          iconColor: 'var(--color-text-primary)',
         } as IconButton.IconButton.IconWithTextData,
       ],
     } as IconButton.IconButton.IconButtonData}>

front_end/ui/components/docs/icon_button/basic.ts

@@ -12,7 +12,7 @@ function appendComponent(data: IconButton.IconButton.IconButtonData) {
 
 appendComponent({
   clickHandler: (): void => {},
-  groups: [{iconName: 'survey_feedback_icon', text: '1 item'}],
+  groups: [{iconName: 'survey_feedback_icon', iconColor: 'var(--color-text-primary)', text: '1 item'}],
 });
 
 appendComponent({

front_end/ui/components/icon_button/IconButton.ts

@@ -85,7 +85,7 @@ export class IconButton extends HTMLElement {
       ${filteredGroups.map(counter =>
       LitHtml.html`
       <${Icon.litTagName} class="status-icon"
-      .data=${{iconName: counter.iconName, color: counter.iconColor || 'var(--color-text-primary)', width: counter.iconWidth || '1.5ex', height: counter.iconHeight || '1.5ex'} as IconData}>
+      .data=${{iconName: counter.iconName, color: counter.iconColor, width: counter.iconWidth || '1.5ex', height: counter.iconHeight || '1.5ex'} as IconData}>
       </${Icon.litTagName}>
       ${this.#compact ? LitHtml.html`<!-- Force line-height for this element --><span>&#8203;</span>` : LitHtml.nothing}
       <span class="icon-button-title">${counter.text}</span>