Dwinzo-Beta/Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update tooltips to include keyboard shortcuts and adjust tooltip positioning

Browse Source
This commit is contained in:
Vishnu
2025-05-07 19:02:36 +05:30
parent d51f851999
commit 8bf48bfcfe
4 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/components/layout/sidebarLeft/Header.tsx
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 /> <ToggleSidebarIcon />
</button> </button>
</div> </div>

20
app/src/components/ui/Tools.tsx
View File

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

4
app/src/components/ui/simulation/simulationPlayer.tsx
View File

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

2
app/src/styles/layout/sidebar.scss
View File

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