Token cleanup in OnlineBoardDetailsPage (#333/#657282/#d1dcea/#d0d5dd/#eee → tokens)

src/features/online-board/components/OnlineBoardDetailsPage.scss

@@ -62,12 +62,12 @@
   &__city {
     font-size: 14px;
     font-weight: 400;
-    color: #333;
+    color: colors.$text-color;
   }
 
   &__airport {
     font-size: 12px;
-    color: #657282;
+    color: colors.$light-gray;
     margin-top: 2px;
   }
 
@@ -88,7 +88,7 @@
   &__bar {
     width: 100%;
     height: 2px;
-    background: #d0d5dd;
+    background: colors.$border;
     position: relative;
   }
 
@@ -179,7 +179,7 @@
     padding-top: vars.$space-xl;
     // Angular uses a 1.3px dotted hairline (#D1DCEA) between the route
     // strip and the time-details block.
-    border-top: 1.3px dotted #d1dcea;
+    border-top: 1.3px dotted colors.$border;
   }
 
   &__details-side {
@@ -202,7 +202,7 @@
 
     &-label {
       font-size: 12px;
-      color: #657282;
+      color: colors.$light-gray;
     }
 
     &-value {
@@ -214,13 +214,13 @@
     &-offset {
       font-weight: normal;
       font-size: 10px;
-      color: #657282;
+      color: colors.$light-gray;
       margin-left: 4px;
     }
 
     &-date {
       font-size: 10px;
-      color: #333;
+      color: colors.$text-color;
     }
   }
 
@@ -420,7 +420,7 @@
     font-size: 18px;
     font-weight: 600;
     color: colors.$text-color;
-    border-top: 1px solid #eee;
+    border-top: 1px solid colors.$border;
     margin-top: vars.$space-m;
   }