fix: fix wrong usage of fg token

Author: anitavincent

packages/components/src/checkbox/checkbox.css

@@ -6,7 +6,7 @@
 
 @layer sl-components {
   [data-sl-checkbox] {
-    color: var(--sl-color-fg);
+    color: var(--sl-fg);
     width: var(--sl-checkbox-size);
     height: var(--sl-checkbox-size);
     display: flex;

packages/components/src/menu/menu.css

@@ -1,7 +1,7 @@
 @layer sl-components {
   [data-sl-menu] {
     background: var(--sl-bg);
-    color: var(--sl-color-fg);
+    color: var(--sl-fg);
     outline: none;
     border: var(--sl-border);
     border-radius: var(--sl-border-radius-medium);

packages/components/src/table/table.css

@@ -6,7 +6,7 @@
 
 @layer sl-components {
   [data-sl-table] {
-    color: var(--sl-color-fg);
+    color: var(--sl-fg);
     border-collapse: collapse;
     width: 100%;
     display: grid;
@@ -18,7 +18,7 @@
       overflow: unset;
 
       [data-sl-table-header-cell] {
-        color: var(--sl-color-fg);
+        color: var(--sl-fg);
         position: sticky;
         top: 0;
         z-index: 1;