update text color

src/App.js

@@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from 'react';
 import { initializeApp } from 'firebase/app';
 import { getAuth, signInAnonymously, onAuthStateChanged, signInWithCustomToken } from 'firebase/auth';
 import { getFirestore, doc, setDoc, addDoc, getDoc, getDocs, collection, onSnapshot, updateDoc, deleteDoc, query, writeBatch } from 'firebase/firestore';
-import { ArrowLeft, PlusCircle, Users, Swords, Shield, Trash2, Eye, Edit3, Save, XCircle, ChevronsUpDown, ChevronDown, ChevronUp, UserCheck, UserX, HeartCrack, HeartPulse, Zap, Share2, Copy as CopyIcon, Image as ImageIcon, EyeOff, ExternalLink } from 'lucide-react'; // Added ExternalLink
+import { ArrowLeft, PlusCircle, Users, Swords, Shield, Trash2, Eye, Edit3, Save, XCircle, ChevronsUpDown, ChevronDown, ChevronUp, UserCheck, UserX, HeartCrack, HeartPulse, Zap, Share2, Copy as CopyIcon, Image as ImageIcon, EyeOff, ExternalLink } from 'lucide-react';
 
 // --- Firebase Configuration ---
 const firebaseConfig = {
@@ -52,7 +52,6 @@ function App() {
   const [isPlayerViewOnlyMode, setIsPlayerViewOnlyMode] = useState(false);
 
   useEffect(() => {
-    // Check for query parameter to determine if this is a player-only display window
     const queryParams = new URLSearchParams(window.location.search);
     if (queryParams.get('playerView') === 'true') {
       setIsPlayerViewOnlyMode(true);
@@ -114,17 +113,12 @@ function App() {
   }
 
   const openPlayerWindow = () => {
-    // Construct the URL for the player view.
-    // It's the current path + ?playerView=true
-    // window.location.origin gives http://localhost:3000
-    // window.location.pathname gives / (or your base path if deployed in a subfolder)
     const playerViewUrl = window.location.origin + window.location.pathname + '?playerView=true';
-    window.open(playerViewUrl, '_blank', 'noopener,noreferrer,width=1024,height=768'); // Opens in a new tab/window
+    window.open(playerViewUrl, '_blank', 'noopener,noreferrer,width=1024,height=768'); 
   };
 
 
   if (isPlayerViewOnlyMode) {
-    // Render only the DisplayView if in player-only mode
     return (
       <div className="min-h-screen bg-slate-800 text-slate-100 font-sans">
         {isAuthReady && <DisplayView />}
@@ -133,13 +127,12 @@ function App() {
     );
   }
 
-  // Default Admin View
   return (
     <div className="min-h-screen bg-slate-800 text-slate-100 font-sans">
         <header className="bg-slate-900 p-4 shadow-lg">
           <div className="container mx-auto flex justify-between items-center">
             <h1 
-              className="text-3xl font-bold text-sky-400" // No longer needs to be clickable to go to admin, as this IS admin view
+              className="text-3xl font-bold text-sky-400"
             >
               TTRPG Initiative Tracker
             </h1>
@@ -160,7 +153,7 @@ function App() {
         {!isAuthReady && !error && <p>Authenticating...</p>} 
       </main>
        <footer className="bg-slate-900 p-4 text-center text-sm text-slate-400 mt-8">
-        TTRPG Initiative Tracker v0.1.17
+        TTRPG Initiative Tracker v0.1.18
       </footer>
     </div>
   );
@@ -831,7 +824,6 @@ function InitiativeControls({ campaignId, encounter, encounterPath }) {
     console.warn("Attempting to end encounter without confirmation");
     try {
       await updateDoc(doc(db, encounterPath), { isStarted: false, currentTurnParticipantId: null, round: 0, turnOrderIds: [] });
-      // When an encounter ends, also deactivate it from the Player Display
       await setDoc(doc(db, ACTIVE_DISPLAY_DOC), { 
         activeCampaignId: null, 
         activeEncounterId: null 
@@ -998,7 +990,7 @@ function DisplayView() {
                 <div className="w-full bg-slate-600 rounded-full h-6 md:h-8 relative overflow-hidden border-2 border-slate-500">
                   <div className={`h-full rounded-full transition-all ${p.currentHp <= p.maxHp / 4 ? 'bg-red-500' : (p.currentHp <= p.maxHp / 2 ? 'bg-yellow-500' : 'bg-green-500')}`} style={{ width: `${Math.max(0, (p.currentHp / p.maxHp) * 100)}%` }}></div>
                   {p.type !== 'monster' && ( 
-                      <span className="absolute inset-0 flex items-center justify-center text-xs md:text-sm font-medium text-white mix-blend-difference px-2">
+                      <span className="absolute inset-0 flex items-center justify-center text-xs md:text-sm font-medium text-white px-2"> {/* Removed mix-blend-difference */}
                       HP: {p.currentHp} / {p.maxHp}
                       </span>
                   )}