diff --git a/inject.css b/inject.css index 3d22b64..45f9522 100644 --- a/inject.css +++ b/inject.css @@ -12,7 +12,7 @@ margin: 10px; line-height: 1.8em; - cursor: pointer; + cursor: default; z-index: 9999999; opacity: 0.3; @@ -20,9 +20,6 @@ font-size: 13px; } -.tc-videoController button { -} - .tc-videoController:hover { opacity: 0.7; } @@ -37,6 +34,7 @@ } .tc-controls button { + cursor: pointer; color: black !important; background: white !important; font-weight: bold !important; @@ -47,6 +45,11 @@ line-height: 15px !important; } +.tc-videoController button.tc-hideButton { + margin: 0 2px 0 20px !important; + opacity: 0.8; +} + /* shift controller when YouTube infobar is present */ .ytp-block-autohide:not(.el-detailpage):not(.hide-info-bar) .tc-videoController { margin-top: 40px; diff --git a/inject.js b/inject.js index 55d29b4..2f2bafc 100644 --- a/inject.js +++ b/inject.js @@ -66,14 +66,18 @@ chrome.extension.sendMessage({}, function(response) { var fasterButton = document.createElement('button'); var slowerButton = document.createElement('button'); var rewindButton = document.createElement('button'); + var hideButton = document.createElement('button'); rewindButton.innerHTML = '«'; fasterButton.textContent = '+'; slowerButton.textContent = '-'; + hideButton.textContent = 'x'; + hideButton.className = 'tc-hideButton'; controls.appendChild(rewindButton); controls.appendChild(slowerButton); controls.appendChild(fasterButton); + controls.appendChild(hideButton); container.appendChild(speedIndicator); container.appendChild(controls); @@ -96,7 +100,7 @@ chrome.extension.sendMessage({}, function(response) { runAction('faster') } else if (e.target === rewindButton) { runAction('rewind') - } else { + } else if (e.target === hideButton) { container.nextSibling.classList.add('vc-cancelled') container.remove(); }