Reorganize Volume Rendering Paths section in App.tsx

This commit is contained in:
2026-04-06 09:16:05 +02:00
parent 18f69a7d20
commit e6405fb3de

View File

@@ -5708,44 +5708,6 @@ export function App({ store, initialStatusMessage }: AppProps) {
/>
</label>
<div className="form-section">
<div className="label">Volume Rendering Paths</div>
<div className="material-summary">
{advancedRendering.enabled
? "Uses the authored path below."
: "Advanced Rendering is off — both paths force to Performance."}
</div>
<div className="vector-inputs vector-inputs--two">
<label className="form-field">
<span className="label">Fog</span>
<select
className="select-input"
value={advancedRendering.fogPath}
onChange={(event) => applyAdvancedRenderingFogPath(event.currentTarget.value as BoxVolumeRenderPath)}
>
{BOX_VOLUME_RENDER_PATHS.map((path) => (
<option key={path} value={path}>
{formatBoxVolumeRenderPathLabel(path)}
</option>
))}
</select>
</label>
<label className="form-field">
<span className="label">Water</span>
<select
className="select-input"
value={advancedRendering.waterPath}
onChange={(event) => applyAdvancedRenderingWaterPath(event.currentTarget.value as BoxVolumeRenderPath)}
>
{BOX_VOLUME_RENDER_PATHS.map((path) => (
<option key={path} value={path}>
{formatBoxVolumeRenderPathLabel(path)}
</option>
))}
</select>
</label>
</div>
</div>
{!advancedRendering.enabled ? null : (
<>
@@ -6020,6 +5982,40 @@ export function App({ store, initialStatusMessage }: AppProps) {
/>
</label>
</div>
<div className="form-section">
<div className="label">Volume Rendering Paths</div>
<div className="vector-inputs vector-inputs--two">
<label className="form-field">
<span className="label">Fog</span>
<select
className="select-input"
value={advancedRendering.fogPath}
onChange={(event) => applyAdvancedRenderingFogPath(event.currentTarget.value as BoxVolumeRenderPath)}
>
{BOX_VOLUME_RENDER_PATHS.map((path) => (
<option key={path} value={path}>
{formatBoxVolumeRenderPathLabel(path)}
</option>
))}
</select>
</label>
<label className="form-field">
<span className="label">Water</span>
<select
className="select-input"
value={advancedRendering.waterPath}
onChange={(event) => applyAdvancedRenderingWaterPath(event.currentTarget.value as BoxVolumeRenderPath)}
>
{BOX_VOLUME_RENDER_PATHS.map((path) => (
<option key={path} value={path}>
{formatBoxVolumeRenderPathLabel(path)}
</option>
))}
</select>
</label>
</div>
</div>
</>
)}
</div>