YT feedxer by riedler

/* ==UserStyle==
@name           YT feedxer
@namespace      https://github.com/RiedleroD/userstyles-riedler
@version        0.0.2
@description    more columns in feed more better. mobile-first is a fuck
@author         Riedler
@preprocessor	less
@var	text	colc	"Column count"	5
@var	text	gapsize	"Gap Size"		"1.5rem"
@var	checkbox	uselessbadges	"remove useless badges"	1
==/UserStyle== */

@-moz-document url-prefix("https://www.youtube.com/feed/"), url("https://www.youtube.com/") {
	#contents {
		display: grid !important;
		box-sizing: border-box;
		gap: @gapsize;
		padding-left: @gapsize;
		padding-right: @gapsize;
		grid-template-columns: repeat(@colc, 1fr);
		
		&>ytd-rich-section-renderer {
			grid-column: 1 / (@colc + 1);
		}
		&>ytd-rich-item-renderer {
			width: 100%;
			margin: 0;
			padding: 0;
			box-sizing: border-box;
			--ytd-rich-grid-gutter-margin: 0px;
			overflow: hidden;
		}
		&>ytd-continuation-item-renderer {
			background-color: var(--hover-background);
			border-radius: 12px;
			aspect-ratio: 16 / 9;
			
			#ghost-cards {
				display: none;
			}
		}
	}
	& when (@uselessbadges = 1) {
		[aria-label="YouTube featured"] {
			//useless badge. it's always members only as well, making the container overflow.
			display: none;
		}
		.ytmPaidContentOverlayLink {
			// the amount of times I've accidentally clicked on this bastard should be an indication for youtube HQ that this button sucks ass
			display: none;
		}
	}
}