diff --git a/frontend/react/src/map/map.ts b/frontend/react/src/map/map.ts index cf801ff0..ead5d712 100644 --- a/frontend/react/src/map/map.ts +++ b/frontend/react/src/map/map.ts @@ -763,13 +763,8 @@ export class Map extends L.Map { if (this.#state === IDLE) { this.deselectAllCoalitionAreas(); } else if (this.#state === MOVE_UNIT) { - getApp().getUnitsManager().clearDestinations(); - getApp() - .getUnitsManager() - .addDestination(e.latlng, - false, - 0 - ); + getApp().getUnitsManager().clearDestinations(); + getApp().getUnitsManager().addDestination(e.latlng, false, 0); } else if (this.#state === SPAWN_UNIT) { if (this.#spawnRequestTable !== null) { const location = e.latlng; @@ -821,9 +816,7 @@ export class Map extends L.Map { this.setState(IDLE); } - #onContextMenu(e: any) { - - } + #onContextMenu(e: any) {} #onSelectionStart(e: any) { this.#selecting = true; @@ -841,9 +834,7 @@ export class Map extends L.Map { this.#updateCursor(); } - #onMouseDown(e: any) { - - } + #onMouseDown(e: any) {} #onMouseMove(e: any) { this.#lastMousePosition.x = e.originalEvent.x; diff --git a/frontend/react/src/ui/components/ollabeltoggle.tsx b/frontend/react/src/ui/components/ollabeltoggle.tsx index 2ab97959..2c6a5c08 100644 --- a/frontend/react/src/ui/components/ollabeltoggle.tsx +++ b/frontend/react/src/ui/components/ollabeltoggle.tsx @@ -11,7 +11,7 @@ export function OlLabelToggle(props: { onClick={props.onClick} className={` relative flex h-10 w-[120px] flex-none cursor-pointer select-none - flex-row justify-between rounded-md border border px-1 py-[5px] text-sm + flex-row justify-between rounded-md border px-1 py-[5px] text-sm contents-center dark:border-gray-600 dark:border-transparent dark:bg-gray-700 dark:hover:bg-gray-600 dark:focus:ring-blue-800 @@ -33,7 +33,6 @@ export function OlLabelToggle(props: { className={` my-auto pl-3 font-normal transition-colors z-ui-2 dark:data-[active='false']:text-gray-400 - dark:data-[active='false']:text-gray-400 dark:data-[active='true']:text-white `} > diff --git a/frontend/react/src/ui/components/olstatebutton.tsx b/frontend/react/src/ui/components/olstatebutton.tsx index e8ce7399..6ef85455 100644 --- a/frontend/react/src/ui/components/olstatebutton.tsx +++ b/frontend/react/src/ui/components/olstatebutton.tsx @@ -13,7 +13,6 @@ import { OlTooltip } from "./oltooltip"; export function OlStateButton(props: { className?: string; checked: boolean; - highlighted?: boolean; icon: IconProp; tooltip: string; onClick: () => void; @@ -26,8 +25,6 @@ export function OlStateButton(props: { ` h-[40px] w-[40px] flex-none rounded-md text-lg font-medium dark:bg-olympus-600 dark:text-gray-300 dark:hover:bg-olympus-300 - dark:data-[highlighted='true']:border-[2px] - dark:data-[highlighted='true']:border-blue-800 dark:data-[checked='true']:bg-blue-500 dark:data-[checked='true']:text-white `; @@ -41,7 +38,6 @@ export function OlStateButton(props: { setHover(false); }} data-checked={props.checked} - data-highlighted={props.highlighted ?? false} type="button" className={className} onMouseEnter={() => { @@ -61,7 +57,6 @@ export function OlStateButton(props: { export function OlRoundStateButton(props: { className?: string; checked: boolean; - highlighted?: boolean; icon: IconProp; tooltip: string; onClick: () => void; diff --git a/frontend/react/src/ui/panels/components/menu.tsx b/frontend/react/src/ui/panels/components/menu.tsx index ba646f2b..b9085a7a 100644 --- a/frontend/react/src/ui/panels/components/menu.tsx +++ b/frontend/react/src/ui/panels/components/menu.tsx @@ -1,57 +1,78 @@ import { faArrowLeft, faClose } from "@fortawesome/free-solid-svg-icons"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import React from "react"; +import React, { useState } from "react"; +import { FaChevronDown, FaChevronUp } from "react-icons/fa"; export function Menu(props: { title: string; open: boolean; onClose: () => void; + canBeHidden?: boolean; onBack?: () => void; showBackButton?: boolean; children?: JSX.Element | JSX.Element[]; }) { + const [hide, setHide] = useState(true); + + if (!props.open && hide) setHide(false); + return (
-
- {props.showBackButton && ( +
+
+ {props.showBackButton && ( + {})} + icon={faArrowLeft} + className={` + mr-1 cursor-pointer rounded-md p-2 + dark:text-gray-500 dark:hover:bg-gray-700 dark:hover:text-white + `} + /> + )}{" "} + {props.title} {})} - icon={faArrowLeft} + onClick={props.onClose} + icon={faClose} className={` - mr-1 cursor-pointer rounded-md p-2 + ml-auto flex cursor-pointer items-center justify-center rounded-md + p-2 text-lg dark:text-gray-500 dark:hover:bg-gray-700 dark:hover:text-white + hover:bg-gray-200 `} /> - )}{" "} - {props.title} - -
- {props.children} +
+ {props.children} +
+ {props.canBeHidden == true && ( +
setHide(!hide)}> + {hide ? ( + + ) : ( + + )} +
+ )} ); } diff --git a/frontend/react/src/ui/panels/header.tsx b/frontend/react/src/ui/panels/header.tsx index 81f79c72..dc1020d5 100644 --- a/frontend/react/src/ui/panels/header.tsx +++ b/frontend/react/src/ui/panels/header.tsx @@ -39,7 +39,7 @@ export function Header() {