style: Updated CSS files to fix text color and background color in track page

Author: Yashasewi

src/components/ItemsPage.module.css

@@ -62,10 +62,11 @@
   border-bottom: var(--border);
   border-left: var(--border);
   height: var(--baseline-6x);
-  background-color: white;
+  background-color: var(--background-color);
 
   & p {
     margin: 0 0 var(--baseline) 0;
+    color: var(--text-color);
   }
 
   & svg {

src/components/Select.module.css

@@ -51,7 +51,6 @@
   flex-direction: column;
   justify-content: space-between;
   height: calc(100% - var(--baseline));
-  background-color: red;
 }
 
 .select {
@@ -75,6 +74,8 @@
 
 .select :global(.rs__menu) {
   border-radius: 0;
+  color: var(--text-color) !important;
+  background-color: var(--background-color);
 }
 
 .select :global(.rs__menu-list) {
@@ -98,12 +99,13 @@
   }
 
   & .select {
-    color: var(--gray-dark);
+    color: var(--text-color);
     background-color: var(--red-light);
   }
   & .select :global(.rs__option--is-focused),
   & .select :global(.rs__control) {
     background-color: var(--red-light);
+    color: var(--text-color);
   }
   & .select :global(.rs__option--is-selected) {
     background-color: var(--red);
@@ -129,13 +131,14 @@
   }
 
   & .select {
-    color: var(--gray-dark);
+    color: var(--text-color);
     background-color: var(--cyan-light);
   }
 
   & .select :global(.rs__option--is-focused),
   & .select :global(.rs__control) {
     background-color: var(--cyan-light);
+    color: var(--text-color);
   }
 
   & .select :global(.rs__menu-list) {
@@ -165,7 +168,7 @@
   }
 
   & .select {
-    color: var(--gray-dark);
+    color: var(--text-color);
     background-color: var(--purple-light);
   }
 

src/components/tracks/Card.module.css

@@ -135,6 +135,7 @@
   height: var(--baseline);
   padding: 0 var(--box-padding);
   line-height: var(--baseline);
+  color: var(--text-color);
 }
 
 .expand {
@@ -157,7 +158,7 @@
   height: var(--baseline);
   padding: 0 var(--box-padding);
   background: var(--red-light);
-  color: var(--gray-dark);
+  color: var(--text-color);
   font-size: var(--maru-normal);
   line-height: var(--maru-normal-line-height);
   & * + * {