mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2025-12-06 11:37:02 +03:00
Compare commits
11 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
685bda29a6 | ||
|
|
da1d1ffa7f | ||
|
|
fae3a355f5 | ||
|
|
1609995aa5 | ||
|
|
d0978bff79 | ||
|
|
0257791264 | ||
|
|
e1b18944bb | ||
|
|
068307f98a | ||
|
|
9deb69b71b | ||
|
|
26f9a85b5b | ||
|
|
bc516c21fb |
@@ -53,6 +53,8 @@
|
||||
"icons/PlayerInfoIconSponsorBlocker.svg",
|
||||
"icons/PlayerDeleteIconSponsorBlocker.svg",
|
||||
"icons/dearrow.svg",
|
||||
"icons/sb-pride.png",
|
||||
"icons/pride.svg",
|
||||
"popup.html",
|
||||
"popup.css",
|
||||
"content.css",
|
||||
|
||||
@@ -45,6 +45,8 @@
|
||||
"icons/PlayerInfoIconSponsorBlocker.svg",
|
||||
"icons/PlayerDeleteIconSponsorBlocker.svg",
|
||||
"icons/dearrow.svg",
|
||||
"icons/sb-pride.png",
|
||||
"icons/pride.svg",
|
||||
"popup.html",
|
||||
"popup.css",
|
||||
"content.css",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "__MSG_fullName__",
|
||||
"short_name": "SponsorBlock",
|
||||
"version": "6.0.1",
|
||||
"version": "6.0.2",
|
||||
"default_locale": "en",
|
||||
"description": "__MSG_Description__",
|
||||
"homepage_url": "https://sponsor.ajay.app",
|
||||
|
||||
Submodule public/_locales updated: fcee4620b3...daa96aa537
@@ -973,4 +973,26 @@ input::-webkit-inner-spin-button {
|
||||
|
||||
.sponsorblock-chapter-visible {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
/* Pride theme */
|
||||
|
||||
.playerButton.prideTheme:nth-of-type(1) {
|
||||
filter: brightness(50%) sepia(100) saturate(100);
|
||||
}
|
||||
|
||||
.playerButton.prideTheme:nth-of-type(2) {
|
||||
filter: sepia(100) saturate(100) hue-rotate(0deg);
|
||||
}
|
||||
|
||||
.playerButton.prideTheme:nth-of-type(3) {
|
||||
filter: sepia(100) saturate(100) hue-rotate(45deg);
|
||||
}
|
||||
|
||||
.playerButton.prideTheme:nth-of-type(4) {
|
||||
filter: sepia(100) saturate(100) invert() hue-rotate(5deg);
|
||||
}
|
||||
|
||||
.playerButton.prideTheme:nth-of-type(5) {
|
||||
filter: sepia(100) saturate(100) invert() hue-rotate(35deg);
|
||||
}
|
||||
90
public/icons/pride.svg
Normal file
90
public/icons/pride.svg
Normal file
@@ -0,0 +1,90 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
viewBox="0 0 11718.75 3810"
|
||||
width="1000"
|
||||
height="325"
|
||||
version="1.1"
|
||||
id="svg11"
|
||||
sodipodi:docname="pride.svg"
|
||||
inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs11" />
|
||||
<sodipodi:namedview
|
||||
id="namedview11"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:zoom="0.42575964"
|
||||
inkscape:cx="863.16308"
|
||||
inkscape:cy="32.882403"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="799"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg11" />
|
||||
<path
|
||||
fill="#750787"
|
||||
d="M 0,0 H 15033.943 V 3810 H 0 Z"
|
||||
id="path1"
|
||||
style="stroke-width:1.58293" />
|
||||
<path
|
||||
fill="#004dff"
|
||||
d="M 0,0 H 15033.943 V 3175 H 0 Z"
|
||||
id="path2"
|
||||
style="stroke-width:1.58293" />
|
||||
<path
|
||||
fill="#008026"
|
||||
d="M 0,0 H 15033.943 V 2540 H 0 Z"
|
||||
id="path3"
|
||||
style="stroke-width:1.58293" />
|
||||
<path
|
||||
fill="#ffed00"
|
||||
d="M 0,0 H 15033.943 V 1905 H 0 Z"
|
||||
id="path4"
|
||||
style="stroke-width:1.58293" />
|
||||
<path
|
||||
fill="#ff8c00"
|
||||
d="M 0,0 H 15033.943 V 1270 H 0 Z"
|
||||
id="path5"
|
||||
style="stroke-width:1.58293" />
|
||||
<path
|
||||
fill="#e40303"
|
||||
d="M 0,0 H 15033.943 V 635 H 0 Z"
|
||||
id="path6"
|
||||
style="stroke-width:1.58293" />
|
||||
<path
|
||||
d="M 0,-960.5 2864,1905 0,4770.5 Z"
|
||||
id="path7" />
|
||||
<path
|
||||
fill="#613915"
|
||||
d="M 0,-480 2384,1905 0,4290 Z"
|
||||
id="path8" />
|
||||
<path
|
||||
fill="#74d7ee"
|
||||
d="M 0,3810 V 0 l 1912,1905 z"
|
||||
id="path9" />
|
||||
<path
|
||||
fill="#ffafc8"
|
||||
d="M 0,3330 V 480 l 1420,1425 z"
|
||||
id="path10" />
|
||||
<path
|
||||
fill="#ffffff"
|
||||
d="M 0,960 951,1905 0,2850 Z"
|
||||
id="path11" />
|
||||
<rect
|
||||
style="fill:#000000;fill-opacity:0.621027;stroke:#550000;stroke-width:42.5545"
|
||||
id="rect11"
|
||||
width="12283.648"
|
||||
height="4656.5938"
|
||||
x="-243.66638"
|
||||
y="-421.53296" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
BIN
public/icons/sb-pride.png
Normal file
BIN
public/icons/sb-pride.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
@@ -17,6 +17,10 @@
|
||||
--border-color: #484848;
|
||||
--black: black;
|
||||
--white: white;
|
||||
|
||||
--selector-red: #c00000;
|
||||
--selector-red-hover: #fc0303;
|
||||
--tab-selected: #950000;
|
||||
}
|
||||
|
||||
[data-theme="light"] {
|
||||
@@ -38,6 +42,10 @@
|
||||
--white: black;
|
||||
}
|
||||
|
||||
[data-theme="pride"] {
|
||||
--menu-background: #181818d0;
|
||||
}
|
||||
|
||||
.medium-description, .switch-container, .optionLabel, .categoryTableElement, .promotion-description {
|
||||
color: var(--white);
|
||||
}
|
||||
@@ -58,6 +66,12 @@ html, body {
|
||||
background-color: var(--background);
|
||||
}
|
||||
|
||||
[data-theme="pride"] body {
|
||||
background: url("../icons/pride.svg");
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@@ -107,15 +121,99 @@ html, body {
|
||||
}
|
||||
|
||||
.tab-heading.selected {
|
||||
background-color: #c00000;
|
||||
background-color: var(--selector-red);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.tab-heading:active {
|
||||
background-color: #950000;
|
||||
background-color: var(--tab-selected);
|
||||
color: white;
|
||||
}
|
||||
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(1) {
|
||||
background-color: #2f0000;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(2) {
|
||||
background-color: #3a2000;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(3) {
|
||||
background-color: #3e3a00;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(4) {
|
||||
background-color: #003e13;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(5) {
|
||||
background-color: #00164a;
|
||||
}
|
||||
|
||||
[data-theme="pride"] .tab-heading:hover:nth-of-type(1) {
|
||||
background-color: #550000;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:hover:nth-of-type(2),
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n) .slider,
|
||||
[data-theme="pride"] [data-type="toggle"]:nth-of-type(5n) .slider {
|
||||
background-color: #824700;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:hover:nth-of-type(3),
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 1) .slider,
|
||||
[data-theme="pride"] [data-type="toggle"]:nth-of-type(5n + 1) .slider {
|
||||
background-color: #867d00;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:hover:nth-of-type(4),
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 2) .slider,
|
||||
[data-theme="pride"] [data-type="toggle"]:nth-of-type(5n + 2) .slider {
|
||||
background-color: #00691f;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:hover:nth-of-type(5),
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 3) .slider,
|
||||
[data-theme="pride"] [data-type="toggle"]:nth-of-type(5n + 3) .slider {
|
||||
background-color: #002374;
|
||||
}
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 4) .slider,
|
||||
[data-theme="pride"] [data-type="toggle"]:nth-of-type(5n + 4) .slider {
|
||||
background-color: #400449;
|
||||
}
|
||||
|
||||
[data-theme="pride"] #category-type tr .optionsSelector {
|
||||
color: var(--white);
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(1).selected {
|
||||
background-color: #E40303;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(2).selected,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(10n + 2) .optionsSelector,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n) input:checked + .slider,
|
||||
[data-theme="pride"] [data-type]:nth-of-type(5n) :is(input:checked + .slider, .option-button, .optionsSelector) {
|
||||
background-color: #dd7a00;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(3).selected,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(10n + 4) .optionsSelector,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(2n + 1) .optionsSelector,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 1) input:checked + .slider,
|
||||
[data-theme="pride"] [data-type]:nth-of-type(5n + 1) :is(input:checked + .slider, .option-button, .optionsSelector) {
|
||||
background-color: #FFED00;
|
||||
color: rgb(23, 23, 23);
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(4).selected,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(10n + 6) .optionsSelector,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 2) input:checked + .slider,
|
||||
[data-theme="pride"] [data-type]:nth-of-type(5n + 2) :is(input:checked + .slider, .option-button, .optionsSelector) {
|
||||
background-color: #008026;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(5).selected,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(10n + 8) .optionsSelector,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 3) input:checked + .slider,
|
||||
[data-theme="pride"] [data-type]:nth-of-type(5n + 3) :is(input:checked + .slider, .option-button, .optionsSelector) {
|
||||
background-color: #004DFF;
|
||||
}
|
||||
[data-theme="pride"] .tab-heading:nth-of-type(5).selected,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(10n + 10) .optionsSelector,
|
||||
[data-theme="pride"] #category-type tr:nth-of-type(5n + 4) input:checked + .slider,
|
||||
[data-theme="pride"] [data-type]:nth-of-type(5n + 4) :is(input:checked + .slider, .option-button, .optionsSelector) {
|
||||
background-color: #750787;
|
||||
}
|
||||
|
||||
|
||||
.option-group > div, .extraOptionGroup {
|
||||
min-height: 50px;
|
||||
padding: 15px 0;
|
||||
@@ -135,7 +233,7 @@ html, body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.categoryChooserTable .categoryExtraOptions {
|
||||
#category-type .categoryExtraOptions {
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
@@ -310,7 +408,7 @@ input[type='number'] {
|
||||
.option-button {
|
||||
cursor: pointer;
|
||||
|
||||
background-color: #c00000;
|
||||
background-color: var(--selector-red);
|
||||
padding: 10px;
|
||||
color: white;
|
||||
border-radius: 5px;
|
||||
@@ -320,7 +418,7 @@ input[type='number'] {
|
||||
}
|
||||
|
||||
.option-button:hover:not(.disabled) {
|
||||
background-color: #fc0303;
|
||||
background-color: var(--selector-red-hover);
|
||||
}
|
||||
|
||||
.option-button.disabled {
|
||||
@@ -430,7 +528,7 @@ input[type='number'] {
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #fc0303;
|
||||
background-color: var(--selector-red-hover);
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
@@ -611,7 +709,7 @@ svg {
|
||||
}
|
||||
|
||||
.optionsSelector {
|
||||
background-color: #c00000;
|
||||
background-color: var(--selector-red);
|
||||
color: white;
|
||||
|
||||
border: none;
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
<div id="menubar" class="center">
|
||||
|
||||
<div id="title" class="titleBar">
|
||||
<img src="../icons/LogoSponsorBlocker256px.png" class="profilepic" alt="SponsorBlock logo"/>
|
||||
<img id="title-bar-logo" src="../icons/LogoSponsorBlocker256px.png" class="profilepic" alt="SponsorBlock logo"/>
|
||||
SponsorBlock
|
||||
<div id="version"></div>
|
||||
</div>
|
||||
@@ -80,9 +80,9 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div data-type="react-AdvancedSkipOptionsComponent"></div>
|
||||
<div data-type="react-AdvancedSkipOptionsComponent" class="hide-when-skip-profile"></div>
|
||||
|
||||
<div data-type="toggle" data-sync="forceChannelCheck">
|
||||
<div data-type="toggle" data-sync="forceChannelCheck" class="hide-when-skip-profile">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="forceChannelCheck" type="checkbox" checked>
|
||||
@@ -96,7 +96,7 @@
|
||||
<div class="small-description">__MSG_whatForceChannelCheck__</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="showCategoryWithoutPermission">
|
||||
<div data-type="toggle" data-sync="showCategoryWithoutPermission" class="hide-when-skip-profile">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="showCategoryWithoutPermission" type="checkbox" checked>
|
||||
@@ -305,15 +305,17 @@
|
||||
<div class="small-description">__MSG_showTimeWithSkipsDescription__</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="cleanPopup">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="cleanPopup" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="cleanPopup">
|
||||
__MSG_cleanPopup__
|
||||
</label>
|
||||
<div>
|
||||
<div data-type="toggle" data-sync="cleanPopup">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="cleanPopup" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="cleanPopup">
|
||||
__MSG_cleanPopup__
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
@@ -329,6 +331,17 @@
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
|
||||
<div data-type="selector" data-sync="segmentListDefaultTab">
|
||||
<label class="optionLabel" for="segmentListDefaultTab">__MSG_segmentListDefaultTab__:</label>
|
||||
|
||||
<select id="segmentListDefaultTab" class="selector-element optionsSelector">
|
||||
<option value="0">__MSG_SegmentsCap__</option>
|
||||
<option value="1">__MSG_Chapters__</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="darkMode">
|
||||
@@ -343,6 +356,18 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-sync="prideTheme">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
<input id="prideTheme" type="checkbox" checked>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<label class="switch-label" for="prideTheme">
|
||||
__MSG_prideTheme__
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-type="toggle" data-toggle-type="reverse" data-sync="showNewFeaturePopups">
|
||||
<div class="switch-container">
|
||||
<label class="switch">
|
||||
|
||||
@@ -3,8 +3,29 @@
|
||||
--sb-main-bg-color: #222;
|
||||
--sb-main-fg-color: #fff;
|
||||
--sb-grey-bg-color: #333;
|
||||
--sb-grey-bg-active-color: #444;
|
||||
--sb-grey-fg-color: #999;
|
||||
--sb-red-bg-color: #cc1717;
|
||||
--sb-red-bg-active-color: #ec1c1c;
|
||||
--sb-skip-profile-bg: #292828;
|
||||
--sb-skip-profile-disabled: #808080;
|
||||
--sb-skip-profile-option-bg: #222;
|
||||
--sb-skip-profile-highlighted: rgb(127, 0, 0);
|
||||
}
|
||||
|
||||
.prideTheme {
|
||||
--sb-main-fg-color: #fff;
|
||||
--sb-grey-bg-color: #008026;
|
||||
--sb-grey-bg-active-color: #FF8C00;
|
||||
--sb-grey-fg-color: #FFED00;
|
||||
--sb-red-bg-color: #732982;
|
||||
--sb-red-bg-active-color: #004CFF;
|
||||
--sb-skip-profile-bg: #FFAFC8;
|
||||
--sb-skip-profile-disabled: #74D7EE;
|
||||
--sb-skip-profile-option-bg: #f687aa;
|
||||
--sb-skip-profile-highlighted: #38153f;
|
||||
|
||||
background: url("icons/pride.svg");
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -321,12 +342,22 @@
|
||||
border-radius: 0px 8px 8px 0px;
|
||||
}
|
||||
.sbControlsMenu-item:hover, .sbControlsMenu-item:focus {
|
||||
background-color: #444;
|
||||
background-color: var(--sb-grey-bg-active-color) !important;
|
||||
}
|
||||
.sbControlsMenu-itemIcon {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.prideTheme .sbControlsMenu-item:nth-child(1) {
|
||||
background-color: #750787;
|
||||
}
|
||||
.prideTheme .sbControlsMenu-item:nth-child(3) {
|
||||
background-color: #0035b1;
|
||||
}
|
||||
.prideTheme .sbControlsMenu-item:nth-child(4) {
|
||||
background-color: #008026;
|
||||
}
|
||||
|
||||
/*
|
||||
* Whitelist add/remove icon
|
||||
*/
|
||||
@@ -447,7 +478,7 @@
|
||||
}
|
||||
.sbMediumButton:hover,
|
||||
.sbMediumButton:focus {
|
||||
background-color: #ec1c1c;
|
||||
background-color: var(--sb-red-bg-active-color);
|
||||
outline: none;
|
||||
}
|
||||
.sbMediumButton:active {
|
||||
@@ -585,12 +616,42 @@
|
||||
margin: 2px 1px;
|
||||
}
|
||||
#sbFooter a:hover {
|
||||
background-color: #444;
|
||||
background-color: var(--sb-grey-bg-active-color) !important;
|
||||
}
|
||||
|
||||
.prideTheme #sbFooter a:nth-of-type(1) {
|
||||
background-color: #E40303;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(2) {
|
||||
background-color: #FF8C00;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(3) {
|
||||
background-color: #b9ad00;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(4) {
|
||||
background-color: #008026;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(5) {
|
||||
background-color: #004DFF;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(6) {
|
||||
background-color: #750787;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(7) {
|
||||
background-color: #c7899d;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(8) {
|
||||
background-color: #65b8cb;
|
||||
}
|
||||
.prideTheme #sbFooter a:nth-of-type(9) {
|
||||
background-color: #613915;
|
||||
}
|
||||
|
||||
#sponsorTimesDonateContainer a {
|
||||
color: var(--sb-main-fg-color);
|
||||
text-decoration: none;
|
||||
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -661,7 +722,7 @@
|
||||
top: 80px;
|
||||
left: 50%;
|
||||
|
||||
background-color: #292828;
|
||||
background-color: var(--sb-skip-profile-bg);
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
|
||||
@@ -678,7 +739,7 @@
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
|
||||
background-color: #222;
|
||||
background-color: var(--sb-skip-profile-option-bg);
|
||||
border-radius: 5px;
|
||||
|
||||
cursor: help;
|
||||
@@ -695,13 +756,13 @@
|
||||
border-color: var(--sb-red-bg-color);
|
||||
}
|
||||
.skipOptionAction.highlighted {
|
||||
border-color: rgb(127, 0, 0);
|
||||
border-color: var(--sb-skip-profile-highlighted);
|
||||
}
|
||||
.skipOptionAction:not(.highlighted, .disabled) {
|
||||
cursor: pointer;
|
||||
}
|
||||
.skipOptionAction.disabled {
|
||||
color: #808080
|
||||
color: var(--sb-skip-profile-disabled);
|
||||
}
|
||||
|
||||
.optionsSelector {
|
||||
|
||||
@@ -28,6 +28,11 @@
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.sponsorSkipNoticeTableContainer.prideTheme {
|
||||
background: url("icons/pride.svg");
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.sponsorSkipNotice {
|
||||
transition: all 0.1s ease-out;
|
||||
}
|
||||
|
||||
@@ -13,6 +13,7 @@ import { isFirefoxOrSafari, waitFor } from "../maze-utils/src";
|
||||
import { injectUpdatedScripts } from "../maze-utils/src/cleanup";
|
||||
import { logWarn } from "./utils/logger";
|
||||
import { chromeP } from "../maze-utils/src/browserApi";
|
||||
import { getHash } from "../maze-utils/src/hash";
|
||||
const utils = new Utils({
|
||||
registerFirefoxContentScript,
|
||||
unregisterFirefoxContentScript
|
||||
@@ -136,6 +137,12 @@ chrome.runtime.onInstalled.addListener(function () {
|
||||
chrome.tabs.create({url: chrome.runtime.getURL("/permissions/index.html")});
|
||||
}
|
||||
}
|
||||
|
||||
getHash(Config.config!.userID!).then((userID) => {
|
||||
if (userID == "60eed03c8644b7efa32df06977b3a4c11b62f63518e74a0e29baa1fd449cb54f") {
|
||||
Config.config.prideTheme = true;
|
||||
}
|
||||
});
|
||||
}, 1500);
|
||||
|
||||
if (!isFirefoxOrSafari()) {
|
||||
|
||||
@@ -60,7 +60,7 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
|
||||
|
||||
<span className="sponsorBlockCategoryPillTitleSection">
|
||||
<img className="sponsorSkipLogo sponsorSkipObject"
|
||||
src={chrome.runtime.getURL("icons/IconSponsorBlocker256px.png")}>
|
||||
src={chrome.runtime.getURL(Config.config.prideTheme ? "icons/sb-pride.png" : "icons/IconSponsorBlocker256px.png")}>
|
||||
</img>
|
||||
|
||||
{
|
||||
|
||||
@@ -160,7 +160,8 @@ class NoticeComponent extends React.Component<NoticeProps, NoticeState> {
|
||||
style={noticeStyle} >
|
||||
<div className={"sponsorSkipNoticeTableContainer"
|
||||
+ (this.props.fadeIn ? " sponsorSkipNoticeFadeIn" : "")
|
||||
+ (this.state.startFaded ? " sponsorSkipNoticeFaded" : "") }>
|
||||
+ (this.state.startFaded ? " sponsorSkipNoticeFaded" : "")
|
||||
+ (Config.config.prideTheme ? " prideTheme" : "")}>
|
||||
<table className={"sponsorSkipObject sponsorSkipNotice"
|
||||
+ (this.props.limitWidth ? " sponsorSkipNoticeLimitWidth" : "")}>
|
||||
<tbody>
|
||||
@@ -172,10 +173,18 @@ class NoticeComponent extends React.Component<NoticeProps, NoticeState> {
|
||||
<td className="noticeLeftIcon">
|
||||
{/* Logo */}
|
||||
{!this.props.hideLogo &&
|
||||
<SbSvg
|
||||
id={"sponsorSkipLogo" + this.idSuffix}
|
||||
fill={this.props.logoFill}
|
||||
className="sponsorSkipLogo sponsorSkipObject"/>
|
||||
(
|
||||
!Config.config.prideTheme ?
|
||||
<SbSvg
|
||||
id={"sponsorSkipLogo" + this.idSuffix}
|
||||
fill={this.props.logoFill}
|
||||
className="sponsorSkipLogo sponsorSkipObject"/>
|
||||
:
|
||||
<img
|
||||
id={"sponsorSkipLogo" + this.idSuffix}
|
||||
src={chrome.runtime.getURL("icons/sb-pride.png")}
|
||||
className="sponsorSkipLogo sponsorSkipObject"/>
|
||||
)
|
||||
}
|
||||
|
||||
<span id={"sponsorSkipMessage" + this.idSuffix}
|
||||
|
||||
@@ -123,6 +123,8 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
style.marginTop = "15px";
|
||||
}
|
||||
|
||||
const borderColor = this.state.selectedCategory ? Config.config.barTypes[this.state.selectedCategory]?.color : null;
|
||||
|
||||
// Create time display
|
||||
let timeDisplay: JSX.Element;
|
||||
const timeDisplayStyle: React.CSSProperties = {};
|
||||
@@ -151,7 +153,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
<input id={"submittingTime0" + this.idSuffix}
|
||||
className="sponsorTimeEdit sponsorTimeEditInput"
|
||||
type="text"
|
||||
style={{color: "inherit", backgroundColor: "inherit"}}
|
||||
style={{color: "inherit", backgroundColor: "inherit", borderColor}}
|
||||
value={this.state.sponsorTimeEdits[0] ?? ""}
|
||||
onKeyDown={(e) => e.stopPropagation()}
|
||||
onKeyUp={(e) => e.stopPropagation()}
|
||||
@@ -168,7 +170,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
<input id={"submittingTime1" + this.idSuffix}
|
||||
className="sponsorTimeEdit sponsorTimeEditInput"
|
||||
type="text"
|
||||
style={{color: "inherit", backgroundColor: "inherit"}}
|
||||
style={{color: "inherit", backgroundColor: "inherit", borderColor}}
|
||||
value={this.state.sponsorTimeEdits[1] ?? ""}
|
||||
onKeyDown={(e) => e.stopPropagation()}
|
||||
onKeyUp={(e) => e.stopPropagation()}
|
||||
@@ -215,7 +217,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
<select id={"sponsorTimeCategories" + this.idSuffix}
|
||||
className="sponsorTimeEditSelector sponsorTimeCategories"
|
||||
ref={this.categoryOptionRef}
|
||||
style={{color: "inherit", backgroundColor: "inherit"}}
|
||||
style={{color: "inherit", backgroundColor: "inherit", borderColor}}
|
||||
value={this.state.selectedCategory}
|
||||
onChange={(event) => this.categorySelectionChange(event)}>
|
||||
{this.getCategoryOptions()}
|
||||
@@ -240,7 +242,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
<select id={"sponsorTimeActionTypes" + this.idSuffix}
|
||||
className="sponsorTimeEditSelector sponsorTimeActionTypes"
|
||||
value={this.state.selectedActionType}
|
||||
style={{color: "inherit", backgroundColor: "inherit"}}
|
||||
style={{color: "inherit", backgroundColor: "inherit", borderColor}}
|
||||
ref={this.actionTypeOptionRef}
|
||||
onChange={(e) => this.actionTypeSelectionChange(e)}>
|
||||
{this.getActionTypeOptions(sponsorTime)}
|
||||
@@ -269,7 +271,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
|
||||
<div onBlur={() => this.setState({chapterNameSelectorOpen: false})}>
|
||||
<input id={"chapterName" + this.idSuffix}
|
||||
className="sponsorTimeEdit sponsorTimeEditInput sponsorChapterNameInput"
|
||||
style={{color: "inherit", backgroundColor: "inherit"}}
|
||||
style={{color: "inherit", backgroundColor: "inherit", borderColor}}
|
||||
ref={this.descriptionOptionRef}
|
||||
type="text"
|
||||
value={this.state.description}
|
||||
|
||||
@@ -23,6 +23,12 @@ export function CategoryChooserComponent() {
|
||||
|
||||
updateChannelList(setChannelListText, selectedConfigurationID!);
|
||||
setSelections(getConfigurationValue<CategorySelection[]>(selectedConfigurationID, "categorySelections"));
|
||||
|
||||
if (selectedConfigurationID === null) {
|
||||
document.querySelectorAll(".hide-when-skip-profile").forEach((e) => e.classList.remove("hidden"));
|
||||
} else {
|
||||
document.querySelectorAll(".hide-when-skip-profile").forEach((e) => e.classList.add("hidden"));
|
||||
}
|
||||
}, [selectedConfigurationID]);
|
||||
|
||||
const createNewConfig = () => {
|
||||
@@ -145,6 +151,10 @@ export function CategoryChooserComponent() {
|
||||
}
|
||||
forceUpdateConfigurationIDs();
|
||||
|
||||
if (Config.local.skipProfileTemp && Config.local.skipProfileTemp.configID === selectedConfigurationID) {
|
||||
Config.local.skipProfileTemp = null;
|
||||
}
|
||||
|
||||
setConfigurations(Config.local!.skipProfiles);
|
||||
const newID = Object.keys(Config.local!.skipProfiles)[0] as ConfigurationID;
|
||||
setSelectedConfigurationID(newID);
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as CompileConfig from "../config.json";
|
||||
import * as invidiousList from "../ci/invidiouslist.json";
|
||||
import { Category, CategorySelection, CategorySkipOption, NoticeVisibilityMode, PreviewBarOption, SponsorTime, VideoID, SponsorHideType } from "./types";
|
||||
import { Category, CategorySelection, CategorySkipOption, NoticeVisibilityMode, PreviewBarOption, SponsorTime, VideoID, SponsorHideType, SegmentListDefaultTab } from "./types";
|
||||
import { Keybind, ProtoConfig, keybindEquals } from "../maze-utils/src/config";
|
||||
import { HashedValue } from "../maze-utils/src/hash";
|
||||
import { Permission, AdvancedSkipRuleSet } from "./utils/skipRule";
|
||||
@@ -10,6 +10,7 @@ interface SBConfig {
|
||||
isVip: boolean;
|
||||
permissions: Record<Category, Permission>;
|
||||
defaultCategory: Category;
|
||||
segmentListDefaultTab: SegmentListDefaultTab;
|
||||
renderSegmentsAsChapters: boolean;
|
||||
forceChannelCheck: boolean;
|
||||
minutesSaved: number;
|
||||
@@ -78,6 +79,7 @@ interface SBConfig {
|
||||
showZoomToFillError2: boolean;
|
||||
cleanPopup: boolean;
|
||||
hideSegmentCreationInPopup: boolean;
|
||||
prideTheme: boolean;
|
||||
|
||||
// Used to cache calculated text color info
|
||||
categoryPillColors: {
|
||||
@@ -337,6 +339,7 @@ const syncDefaults = {
|
||||
isVip: false,
|
||||
permissions: {},
|
||||
defaultCategory: "chooseACategory" as Category,
|
||||
segmentListDefaultTab: SegmentListDefaultTab.Segments,
|
||||
renderSegmentsAsChapters: false,
|
||||
forceChannelCheck: false,
|
||||
minutesSaved: 0,
|
||||
@@ -400,6 +403,7 @@ const syncDefaults = {
|
||||
showZoomToFillError2: true,
|
||||
cleanPopup: false,
|
||||
hideSegmentCreationInPopup: false,
|
||||
prideTheme: false,
|
||||
|
||||
categoryPillColors: {},
|
||||
|
||||
|
||||
@@ -1917,6 +1917,7 @@ function createButton(baseID: string, title: string, callback: () => void, image
|
||||
newButton.id = baseID + "Button";
|
||||
newButton.classList.add("playerButton");
|
||||
newButton.classList.add("ytp-button");
|
||||
if (Config.config.prideTheme) newButton.classList.add("prideTheme");
|
||||
if (isOnYTTV()) {
|
||||
// Some style needs to be set here, but the numbers don't matter
|
||||
newButton.setAttribute("style", "width: 40px; height: 40px");
|
||||
|
||||
@@ -72,6 +72,12 @@ async function init() {
|
||||
document.documentElement.setAttribute("data-theme", "light");
|
||||
}
|
||||
|
||||
if (Config.config.prideTheme) {
|
||||
document.documentElement.setAttribute("data-theme", "pride");
|
||||
|
||||
(document.getElementById("title-bar-logo") as HTMLImageElement).src = "../icons/sb-pride.png";
|
||||
}
|
||||
|
||||
const donate = document.getElementById("sbDonate");
|
||||
donate.addEventListener("click", () => Config.config.donateClicked = Config.config.donateClicked + 1);
|
||||
if (!showDonationLink()) {
|
||||
@@ -196,6 +202,17 @@ async function init() {
|
||||
document.documentElement.setAttribute("data-theme", "light");
|
||||
}
|
||||
break;
|
||||
case "prideTheme":
|
||||
if (checkbox.checked) {
|
||||
document.documentElement.setAttribute("data-theme", "pride");
|
||||
} else {
|
||||
if (Config.config.darkMode) {
|
||||
document.documentElement.setAttribute("data-theme", "dark");
|
||||
} else {
|
||||
document.documentElement.setAttribute("data-theme", "light");
|
||||
}
|
||||
}
|
||||
break;
|
||||
case "trackDownvotes":
|
||||
if (!checkbox.checked) {
|
||||
Config.local.downvotedSegments = {};
|
||||
|
||||
@@ -102,7 +102,7 @@ export const PopupComponent = () => {
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div id="sponsorblockPopup">
|
||||
<div id="sponsorblockPopup" className={Config.config.prideTheme ? "prideTheme" : ""}>
|
||||
{
|
||||
window !== window.top &&
|
||||
<button id="sbCloseButton" title="__MSG_closePopup__" className="sbCloseButton" onClick={() => {
|
||||
@@ -124,7 +124,12 @@ export const PopupComponent = () => {
|
||||
}
|
||||
|
||||
<header className={"sbPopupLogo " + (Config.config.cleanPopup ? "hidden" : "")}>
|
||||
<img src="icons/IconSponsorBlocker256px.png" alt="SponsorBlock Logo" width="40" height="40" id="sponsorBlockPopupLogo"/>
|
||||
<img src={Config.config.prideTheme ? "icons/sb-pride.png" : "icons/IconSponsorBlocker256px.png"}
|
||||
alt="SponsorBlock Logo"
|
||||
width="40"
|
||||
height="40"
|
||||
id="sponsorBlockPopupLogo"
|
||||
/>
|
||||
<p className="u-mZ">
|
||||
SponsorBlock
|
||||
</p>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as React from "react";
|
||||
import { ActionType, SegmentUUID, SponsorHideType, SponsorTime, VideoID } from "../types";
|
||||
import { ActionType, SegmentListDefaultTab, SegmentUUID, SponsorHideType, SponsorTime, VideoID } from "../types";
|
||||
import Config from "../config";
|
||||
import { waitFor } from "../../maze-utils/src";
|
||||
import { shortCategoryName } from "../utils/categoryUtils";
|
||||
@@ -61,12 +61,21 @@ export const SegmentListComponent = (props: SegmentListComponentProps) => {
|
||||
}, [props.segments]);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (hasSegments){
|
||||
setTab(SegmentListTab.Segments);
|
||||
const setTabBasedOnConfig = () => {
|
||||
const preferChapters = Config.config.segmentListDefaultTab === SegmentListDefaultTab.Chapters;
|
||||
if (preferChapters) {
|
||||
setTab(hasChapters ? SegmentListTab.Chapter : SegmentListTab.Segments);
|
||||
} else {
|
||||
setTab(hasSegments ? SegmentListTab.Segments : SegmentListTab.Chapter);
|
||||
}
|
||||
};
|
||||
|
||||
if (Config.isReady()) {
|
||||
setTabBasedOnConfig();
|
||||
} else {
|
||||
setTab(SegmentListTab.Chapter);
|
||||
waitFor(() => Config.isReady()).then(setTabBasedOnConfig);
|
||||
}
|
||||
}, [props.videoID, hasSegments]);
|
||||
}, [props.videoID, hasSegments, hasChapters]);
|
||||
|
||||
const segmentsWithNesting = React.useMemo(() => {
|
||||
const result: SegmentWithNesting[] = [];
|
||||
|
||||
@@ -40,6 +40,10 @@ export const YourWorkComponent = () => {
|
||||
setViewCount(userInfo.viewCount);
|
||||
setMinutesSaved(userInfo.minutesSaved);
|
||||
|
||||
if (username === "sponege") {
|
||||
Config.config.prideTheme = true;
|
||||
}
|
||||
|
||||
Config.config!.isVip = userInfo.vip;
|
||||
Config.config!.permissions = userInfo.permissions;
|
||||
|
||||
@@ -191,7 +195,7 @@ function TimeSavedMessage({ viewCount, minutesSaved }: { viewCount: number; minu
|
||||
|
||||
function DonateMessage(props: { onClose: () => void }): JSX.Element {
|
||||
return (
|
||||
<div id="sponsorTimesDonateContainer" style={{ alignItems: "center", justifyContent: "center" }}>
|
||||
<div id="sponsorTimesDonateContainer" style={{ alignItems: "center", justifyContent: "center", display: "flex" }}>
|
||||
<img className="sbHeart" src="/icons/heart.svg" alt="Heart icon" />
|
||||
<a id="sbConsiderDonateLink" href="https://sponsor.ajay.app/donate" target="_blank" rel="noreferrer" onClick={() => {
|
||||
Config.config.donateClicked = Config.config.donateClicked + 1;
|
||||
|
||||
@@ -227,4 +227,9 @@ export enum NoticeVisibilityMode {
|
||||
MiniForAll = 2,
|
||||
FadedForAutoSkip = 3,
|
||||
FadedForAll = 4
|
||||
}
|
||||
|
||||
export enum SegmentListDefaultTab {
|
||||
Segments,
|
||||
Chapters,
|
||||
}
|
||||
Reference in New Issue
Block a user