fix: OPTIC-2145: Audio tracker line is not visible in dark mode

[ricardoantoniocm]

Reason for change

The audio tracker line in the Quick View is not visible when Dark Mode is enabled, making it difficult for users to navigate the audio data. This change updates the color of the tracker line to use a theme-aware variable, ensuring it is visible in both Light and Dark Modes.

Screenshots

Before:

After:

Rollout strategy

This is a small visual change and does not require a specific rollout strategy.

Testing

1. Set the application theme to Dark Mode.
2. Open an audio project and navigate to the Data Manager page.
3. Click on a task to open it in Quick View.
4. Hover over the waveform area to display the audio tracker under the cursor.
5. Verify that the audio tracker line is clearly visible.
6. Set the application theme to Light Mode.
7. Refresh the page to reload the audio player's styles.
8. Repeat steps 2-5 and confirm the audio tracker line is still visible.

Risks

There are no anticipated risks associated with this minor visual correction.

Reviewer notes

Please verify that the color variable var(--color-neutral-border) ensures sufficient contrast for the audio tracker line to be visible in both Light and Dark Mode themes.

General notes

The fix involves changing a hardcoded color value to a CSS variable that adapts to the current theme.

[netlify]

✅ Deploy Preview for label-studio-docs-new-theme canceled.

Name	Link
🔨 Latest commit	f9d20d6
🔍 Latest deploy log	https://app.netlify.com/sites/label-studio-docs-new-theme/deploys/682273f6271d20000890a66b

[netlify]

✅ Deploy Preview for label-studio-storybook ready!

Name	Link
🔨 Latest commit	f9d20d6
🔍 Latest deploy log	https://app.netlify.com/sites/label-studio-storybook/deploys/682273f6f214560008d9e1b8
😎 Deploy Preview	https://deploy-preview-7514--label-studio-storybook.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for heartex-docs canceled.

Name	Link
🔨 Latest commit	f9d20d6
🔍 Latest deploy log	https://app.netlify.com/sites/heartex-docs/deploys/682273f6390f2500080c6568

[Copilot]

Pull Request Overview

This PR fixes an issue where the audio tracker line was not visible in Dark Mode by switching from a hardcoded RGBA value to a theme-aware CSS variable.

• Updated the color assignment for the audio tracker line in Cursor.ts
• Ensured compatibility with both Light and Dark Mode themes by using the CSS variable "var(--color-neutral-border)"

Comments suppressed due to low confidence (1)

web/libs/editor/src/lib/AudioUltra/Cursor/Cursor.ts:61

• Ensure that the CSS variable 'var(--color-neutral-border)' delivers sufficient contrast in both Light and Dark Mode themes by cross-checking with the current design tokens or accessibility guidelines.

color = "var(--color-neutral-border)";