diff options
Diffstat (limited to 'frontend/views/page')
| -rw-r--r-- | frontend/views/page/components/tile.form.js | 23 | ||||
| -rw-r--r-- | frontend/views/page/page.css | 23 |
2 files changed, 35 insertions, 11 deletions
diff --git a/frontend/views/page/components/tile.form.js b/frontend/views/page/components/tile.form.js index 1d15296..a59a433 100644 --- a/frontend/views/page/components/tile.form.js +++ b/frontend/views/page/components/tile.form.js @@ -313,16 +313,19 @@ class TileForm extends Component { console.log(temporaryTile.settings) return ( <div> - <TextInput - title="" - placeholder='http://' - name="url" - required - data={temporaryTile.settings} - error={errorFields.has('url')} - onChange={this.handleImageChange.bind(this)} - autoComplete="off" - /> + <div className='row imageUrl'> + {temporaryTile.settings.url && <div className='thumb'><img src={temporaryTile.settings.url} /></div>} + <TextInput + title="" + placeholder='http://' + name="url" + required + data={temporaryTile.settings} + error={errorFields.has('url')} + onChange={this.handleImageChange.bind(this)} + autoComplete="off" + /> + </div> <div className='row pair'> <Checkbox label="Tiled" diff --git a/frontend/views/page/page.css b/frontend/views/page/page.css index 887ec0f..5c29a9a 100644 --- a/frontend/views/page/page.css +++ b/frontend/views/page/page.css @@ -68,6 +68,27 @@ opacity: 0.6; } -.row.buttons { +.row.imageUrl label { + width: 13rem; +} +.row.imageUrl .thumb { + display: flex; + justify-content: center; + align-items: center; + height: 1.5rem; + width: 2rem; + margin-right: 0.5rem; +} +.row.imageUrl img { + max-width: 100%; + max-height: 100%; +} +.box .row.buttons { + justify-content: space-between; +} +.box .row.pair { justify-content: space-between; } +.box .pair label:last-child { + margin-right: 0; +}
\ No newline at end of file |