Skip to content

Xcellent by Himither

Mirrored from https://raw.githubusercontent.com/Himither/Xcellent/master/xcellent.user.css

Screenshot of Xcellent

Details

AuthorHimither

LicenseMIT

Categoryx

Created

Updated

Size9.6 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Adjustable timeline width, hide ads, hide stuff, show stuff only on hover & more

Notes

Source code

/* ==UserStyle==

@name				Xcellent
@namespace			github.com/Himither
@homepageURL			https://github.com/Himither/Xcellent
@supportURL			https://github.com/Himither/Xcellent/issues
@version			1.0.13
@description			Adjustable timeline width, hide ads, hide stuff, show stuff only on hover & more
@author				Himither
@license			MIT
@preprocessor			stylus

@var checkbox			wide				"Make it wide"					1

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

@var range			timeline-width			"Timline max-width"				[900, 600, 1800, 1, "px"]
@var checkbox			timeline-header			"Non-sticky timline header"			0
@var checkbox			timeline-hideFollow		"Hide 'Who to follow'"				0
@var checkbox			timeline-hideAds		"Hide Ads"					0
@var checkbox			timeline-outerBorders		"Hide borders around timeline"			0
@var checkbox			timeline-postBorders		"Hide borders between posts"			0
@var checkbox			timeline-imgBorders		"Hide borders around images"			0
@var checkbox			timeline-quoteBorders		"Hide borders around quotes"			0
@var checkbox			timeline-quoteImg		"Round top corners for quote images"		0

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

@var checkbox			sidemenu-hover			"Show menu only on hover"			0
@var checkbox			sidemenu-hidePremium		"Hide 'Premium' button"				0
@var checkbox			sidemenu-hideJobs		"Hide 'Jobs' button"				0
@var checkbox			sidemenu-hideVerifiedOrgs	"Hide 'Verified Orgs' button"			0
@var checkbox			sidemenu-hidePost		"Hide 'Post' button"				0

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

@var checkbox			sidebar-hover			"Show sidebar only on hover"			0
@var checkbox			sidebar-hideSearch		"Hide sidebar searchbar"			0
@var checkbox			sidebar-hideLike		"Hide sidebar 'You might like'"			0
@var checkbox			sidebar-hideTrends		"Hide sidebar trends"				0
@var checkbox			sidebar-hideLegalNotice		"Hide sidebar legal notice"			0

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

@var checkbox			other-hoverMessages		"Show Messages only on hover"			0
@var checkbox			other-hateBorders		"Make all borders transparent"			0

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

	:root:has(body[style*="rgb(0"]) {
		--bg: rgb(0, 0, 0);
	}

	:root:has(body[style*="rgb(21"]) {
		--bg: rgb(21, 32, 43);
	}

	:root:has(body[style*="rgb(255"]) {
		--bg: rgb(255, 255, 255);
	}

	/* Formerly known as Twitter ¯\_(ツ)_/¯ */
	if wide {
		
		html {
			overflow-x: hidden;
		}
		
		header[role="banner"] {
			position: absolute !important;
			left: 0 !important;
		}

		header[role="banner"] > div {
			position: absolute !important;
			left: 0 !important;
			margin-left: 0 !important;
		}

		header[role="banner"] > div > div {
			left: 0 !important;
		}

		main[role="main"] > div {
			width: 100dvw !important;
		}

		[data-testid="primaryColumn"] {
			position: absolute !important;
			left: 275px !important;
			width: auto !important;
			margin: auto !important;
			max-width: timeline-width !important;
			right: calc(382px + 32px) !important;
			transform: translateX(0) !image-orientation;
		}


		[data-testid="primaryColumn"] > div > div:last-child,
		[data-testid="primaryColumn"] > div > div:last-child > div > div {
			min-width: unset !important;
			max-width: unset !important;
			width: 100% !important;
			margin: 0 !important;
		}

		[data-testid="sidebarColumn"] {
			position: absolute !important;
			right: 0 !important;
			padding-right: 32px !important;
			margin-right: 0 !important;
			width: 382px !important;
			min-width: unset !important;
			max-width: unset !important;
		}

		[data-testid="sidebarColumn"] > div {
			align-items: flex-end !important;
			width: 100% !important;
		}

		[data-testid="sidebarColumn"] > div > div {
			width: 350px !important;
		}


		if sidemenu-hover or sidebar-hover {
			[data-testid="primaryColumn"] {
				transition: all 300ms ease-in-out !important;
			}
		}

		if sidemenu-hover {
			[data-testid="primaryColumn"] {
				left: 0 !important;
			}

			header[role="banner"] > div > div {
				background-color: var(--bg) !important;
			}
		}

		if sidebar-hover {
			[data-testid="primaryColumn"] {
				z-index: 0 !important;
				right: 32px !important;
			}

			[data-testid="sidebarColumn"]:hover {
				width: 414px !important;
				background-color: var(--bg) !important;
			}
		}

		@media screen and (max-width: 1264px) {

			header[role="banner"] > div > div > div {
				width: 68px !important;
			}

			[data-testid="primaryColumn"] {
				left: 68px !important;
			}
		}

		@media screen and (max-width: 987px) {
			[data-testid="primaryColumn"] {
				right: 0 !important;
			}
		}


		@media screen and (max-width: 499px) {
			[data-testid="primaryColumn"] {
				left: 0 !important;
			}
		}
	}

	/* ━━━━━━⮞ Timeline */
	if timeline-header {
		[data-testid="primaryColumn"] > div > div:first-child {
			position: unset !important;
		}
	}

	if timeline-outerBorders {

		[data-testid="primaryColumn"] {
			border-color: transparent !important
		}
	}


	if timeline-hideFollow {
		div[aria-label$="posts"] > div > div:not(:has(:is(article, a[href^="/i/status"], [role="progressbar"], button > div > svg))) {
			display: none !important;
		}
	}

	if timeline-hideAds {
		main section > div > div > div:has(article > div > div > div > div > div > div > div > div > div > span) {
			display: none !important;
		}
	}

	if timeline-postBorders {

		[data-testid="primaryColumn"] nav,
		[data-testid="primaryColumn"] section[role="region"] > div > div > div > div {
			border-color: transparent !important
		}
	}

	if timeline-postBorders or other-hateBorders {
		[data-testid="primaryColumn"]:has(article) > div > div:nth-child(4),
		[data-testid="primaryColumn"] section[role="region"] > div > div > div > div > div {
			background-color: transparent !important;
		}
	}


	if timeline-imgBorders {
		[data-testid="primaryColumn"] div[id^="id__"] > div > div > div > div {
			border-color: transparent !important
		}
	}

	if timeline-quoteBorders {
		[data-testid="primaryColumn"] div[id^="id__"] > div:last-child[role="link"] {
			border-color: transparent !important
		}
	}

	if timeline-quoteImg {
		div[data-testid="tweetPhoto"] {
			border-radius: 16px;
		}
	}

	/* ━━━━━━⮞ Side menu */
	if sidemenu-hover {
		header[role="banner"] > div > div {
			opacity: 0 !important;
			transition: all 300ms ease-in-out !important;
		}

		header[role="banner"] > div > div:hover {
			opacity: 1 !important;
		}

		if wide {
			header[role="banner"] > div > div {
				left: calc(-275px + 32px) !important;
			}

			header[role="banner"] > div > div:hover {
				left: 0px !important;
			}

			@media screen and (max-width: 1264px) {
				header[role="banner"] > div > div {
					left: calc(-88px + 32px) !important;
				}

				header[role="banner"] > div > div:hover {
					left: 0 !important;
				}
			}
		}
	}

	if sidemenu-hidePremium {
		header a[data-testid="premium-hub-tab"] {
			display: none;
		}
	}

	if sidemenu-hideJobs {
		header a[data-testid="jobs-tab-item"] {
			display: none;
		}
	}

	if sidemenu-hideVerifiedOrgs {
		header a[data-testid="vo-signup-tab"] {
			display: none;
		}
	}

	if sidemenu-hidePost {
		header div:has(> a[data-testid="SideNav_NewTweet_Button"]) {
			display: none;
		}
	}

	/* ━━━━━━⮞ Sidebar */
	if sidebar-hover {
		[data-testid="sidebarColumn"] {
			height: 100dvh !important;
			opacity: 0 !important;
			transition: all 300ms ease-in-out !important;
		}

		[data-testid="sidebarColumn"]:hover {
			opacity: 1 !important;
		}

		if wide {
			[data-testid="sidebarColumn"] {
				transition: all 300ms ease-in-out !important;
			}

			[data-testid="sidebarColumn"] {
				transform: translateX(calc(100% - 32px)) !important;
			}

			[data-testid="sidebarColumn"] {
				position: fixed !important;
			}

			[data-testid="sidebarColumn"]:hover {
				transform: translateX(0) !important;
			}

			[data-testid="sidebarColumn"]:hover > div > div > div > div > div > div:first-child {
				transform: translateX(0) !important;
			}
		}
	}

	if sidebar-hideSearch {
		[data-testid="sidebarColumn"]:has(section) > div > div > div > div > div > div:nth-child(1) {
			display: none !important;
		}
	}

	if sidebar-hideLike {
		[data-testid="sidebarColumn"]:has(section) > div > div > div > div > div > div:nth-last-child(3) {
			display: none !important;
		}
	}

	if sidebar-hideTrends {
		[data-testid="sidebarColumn"]:has(section) > div > div > div > div > div > div:nth-last-child(2) {
			display: none !important;
		}
	}

	if sidebar-hideLegalNotice {
		[data-testid="sidebarColumn"]:has(section) > div > div > div > div > div > div:nth-last-child(1) {
			display: none !important;
		}
	}

	/* ━━━━━━⮞ Others */
	if other-hoverMessages {
		div#layers div[data-testid="DMDrawer"] {
			opacity: 0 !important;
			transform: translateX(90%) !important;
			margin-right: 0px !important;
			padding-right: 32px !important;
			transition: all 300ms ease-in-out !important;
		}

		div#layers div[data-testid="DMDrawer"]:hover {
			opacity: 1 !important;
			transform: translateX(0) !important;
		}
	}

	if other-hateBorders {
		* {
			border-color: transparent !important;
		}
	}
}

Reviews

No reviews yet.