Bug 1543324 - Part 2: Rename --theme-body-color-* variables to --theme-text-color-*; r=ntim

Differential Revision: https://phabricator.services.mozilla.com/D27107

--HG--
extra : moz-landing-system : lando

devtools/client/application/src/components/Worker.css

@@ -32,7 +32,7 @@
 }
 
 .worker:not(:last-child) {
-  border-bottom: 1px solid var(--theme-body-color-alt);
+  border-bottom: 1px solid var(--theme-text-color-alt);
 }
 
 .worker__header {
@@ -71,5 +71,5 @@
 }
 
 .worker__data__updated {
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }

devtools/client/debugger/src/components/PrimaryPanes/Sources.css

@@ -34,7 +34,7 @@
   width: 5px;
   margin: 0 2px 0 6px;
   vertical-align: bottom;
-  background: var(--theme-body-color-alt);
+  background: var(--theme-text-color-alt);
 }
 
 .sources-clear-root-label {

devtools/client/debugger/src/components/ProjectSearch.css

@@ -68,7 +68,7 @@
 }
 
 .project-text-search .no-result-msg {
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   font-size: 24px;
   padding: 4px 15px;
   max-width: 100%;

devtools/client/debugger/src/components/shared/SearchInput.css

@@ -100,7 +100,7 @@
   white-space: nowrap;
   text-align: center;
   user-select: none;
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 .search-field .search-nav-buttons {

devtools/client/netmonitor/src/assets/styles/NetworkDetailsPanel.css

@@ -47,7 +47,7 @@
 /* Empty notices in tab panels */
 
 .network-monitor .empty-notice {
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   padding: 3px 8px;
   text-align: center;
   display: flex;

devtools/client/netmonitor/src/assets/styles/RequestList.css

@@ -327,7 +327,7 @@
 
 .requests-list-cause-stack {
   display: inline-block;
-  background-color: var(--theme-body-color-alt);
+  background-color: var(--theme-text-color-alt);
   color: var(--theme-body-background);
   font-size: 8px;
   font-weight: bold;

devtools/client/performance/modules/widgets/markers-overview.js

@@ -225,7 +225,7 @@ MarkersOverview.prototype = extend(AbstractCanvasGraph.prototype, {
     this.headerBackgroundColor = getColor("body-background", theme);
     this.headerTextColor = getColor("body-color", theme);
     this.headerTimelineStrokeColor = colorUtils.setAlpha(
-      getColor("body-color-alt", theme), 0.25);
+      getColor("text-color-alt", theme), 0.25);
     this.alternatingBackgroundColor = colorUtils.setAlpha(
       getColor("body-color", theme), 0.05);
   },

devtools/client/responsive.html/index.css

@@ -652,7 +652,7 @@ input:-moz-focusring {
 }
 
 #device-form label > .viewport-dimension {
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   display: flex;
   align-items: center;
 }
@@ -662,7 +662,7 @@ input:-moz-focusring {
   border: 1px solid;
   border-radius: 2px;
   text-align: center;
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   transition: all 0.25s ease;
 }
 

devtools/client/shared/test/browser_theme.js

@@ -81,7 +81,7 @@ function testColorExistence() {
     "body-background", "sidebar-background", "contrast-background",
     "tab-toolbar-background", "toolbar-background", "selection-background",
     "selection-color", "selection-background-hover", "splitter-color",
-    "comment", "body-color", "body-color-alt", "text-color-strong",
+    "comment", "body-color", "text-color-alt", "text-color-inactive", "text-color-strong",
     "highlight-green", "highlight-blue", "highlight-bluegrey", "highlight-purple",
     "highlight-lightorange", "highlight-orange", "highlight-red", "highlight-pink",
   ];

devtools/client/shared/widgets/cubic-bezier.css

@@ -195,7 +195,7 @@
 .cubic-bezier-container .preset p {
   font-size: 80%;
   margin: 2px auto 0px auto;
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
   text-transform: capitalize;
   text-overflow: ellipsis;
   overflow: hidden;

devtools/client/shared/widgets/filter-widget.css

@@ -179,7 +179,7 @@
   text-overflow: ellipsis;
   display: block;
   order: 3;
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 #filter-container .remove-button {

devtools/client/themes/chart.css

@@ -14,7 +14,7 @@
 }
 
 .theme-light .generic-chart-container {
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 .chart-colored-blob {
@@ -118,7 +118,7 @@
 }
 
 .table-chart-totals {
-  border-top: 1px solid var(--theme-body-color-alt); /* Grey foreground text */
+  border-top: 1px solid var(--theme-text-color-alt); /* Grey foreground text */
 }
 
 .table-chart-summary-label {

devtools/client/themes/common.css

@@ -51,7 +51,7 @@
  * Customize the dark theme's scrollbar colors to avoid excessive contrast.
  */
 :root.theme-dark {
-  scrollbar-color: var(--theme-body-color-inactive) var(--theme-splitter-color);
+  scrollbar-color: var(--grey-50) var(--theme-splitter-color);
 }
 
 /**
@@ -60,7 +60,7 @@
  * This removes GTK scrollbars and uses a fallback design (see bug 1464723).
  */
 :root[platform="linux"].theme-light {
-  scrollbar-color: var(--theme-body-color-inactive) var(--grey-20);
+  scrollbar-color: var(--grey-40) var(--grey-20);
 }
 
 .devtools-monospace {

devtools/client/themes/computed.css

@@ -103,7 +103,7 @@
   background-repeat: no-repeat;
   background-size: contain;
   -moz-context-properties: fill;
-  fill: var(--theme-body-color-inactive);
+  fill: var(--theme-text-color-inactive);
 }
 
 .computed-other-property-value:dir(rtl)::before {

devtools/client/themes/fonts.css

@@ -177,7 +177,7 @@
   height: 8px;
   margin: 0 2px;
   line-height: 3px;
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   border-radius: 3px;
   border-style: solid;
   border-width: 1px;

devtools/client/themes/markup.css

@@ -323,7 +323,7 @@ ul.children + .tag-line::before {
   margin: 0 2px;
   line-height: 7px;
   font-size: 0.6em;
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   border-radius: 3px;
   border-style: solid;
   border-width: 1px;

devtools/client/themes/memory.css

@@ -245,7 +245,7 @@ html, body, #app, #memory-tool {
 .snapshot-list-item > .snapshot-state,
 .snapshot-list-item > .snapshot-totals {
   font-size: 90%;
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 .snapshot-list-item.selected > .snapshot-state,
@@ -506,7 +506,7 @@ html, body, #app, #memory-tool {
 .heap-tree-number {
   padding: 0 3px;
   flex: 1;
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
   /* Make sure number doesn't appear backwards on RTL locales */
   direction: ltr;
 }
@@ -620,7 +620,7 @@ svg {
 }
 
 .theme-dark svg {
-  --arrow-color: var(--theme-body-color-alt);
+  --arrow-color: var(--theme-text-color-alt);
 }
 
 svg #arrowhead {

devtools/client/themes/performance.css

@@ -202,13 +202,12 @@
 
 .recording-list-item-duration,
 .recording-list-item-save {
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 .recording-list-item.selected .recording-list-item-duration,
 .recording-list-item.selected .recording-list-item-save {
-  color: var(--theme-body-color-alt);
-  color: var(--theme-selection-color);
+  color: inherit;
 }
 
 #recordings-list .selected label {

devtools/client/themes/rules.css

@@ -117,7 +117,7 @@
 
 #ruleview-class-panel .no-classes {
   flex: 1;
-  color: var(--theme-body-color-inactive);
+  color: var(--theme-text-color-inactive);
   margin: 0;
   text-align: center;
 }
@@ -418,7 +418,7 @@
   content: "";
   position: absolute;
   display: block;
-  border: 0px solid var(--theme-body-color-alt);
+  border: 0px solid var(--theme-text-color-alt);
 }
 
 .ruleview-overridden-item::before {
@@ -541,7 +541,7 @@
 }
 
 .ruleview-overridden {
-  text-decoration: line-through solid var(--theme-body-color-alt);
+  text-decoration: line-through solid var(--theme-text-color-alt);
 }
 
 /**

devtools/client/themes/tooltips.css

@@ -575,7 +575,7 @@
   border-radius: 3px;
   padding: 2px;
   margin-inline-start: 5px;
-  background-color: var(--theme-body-color-alt);
+  background-color: var(--theme-text-color-alt);
   color: var(--theme-body-background);
 }
 

devtools/client/themes/variables.css

@@ -55,8 +55,8 @@
   --theme-comment: var(--grey-50);
   --theme-comment-alt: var(--grey-40);
   --theme-body-color: var(--grey-60);
-  --theme-body-color-alt: var(--grey-50);
-  --theme-body-color-inactive: var(--grey-40);
+  --theme-text-color-alt: var(--grey-50);
+  --theme-text-color-inactive: var(--grey-40);
   --theme-text-color-strong: var(--grey-80);
 
   --theme-highlight-green: var(--green-70);
@@ -146,8 +146,8 @@
   --theme-comment: var(--grey-45);
   --theme-comment-alt: var(--grey-50);
   --theme-body-color: var(--grey-40);
-  --theme-body-color-alt: var(--grey-45);
-  --theme-body-color-inactive: var(--grey-50);
+  --theme-text-color-alt: var(--grey-45);
+  --theme-text-color-inactive: var(--grey-50);
   --theme-text-color-strong: var(--grey-30);
 
   --theme-highlight-green: #86DE74;

devtools/client/themes/webconsole.css

@@ -370,7 +370,7 @@ a {
 }
 
 .message.network .xhr {
-  background-color: var(--theme-body-color-alt);
+  background-color: var(--theme-text-color-alt);
   color: var(--theme-body-background);
   border-radius: 3px;
   font-weight: bold;

devtools/client/themes/widgets.css

@@ -113,7 +113,7 @@
 }
 
 .variables-view-empty-notice {
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 .variables-view-scope:focus > .title,
@@ -527,7 +527,7 @@
 
 .line-graph-widget-tooltip > [text=metric] {
   margin-inline-start: 1px;
-  color: var(--theme-body-color-alt);
+  color: var(--theme-text-color-alt);
 }
 
 .theme-light .line-graph-widget-tooltip > [text=value],