Update tooltips to include keyboard shortcuts and adjust tooltip positioning

This commit is contained in:
2025-05-07 19:02:36 +05:30
parent d51f851999
commit 8bf48bfcfe
4 changed files with 14 additions and 14 deletions

View File

@@ -28,7 +28,7 @@ const Header: React.FC = () => {
}
}}
>
<div className="tooltip">{toggleUI ? "Hide" : "Show"} sidebar</div>
<div className="tooltip">{toggleUI ? "Hide" : "Show"} sidebar (ctrl + .)</div>
<ToggleSidebarIcon />
</button>
</div>

View File

@@ -218,7 +218,7 @@ const Tools: React.FC = () => {
setActiveTool("cursor");
}}
>
<div className="tooltip">cursor</div>
<div className="tooltip">cursor (v)</div>
<CursorIcon isActive={activeTool === "cursor"} />
</div>
)}
@@ -231,7 +231,7 @@ const Tools: React.FC = () => {
setActiveTool("free-hand");
}}
>
<div className="tooltip">free hand</div>
<div className="tooltip">free hand (h)</div>
<FreeMoveIcon isActive={activeTool === "free-hand"} />
</div>
)}
@@ -244,7 +244,7 @@ const Tools: React.FC = () => {
setActiveTool("delete");
}}
>
<div className="tooltip">delete</div>
<div className="tooltip">delete (x)</div>
<DeleteIcon isActive={activeTool === "delete"} />
</div>
)}
@@ -319,7 +319,7 @@ const Tools: React.FC = () => {
setActiveTool("draw-wall");
}}
>
<div className="tooltip">draw wall</div>
<div className="tooltip">draw wall (q)</div>
<WallIcon isActive={activeTool === "draw-wall"} />
</div>
<div
@@ -330,7 +330,7 @@ const Tools: React.FC = () => {
setActiveTool("draw-zone");
}}
>
<div className="tooltip">draw zone</div>
<div className="tooltip">draw zone (e)</div>
<ZoneIcon isActive={activeTool === "draw-zone"} />
</div>
<div
@@ -341,7 +341,7 @@ const Tools: React.FC = () => {
setActiveTool("draw-aisle");
}}
>
<div className="tooltip">draw asile</div>
<div className="tooltip">draw asile (r)</div>
<AsileIcon isActive={activeTool === "draw-aisle"} />
</div>
<div
@@ -352,7 +352,7 @@ const Tools: React.FC = () => {
setActiveTool("draw-floor");
}}
>
<div className="tooltip">draw floor</div>
<div className="tooltip">draw floor (t)</div>
<FloorIcon isActive={activeTool === "draw-floor"} />
</div>
</div>
@@ -370,7 +370,7 @@ const Tools: React.FC = () => {
setActiveTool("measure");
}}
>
<div className="tooltip">measure scale</div>
<div className="tooltip">measure scale (m)</div>
<MeasureToolIcon isActive={activeTool === "measure"} />
</div>
</div>
@@ -439,7 +439,7 @@ const Tools: React.FC = () => {
setIsPlaying(!isPlaying);
}}
>
<div className="tooltip">play</div>
<div className="tooltip">play (ctrl + p)</div>
<PlayIcon isActive={activeTool === "play"} />
</div>
)}
@@ -453,7 +453,7 @@ const Tools: React.FC = () => {
}`}
onClick={toggleSwitch}
>
<div className="tooltip">toggle view</div>
<div className="tooltip">toggle view (tab)</div>
<div
className={`toggle-option${!toggleThreeD ? " active" : ""}`}
>

View File

@@ -24,7 +24,7 @@ import ThroughputSummary from "../analysis/ProductionCapacity";
import ROISummary from "../analysis/ROISummary";
const SimulationPlayer: React.FC = () => {
const MAX_SPEED = 8; // Maximum speed
const MAX_SPEED = 4; // Maximum speed
const isDragging = useRef(false);
const sliderRef = useRef<HTMLDivElement>(null);
@@ -341,7 +341,7 @@ const SimulationPlayer: React.FC = () => {
className="slider-input"
/>
</div>
<div className="speed-label max-value">8x</div>
<div className="speed-label max-value">{MAX_SPEED}x</div>
</div>
</div>
</div>

View File

@@ -44,7 +44,7 @@
position: relative;
.tooltip {
top: 6px;
right: -116px;
right: -168px;
&::after {
left: 0px;
bottom: 50%;