Align timestamp at top of cue in Transcripts component

[elynema]

Description

Currently, the timestamp part of the cue (provided by .vtt or .srt files in the Transcript component) seems to be center-aligned vertically. The EVIADA materials we are ingesting have extremely long .vtt cues that include long descriptions, so sometimes you have to scroll a bit to get to the timestamp.

Would it make sense to top align the timestamp, as opposed to center-aligning the timestamp vertically?

Currently, for an EVIADA example item, it looks like this:

Could the linked timecode be vertically aligned with the first line of text in the cue that starts with "Batá drums and singer"?

Done Looks Like

• The hyperlinked timestamp from the .vtt / .srt cue that displays in the Transcript component should be vertically aligned at the top of the cue text, rather there center-aligned to display in the middle of the cue text.
• Test how this change looks on more standard types of transcripts, for example for this lunchroom manners record: https://avalon-dev.dlib.indiana.edu/media_objects/rb68xb881

[joncameron]

Possible options:

• Align timecode to the top of the cue, rather than middle
• Have timecode value float next to cue so the active cue never loses the timestamp when scrolling within the transcript component

[cjcolvar]

Science History Institute example: https://digital.sciencehistory.org/works/x8peubh

[elynema]

Aviary example: https://iiif.aviaryplatform.com/player?manifest=https%3A%2F%2Fweareavp.aviaryplatform.com%2Fiiif%2Fhm52f7jz70%2Fmanifest&tab=Annotations

Here's an example of a longer annotation: