DeAnnoy CNBC [papo] by papo

/* ==UserStyle==
@name           DeAnnoy CNBC [papo]
@namespace      github.com/paponius/userstyles
@version        1.0.2
@description    Updated: 2025-03 [m] Notes and feedback: https://github.com/paponius/userstyles/. Removed distracting and annoying elements. See what it does in the UserStyle Options, or read @var descriptions on top of the code.
@author         Papo
@homepageURL    https://github.com/paponius/userstyles/
@supportURL     https://github.com/paponius/userstyles/
@license        CC BY-NC-SA 4.0
@preprocessor   less

@var checkbox UnstickHeader          "Unstick the header" 1
@var checkbox HideBottomShareHeader  "Hide bottom share header on mobile" 1
@var checkbox HideBottomMobileHeader "Hide bottom header on mobile, when scrolled up. (Menu, Markets, Video, Watchlist icons will be unreachable)" 0
@var checkbox HideNewsletter         "Hide Newsletter subscription box" 1
@var checkbox FooterMinimize         'Footer: leave only TM on Article pages. Full footer still present on Home Page.' 1
@var checkbox responsive             'responsive (for old site)' 0


==/UserStyle== */

@-moz-document domain("cnbc.com")

, url-prefix("file:///")

{

/* === fix [m] === */
/* maybe copy here from my Dark UserStyle */
/* - fix overlapping header items - */
& when (@UnstickHeader = 9) {
}


& when (@UnstickHeader = 1) {
    .CNBCGlobalNav-container {
		position: absolute;
	}
}

/* when top scrolled */
div#nav-menu-article.nav-menu-navMenu.nav-menu-navMenuArticle.nav-menu-navMenu {

}

/* when scrolled down */
div#nav-menu-articleSticky-persistent.nav-menu-navMenuSticky.nav-menu-navMenu.nav-menu-navMenuArticleSticky.nav-menu-navMenuSticky.nav-menu-navMenu {

}

& when (@HideBottomShareHeader = 1) {
	.nav-menu-navMenuSticky, .nav-menu-navMenu.nav-menu-navMenuArticleSticky, .nav-menu-navMenuSticky {
		display: none;
	}
}

& when (@HideBottomMobileHeader = 1) {
	.nav-menu-navMenu, .nav-menu-navMenuAllAccess, .nav-menu-navMenuIC, .nav-menu-navMenuPro {
		display: none;
	}
}

& when (@HideNewsletter = 1) {
	.ArticleBody-articleBody [data-test="WildCardEmbed"]:has([href$="-newsletter"]) {
		display: none;
	}
}

/* todo on mobile does not show TM, only the ::after content. Can't simulate mobile on Desktop properly. Something's different in footer. */
& when (@FooterMinimize = 1) {
	.cnbcBrand:has(.Regular.Article) footer {
		padding: 7px 0 0;

		.CNBCFooter-wrapper > :not(.CNBCFooter-info) {
			display: none;
		}
		.CNBCFooter-info {
/* 			margin: 0 auto 15px; */
			margin: 0 auto;
		}
		.CNBCFooter-info.sf-hidden {
			display: block !important;
			color: #ccc;
			margin: 0 auto;
			font-size: 10px;
			grid-column: 1/-1;
		}
		.CNBCFooter-wrapper::after {
			content: 'To access full Footer, go to the Home Page';
			color: #ccc;
			margin: 0 auto 15px;
/* 			align-items: center; */
/* 			display: flex; */
			font-size: 10px;
			grid-column: 1/-1;
/* 			letter-spacing: .5px; */
		}
	}
}


/*** responsive design ***/
/* from my old US: cnbc.com res [papo]
Date installed: Aug 1, 2018
Date updated: — */
& when (@responsive = 1) {
	.cnbc-body {
		width: unset;
	/* width: 970px; */
	}

	.cnbc-contents {
		min-width: unset;
	/* min-width: 970px; */
	}
	.story-top {
		width: unset;
		/* width: 940px; */
	}

	/* 530 + 350880 = 880 */
	.story-top .story-header-left.twoCol {
		width: calc(70% - 15px - 15px);
		/* width: 530px; */
		margin: 0 15px 0 15px;
		/* margin-right: 60px; */
	}
	.story-top .story-header-right {
		width: calc(30% - 15px);
		/* width: 350px; */
		margin-right: 15px; /* nothing was defined */
	}

	.cols2 .col1 {
		width: calc(70% - 15px - 15px);
		/* width: 530px; */
		margin: 0 15px 0 15px;
		/* margin: 0 60px 0 15px; */
	}
	.cols2 .col2 {
		width: calc(30% - 15px);
		/* width: 350px; */
	}
}

}