holodex.user.css

/* ==UserStyle==

@name				Holodex & Youtube Tweaks
@namespace			https://github.com/Himither
@homepageURL			https://github.com/Himither/Holodex-Youtube-Tweaks
@supportURL			https://github.com/Himither/Holodex-Youtube-Tweaks/issues
@version			1.1.41
@description			Improved dark mode, adjustable chat width, hiding scrollbars/buttons and many more tweaks.
@author				Himither
@license			MIT
@preprocessor			stylus

@var text Holodex		"━━━━━━⮞【Holodex】" '_'

@var select			hd-darkmode						"Dark Mode" {

"Default":			"normal",
"Darker*":			"darker",
"La+ Darknesss":		"darknesss"

}
@var select			hd-theme						"Select a theme" {

"None*":			"none",
"Aqua":				"aqutan"

}
@var number			hd-sidemenuWidth					"Menu width (170px - 1080px)" [220, 170, 1080, 1, "px"]
@var checkbox			hd-borderlessHolodex					"Borderless Holodex" 1
@var checkbox			hd-hoverOverlay						"YT Overlay only on video hover" 0
@var select			hd-changeAvatar						"Change the avatar image" {

"None":				"none",
"Anchor*":			"'data:image/webp;base64,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'",
"Custom":			"hd-avatarCustom"

}
@var text			hd-avatarCustom						"Custom avatar (Link to an image/Data URL wrapped in single quotes)" "''"
@var range			hd-avatarSize						"Avatar size" [100, 50, 150, 1, "%"]

@var text Singleview		"━━━━━━⮞【Singleview】" '_'

@var number			sw-sidebarWidth						"Chat width (170px - 1080px)" [340, 170, 1080, 1, "px"]
@var checkbox			sw-videoHeight						"Set video height to 100%" 0
@var checkbox			sw-videoRound						"Rounded & padded video" 0

@var text Multidex		"━━━━━━⮞【Multidex】" '_'

@var checkbox			md-hoverToolbarButton					"Show top-right toolbar button only on mouse hover" 0
@var checkbox			md-hoverChatButtons					"Show bottom chat buttons only on mouse hover" 0
@var checkbox			md-hoverArchiveSync					"Show Archive Sync only on mouse hover" 0

@var text Youtube		"━━━━━━⮞【YouTube】" '_'

@var number			yt-menuWidth						"Change side menu width (170px - 1080px)" [240, 170, 1080, 1, "px"]
@var checkbox			yt-darknesss						"La+ Darknesss" 0
@var checkbox			yt-borderlessChat					"Remove border around chat" 0
@var checkbox			yt-hoverHeader						"Show header only on hover" 0
@var checkbox			yt-buttons						"Remove text from buttons below video" 0
@var checkbox			yt-useWidth						"Use full width when watching videos (progess bar is a bit iffy)" 0
@var checkbox			yt-hoverSecondary					"Works only with full width option. When chat AND playlist are closed hide right column when not hovered." 0

@var text YouTubeChat		"━━━━━━⮞【YT Chat】" '_'

@var checkbox			ytc-showLabel						"Show \"Live chat replay\" as label" 0
@var checkbox			ytc-showDropdownMenu					"Show dropdown menu again" 0
@var checkbox			ytc-showButtons						"Show hidden buttons again" 0

@var text Hyperchat		"━━━━━━⮞【Hyperchat】" '_'

@var checkbox			hc-hideHyperchatInfo					"Hide Hyperchat Notice (Please 👍 and ⭐ Hyperchat)" 0

@var text Scrollbars		"━━━━━━⮞【Scrollbars】" '_'

@var checkbox			hd-hideScrollbars					"Hide Holodex scrollbars" 0
@var checkbox			ytc-hideScrollbars					"Hide YouTube-Chat scrollbars" 0
@var checkbox			hc-hideScrollbars					"Hide Hyperchat scrollbars" 0
@var checkbox			yt-hideScrollbars					"Hide YouTube scrollbars" 0

==/UserStyle== */
@-moz-document url-prefix("https://holodex.net") {

	.v-navigation-drawer,
	.v-overlay {
		transition: all 300ms ease-in-out !important;
	}

	.v-navigation-drawer--open {
		width: hd-sidemenuWidth !important;
	}

	.v-application--wrap:not(:has(.video)):not(:has(.mv-background)) main {
		transition: padding-left 300ms ease-in-out !important;
	}


	.v-application--wrap:has(.v-navigation-drawer--open):not(:has(.video)):not(:has(.mv-background)) main {
		padding-left: hd-sidemenuWidth !important;
	}

	if hd-darkmode==darker {

		nav .v-list.v-sheet,
		.v-navigation-drawer__content,
		.v-tabs-bar,
		.v-expansion-panel-content,
		.v-expansion-panel,
		.topic-chip,
		.v-bottom-navigation,
		.theme--dark.v-list,
		.settings-group,
		.mv-toolbar,
		.mv-cell {
			background-color: var(--v-background-base) !important;
		}

		.watch-layout,
		div.tl-overlay,
		.theme--dark.v-card,
		.multiview,
		.vue-grid-layout,
		.theme--dark.v-sheet {
			background-color: #0f0f0f !important;
		}

		.settings-group {
			border-color: var(--v-background-base) !important;
		}
	}

	if hd-darkmode==darknesss {

		iframe,
		.v-main,
		.v-sheet,
		.watch-layout,
		.multiview,
		.vue-grid-layout,
		.v-app-bar.v-toolbar.v-sheet,
		.v-navigation-drawer__content,
		.v-tabs-bar,
		.v-expansion-panel-content,
		.v-bottom-navigation,
		.v-input__slot {
			background-color: var(--v-background-darken4) !important;
		}

		header .v-input__slot,
		.v-expansion-panel,
		.topic-chip,
		.embedded-chat {
			background-color: var(--v-background-base) !important;
		}

		button:not(.video-card-action) {
			background-color: transparent !important;
		}

		.v-list-item--link::before,
		.v-btn::before {
			background-color: var(--v-background-lighten4)
		}
	}

	if hd-borderlessHolodex {

		*,
		.tl-overlay,
		.mv-cell {
			border-color: transparent !important;
		}

		.v-navigation-drawer__border {
			opacity: 0 !important;
		}

		.layout-preview {
			border-color: var(--v-primary-base) !important;
		}

		.layout-preview-cell {
			border: none !important;
		}

		.watch-live-chat {
			background-color: transparent !important;
		}
	}

	if hd-hideScrollbars {

		* {
			scrollbar-width: none !important;
		}
	}

	if hd-theme==aqutan {

		.tl-name,
		.subtitle-text,
		.v-application .red--text,
		:is(.channel-container, .watch-card) .v-list-item__title {
			color: rgb(240, 98, 146) !important;
		}

		.tl-message .tl-caption,
		.text--org {
			color: rgb(59, 136, 213) !important;
		}

		.subtitle-text {
			text-shadow: 2px 2px 5px rgb(59, 136, 213);
		}

		.watch-btn-group button.v-btn:first-child .v-icon__svg {
			fill: rgb(59, 136, 213) !important;
		}
	}

	if hd-changeAvatar!="none" {

		header:not(.mv-toolbar) .v-avatar,
		.v-menu__content .v-avatar {
			height: 0 !important;
			width: 0 !important;
			padding-left: 40px !important;
			padding-top: 40px !important;
			background-image: url(hd-changeAvatar) !important;
			background-position: center !important;
			background-size: hd-avatarSize !important;
		}
	}
}

