add Dial to replace sliders

This commit is contained in:
Aoife
2021-04-06 13:44:07 -04:00
parent 0ad9f90fdc
commit 6651765178
9 changed files with 551 additions and 284 deletions
+49 -47
View File
@@ -10,53 +10,55 @@ export default function Mixer(props) {
return (
<Card header={props.name}>
<div className='-mt-2'>
<h3 className='text-lg font-semibold'>Volume 1</h3>
<Slider
min={0}
max={127}
parameter={parameters.vol1}
onChange={(value) =>
dispatch(
parameterUpdated({
id: props.id,
changes: { vol1: value },
})
)
}
/>
</div>
<div className='-mt-2'>
<h3 className='text-lg font-semibold'>Volume 2</h3>
<Slider
min={0}
max={127}
parameter={parameters.vol2}
onChange={(value) =>
dispatch(
parameterUpdated({
id: props.id,
changes: { vol2: value },
})
)
}
/>
</div>
<div>
<h3 className='text-lg font-semibold'>Volume 3</h3>
<Slider
min={0}
max={127}
parameter={parameters.vol3}
onChange={(value) =>
dispatch(
parameterUpdated({
id: props.id,
changes: { vol3: value },
})
)
}
/>
<div className='-mt-3'>
<div>
<h3 className='text-lg font-semibold'>Volume 1</h3>
<Slider
min={0}
max={127}
parameter={parameters.vol1}
onChange={(value) =>
dispatch(
parameterUpdated({
id: props.id,
changes: { vol1: value },
})
)
}
/>
</div>
<div>
<h3 className='text-lg font-semibold'>Volume 2</h3>
<Slider
min={0}
max={127}
parameter={parameters.vol2}
onChange={(value) =>
dispatch(
parameterUpdated({
id: props.id,
changes: { vol2: value },
})
)
}
/>
</div>
<div>
<h3 className='text-lg font-semibold'>Volume 3</h3>
<Slider
min={0}
max={127}
parameter={parameters.vol3}
onChange={(value) =>
dispatch(
parameterUpdated({
id: props.id,
changes: { vol3: value },
})
)
}
/>
</div>
</div>
</Card>
);