refactor: Update SVG attributes for consistency and improve styling in analysis icons; remove unused imports in ProductionCapacity component; enhance simulation player UI with custom slider wrapper

This commit is contained in:
2025-05-03 17:58:21 +05:30
parent c8c0f9a9c0
commit 27817f00d4
5 changed files with 63 additions and 89 deletions

View File

@@ -87,6 +87,7 @@ const SimulationPlayer: React.FC = () => {
document.removeEventListener("mousemove", handleMouseMove);
document.removeEventListener("mouseup", handleMouseUp);
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
// Slider function ends
@@ -310,25 +311,29 @@ const SimulationPlayer: React.FC = () => {
<div className="marker marker-70"></div>
<div className="marker marker-80"></div>
<div className="marker marker-90"></div>
<div className="custom-slider">
<button
className={`slider-handle ${isDragging ? "dragging" : ""}`}
style={{ left: `${calculateHandlePosition()}%` }}
onMouseDown={handleMouseDown}
>
{speed.toFixed(1)}x
</button>
<input
type="range"
min="0.5"
max={MAX_SPEED}
step="0.1"
value={speed}
onChange={handleSpeedChange}
className="slider-input"
/>
<div className="custom-slider-wrapper">
<div className="custom-slider">
<button
className={`slider-handle ${
isDragging ? "dragging" : ""
}`}
style={{ left: `${calculateHandlePosition()}%` }}
onMouseDown={handleMouseDown}
>
{speed.toFixed(1)}x
</button>
<input
type="range"
min="0.5"
max={MAX_SPEED}
step="0.1"
value={speed}
onChange={handleSpeedChange}
className="slider-input"
/>
</div>
<div className="speed-label max-value">4x</div>
</div>
<div className="speed-label max-value">4x</div>
</div>
</div>
</div>
@@ -369,6 +374,7 @@ const SimulationPlayer: React.FC = () => {
</div>
</div>
{/* {subModule === "analysis" && ( */}
{subModule === "analysis" && (
<div className="analysis">
<div className="analysis-wrapper">
<ProductionCapacity />
@@ -376,6 +382,7 @@ const SimulationPlayer: React.FC = () => {
</div>
<ROISummary />
</div>
)}
{/* )} */}
</>
);