@-moz-document url-prefix("https://holodex.net/watch") {

	.sidebar {
		min-width: sw-sidebarWidth !important;
	}

	if sw-videoHeight {
		.watch-layout.full-height:not(.mobile).show-highlights-bar .video,
		.watch-layout.full-height:not(.mobile) .video {
			height: 100dvh !important;
		}

		.video {
			height: calc(100dvh - 56px) !important;
		}
	}

	if sw-videoRound {
		.v-main__wrap > div > div > div.flex-column > div[style] {
			padding: 0 16px !important;
		}
	}
}

@-moz-document url-prefix("https://holodex.net/multiview") {

	if md-hoverToolbarButton {

		.open-mv-toolbar-btn {
			opacity: 0 !important;
			transition: opacity 300ms ease-in-out !important;
			border-bottom-left-radius: 5px !important;
		}

		.open-mv-toolbar-btn:hover {
			opacity: 0.7 !important;
			background: var(--v-secondary-base) !important;
		}
	}

	if md-hoverChatButtons {

		.vue-grid-item > .mv-cell > .cell-content > .d-flex:last-child:not(.cell-control) {
			position: absolute !important;
			right: 0 !important;
			bottom: 0 !important;
			width: 100% !important;
			opacity: 0 !important;
			transition: opacity 300ms ease-in-out !important;
			background-color: black !important;
		}

		.vue-grid-item > .mv-cell > .cell-content > .d-flex:last-child:not(.cell-control):hover {
			opacity: 1 !important;
		}
	}

	if md-hoverArchiveSync {
		.sync-bar.d-flex {
			opacity: 0 !important;
		}

		.sync-bar.d-flex:hover {
			opacity: 1 !important;
		}
	}
}

@-moz-document url-prefix("https://www.youtube.com/") {

	#guide-content,
	#guide-renderer {
		width: yt-menuWidth !important;
	}

	if yt-hideScrollbars {
		* {
			scrollbar-width: none !important;
		}
	}
}

