chore: added expanding tooltip to unit category quick filter buttons

This commit is contained in:
MarcoJayUsai 2025-04-01 12:34:07 +02:00
parent 43284c46db
commit 2d7db0bf5e

View File

@ -289,13 +289,9 @@ export function Header() {
<span className="my-auto text-nowrap font-bold">Game Master</span> <span className="my-auto text-nowrap font-bold">Game Master</span>
{enabledCommandModes.length > 0 && ( {enabledCommandModes.length > 0 && (
<> <>
{loadingNewCommandMode ? ( {loadingNewCommandMode ? <FaSpinner className={`
<FaSpinner my-auto ml-2 animate-spin text-white
className={`my-auto ml-2 animate-spin text-white`} `} /> : <FaRedo className={`my-auto ml-2 text-gray-200`} />}
/>
) : (
<FaRedo className={`my-auto ml-2 text-gray-200`} />
)}
</> </>
)} )}
</div> </div>
@ -321,9 +317,9 @@ export function Header() {
{enabledCommandModes.length > 0 && ( {enabledCommandModes.length > 0 && (
<> <>
{loadingNewCommandMode ? ( {loadingNewCommandMode ? (
<FaSpinner <FaSpinner className={`
className={`my-auto ml-2 animate-spin text-gray-200`} my-auto ml-2 animate-spin text-gray-200
/> `} />
) : ( ) : (
<FaRedo className={`my-auto ml-2 text-gray-200`} /> <FaRedo className={`my-auto ml-2 text-gray-200`} />
)} )}
@ -352,9 +348,9 @@ export function Header() {
{enabledCommandModes.length > 0 && ( {enabledCommandModes.length > 0 && (
<> <>
{loadingNewCommandMode ? ( {loadingNewCommandMode ? (
<FaSpinner <FaSpinner className={`
className={`my-auto ml-2 animate-spin text-gray-200`} my-auto ml-2 animate-spin text-gray-200
/> `} />
) : ( ) : (
<FaRedo className={`my-auto ml-2 text-gray-200`} /> <FaRedo className={`my-auto ml-2 text-gray-200`} />
)} )}
@ -389,9 +385,11 @@ export function Header() {
onClick={() => { onClick={() => {
audioState === AudioManagerState.RUNNING ? getApp().getAudioManager().stop() : getApp().getAudioManager().start(); audioState === AudioManagerState.RUNNING ? getApp().getAudioManager().stop() : getApp().getAudioManager().start();
}} }}
className={audioState === AudioManagerState.ERROR ? ` className={
animate-pulse !border-red-500 !text-red-500 audioState === AudioManagerState.ERROR
` : ""} ? `animate-pulse !border-red-500 !text-red-500`
: ""
}
tooltip={() => ( tooltip={() => (
<OlExpandingTooltip <OlExpandingTooltip
title="Enable/disable audio" title="Enable/disable audio"
@ -463,7 +461,19 @@ export function Header() {
onClick={(event) => unitTypeFilterClickHandler(event, entry[0])} onClick={(event) => unitTypeFilterClickHandler(event, entry[0])}
checked={!mapHiddenTypes[entry[0]]} checked={!mapHiddenTypes[entry[0]]}
icon={entry[1]} icon={entry[1]}
tooltip={"Hide/show " + entry[0] + " units. Tip: holding ctrl key while clicking will hide other unit categories. To show all units again, hold ctrl while clicking a displayed unit category."} tooltip={() => {
return (
<OlExpandingTooltip
title={"Hide/show " + entry[0] + " units."}
content={
<>
<p>Tip: holding ctrl key while clicking will hide other unit categories.</p>
<p>To show all units again, hold ctrl while clicking a displayed unit category.</p>
</>
}
/>
);
}}
/> />
); );
})} })}