mirror of
https://github.com/PR0M3TH3AN/bitvid.git
synced 2026-10-27 07:52:24 +00:00
thePR0M3TH3ANandClaude Fable 5
cbe894969d
The zap-totals store's pointerKey only understood {type,value} objects, but
deriveVideoPointerInfo produces tag-style ARRAYS (["a", value, relay?]) — so
every card-badge lookup keyed to nothing, no receipt fetch was ever
scheduled, and the Most Zapped ranking metric silently read 0 for every
video. pointerKey now normalizes both shapes; tests use the array shape the
app actually passes.
Also adds the orange sats badge to the video player modal's meta row
(right side via the row's existing justify-between; views stay left),
driven by the same cache/change-signal as the cards and torn down with the
view-count subscription.
Co-Authored-By: Claude Fable 5 <[email protected]>
699 lines
29 KiB
HTML
699 lines
29 KiB
HTML
<!-- components/video-modal.html -->
|
||
<div
|
||
id="playerModal"
|
||
class="bv-modal hidden"
|
||
role="dialog"
|
||
aria-modal="true"
|
||
data-ds="new"
|
||
data-testid="video-modal"
|
||
hidden
|
||
>
|
||
<div class="bv-modal-backdrop" data-dismiss></div>
|
||
<div class="bv-modal__panel" tabindex="-1">
|
||
<div class="player-modal__container video-modal__container">
|
||
<div id="modalNav" class="modal-nav modal-nav--visible">
|
||
<div class="watch-container modal-nav__bar">
|
||
<div class="modal-nav__rail">
|
||
<div class="modal-nav__slot modal-nav__slot--primary">
|
||
<div class="modal-actions">
|
||
<button
|
||
id="closeModal"
|
||
type="button"
|
||
class="icon-button focus-ring accent-action-button"
|
||
>
|
||
<svg
|
||
xmlns="http://www.w3.org/2000/svg"
|
||
width="24"
|
||
height="24"
|
||
viewBox="0 0 24 24"
|
||
fill="none"
|
||
stroke="currentColor"
|
||
stroke-width="2"
|
||
stroke-linecap="round"
|
||
stroke-linejoin="round"
|
||
class="h-5 w-5"
|
||
aria-hidden="true"
|
||
>
|
||
<path d="M15 18l-6-6 6-6" />
|
||
</svg>
|
||
<span class="sr-only">Close player</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="modal-nav__slot modal-nav__slot--context"
|
||
data-modal-nav-context
|
||
>
|
||
<div id="modalNavContext" class="modal-nav__context" hidden></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="player-modal__content video-modal__panel flex flex-col gap-6">
|
||
<div class="video-modal__layout">
|
||
<div class="video-modal__primary flex flex-col gap-6">
|
||
<div class="watch-container video-modal__stage">
|
||
<div class="video-modal__ambient" aria-hidden="true">
|
||
<canvas
|
||
id="ambientCanvas"
|
||
class="video-modal__ambient-canvas"
|
||
></canvas>
|
||
</div>
|
||
<div
|
||
class="video-modal__moderation-bar"
|
||
data-moderation-bar
|
||
hidden
|
||
>
|
||
<div
|
||
class="moderation-badge"
|
||
data-moderation-badge="true"
|
||
data-variant="warning"
|
||
role="status"
|
||
aria-live="polite"
|
||
aria-atomic="true"
|
||
>
|
||
<span class="moderation-badge__label inline-flex items-center gap-xs">
|
||
<span class="moderation-badge__icon" aria-hidden="true">
|
||
<svg
|
||
class="moderation-badge__icon-mark"
|
||
viewBox="0 0 20 20"
|
||
focusable="false"
|
||
aria-hidden="true"
|
||
>
|
||
<path
|
||
fill="currentColor"
|
||
d="M10 18a8 8 0 100-16 8 8 0 000 16zm-.75-11.75a.75.75 0 011.5 0v4.5a.75.75 0 01-1.5 0v-4.5zm.75 8.5a1 1 0 100-2 1 1 0 000 2z"
|
||
fill-rule="evenodd"
|
||
clip-rule="evenodd"
|
||
/>
|
||
</svg>
|
||
</span>
|
||
<span
|
||
class="moderation-badge__text"
|
||
data-moderation-text
|
||
>
|
||
Content or user blocked by a trusted contact.
|
||
</span>
|
||
</span>
|
||
<div
|
||
class="moderation-badge__actions"
|
||
data-moderation-actions
|
||
>
|
||
<button
|
||
type="button"
|
||
class="moderation-badge__action flex-shrink-0"
|
||
data-moderation-action="override"
|
||
aria-pressed="false"
|
||
aria-label="Show anyway"
|
||
>
|
||
Show anyway
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video-modal__video" data-video-surface>
|
||
<video
|
||
id="modalVideo"
|
||
class="video-modal__media"
|
||
controls
|
||
></video>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="video-modal__source-toggle-container watch-container" data-source-toggle-container hidden>
|
||
<div class="inline-flex rounded-lg bg-overlay-panel-soft p-1">
|
||
<button
|
||
type="button"
|
||
class="px-3 py-1.5 text-xs font-medium rounded-md transition-colors focus-ring"
|
||
data-source-toggle="url"
|
||
aria-pressed="true"
|
||
>
|
||
<span class="flex items-center gap-2">
|
||
<span>CDN</span>
|
||
<span class="text-xs opacity-70" data-active-servers-count>1 server</span>
|
||
</span>
|
||
</button>
|
||
<button
|
||
type="button"
|
||
class="px-3 py-1.5 text-xs font-medium rounded-md transition-colors focus-ring"
|
||
data-source-toggle="torrent"
|
||
aria-pressed="false"
|
||
>
|
||
<span class="flex items-center gap-2">
|
||
<span>P2P</span>
|
||
<span class="text-xs opacity-70" data-active-peers-count>0 peers</span>
|
||
</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
class="watch-container"
|
||
data-video-stats-container
|
||
hidden
|
||
>
|
||
<div
|
||
class="video-modal__stats rounded-2xl border border-border border-opacity-20 bg-surface px-6 py-5 shadow-sm"
|
||
data-video-stats
|
||
>
|
||
<div class="video-modal__progress">
|
||
<progress
|
||
id="modalProgress"
|
||
class="progress"
|
||
max="100"
|
||
value="0"
|
||
data-variant="accent"
|
||
aria-label="Download progress"
|
||
></progress>
|
||
<p
|
||
id="modalProgressStatus"
|
||
class="sr-only"
|
||
role="status"
|
||
aria-live="polite"
|
||
></p>
|
||
</div>
|
||
<div class="video-modal__stat-metrics flex flex-wrap items-center justify-between gap-3 text-sm text-muted">
|
||
<span id="modalPeers">Peers: 0</span>
|
||
<span id="modalSpeed">Speed: 0 KB/s</span>
|
||
<span id="modalDownloaded">Downloaded: 0 MB / 0 MB</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="watch-container">
|
||
<div class="modal-info-panel">
|
||
<div class="video-modal__details flex flex-col gap-6">
|
||
<div
|
||
class="video-modal__headline flex flex-col gap-3 lg:flex-row lg:flex-wrap lg:items-start lg:justify-between"
|
||
>
|
||
<h2 id="videoTitle" class="video-modal__title"></h2>
|
||
<div
|
||
id="modalStatus"
|
||
class="video-modal__status text-sm text-muted lg:text-right lg:ml-auto"
|
||
role="status"
|
||
aria-live="polite"
|
||
>
|
||
Initializing... Just give it a sec.
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="video-modal__meta flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between"
|
||
>
|
||
<div class="video-modal__meta-info flex flex-wrap items-center gap-3">
|
||
<span id="videoTimestamp" class="modal-meta">Posted just now</span>
|
||
<span id="videoEditedTimestamp" class="modal-meta hidden">Last edited just now</span>
|
||
<span id="videoViewCount" class="modal-meta modal-view-count flex items-center gap-1.5" title="Views">
|
||
<svg viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
|
||
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
|
||
<circle cx="12" cy="12" r="3"></circle>
|
||
</svg>
|
||
<span data-view-count-text>–</span>
|
||
</span>
|
||
</div>
|
||
<span
|
||
id="videoZapTotal"
|
||
class="modal-meta video-modal__zaps flex items-center gap-1.5 hidden"
|
||
title="Zap total (sats)"
|
||
>
|
||
<svg viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
|
||
<polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"></polygon>
|
||
</svg>
|
||
<span data-zap-total-text></span>
|
||
</span>
|
||
</div>
|
||
|
||
<div class="video-modal__actions-row">
|
||
<div class="video-modal__reactions">
|
||
<div class="video-modal__reaction-buttons inline-flex flex-wrap items-center gap-2">
|
||
<button
|
||
id="modalLikeBtn"
|
||
type="button"
|
||
class="video-modal__action-button video-modal__reaction-button focus-ring accent-action-button"
|
||
data-reaction="+"
|
||
aria-pressed="false"
|
||
aria-label="Like this video"
|
||
>
|
||
<svg
|
||
class="video-modal__action-icon icon-image"
|
||
viewBox="0 0 24 24"
|
||
aria-hidden="true"
|
||
focusable="false"
|
||
>
|
||
<path
|
||
fill="none"
|
||
stroke="currentColor"
|
||
stroke-width="1.5"
|
||
stroke-linecap="round"
|
||
stroke-linejoin="round"
|
||
d="M7 10v12H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2Z"
|
||
/>
|
||
<path
|
||
fill="none"
|
||
stroke="currentColor"
|
||
stroke-width="1.5"
|
||
stroke-linecap="round"
|
||
stroke-linejoin="round"
|
||
d="M7 10 11.34 2.67A2 2 0 0 1 13.14 2H14a2 2 0 0 1 2 2v4h3.37a2 2 0 0 1 1.97 2.5l-1.1 5A2 2 0 0 1 18.3 18H11"
|
||
/>
|
||
</svg>
|
||
<span class="video-modal__action-label">Like</span>
|
||
<span class="video-modal__reaction-count" data-reaction-like-count>0</span>
|
||
</button>
|
||
<button
|
||
id="modalDislikeBtn"
|
||
type="button"
|
||
class="video-modal__action-button video-modal__reaction-button focus-ring accent-action-button"
|
||
data-reaction="-"
|
||
aria-pressed="false"
|
||
aria-label="Dislike this video"
|
||
>
|
||
<svg
|
||
class="video-modal__action-icon icon-image"
|
||
viewBox="0 0 24 24"
|
||
aria-hidden="true"
|
||
focusable="false"
|
||
>
|
||
<path
|
||
fill="none"
|
||
stroke="currentColor"
|
||
stroke-width="1.5"
|
||
stroke-linecap="round"
|
||
stroke-linejoin="round"
|
||
d="M17 14V2h3a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2Z"
|
||
/>
|
||
<path
|
||
fill="none"
|
||
stroke="currentColor"
|
||
stroke-width="1.5"
|
||
stroke-linecap="round"
|
||
stroke-linejoin="round"
|
||
d="M17 14 12.66 21.33A2 2 0 0 1 10.86 22H10a2 2 0 0 1-2-2v-4H4.63a2 2 0 0 1-1.97-2.5l1.1-5A2 2 0 0 1 4.73 8H13"
|
||
/>
|
||
</svg>
|
||
<span class="video-modal__action-label">Dislike</span>
|
||
<span class="video-modal__reaction-count" data-reaction-dislike-count>0</span>
|
||
</button>
|
||
</div>
|
||
<div
|
||
class="video-modal__reaction-meter"
|
||
data-reaction-meter
|
||
role="meter"
|
||
aria-valuemin="0"
|
||
aria-valuemax="100"
|
||
aria-valuenow="0"
|
||
aria-valuetext="No reactions yet"
|
||
>
|
||
<span class="video-modal__reaction-meter-label" data-reaction-meter-label>No reactions yet</span>
|
||
<div class="video-modal__reaction-meter-track" aria-hidden="true">
|
||
<div
|
||
class="video-modal__reaction-meter-fill video-modal__reaction-meter-fill--empty"
|
||
data-reaction-meter-fill
|
||
></div>
|
||
</div>
|
||
<span class="sr-only" data-reaction-meter-sr>No reactions yet</span>
|
||
</div>
|
||
</div>
|
||
<div class="video-modal__actions-group">
|
||
<div class="popover" data-modal-zap-wrapper>
|
||
<button
|
||
id="modalZapBtn"
|
||
type="button"
|
||
class="video-modal__action-button focus-ring accent-action-button"
|
||
aria-label="Send a zap"
|
||
aria-haspopup="dialog"
|
||
aria-expanded="false"
|
||
aria-controls="modalZapDialog"
|
||
>
|
||
<svg
|
||
class="video-modal__action-icon icon-image"
|
||
viewBox="0 0 24 24"
|
||
aria-hidden="true"
|
||
focusable="false"
|
||
>
|
||
<polygon
|
||
points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"
|
||
fill="none"
|
||
stroke="currentColor"
|
||
stroke-width="2"
|
||
stroke-linecap="round"
|
||
stroke-linejoin="round"
|
||
/>
|
||
</svg>
|
||
<span class="video-modal__action-label">Zap</span>
|
||
</button>
|
||
<div
|
||
id="modalZapDialog"
|
||
class="popover__panel card w-72 max-w-popover-safe px-5 py-4"
|
||
data-variant="zap"
|
||
role="dialog"
|
||
aria-hidden="true"
|
||
data-state="closed"
|
||
hidden
|
||
>
|
||
<div class="grid gap-4">
|
||
<div class="mb-4 flex items-center justify-between gap-4">
|
||
<h3 class="text-xs font-semibold uppercase tracking-wide text-muted">
|
||
Send a zap
|
||
</h3>
|
||
<button
|
||
type="button"
|
||
id="modalZapCloseBtn"
|
||
class="focus-ring inline-flex h-8 w-8 items-center justify-center rounded-full text-muted transition hover:text-text"
|
||
aria-label="Close zap dialog"
|
||
>
|
||
✕
|
||
</button>
|
||
</div>
|
||
<p
|
||
id="modalZapWalletPrompt"
|
||
class="mb-3 text-sm text-muted"
|
||
aria-hidden="true"
|
||
hidden
|
||
>
|
||
Connect a wallet in
|
||
<button
|
||
type="button"
|
||
id="modalZapWalletLink"
|
||
class="focus-ring inline-flex items-center gap-1 text-sm font-semibold text-info underline decoration-dotted underline-offset-2 hover:text-info-strong"
|
||
>
|
||
Wallet Connect settings
|
||
</button>
|
||
to send zaps.
|
||
</p>
|
||
<form id="modalZapForm" class="space-y-4">
|
||
<div class="space-y-2">
|
||
<label
|
||
for="modalZapAmountInput"
|
||
class="text-xs font-semibold uppercase tracking-wide text-muted"
|
||
>
|
||
Zap amount (sats)
|
||
</label>
|
||
<input
|
||
id="modalZapAmountInput"
|
||
type="number"
|
||
min="1"
|
||
step="1"
|
||
inputmode="numeric"
|
||
class="input"
|
||
placeholder="Enter sats"
|
||
/>
|
||
</div>
|
||
<div class="space-y-2">
|
||
<label
|
||
for="modalZapCommentInput"
|
||
class="text-xs font-semibold uppercase tracking-wide text-muted"
|
||
>
|
||
Comment (optional)
|
||
</label>
|
||
<textarea
|
||
id="modalZapCommentInput"
|
||
rows="2"
|
||
maxlength="280"
|
||
class="input resize-y"
|
||
placeholder="Include a note with your zap"
|
||
></textarea>
|
||
</div>
|
||
<p
|
||
id="modalZapSplitSummary"
|
||
class="text-sm text-muted"
|
||
aria-live="polite"
|
||
>
|
||
Enter an amount to view the split.
|
||
</p>
|
||
<p
|
||
id="modalZapStatus"
|
||
class="text-xs text-muted"
|
||
role="status"
|
||
aria-live="polite"
|
||
></p>
|
||
<ul
|
||
id="modalZapReceipts"
|
||
class="space-y-2 text-xs text-muted"
|
||
></ul>
|
||
<div class="flex items-center justify-end gap-2">
|
||
<button
|
||
type="submit"
|
||
id="modalZapSendBtn"
|
||
class="btn"
|
||
>
|
||
Send
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<button
|
||
id="shareBtn"
|
||
type="button"
|
||
class="video-modal__action-button focus-ring accent-action-button"
|
||
aria-label="Share video"
|
||
>
|
||
<svg
|
||
class="video-modal__action-icon icon-image"
|
||
viewBox="0 0 24 24"
|
||
aria-hidden="true"
|
||
focusable="false"
|
||
>
|
||
<path
|
||
fill="currentColor"
|
||
d="M5 7a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm11.122 12.065A4 4 0 1 1 24 20a4 4 0 0 1-7.878-.935l-5.488-2.927a6.009 6.009 0 0 1-.943 1.764l5.488 2.927ZM24 4a4 4 0 1 1-7.878.935l-5.488 2.927a6.01 6.01 0 0 1-.943-1.764l5.488-2.927A4 4 0 0 1 24 4Z"
|
||
/>
|
||
</svg>
|
||
<span class="video-modal__action-label">Share</span>
|
||
</button>
|
||
<button
|
||
id="embedBtn"
|
||
type="button"
|
||
class="video-modal__action-button focus-ring accent-action-button"
|
||
aria-label="Embed video"
|
||
>
|
||
<svg
|
||
class="video-modal__action-icon icon-image"
|
||
viewBox="0 0 24 24"
|
||
aria-hidden="true"
|
||
focusable="false"
|
||
>
|
||
<path
|
||
fill="currentColor"
|
||
d="M9.4 16.4 5 12l4.4-4.4-1.4-1.4L2.2 12l5.8 5.8 1.4-1.4Zm5.2 0L19 12l-4.4-4.4 1.4-1.4 5.8 5.8-5.8 5.8-1.4-1.4Z"
|
||
/>
|
||
</svg>
|
||
<span class="video-modal__action-label">Embed</span>
|
||
</button>
|
||
<div class="relative" data-more-menu-wrapper="true">
|
||
<button
|
||
id="modalMoreBtn"
|
||
type="button"
|
||
class="video-modal__action-button focus-ring accent-action-button"
|
||
aria-haspopup="true"
|
||
aria-expanded="false"
|
||
aria-label="More actions"
|
||
data-more-dropdown="modal"
|
||
>
|
||
<svg
|
||
class="video-modal__action-icon icon-image"
|
||
viewBox="0 0 24 24"
|
||
aria-hidden="true"
|
||
focusable="false"
|
||
>
|
||
<circle cx="5" cy="12" r="2" fill="currentColor" />
|
||
<circle cx="12" cy="12" r="2" fill="currentColor" />
|
||
<circle cx="19" cy="12" r="2" fill="currentColor" />
|
||
</svg>
|
||
<span class="video-modal__action-label">More</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="channel-card">
|
||
<div class="channel-card__avatar">
|
||
<img
|
||
id="creatorAvatar"
|
||
src=""
|
||
alt="Creator"
|
||
loading="lazy"
|
||
decoding="async"
|
||
class="h-full w-full rounded-full object-cover cursor-pointer"
|
||
/>
|
||
</div>
|
||
<div class="flex flex-col gap-1">
|
||
<h3 id="creatorName" class="channel-card__name cursor-pointer">
|
||
Creator Name
|
||
</h3>
|
||
<p id="creatorNpub" class="channel-card__npub">npub...</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="description-panel">
|
||
<p
|
||
id="videoDescription"
|
||
class="video-modal__description-body whitespace-pre-wrap"
|
||
>
|
||
No description available.
|
||
</p>
|
||
<div
|
||
id="videoDescriptionPreviews"
|
||
class="mt-4 space-y-3"
|
||
data-link-previews
|
||
hidden
|
||
></div>
|
||
</div>
|
||
|
||
<div
|
||
class="comment-thread__disabled"
|
||
data-comments-disabled-placeholder
|
||
role="status"
|
||
aria-live="polite"
|
||
hidden
|
||
>
|
||
Comments have been turned off for this video.
|
||
</div>
|
||
|
||
<section
|
||
class="video-modal__comments comment-thread"
|
||
aria-labelledby="videoModalCommentsHeading"
|
||
role="region"
|
||
data-comments-root
|
||
>
|
||
<div class="comment-thread__header">
|
||
<h2
|
||
id="videoModalCommentsHeading"
|
||
class="comment-thread__title"
|
||
>
|
||
Comments
|
||
</h2>
|
||
<p
|
||
class="comment-thread__count"
|
||
data-comments-count
|
||
aria-live="polite"
|
||
>
|
||
0 comments
|
||
</p>
|
||
</div>
|
||
|
||
<p
|
||
class="comment-thread__empty"
|
||
data-comments-empty
|
||
role="status"
|
||
aria-live="polite"
|
||
>
|
||
No comments yet. Be the first to share your thoughts.
|
||
</p>
|
||
|
||
<ol
|
||
class="comment-thread__list"
|
||
data-comments-list
|
||
role="list"
|
||
aria-live="polite"
|
||
></ol>
|
||
|
||
<button
|
||
type="button"
|
||
class="comment-thread__load-more focus-ring"
|
||
data-comments-load-more
|
||
hidden
|
||
>
|
||
Load more comments
|
||
</button>
|
||
|
||
<form
|
||
class="comment-composer"
|
||
data-comments-composer
|
||
aria-labelledby="videoModalCommentsHeading"
|
||
novalidate
|
||
>
|
||
<div class="comment-composer__field">
|
||
<label
|
||
for="commentComposerInput"
|
||
class="comment-composer__label"
|
||
>
|
||
Add a comment
|
||
</label>
|
||
<textarea
|
||
id="commentComposerInput"
|
||
name="comment"
|
||
class="textarea comment-composer__textarea"
|
||
rows="3"
|
||
maxlength="500"
|
||
placeholder="Share your thoughts"
|
||
aria-describedby="commentComposerHelp commentComposerCount"
|
||
data-comments-input
|
||
required
|
||
></textarea>
|
||
</div>
|
||
|
||
<div class="comment-composer__footer">
|
||
<p
|
||
id="commentComposerHelp"
|
||
class="comment-composer__hint"
|
||
>
|
||
Keep it respectful and follow the community guidelines.
|
||
</p>
|
||
<div class="comment-composer__actions">
|
||
<p
|
||
id="commentComposerCount"
|
||
class="comment-composer__char-count"
|
||
data-comments-char-count
|
||
aria-live="polite"
|
||
>
|
||
0 / 500
|
||
</p>
|
||
<button
|
||
type="submit"
|
||
class="comment-composer__submit btn"
|
||
data-comments-submit
|
||
disabled
|
||
>
|
||
Post
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<p
|
||
class="comment-composer__status sr-only"
|
||
data-comments-status
|
||
role="status"
|
||
aria-live="polite"
|
||
></p>
|
||
</form>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<aside class="video-modal__secondary flex flex-col gap-4">
|
||
<div class="watch-container video-modal__similar">
|
||
<div
|
||
id="videoTags"
|
||
class="video-modal__tags"
|
||
hidden
|
||
aria-hidden="true"
|
||
></div>
|
||
<section
|
||
class="player-modal__module"
|
||
aria-labelledby="playerModalSimilarContentHeading"
|
||
>
|
||
<h2
|
||
id="playerModalSimilarContentHeading"
|
||
class="player-modal__module-title"
|
||
>
|
||
Similar Content
|
||
</h2>
|
||
<ul
|
||
id="playerModalSimilarContentList"
|
||
class="player-modal__module-list player-modal__module-scroll"
|
||
role="list"
|
||
></ul>
|
||
</section>
|
||
</div>
|
||
|
||
</aside>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|