From 76617bc1b014bfe381118f225f6d3fa7c4b996b8 Mon Sep 17 00:00:00 2001 From: Chev Date: Mon, 24 Jul 2023 15:04:42 -0700 Subject: [PATCH] Invidious Dark-Blue v1.1.0 - Add ability to hide thumbnails (user-configurable) - Add rule for
tags - Speed up player control bar show/hide animation - Rounded corners for channel banner image - Adjust margin-right for video description & comments --- styles/invidious-dark-blue.user.css | 38 ++++++++++++++++++++++++++--- 1 file changed, 35 insertions(+), 3 deletions(-) diff --git a/styles/invidious-dark-blue.user.css b/styles/invidious-dark-blue.user.css index 6ff765d..c23e974 100644 --- a/styles/invidious-dark-blue.user.css +++ b/styles/invidious-dark-blue.user.css @@ -1,7 +1,7 @@ /* ==UserStyle== @name Invidious Dark-Blue @author Chev (https://github.com/chev2) -@version 1.0.0 +@version 1.1.0 @description Dark-blue theme for Invidious. NOTE: This CSS theme was made specifically for inv.tux.pizza--YMMV on other instances! @namespace github.com/chev2 @license Apache-2.0 @@ -15,6 +15,7 @@ @var range video-player-height "Video player height" [70, 5, 100, 5, "vh"] @var range main-side-padding "Side padding" [10, 1, 20, 1, "vw"] @var checkbox move-side-bar "Move next-video sidebar up" 1 +@var checkbox hide-thumbnails "Hide thumbnails" 0 ==/UserStyle== */ @-moz-document domain("yewtu.be"), domain("vid.puffyan.us"), domain("yt.artemislena.eu"), domain("invidious.flokinet.to"), domain("invidious.projectsegfau.lt"), domain("inv.bp.projectsegfau.lt"), domain("invidious.tiekoetter.com"), domain("invidious.slipfox.xyz"), domain("inv.pistasjis.net"), domain("invidious.privacydev.net"), domain("vid.priv.au"), domain("iv.melmac.space"), domain("iv.ggtyler.dev"), domain("invidious.lunar.icu"), domain("invidious.0011.lt"), domain("inv.zzls.xyz"), domain("inv.tux.pizza"), domain("invidious.protokolla.fi"), domain("onion.tube"), domain("inv.in.projectsegfau.lt") { @@ -32,6 +33,13 @@ } + /* Adjust horizontal rule style */ + hr { + margin: 2px 0; + color: rgba(255, 255, 255, 70%); + } + + /* Shorten website header */ .h-box > h3 { margin: 0px; @@ -86,7 +94,8 @@ color: inherit; } - /* Adjustments to player color */ + + /* Adjustments to player background color */ #player, .video-js .vjs-tech { background-color: transparent; } @@ -101,6 +110,10 @@ background-color: rgba(5, 5, 5, 0.75); } + /* Speed up player controls show/hide animation */ + .vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar { + transition: visibility 0.4s, opacity 0.4s; + } /* Adjust search bar BG color */ @@ -194,6 +207,12 @@ } + /* Modify channel banner image */ + div.h-box:nth-child(3) > img:nth-child(1) { + border-radius: 8px; + } + + /* Adjust related videos right-side panel */ /* This one's a bit hacky, unfortunately */ if move-side-bar { @@ -208,11 +227,24 @@ } /* Adjust video creator & description/comments */ div.pure-u-1.pure-u-lg-3-5 > * { - margin-right: 2.9vw; + margin-right: 4.2vw; } /* Adjust title */ div.h-box:nth-child(5) > h1 { margin: 0px; } } + + + /* Hide thumbnails if the user asks for it */ + if hide-thumbnails { + div.thumbnail { + display: none; + } + + /* Offset margin of first text child */ + div.pure-u-1:nth-child(5) > div:nth-child(1) > div:nth-child(2) { + margin-top: -12px; + } + } }