@-moz-document url-prefix("https://www.youtube.com/watch"),
url-prefix("https://www.youtube.com/live") {

	if yt-darknesss {
		html[dark],
		[dark] {
			--yt-spec-base-background: black;
		}
	}

	if yt-borderlessChat {
		#chat {
			border-color: transparent !important;
		}
	}

	if yt-hoverHeader {

		#content #masthead-container {
			opacity: 0 !important;
		}

		#content:not(:has(#chat-container:hover)) #masthead-container:hover {
			opacity: 1 !important;
			background-color: var(--yt-spec-base-background) !important;
		}
	}

	if yt-buttons {

		:is(#owner, #actions.ytd-watch-metadata) {
			width: fit-content;
			min-width: unset;
		}

		ytd-subscribe-button-renderer {
			width: fit-content !important; /* Must be !important */
		}

		:is(yt-button-view-model, #flexible-item-buttons, ytd-subscribe-button-renderer[subscribed]) .yt-spec-button-shape-next__button-text-content {
			display: none;
		}

		:is(yt-button-view-model, #flexible-item-buttons) .yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading .yt-spec-button-shape-next__icon {
			margin: 0;
		}
	}

	if yt-useWidth {

		#page-manager.ytd-app {
			margin-top: 0 !important;
		}

		#columns {
			max-width: 100% !important;
			justify-content: flex-end !important;
		}

		#primary {
			padding-top: 0 !important;
		}

		#secondary {
			padding-top: var(--ytd-toolbar-height) !important;
		}

		#player {
			display: inline-flex !important;
			height: 100dvh !important;
			width: 100% !important;
			align-items: center !important;
		}

		#player-container-outer {
			width: 100% !important;
		}

		.ytp-player-content,
		.ytp-iv-video-content,
		.html5-video-container,
		video.video-stream {
			width: 100% !important;
			height: 100% !important;
		}

		.ytp-chrome-bottom {
			left: 50% !important;
			transform: translateX(-50%) !important;
		}

		.ytp-player-content.ytp-iv-player-content {
			left: 0 !important;
			right: 0 !important;
		}

		.ytp-cued-thumbnail-overlay {
			z-index: 10 !important;
		}

		#secondary:has(#playlist[hidden]) #chat-container:has(#chat):not(:has(#chat[collapsed])) {
			height: calc(100dvh - var(--ytd-toolbar-height)) !important;
		}

		#secondary:has(#playlist[collapsed]) #chat-container:has(#chat):not(:has(#chat[collapsed])) {
			height: calc(100dvh - var(--ytd-toolbar-height) - var(--ytd-margin-6x) - 68px) !important;
			margin-bottom: var(--ytd-margin-6x);
		}

		#chat:not([collapsed]) {
			height: 100% !important;
			min-height: 0 !important;
			margin-bottom: 0 !important;
		}

		#secondary #chat-container:not(:has(#chat[collapsed])) #chat {
			height: calc(100% - var(--ytd-toolbar-height)) !important
		}

		.ytp-tooltip:not([aria-hidden="true"]) {
			top: calc(100% - 96px) !important;
		}

		.ytp-tooltip:not([aria-hidden="true"]).ytp-preview {
			top: calc(100% - 224px) !important;
		}

		#player:has(.ytp-show-tiles) .video-stream {
			display: none !important;
		}
	}

	if yt-hoverSecondary and yt-useWidth {

		#columns {
			overflow-x: hidden !important;
		}

		#columns:has(#chat[collapsed]):has(#playlist:is([collapsed], [hidden])) #primary,
		#columns:not(:has(#chat)) #primary {
			max-width: 90dvw !important;
			padding-right: 0 !important;
			margin: 0 auto !important;
			padding-left: var(--ytd-margin-6x) !important;
		}

		#columns:has(#chat[collapsed]):has(#playlist:is([collapsed], [hidden])) #player-container-outer,
		#columns:not(:has(#chat)) #player-container-outer {
			max-width: 100% !important;
		}

		#columns:has(#chat[collapsed]):has(#playlist:is([collapsed], [hidden])) #secondary,
		#columns:not(:has(#chat)) #secondary {
			opacity: 0 !important;
			width: 0 !important;
			min-width: 0 !important;
		}

		#columns:has(#chat[collapsed]):has(#playlist:is([collapsed], [hidden])):has(#secondary:hover),
		#columns:not(:has(#chat)):has(#secondary:hover) {
			justify-content: flex-end !important;
		}

		#columns:has(#chat[collapsed]):has(#playlist:is([collapsed], [hidden])):has(#secondary:hover) #primary,
		#columns:not(:has(#chat)):has(#secondary:hover) #primary {
			min-width: var(--ytd-watch-flexy-min-player-width) !important;
			margin-right: 0 !important;
			margin-left: var(--ytd-margin-6x) !important;
		}

		#columns:has(#chat[collapsed]):has(#playlist:is([collapsed], [hidden])) #secondary:hover,
		#columns:not(:has(#chat)):not(:has(#primary:hover)) #secondary:hover {
			opacity: 1 !important;
			width: var(--ytd-watch-flexy-sidebar-width) !important;
			min-width: var(--ytd-watch-flexy-sidebar-min-width) !important;
			padding-left: var(--ytd-margin-6x) !important;
		}
	}
}

