Files
usda-vision/scripts/dark-mode-regex-patterns.md
salirezav 4acad772f9 Update camera management and MQTT logging for improved functionality
- Changed log level in configuration from WARNING to INFO for better visibility of system operations.
- Enhanced StandaloneAutoRecorder initialization to accept camera manager, state manager, and event system for improved modularity.
- Updated recording routes to handle optional request bodies and improved error logging for better debugging.
- Added checks in CameraMonitor to determine if a camera is already in use before initialization, enhancing resource management.
- Improved MQTT client logging to provide more detailed connection and message handling information.
- Added new MQTT event handling capabilities to the VisionApiClient for better tracking of machine states.
2025-11-03 16:56:53 -05:00

3.1 KiB

Dark Mode Regex Patterns for Find & Replace

Use these regex patterns in VS Code (Ctrl+Shift+F) to find classes that need dark mode variants.

Enable Regex Mode

Make sure the .* button is enabled in the Find dialog (regex mode).

Patterns to Find Classes Without Dark Variants

1. Find bg-white without dark:bg in the same className

className="[^"]*\bbg-white\b(?!.*dark:bg)[^"]*"

Simpler version (finds bg-white in any context, you manually check):

\bbg-white\b

2. Find text-gray-900 without dark:text in the same className

className="[^"]*\btext-gray-900\b(?!.*dark:text)[^"]*"

Simpler version:

\btext-gray-900\b

3. Find text-gray-600 or text-gray-700 without dark variants

className="[^"]*\btext-gray-[67]00\b(?!.*dark:text)[^"]*"

Simpler version:

\btext-gray-[67]00\b

4. Find text-gray-500 without dark variant

\btext-gray-500\b

5. Find border-gray-200 without dark variant

\bborder-gray-200\b

6. Find any bg-gray-* without dark variant (like bg-gray-50)

\bbg-gray-\d+\b

Since the negative lookahead patterns are complex, here's a simpler workflow:

  1. Find all instances of a pattern:

    \bbg-white\b
    
  2. For each match, check if the same line/className contains dark:bg-

    • If NO → needs dark mode variant
    • If YES → skip (already has dark mode)
  3. Replace patterns:

Replacement Patterns

Backgrounds:

  • Find: \bbg-white\b
  • Replace: bg-white dark:bg-gray-800
  • Then manually add border if missing: border border-gray-200 dark:border-gray-700

Text colors:

  • Find: \btext-gray-900\b

  • Replace: text-gray-900 dark:text-white

  • Find: \btext-gray-800\b

  • Replace: text-gray-800 dark:text-white/90

  • Find: \btext-gray-700\b

  • Replace: text-gray-700 dark:text-gray-300

  • Find: \btext-gray-600\b

  • Replace: text-gray-600 dark:text-gray-400

  • Find: \btext-gray-500\b

  • Replace: text-gray-500 dark:text-gray-400

Borders:

  • Find: \bborder-gray-200\b

  • Replace: border-gray-200 dark:border-gray-700

  • Find: \bborder-gray-300\b

  • Replace: border-gray-300 dark:border-gray-600

Table backgrounds:

  • Find: \bbg-gray-50\b
  • Replace: bg-gray-50 dark:bg-gray-900

Badges:

  • Find: \bbg-blue-100\b

  • Replace: bg-blue-100 dark:bg-blue-900/30

  • Find: \btext-blue-800\b

  • Replace: text-blue-800 dark:text-blue-300

(Similar pattern for green, red, yellow, purple badges)

Quick Find Patterns (Check Manually)

  1. All bg-white: \bbg-white\b
  2. All text-gray-*: \btext-gray-[0-9]+\b
  3. All border-gray-*: \bborder-gray-[0-9]+\b
  4. All bg-gray-*: \bbg-gray-[0-9]+\b

Example: Finding bg-white in className strings

If you want to be more precise and find bg-white that appears in a className attribute but doesn't have dark:bg nearby:

className="[^"]*\bbg-white\b[^"]*"(?!.*dark:bg)

But this won't work well if dark:bg is on a different line. So the simpler approach of finding all instances and manually checking is recommended.