1
0
mirror of https://github.com/mifi/lossless-cut.git synced 2024-11-25 03:33:14 +01:00

make info boxes different from buttons

This commit is contained in:
Mikael Finstad 2018-09-09 20:04:20 +02:00
parent 4111b08c80
commit aab07e848f

View File

@ -408,6 +408,7 @@ class App extends React.Component {
render() { render() {
const jumpCutButtonStyle = { position: 'absolute', color: 'black', bottom: 0, top: 0, padding: '2px 8px' }; const jumpCutButtonStyle = { position: 'absolute', color: 'black', bottom: 0, top: 0, padding: '2px 8px' };
const infoSpanStyle = { background: 'rgba(255, 255, 255, 0.4)', padding: '.1em .4em', margin: '0 3px', fontSize: 13, borderRadius: '.3em' };
return (<div> return (<div>
{!this.state.filePath && <div id="drag-drop-field">DROP VIDEO</div>} {!this.state.filePath && <div id="drag-drop-field">DROP VIDEO</div>}
@ -536,13 +537,13 @@ class App extends React.Component {
</div> </div>
<div className="left-menu"> <div className="left-menu">
<button title="Format of current file"> <span style={infoSpanStyle} title="Format of current file">
{this.state.fileFormat || 'FMT'} {this.state.fileFormat || 'FMT'}
</button> </span>
<button className="playback-rate" title="Playback rate"> <span style={infoSpanStyle} title="Playback rate">
{_.round(this.state.playbackRate, 1) || 1}x {_.round(this.state.playbackRate, 1) || 1}x
</button> </span>
</div> </div>
<div className="right-menu"> <div className="right-menu">