jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

change(ui) - player control icons and other changes

Browse source
This commit is contained in:
Shekar Siri 2023-04-20 15:54:58 +02:00
parent 432a988afd
commit bbb50e890a
2 changed files with 4 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frontend/app/components/Session_/Player/Controls/components/PlayerControls.tsx
View file

@ -90,7 +90,7 @@ function PlayerControls(props: Props) {
{/* @ts-ignore */}
<Tooltip
anchorClassName="h-full hover:border-active-blue-border hover:bg-active-blue-border focus:border focus:border-blue border-borderColor-transparent"
title={`Rewind ${currentInterval}s`}
title={`← Rewind ${currentInterval}s`}
placement="top"
>
<button ref={arrowBackRef} className="h-full bg-transparent">
@ -146,7 +146,7 @@ function PlayerControls(props: Props) {
<Tooltip
anchorClassName="h-full hover:border-active-blue-border hover:bg-active-blue-border focus:border focus:border-blue border-borderColor-transparent"
title={`Rewind ${currentInterval}s`}
title={`Forward ${currentInterval}s →`}
placement="top"
>
<button ref={arrowForwardRef} className="h-full bg-transparent">
@ -194,7 +194,7 @@ function PlayerControls(props: Props) {
)}
>
<div onClick={toggleTooltip} ref={skipRef} className="cursor-pointer select-none">
<Tooltip disabled={showTooltip} title="Set default skip duration">
<Tooltip disabled={showTooltip} title="Playback speed (↑↓)">
<button
ref={speedRef}
className={cn(styles.speedButton, 'focus:border focus:border-blue')}

3
frontend/app/player-ui/SkipButton.tsx
View file

@ -15,10 +15,9 @@ export function SkipButton({ size = 18, onClick, isBackwards, customClasses }: I
<div
onClick={onClick}
className={cn('py-1 px-2 hover-main cursor-pointer bg-gray-lightest', customClasses)}
style={{ transform: isBackwards ? 'rotate(180deg)' : '' }}
>
<Icon
name="skip-forward-fill"
name={ isBackwards ? "arrow-counterclockwise" : "arrow-clockwise" }
size={size}
color="inherit"
/>