1
0
mirror of https://github.com/mifi/lossless-cut.git synced 2024-11-22 10:22:31 +01:00

improve keyframes button

This commit is contained in:
Mikael Finstad 2020-02-27 23:40:20 +08:00
parent 25f6638661
commit 102a2e648a

View File

@ -1,4 +1,4 @@
import React, { memo } from 'react';
import React, { Fragment, memo } from 'react';
import { FaHandPointLeft, FaHandPointRight, FaStepBackward, FaStepForward, FaCaretLeft, FaCaretRight, FaPause, FaPlay, FaImages, FaKey } from 'react-icons/fa';
import { GiSoundWaves } from 'react-icons/gi';
// import useTraceUpdate from 'use-trace-update';
@ -111,7 +111,7 @@ const TimelineControls = memo(({
const PlayPause = playing ? FaPause : FaPlay;
const leftRightWidth = 50;
const leftRightWidth = 100;
return (
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
@ -126,22 +126,24 @@ const TimelineControls = memo(({
/>
)}
{hasVideo && (
<FaImages
size={20}
style={{ padding: '0 5px', color: timelineMode === 'thumbnails' ? primaryTextColor : undefined }}
role="button"
title="Show thumbnails"
onClick={() => setTimelineMode('thumbnails')}
/>
)}
<Fragment>
<FaImages
size={20}
style={{ padding: '0 5px', color: timelineMode === 'thumbnails' ? primaryTextColor : undefined }}
role="button"
title="Show thumbnails"
onClick={() => setTimelineMode('thumbnails')}
/>
<FaKey
size={16}
style={{ padding: '0 5px', color: keyframesEnabled ? primaryTextColor : undefined }}
role="button"
title="Show keyframes"
onClick={() => setKeyframesEnabled(v => !v)}
/>
<FaKey
size={16}
style={{ padding: '0 5px', color: keyframesEnabled ? primaryTextColor : undefined }}
role="button"
title="Show keyframes"
onClick={() => setKeyframesEnabled(v => !v)}
/>
</Fragment>
)}
</div>
<div style={{ flexGrow: 1 }} />