diff options
Diffstat (limited to 'animism-align/frontend/app/views/viewer/player')
| -rw-r--r-- | animism-align/frontend/app/views/viewer/player/player.transcript.css | 6 | ||||
| -rw-r--r-- | animism-align/frontend/app/views/viewer/player/player.transcript.js | 2 |
2 files changed, 6 insertions, 2 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/player.transcript.css b/animism-align/frontend/app/views/viewer/player/player.transcript.css index 3725372..8d32abd 100644 --- a/animism-align/frontend/app/views/viewer/player/player.transcript.css +++ b/animism-align/frontend/app/views/viewer/player/player.transcript.css @@ -145,9 +145,13 @@ align-items: center; opacity: 0; cursor: pointer; - transition: opacity 0.2s; + transition: opacity 0.2s, transform 0.2s; + transform: translateZ(0); padding: 1.5rem; } +.audio-paused .not-scrollable .speaker-icon { + transform: translateZ(0) translateY(-3rem); +} .paragraph .speaker-icon { top: -1.5rem; left: -5.5rem; diff --git a/animism-align/frontend/app/views/viewer/player/player.transcript.js b/animism-align/frontend/app/views/viewer/player/player.transcript.js index 44c5bb2..fc0b3ea 100644 --- a/animism-align/frontend/app/views/viewer/player/player.transcript.js +++ b/animism-align/frontend/app/views/viewer/player/player.transcript.js @@ -58,7 +58,7 @@ class PlayerTranscript extends Component { render() { const { paragraphs, color, inlineParagraphCount } = this.props.section const className = "player-transcript " + color + " " + ( - inlineParagraphCount > 2 ? 'scrollable' : '' + inlineParagraphCount > 2 ? 'scrollable' : 'not-scrollable' ) return ( <div |