move timbre style to .css file
This commit is contained in:
@@ -9,22 +9,12 @@ import Amp from './parameters/Amp';
|
||||
import LFO from './parameters/LFO';
|
||||
import Patches from './parameters/Patches';
|
||||
import { selectById } from './timbreSlice.js';
|
||||
|
||||
const timbreStyle = {
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'center',
|
||||
};
|
||||
|
||||
const lineBreak = {
|
||||
width: '100%',
|
||||
};
|
||||
import styles from './Timbre.module.css';
|
||||
|
||||
export default function Timbre(props) {
|
||||
const ids = useSelector((state) => selectById(state, props.id));
|
||||
return (
|
||||
<div style={timbreStyle}>
|
||||
<div className={styles.timbreStyle}>
|
||||
<VCO
|
||||
id={ids.vco1}
|
||||
waveforms={[
|
||||
@@ -124,7 +114,7 @@ export default function Timbre(props) {
|
||||
<Pitch id={ids.pitch} />
|
||||
<Filter id={ids.filter} />
|
||||
<Amp id={ids.amp} />
|
||||
<div className="linebreak" style={lineBreak} />
|
||||
<div className={styles.lineBreak} />
|
||||
<EG id={ids.eg1} />
|
||||
<EG id={ids.eg2} />
|
||||
<LFO
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
.timbreStyle {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.lineBreak {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -8,22 +8,12 @@ import EG from './parameters/EG';
|
||||
import LFO from './parameters/LFO';
|
||||
import { VocoderFilter, FCMod } from './parameters/Filter';
|
||||
import { VocoderAmp } from './parameters/Amp';
|
||||
|
||||
const timbreStyle = {
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'center',
|
||||
};
|
||||
|
||||
const lineBreak = {
|
||||
width: '100%',
|
||||
};
|
||||
import styles from './Timbre.module.css';
|
||||
|
||||
export default function Vocoder(props) {
|
||||
const ids = useSelector((state) => selectById(state, props.id));
|
||||
return (
|
||||
<div style={timbreStyle}>
|
||||
<div className={styles.timbreStyle}>
|
||||
<VCO
|
||||
id={ids.vco}
|
||||
waveforms={[
|
||||
@@ -109,7 +99,7 @@ export default function Vocoder(props) {
|
||||
<Pitch id={ids.pitch} />
|
||||
<VocoderFilter id={ids.filter} />
|
||||
<FCMod id={ids.fcMod} />
|
||||
<div className="linebreak" style={lineBreak} />
|
||||
<div className={styles.lineBreak} />
|
||||
<VocoderAmp id={ids.amp} />
|
||||
<EG id={ids.eg} />
|
||||
<LFO id={ids.lfo1} />
|
||||
|
||||
Reference in New Issue
Block a user