[tools][system-analyzer] Change theme after data load

This CL initialises the change theme button in
correct place and adds the functionality to change
theme after the data load.

Bug: v8:10644

Change-Id: I7397933ff9d12a2ac270d025df1b3327801d89be
Reviewed-on: https://chromium-review.googlesource.com/c/v8/v8/+/2336800Reviewed-by: Camillo Bruni <cbruni@chromium.org>
Commit-Queue: Zeynep Cankara <zcankara@google.com>
Cr-Commit-Position: refs/heads/master@{#69238}

tools/system-analyzer/index.html

@@ -54,7 +54,7 @@ found in the LICENSE file. -->
     display:none;
   }
   .slider {
-    background-color: var(--on-surface-color);
+    background-color: var(--primary-color);
     bottom: 0;
     cursor: pointer;
     left: 0;

tools/system-analyzer/index.mjs

@@ -152,10 +152,17 @@ class App {
     this.fileLoaded = true;
   }
 
+  refreshTimelineTrackView(){
+    this.#view.mapTrack.data = this.#state.mapTimeline;
+    this.#view.icTrack.data = this.#state.icTimeline;
+  }
+
   switchTheme(event) {
-    if(this.fileLoaded) return;
     document.documentElement.dataset.theme =
-      event.target.checked ? 'dark' : 'light';
+      event.target.checked ? 'light' : 'dark';
+    if(this.fileLoaded) {
+      this.refreshTimelineTrackView();
+    }
   }
 }