diff options
-rw-r--r-- | content.css | 43 | ||||
-rw-r--r-- | content.js | 21 | ||||
-rw-r--r-- | icons/close.png | bin | 0 -> 3614 bytes | |||
-rw-r--r-- | icons/downvote.png | bin | 5251 -> 2754 bytes | |||
-rw-r--r-- | icons/upvote.png | bin | 5484 -> 2861 bytes | |||
-rw-r--r-- | manifest.json | 1 |
6 files changed, 43 insertions, 22 deletions
diff --git a/content.css b/content.css index b6d3ceb9..5cfeca6f 100644 --- a/content.css +++ b/content.css @@ -41,8 +41,8 @@ } .sponsorSkipObject { - font-family: 'Source Sans Pro', sans-serif; - + font-family: Roboto, Arial, Helvetica, sans-serif; + margin-left: 2px; margin-right: 2px; } @@ -59,23 +59,33 @@ } .sponsorBlockSpacer { - border-color: #999999; - background-color: #999999; + background-color: rgb(100, 100, 100); + border-color: rgb(100, 100, 100); } .sponsorSkipNotice { - min-width: 300px; - background-color: rgba(0, 0, 0, 0.8); + min-width: 270px; + background-color: rgba(28, 28, 28, 0.9); position: absolute; right: 0; bottom: 100px; right: 10px; - border-radius: 10px; + border-radius: 5px; animation: fadeIn 0.5s; - border-spacing: 7px 7px; + border-spacing: 10px 10px; +} + +.sponsorSkipNoticeTimeLeft { + color: #eeeeee; + + border-radius: 4px; + padding: 2px 5px; + font-size: 12px; + + border: 1px solid #eeeeee; } /* if two are very close to eachother */ @@ -88,7 +98,7 @@ .sponsorSkipNoticeUnskipSection { float: left; - border-left: 1px solid #eeeeee; + border-left: 1px solid rgb(150, 150, 150); } .sponsorSkipNoticeRightSection { @@ -98,15 +108,19 @@ float: right; } -.sponsorSkipNoticeCloseButton { - margin-left: 0px; - margin-right: 0px; +.sponsorSkipNoticeRightButton { + margin-left: 7px !important; padding: 0px; } +.sponsorSkipNoticeCloseButton { + height: 10px; + width: 10px; +} + .sponsorSkipNoticeButton { background: none; - color: #ffffff; + color: rgb(235, 235, 235); border: none; display: inline-block; @@ -119,7 +133,7 @@ .sponsorSkipMessage { font-size: 14px; font-weight: bold; - color: #ffffff; + color: rgb(235, 235, 235); display: inline-block; } @@ -159,7 +173,6 @@ height: 18px; cursor: pointer; - margin-left: 10px; margin-right: 10px; } .voteButton:hover { @@ -901,7 +901,7 @@ function openSkipNotice(UUID){ noticeMessage.id = "sponsorSkipMessage" + UUID; noticeMessage.classList.add("sponsorSkipMessage"); noticeMessage.classList.add("sponsorSkipObject"); - noticeMessage.innerText = "SponsorBlock - Sponsor Skipped"; + noticeMessage.innerText = "Sponsor Skipped"; //create the first column logoColumn.appendChild(logoElement); @@ -909,13 +909,19 @@ function openSkipNotice(UUID){ //add the x button let closeButtonContainer = document.createElement("td"); - closeButtonContainer.className = "sponsorSkipNoticeRightSection" + closeButtonContainer.className = "sponsorSkipNoticeRightSection"; + closeButtonContainer.style.top = "11px"; - let hideButton = document.createElement("button"); - hideButton.innerText = "X"; - hideButton.className = "sponsorSkipNoticeButton sponsorSkipNoticeCloseButton"; + let timeLeft = document.createElement("span"); + timeLeft.innerText = "closing in 7s"; + timeLeft.className = "sponsorSkipObject sponsorSkipNoticeTimeLeft"; + + let hideButton = document.createElement("img"); + hideButton.src = chrome.extension.getURL("icons/close.png"); + hideButton.className = "sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeCloseButton sponsorSkipNoticeRightButton"; hideButton.addEventListener("click", () => closeSkipNotice(UUID)); + closeButtonContainer.appendChild(timeLeft); closeButtonContainer.appendChild(hideButton); //add all objects to first row @@ -954,7 +960,7 @@ function openSkipNotice(UUID){ let unskipButton = document.createElement("button"); unskipButton.innerText = chrome.i18n.getMessage("goBack"); - unskipButton.className = "sponsorSkipNoticeButton"; + unskipButton.className = "sponsorSkipObject sponsorSkipNoticeButton"; unskipButton.addEventListener("click", () => goBackToPreviousTime(UUID)); unskipContainer.appendChild(unskipButton); @@ -962,10 +968,11 @@ function openSkipNotice(UUID){ //add don't show again button let dontshowContainer = document.createElement("td"); dontshowContainer.className = "sponsorSkipNoticeRightSection"; + dontshowContainer.style.bottom = "14px"; let dontShowAgainButton = document.createElement("button"); dontShowAgainButton.innerText = chrome.i18n.getMessage("Hide"); - dontShowAgainButton.className = "sponsorSkipNoticeButton sponsorSkipNoticeCloseButton"; + dontShowAgainButton.className = "sponsorSkipObject sponsorSkipNoticeButton sponsorSkipNoticeRightButton"; dontShowAgainButton.addEventListener("click", dontShowNoticeAgain); dontshowContainer.appendChild(dontShowAgainButton); diff --git a/icons/close.png b/icons/close.png Binary files differnew file mode 100644 index 00000000..1b28870f --- /dev/null +++ b/icons/close.png diff --git a/icons/downvote.png b/icons/downvote.png Binary files differindex 7d6036e6..0fbc0681 100644 --- a/icons/downvote.png +++ b/icons/downvote.png diff --git a/icons/upvote.png b/icons/upvote.png Binary files differindex 30023f95..0af212d1 100644 --- a/icons/upvote.png +++ b/icons/upvote.png diff --git a/manifest.json b/manifest.json index 90cdaad3..91388a7d 100644 --- a/manifest.json +++ b/manifest.json @@ -33,6 +33,7 @@ "icons/PlayerUploadFailedIconSponsorBlocker256px.png", "icons/upvote.png", "icons/downvote.png", + "icons/close.png", "icons/PlayerInfoIconSponsorBlocker256px.png", "icons/PlayerDeleteIconSponsorBlocker256px.png", "popup.html" |