@-moz-document url-prefix("https://www.youtube.com/embed") {

	if hd-darkmode==darker {
		#movie_player {
			background-color: #0f0f0f !important;
		}

		.ytp-gradient-bottom,
		.ytp-gradient-top {
			background-image: none !important;
		}
	}

	if hd-hoverOverlay {

		#movie_player:not(:hover) {
			.ytp-large-play-button,
			.ytp-gradient-top,
			.ytp-chrome-top,
			.ytp-gradient-bottom,
			.ytp-chrome-bottom,
			.ytp-player-content {
				opacity: 0;
			}
		}
	}

	if sw-videoRound {

		video {
			border-radius: 8px !important;
		}

		.ytp-cued-thumbnail-overlay-image {
			background-size: contain !important;
			-moz-background-size: contain !important;
			-webkit-background-size: contain !important;
		}
	}
}

@-moz-document url-prefix("https://www.youtube.com/live_chat") {

	#primary-content.yt-live-chat-header-renderer {
		margin-left: 4px !important;
	}

	if hd-darkmode==darker {

		yt-live-chat-message-input-renderer,
		yt-live-chat-header-renderer,
		yt-live-chat-ticker-renderer,
		#chat-messages {

			background: #0f0f0f !important;
		}

		.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--text:hover {
			background: #202020 !important;
		}
	}

	if hd-darkmode==darknesss {

		yt-live-chat-message-input-renderer,
		yt-live-chat-header-renderer,
		yt-live-chat-ticker-renderer,
		ytd-menu-popup-renderer,
		#chat-messages,
		#input-container,
		#search-panel,
		#menu,
		#contentWrapper {
			background: black !important;
		}

		.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--text:hover {
			background: #202020 !important;
		}
	}

	if !ytc-showDropdownMenu {

		yt-live-chat-header-renderer[prevent-chat-header-overflow] #view-selector.yt-live-chat-header-renderer {
			display: none !important;
		}

		span#title::after {
			content: "Live" !important;
			white-space: pre !important;
			color: white !important;
			display: block !important;
		}

		if ytc-showLabel {

			span#title::after {
				content: "Live chat replay" !important;
				white-space: pre !important;
				color: white !important;
				display: block !important;
			}
		}
	}

	if !ytc-showButtons {

		yt-live-chat-button,
		div#close-button {
			display: none !important;
		}
	}

	#separator.yt-live-chat-renderer,
	#panel-pages.yt-live-chat-renderer {
		border: black !important;
	}

	if ytc-hideScrollbars {

		* {
			scrollbar-width: none !important;
		}
	}

	if hd-theme==aqutan {

		div#content #author-name:not(.moderator) {
			color: rgb(59, 136, 213) !important;
		}

		div#content #author-name.moderator {
			color: green !important;
		}

		div#content :is(#author-name.member,
		span#title::after) {
			color: rgb(240, 98, 146) !important;
		}

		span#title::after,
		#trigger :is(#label-text,
		#label-icon) {
			color: rgb(240, 98, 146) !important;
			text-shadow: -2px 2px 1.0px rgb(59, 136, 213);
		}
	}
}

@-moz-document url-prefix("https://www.youtube.com/embed/hyperchat_embed") {

	if hd-darkmode==darker {
		.hyperchat-root,
		.hyperchat-root > div.w-full > div.flex {
			background: #0f0f0f !important;
		}
	}

	if hd-darkmode==darknesss {

		.hyperchat-root,
		.hyperchat-root > div.w-full > div.flex {
			background: black !important;
		}
	}

	if hc-hideScrollbars {

		* {
			scrollbar-width: none !important;
		}
	}

	if hc-hideScrollbars {

		div.hyperchat-root div.w-full {
			padding-bottom: 4px !important;
		}
	}

	if hc-hideHyperchatInfo {

		div.hover-highlight:not(.flex) {
			display: none !important;
		}
	}

	if hd-theme==aqutan {

		div.content > div > div > div > a > span:not(.text-moderator-light) {
			color: rgb(59, 136, 213) !important;
		}

		div.content > div > div > div > a > span.text-moderator-light {
			color: green !important;
		}

		div.content > div > div > div > a > span.text-member-light {
			color: rgb(240, 98, 146) !important;
		}
	}
}