Add option to disable thumbnail icons

public/_locales/en/messages.json

@@ -797,6 +797,10 @@
         "message": "Show an icon when a video is entirely an advertisement",
         "description": "Referring to the category pill that is now shown on videos that are entirely sponsor or entirely selfpromo"
     },
+    "fullVideoLabelsOnThumbnails": {
+        "message": "Show labels on video thumbnails as well",
+        "description": "Referring to the category pill that is shown on videos that are entirely sponsor or entirely selfpromo on recommended videos, in searches or on the homepage."
+    },
     "previewColor": {
         "message": "Unsubmitted Color",
         "description": "Referring to submissions that have not been sent to the server yet."

public/options/options.css

@@ -697,3 +697,8 @@ svg {
     cursor: pointer;
     vertical-align: middle;
 }
+
+.no-bottom-border {
+    border: none !important;
+    padding: 20px 0px 0px 0px !important;
+}

public/options/options.html

@@ -78,7 +78,7 @@
 					</div>
 				</div>
 				
-				<div data-type="toggle" data-sync="fullVideoSegments">
+				<div data-type="toggle" data-sync="fullVideoSegments" class="no-bottom-border">
 					<div class="switch-container">
 						<label class="switch">
 							<input id="fullVideoSegments" type="checkbox" checked>
@@ -90,6 +90,19 @@
 					</div>
 				</div>
 
+				<div data-type="toggle" data-sync="fullVideoLabelsOnThumbnails" 
+						data-dependent-on="fullVideoSegments">
+					<div class="switch-container">
+						<label class="switch">
+							<input id="fullVideoLabelsOnThumbnails" type="checkbox" checked>
+							<span class="slider round"></span>
+						</label>
+						<label class="switch-label" for="fullVideoLabelsOnThumbnails">
+							__MSG_fullVideoLabelsOnThumbnails__
+						</label>
+					</div>
+				</div>
+
 				<div data-type="number-change" data-sync="minDuration">
 					<label class="number-container">
 						<span class="optionLabel">__MSG_minDuration__</span>

src/config.ts

@@ -27,6 +27,7 @@ interface SBConfig {
     disableSkipping: boolean;
     muteSegments: boolean;
     fullVideoSegments: boolean;
+    fullVideoLabelsOnThumbnails: boolean;
     manualSkipOnFullVideo: boolean;
     trackViewCount: boolean;
     trackViewCountInPrivate: boolean;
@@ -258,6 +259,7 @@ const syncDefaults = {
     disableSkipping: false,
     muteSegments: true,
     fullVideoSegments: true,
+    fullVideoLabelsOnThumbnails: true,
     manualSkipOnFullVideo: false,
     trackViewCount: true,
     trackViewCountInPrivate: true,

src/content.ts

@@ -345,6 +345,7 @@ function contentConfigUpdateListener(changes: StorageChangesObject) {
                 setCategoryColorCSSVariables();
                 break;
             case "fullVideoSegments":
+            case "fullVideoLabelsOnThumbnails":
                 updateAll();
                 break;
         }

src/utils/thumbnails.ts

@@ -9,7 +9,7 @@ export async function labelThumbnails(thumbnails: HTMLImageElement[]): Promise<v
 }
 
 export async function labelThumbnail(thumbnail: HTMLImageElement): Promise<HTMLElement | null> {
-    if (!Config.config?.fullVideoSegments) {
+    if (!Config.config?.fullVideoSegments || !Config.config?.fullVideoLabelsOnThumbnails) {
         hideThumbnailLabel(thumbnail);
         return null;
     }