diff options
Diffstat (limited to 'frontend/app/views/tile/components/tile.form.js')
| -rw-r--r-- | frontend/app/views/tile/components/tile.form.js | 104 |
1 files changed, 60 insertions, 44 deletions
diff --git a/frontend/app/views/tile/components/tile.form.js b/frontend/app/views/tile/components/tile.form.js index 3066da3..c2f2f60 100644 --- a/frontend/app/views/tile/components/tile.form.js +++ b/frontend/app/views/tile/components/tile.form.js @@ -569,7 +569,7 @@ class TileForm extends Component { autoComplete="off" /> </div> - <div className='row pair'> + <div className='row pair with_checkbox'> <Select name='video_style' selected={temporaryTile.settings.video_style || 'none'} @@ -589,12 +589,14 @@ class TileForm extends Component { <Checkbox label="Muted" name="muted" + className='short' checked={temporaryTile.settings.muted} onChange={this.handleSettingsSelect} /> <Checkbox label="Autoadvance" name="autoadvance" + className='short' checked={temporaryTile.settings.autoadvance} onChange={this.handleSettingsSelect} /> @@ -603,6 +605,7 @@ class TileForm extends Component { <div className='row'> <Checkbox label="Loop section?" + className='short' name="loop_section" checked={temporaryTile.settings.loop_section} onChange={this.handleSettingsSelect} @@ -743,15 +746,6 @@ class TileForm extends Component { autoComplete="off" /> </div> - <div className='row single'> - <Select - name='units' - selected={temporaryTile.settings.units} - options={UNITS} - title='Units' - onChange={this.handleSettingsSelect} - /> - </div> </div> ) } @@ -838,32 +832,40 @@ class TileForm extends Component { <Checkbox label="Sound effects" name="has_audio" + className='short' checked={temporaryTile.settings.has_audio} onChange={this.handleSettingsSelect} /> {temporaryTile.settings.has_audio && ( - <div > - <AudioSelect - title="On click" - name="audio_on_click_id" - selected={temporaryTile.settings.audio_on_click_id} - onChange={this.handleSettingsSelect} - /> + <div> + <div className='row single'> + <AudioSelect + title="On click" + name="audio_on_click_id" + selected={temporaryTile.settings.audio_on_click_id} + onChange={this.handleSettingsSelect} + /> + </div> - <Checkbox - label="Navigate when audio finishes" - name="navigate_when_audio_finishes" - checked={temporaryTile.settings.navigate_when_audio_finishes} - onChange={this.handleSettingsSelect} - autoComplete="off" - /> + {!!temporaryTile.settings.audio_on_click_id && ( + <Checkbox + label="Navigate when audio finishes" + name="navigate_when_audio_finishes" + className='short' + checked={temporaryTile.settings.navigate_when_audio_finishes} + onChange={this.handleSettingsSelect} + autoComplete="off" + /> + )} - <AudioSelect - title="On hover" - name="audio_on_hover_id" - selected={temporaryTile.settings.audio_on_hover_id} - onChange={this.handleSettingsSelect} - /> + <div className='row single'> + <AudioSelect + title="On hover" + name="audio_on_hover_id" + selected={temporaryTile.settings.audio_on_hover_id} + onChange={this.handleSettingsSelect} + /> + </div> </div> )} </div> @@ -874,6 +876,15 @@ class TileForm extends Component { const { temporaryTile } = this.props return ( <div> + <div className='row single'> + <Select + name='units' + selected={temporaryTile.settings.units || 'px'} + options={UNITS} + title='Units' + onChange={this.handleSettingsSelect} + /> + </div> <Slider title='Opacity' name='opacity' @@ -905,18 +916,21 @@ class TileForm extends Component { <Checkbox label="Element is a Popup" name="is_popup" + className='short' checked={temporaryTile.settings.is_popup} onChange={this.handleSettingsSelect} autoComplete="off" /> {temporaryTile.settings.is_popup && ( - <TextInput - title="Popup group" - name="popup_group" - data={temporaryTile.settings} - onChange={this.handleSettingsChange} - autoComplete="off" - /> + <div className='row single_text'> + <TextInput + title="Popup group" + name="popup_group" + data={temporaryTile.settings} + onChange={this.handleSettingsChange} + autoComplete="off" + /> + </div> )} <Checkbox label="Wait to appear" @@ -926,13 +940,15 @@ class TileForm extends Component { autoComplete="off" /> {temporaryTile.settings.wait_to_appear && ( - <TextInput - title="Appear after" - name="appear_after" - data={temporaryTile.settings} - onChange={this.handleSettingsChange} - autoComplete="off" - /> + <div className='row single_text'> + <TextInput + title="Appear after" + name="appear_after" + data={temporaryTile.settings} + onChange={this.handleSettingsChange} + autoComplete="off" + /> + </div> )} </div> ) |