external/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2024-11-10 09:07:45 +01:00
Code Issues Projects Releases Packages Wiki Activity
SponsorBlock/public/popup.html
Nikita Krupin e4dd0f1ac6 popup styling requested adjustments
2022-05-02 21:22:25 -04:00

170 lines
8.2 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html id="sponsorBlockPopupHTML">
<head>
<meta charset="utf-8" />
<title>__MSG_openPopup__</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link id="sponsorBlockPopupFont" href="/libs/Source+Sans+Pro.css" rel="stylesheet">
<link id="sponsorBlockStyleSheet" href="popup.css" rel="stylesheet">
</head>
<body id="sponsorBlockPopupBody">
<div id="sponsorblockPopup" class="sponsorBlockPageBody sb-preload">
<div id="sbBetaServerWarning" class="hidden" title="__MSG_openOptionsPage__">
__MSG_betaServerWarning__
</div>
<header class="sbPopupLogo">
<img src="icons/IconSponsorBlocker256px.png" alt="SponsorBlock" width="40" height="40" id="sponsorBlockPopupLogo">
<p class="u-mZ" style="margin: auto;">SponsorBlock</p>
</header>
<div id="videoInfo">
<!-- Loading text -->
<p id="loadingIndicator" class="u-mZ grey-text">__MSG_noVideoID__</p>
<!-- If the video was found in the database -->
<p id="videoFound" class="u-mZ grey-text"></p>
<button id="refreshSegmentsButton" title="__MSG_refreshSegments__">
<img src="/icons/refresh.svg" alt="Refresh icon" id="refreshSegments" />
</button>
<div id="issueReporterContainer">
<div id="issueReporterTimeButtons"></div>
</div>
</div>
<div class="sbControlsMenu">
<label id="whitelistButton" for="whitelistToggle" class="hidden sbControlsMenu-item">
<input type="checkbox" style="display:none;" id="whitelistToggle">
<svg viewBox="0 0 24 24" width="23" height="23" class="SBWhitelistIcon sbControlsMenu-itemIcon">
<path d="M24 10H14V0h-4v10H0v4h10v10h4V14h10z" />
</svg>
<span id="whitelistChannel">__MSG_whitelistChannel__</span>
<span id="unwhitelistChannel" style="display: none">__MSG_removeFromWhitelist__</span>
</label>
<!--github: mbledkowski/toggle-switch-->
<label id="disableExtension" for="toggleSwitch" class="toggleSwitchContainer sbControlsMenu-item">
<span class="toggleSwitchContainer-switch">
<input type="checkbox" style="display:none;" id="toggleSwitch" checked>
<span class="switchBg shadow"></span>
<span class="switchBg white"></span>
<span class="switchBg green"></span>
<span class="switchDot"></span>
</span>
<span id="disableSkipping">__MSG_disableSkipping__</span>
<span id="enableSkipping" style="display: none">__MSG_enableSkipping__</span>
</label>
<button id="optionsButton" data-hover="__MSG_Options__" title="__MSG_OptionsInfo__">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M24 13.6v-3.2c-1.7-.6-2.7-.8-3.2-2h0c-.5-1.3.1-2.1.8-3.7l-2.3-2.3c-1.6.7-2.4 1.4-3.7.8h0c-1.3-.5-1.4-1.6-2-3.2h-3.2c-.6 1.6-.7 2.7-2 3.2h0c-1.3.5-2.1-.1-3.7-.8L2.4 4.7c.7 1.6 1.4 2.4.8 3.7s-1.6 1.4-3.2 2v3.2c1.6.6 2.7.7 3.2 2 .5 1.3-.1 2.2-.8 3.7l2.3 2.3c1.6-.7 2.4-1.4 3.7-.8h0c1.3.5 1.4 1.6 2 3.2h3.2c.6-1.6.8-2.7 2-3.2h0c1.3-.5 2.1.1 3.7.9l2.3-2.3c-.7-1.6-1.4-2.4-.8-3.7s1.6-1.4 3.2-2zM12 16a4 4 0 1 1 0-8 4 4 0 1 1 0 8z"/></svg>
</button>
</div>
<a id="whitelistForceCheck" class="hidden">
__MSG_forceChannelCheckPopup__
</a>
<div id="mainControls" style="display: none">
<p class="sbHeader">
__MSG_recordTimesDescription__
</p>
<sub class="sponsorStartHint grey-text">__MSG_popupHint__</sub>
<div align="center" style="margin: 8px 0;">
<button id="sponsorStart" class="sbMediumButton" style="margin-right: 8px">__MSG_sponsorStart__</button>
<button id="submitTimes" class="sbMediumButton" style="display: none; margin: 0 !important;">__MSG_submitTimesButton__</button>
</div>
<span id="submissionHint" style="display: none;">__MSG_submissionEditHint__</span>
</div>
<!-- Your Work -->
<details class="sbYourWorkCols">
<summary class="recordingSubtitle sbHeader" style="padding: 8px 16px; cursor: pointer;">&nbsp;&nbsp;__MSG_yourWork__</summary>
<div>
<!-- Username -->
<div id="usernameElement">
<div>
<span class="u-mZ grey-text">__MSG_Username__:
<!-- loading/errors -->
<span id="setUsernameStatusContainer" style="display: none">
<span id="setUsernameStatus" class="u-mZ white-text"></span>
</span>
</span>
<div id="setUsernameContainer">
<p id="usernameValue"></p>
<button id="setUsernameButton" title="__MSG_setUsername__">
<img src="/icons/pencil.svg" alt="__MSG_setUsername__" width="16" height="16" id="sbPopupIconEdit">
</button>
<button id="copyUserID" title="__MSG_copyPublicID__">
<img src="/icons/clipboard.svg" alt="__MSG_copyPublicID__" width="16" height="16" id="sbPopupIconCopyUserID">
</button>
</div>
<div id="setUsername" style="display: none">
<input id="usernameInput" placeholder="Username">
<button id="submitUsername">
<img src="/icons/check.svg" alt="__MSG_setUsername__" width="16" height="16" id="sbPopupIconCheck">
</button>
</div>
</div>
</div>
<!-- Submissions -->
<div id="sponsorTimesContributionsContainer" class="hidden">
<div>
<p class="u-mZ grey-text">__MSG_Submissions__:</p>
<span id="sponsorTimesContributionsDisplay">
0
</span>
</div>
</div>
</div>
</details>
<p id="sponsorTimesViewsContainer" style="display: none" class="u-mZ">
__MSG_savedPeopleFrom__
<b><span id="sponsorTimesViewsDisplay">
0
</span></b>
<span id="sponsorTimesViewsDisplayEndWord">__MSG_Segments__</span>
<br>
(<b><span id="sponsorTimesOthersTimeSavedDisplay">0</span>
<span id="sponsorTimesOthersTimeSavedEndWord">__MSG_minsLower__</span></b>
<span>__MSG_youHaveSavedTimeEnd__</span>).
</p>
<p id="sponsorTimesSkipsDoneContainer" style="display: none" class="u-mZ">
__MSG_youHaveSkipped__
<b><span id="sponsorTimesSkipsDoneDisplay">
0
</span></b>
<span id="sponsorTimesSkipsDoneEndWord">__MSG_Segments__</span>
(<b><span id="sponsorTimeSavedDisplay">
0
</span>
<span id="sponsorTimeSavedEndWord">__MSG_minsLower__</span></b>).
</p>
<footer id="sbFooter">
<div id="sponsorTimesDonateContainer" style="display: none; align-items: center; justify-content: center;">
<img class="sbHeart" src="/icons/heart.svg" alt="Heart icon" />
<a id="sbConsiderDonateLink" href="https://sponsor.ajay.app/donate" target="_blank" rel="noopener">
__MSG_considerDonating__
</a>
<img id="sbCloseDonate" src="/icons/close.png" alt="Close icon" height="8" style="padding-left: 5px; cursor: pointer;" />
</div>
<a id="helpButton">__MSG_help__</a>
<a href="https://sponsor.ajay.app" target="_blank" rel="noopener">__MSG_website__</a>
<a href="https://sponsor.ajay.app/stats" target="_blank" rel="noopener">__MSG_viewLeaderboard__</a>
<br />
<a href="https://github.com/ajayyy/SponsorBlock" target="_blank" rel="noopener">GitHub</a>
<a href="https://discord.gg/SponsorBlock" target="_blank" rel="noopener">Discord</a>
<a href="https://matrix.to/#/#sponsor:ajay.app?via=ajay.app&via=matrix.org&via=mozilla.org" target="_blank" rel="noopener">Matrix</a>
<a href="https://sponsor.ajay.app/donate" target="_blank" rel="noopener" id="sbDonate">$</a>
</footer>
<button id="showNoticeAgain" style="display: none">__MSG_showNotice__</button>
</div>
<!-- Scripts that need to load after the html -->
<script src="./js/vendor.js" async></script>
<script src="./js/popup.js" async></script>
</body>
</html>
Reference in a new issue View git blame Copy permalink