Bug 1889866 - Use text-color-deemphasized on syncedtabs sidebar rather than...

Bug 1889866 - Use text-color-deemphasized on syncedtabs sidebar rather than GrayText. r=desktop-theme-reviewers,dao, a=dmeehan

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

browser/components/syncedtabs/sidebar.xhtml

@@ -15,7 +15,10 @@
 
     <link
       rel="stylesheet"
-      media="all"
+      href="chrome://global/skin/design-system/tokens-brand.css"
+    />
+    <link
+      rel="stylesheet"
       href="chrome://browser/skin/syncedtabs/sidebar.css"
     />
     <link rel="localization" href="browser/syncedTabs.ftl" />

browser/themes/shared/syncedtabs/sidebar.css

@@ -237,17 +237,12 @@ body {
 
 .deck .instructions {
   text-align: center;
-  color: GrayText;
+  color: var(--text-color-deemphasized);
   padding: 0 11px;
   max-width: 15em;
   margin: 0 auto;
 }
 
-:root[lwt-sidebar] .deck .instructions {
-  color: inherit;
-  opacity: .6;
-}
-
 .deck .button {
   display: block;
   background-color: #0060df;