diff options
| author | glmdgrielson <localhost.localdomain> | 2019-01-20 18:28:28 -0500 |
|---|---|---|
| committer | Omar Roth <omarroth@protonmail.com> | 2019-04-30 21:19:13 -0500 |
| commit | e48a000784f685ebfca75fcfc7c06c700839d6f1 (patch) | |
| tree | 375bd3bbfce4cd2a8df101a4efda96b88118c445 /assets/css/videojs-youtube-annotations.css | |
| parent | 6d1c150ff5fbc0f69d29f05a6067b7d29378fb80 (diff) | |
| download | invidious-e48a000784f685ebfca75fcfc7c06c700839d6f1.tar.gz invidious-e48a000784f685ebfca75fcfc7c06c700839d6f1.tar.bz2 invidious-e48a000784f685ebfca75fcfc7c06c700839d6f1.zip | |
Add annotation player
This addresses issue #110 from master. Yay for adding annotations back!
Diffstat (limited to 'assets/css/videojs-youtube-annotations.css')
| -rw-r--r-- | assets/css/videojs-youtube-annotations.css | 81 |
1 files changed, 81 insertions, 0 deletions
diff --git a/assets/css/videojs-youtube-annotations.css b/assets/css/videojs-youtube-annotations.css new file mode 100644 index 00000000..3ca4e46d --- /dev/null +++ b/assets/css/videojs-youtube-annotations.css @@ -0,0 +1,81 @@ +.__cxt-ar-annotations-container__ { + --annotation-close-size: 20px; + + position: absolute; + + width: 100%; + height: 100%; + + top: 0px; + left: 0px; + + pointer-events: none; + overflow: hidden; +} + +.__cxt-ar-annotation__ { + position: absolute; + + box-sizing: border-box; + + font-family: Arial, sans-serif; + color: white; + + z-index: 20; +} + +.__cxt-ar-annotation__ { + pointer-events: auto; +} + +.__cxt-ar-annotation__ span { + position: absolute; + left: 0; + top: 0; + overflow: hidden; + word-wrap: break-word; + white-space: pre-wrap; + + pointer-events: none; + box-sizing: border-box; + + padding: 2%; + + user-select: none; + -webkit-user-select: none; /* Chrome all / Safari all */ + -moz-user-select: none; /* Firefox all */ + -ms-user-select: none; /* IE 10+ */ +} + +.__cxt-ar-annotation-close__ { + display: none; + position: absolute; + width: var(--annotation-close-size); + height: var(--annotation-close-size); + + cursor: pointer; + + right: calc(var(--annotation-close-size) / -1.8); + top: calc(var(--annotation-close-size) / -1.8); + /* place the close button above the svg */ + z-index: 1; +} +.__cxt-ar-annotation__:hover:not([hidden]):not([data-ar-closed]) .__cxt-ar-annotation-close__ { + display: block; +} +.__cxt-ar-annotation__[hidden] { + display: none !important; +} + +.__cxt-ar-annotation__[data-ar-type="highlight"] { + border: 1px solid rgba(255, 255, 255, 0.10); + background-color: transparent; +} +.__cxt-ar-annotation__[data-ar-type="highlight"]:hover { + border: 1px solid rgba(255, 255, 255, 0.50); + background-color: transparent; +} + +.__cxt-ar-annotation__ svg { + pointer-events: all; +}
\ No newline at end of file |
