GreasyFork | Modernized ( Optional Dark Theme ) by freeplay

Imported from https://codeberg.org/Freeplay/UserStyles/raw/branch/main/GreasyFork-Modernised.user.css

GreasyFork | Modernized ( Optional Dark Theme ) screenshot
Homepage Install Get Stylus Write a review

Details

Authorfreeplay

License

Created atApril 30, 2021 19:57

Updated atApril 30, 2021 19:57

Applies toGreasyFork

Statistics

Learn how we calculate statistics in the FAQ.

Total views99

Total installs266

Weekly installs29

Weekly updates20

Description

A much cleaner and more modern version of GreasyFork!

Notes

Userstyle doesn't have notes.

History

Daily snapshots of style statistics.

2021-07-072021-07-142021-07-202021-07-272021-08-022021-08-092021-08-152021-08-222021-08-282021-09-042021-09-102021-09-16Date0.003.006.009.0012.0015.0018.0021.0024.00Daily countDaily installsDaily updatesDaily views
2021-07-072021-07-142021-07-202021-07-272021-08-022021-08-092021-08-152021-08-222021-08-282021-09-042021-09-102021-09-16Date0.0034.0068.00102.00135.00169.00203.00237.00270.00Total countTotal installsTotal views

Source code

/* ==UserStyle==
 -- THEME STUFF --
@name           GreasyFork | Modernized ( Optional Dark Theme )
@version        1.3.12
@description    A much cleaner and more modern version of GreasyFork!
@updateURL     	https://codeberg.org/Freeplay/UserStyles/raw/branch/main/GreasyFork-Modernised.user.css

 -- AUTHOR STUFF --
@namespace      Freeplay
@author         Freeplay (https://freeplay.codeberg.org/)
@homepageURL    https://codeberg.org/Freeplay/UserStyles
@supportURL     https://codeberg.org/Freeplay/UserStyles/issues
@preprocessor   stylus


--- SETTINGS ---
@var checkbox darkmode "Dark Mode" 0 

==/UserStyle== */
/* Btw I didn't know how version numbers properly worked before when I first started making this so... */
/* Dec, 16 / 20
- Fixed codeblocks being barely visable https://codeberg.org/Freeplay/UserStyles/issues/4
- Other minor fixes
/* Nov, 15 / 20
- Added borders to sections
- More fixes
/* Nov, 12 / 20
- Changed header to accommodate for other languages & Username lengths (I didn't think about that stuff before, woops!)
- Added border around script list items 
/* Nov, 11 / 20
- Fixed login screen
- Modernised login button in header
- More fixes & Tweaks
- Better thumbnails with Greasy Fork Tweaks https://greasyfork.org/en/scripts/368183
/* Nov, 7 / 20
- Modernised Favorites List
- Tweaked sidebar scrollbar
- Improved Header & Search bar!
/* Nov, 4 / 20
- Modernised dropdown, contributed by: https://codeberg.org/Riedler
/* Oct, 23 / 20
- Changed card color in Dark Mode
- More fixes
- More tweaks
- More links to buttons...
- Changed button color on hover in light theme
/* Oct, 19 / 20
- Nicer font
- Fixed spacing in some areas
- Fixed alerts box on Dark Mode
- Better sortof seperators
- Transparent blurred header, can be removed by making color-primary var opaque.
- More Tweaks
- Now works with 'Greasy Fork Tweaks'! https://greasyfork.org/en/scripts/368183
/* Oct, 15 / 20
- Added max-width to alerts
- Added boxes around forms and comments
- Added scrollbar-color to firefox
- Added max-heights to script lists
- More stylized buttons
- More fixes
- Made stat charts on Dark Mode light
/* Aug, 31 / 20
- Fixed ad placement in Script Details page
- Less saturated topbar on light theme, You can always change the colors inside of :root{}
- Moved some buttons on scripts list page
/* Aug, 23 / 20
- Properly modernised the Script Details page! :D
/* Aug, 20 / 20
- Softened Shadows
- Changed script details page a bit
- Fixed header on homepage
- Fixed forums on Dark Mode
- Moved search bar to header
- Fixed some textboxes
- More fixes
/* Aug, 16 / 20
- Better positioning & look
- Better sidebar
- Forums support
- Added max-width to some pages
- Better Metadata
*/
/* Jul, 6 / 20
- Dark Mode!
*/
/* Jun, 7 / 20 
- Changed links back to underlines, Didn't work too well in some areas
*/
/* Jun, 5 / 20 
- Minor changes - AKA other things I forgot to log.
- Modern TextBox
- Sortof Modern Dropdown
- Links are now shown by the blue color instead of the underline, hovering displays underline
- Tweaked Header
*/
@-moz-document domain("greasyfork.org") {
	:root {
		if darkmode {
			/* DARK MODE COLORS */
			--color-primary: #272b36bd;
			--color-secondary: #072b3a ;
			--color-tertiary: #2c3242;
			--color-bg: #1c1f28;
			--color-text: #d1d1d1;
			--color-link: #00b3ff;
			--color-link-visited: cyan;
			--color-highlighted #287721;
			--shadow-normal: 0 0px 3px rgba(0,0,0,0.5);
			--shadow-button: none;
			--border-button:  1px solid rgba(150,150,150,.1);
		} else {
			/* LIGHT MODE COLORS */
			--color-primary: #980000bd;
			--color-secondary: white;
			--color-tertiary: white;
			--color-bg: #F6F6F6;
			--color-text: black;
			--color-link: #0265be;
			--color-link-visited: #cf2525;
			--color-highlighted: #9fefa3;
			--shadow-normal: 0 0 10px rgba(0, 0, 0, .01);
			--shadow-button: 0px 0px 0px 20px var(--color-bg) inset;
			--border-button:  1px #dcdcdc solid;
		}
	}
	* {
		transition: background .2s;
	}
		
		/* TEXT */
		h3, h2 {
			color: var(--color-text);
		}
		h3 {
			margin-bottom: 1em !important;
		}
		p {
			color: var(--color-text);
		}
		pre, textarea, .preview-results {
			background-color: var(--color-secondary) !important;
			border: var(--border-button) !important;
			border-radius: .3rem;
			color: var(--color-text);
		}
		.code-container {
			max-height: none !important;
			border: none !important;
			border-radius: 4px !important;
		}
		pre.prettyprint {
			background-color: white !important;
			max-height: none;
			margin-top: 0;
			color: black;
		}
		
		.post-discussion > p:first-child,
 		.sidebarred-main-content > p,
		.post-discussion > div:last-of-type ,
 		{
			font-size: 0;
		}
		.sidebarred-main-content > h2 + p {
			font-size: inherit !important;
			margin-top: 0 !important;
		}
		
		/* BUTTONS/LINKS */
		select, option, input, button:not(.lum-gallery-button), code, #user-control-panel > li, .sign-in-link a,
		.pagination > *, .script-list + .pagination > *, .user-list + .pagination > *, 
		a.list-option-button, #script-links > li > *, #script-feedback-suggestion a, .discussion-actions a, .report-link, .edit-comment, .post-discussion > p:first-of-type a, .discussion-up-level a, .post-discussion > div > .inline-list > li a,
		#script-content > ul li a,
		#about-user > p:last-child > *, #about-user > a:first-child,
 		#install-area a, .expander, #contribution > a,  #support-url > a, .script-in-sets > a,
 		.sidebarred-main-content > p:last-child a, .sidebarred-main-content > p:first-of-type a,
 		#home-top-sites a,
 		#by-site-list > li > a {			
			border: var(--border-button) !important;
			text-decoration: none !important;
			border-radius: .3rem !important;
			padding: 5px 14px;
			font-size: 14px;
			font-family: Segoe UI, Helvetica, Arial, sans-serif, Segoe UI Emoji !important;
			transition: all .2s;
			background-color: var(--color-secondary) !important;
			color: var(--color-text) !important;
			list-style: none;
			outline: none !important;
		}
		code {
			padding: 2px 4px !important;
		}
		select:hover, input:hover, input:focus, button:not(.lum-gallery-button):hover, #user-control-panel > li:hover,  .sign-in-link a:hover,
		a.list-option-button:hover, #script-links > li > *:hover, #script-feedback-suggestion a:hover, #script-links .current span, .discussion-actions a:hover, .report-link:hover, .edit-comment:hover, .post-discussion > p:first-of-type a:hover, .discussion-up-level a:hover, .post-discussion > div > .inline-list > li a:hover,
		#script-content > ul li a:hover,
		#about-user > p:last-child > *:hover, #about-user > a:first-child:hover,
		.pagination > *:hover, .script-list + .pagination > *:hover, .user-list + .pagination > *:hover, .pagination > *:focus, .script-list + .pagination > *:focus, .user-list + .pagination > *:focus, 
 		#install-area a:hover, .expander:hover, #contribution > a:hover, #support-url > a:hover, .script-in-sets > a:hover,
 		.sidebarred-main-content > p:last-child a:hover, .sidebarred-main-content > p:first-of-type a:hover,
 		#home-top-sites a:hover,
 		#by-site-list > li > a:hover {
			box-shadow: var(--shadow-button) !important;
			background-color: var(--color-tertiary) !important;
			text-decoration: none !important;
		}
		
		select:not(#remove-scripts-included) { /* Contributed by https://codeberg.org/Riedler */
			appearance:none;
			background-image:url("https://riedler.wien/sfto/darklearning/double_triangles_top_bottom_AAA.svg");
			background-repeat:no-repeat;
			background-position:center right 7px !important;
			background-size:auto 50%;
		}
		
		
		nav > li > a, .pagination > a, #user-control-panel > li > a, #script-links > li > a, div[class="list-option-group"] > ul > li > a, h2 > a ,
		.comment-meta-item-main a {
			text-decoration: none;
			color: var(--color-text);
		}
		.pagination {
			margin-bottom: 20px;
		}
		a {
			display: inline-block;
		}
		a, a.discussion-title, a.discussion-title:hover {
			text-underline-offset: .25em;
			color: var(--color-link);
		}
		a:hover, a.discussion-title:hover {
			text-decoration: underline;
		}
		a:visited {
			color: var(--color-link-visited);
		}
		body, html {
			background-color: var(--color-bg);
			font-family: Segoe UI, Helvetica, Arial, sans-serif, Segoe UI Emoji !important;
		}
		body > .width-constraint {
			max-width: 100% !important;
			margin: 0;
			padding: 10px;
			display: flex;
			flex-wrap: wrap;
		}
		body > .width-constraint > * {
			width: 100%;
		}
		body > .width-constraint > section, .notice, .alert, .announcement {
			max-width: 80rem;
			margin: auto !important;
		}
		body > .width-constraint > section:first-child, .notice, .alert {
			margin-top: 20px !important;
		}
		body > .width-constraint > section:last-of-type {
			margin-bottom: 40px !important;
		}
		.alert, .announcement {
			background-color: var(--color-secondary);
			margin-bottom: 20px !important;
		}
		.alert *, .announcement {
			color: var(--color-text) !important;
			padding: 10px;
		}
		.announcement {
			margin-top: 10px !important;
			border-radius: .3rem;
		}
		section {
			border: none !important;
		}
		
		.notice {
			background-color: var(--color-secondary);
		}
		
		
		.text-content, .discussion-list, #browse-user-list, .inline-form, #new_user,
		#script-meta, #additional-info, #script-show-info-ad, #script-content .script-discussion-list, canvas, 
		/*.multiform-page*/, #script-content form:not(.script-in-sets), table, .comment,
 		#script-content > ul {
			padding: 1rem !important;
			margin: 0 auto !important;
			margin-bottom: 20px !important;
			border: var(--border-button) !important;
			box-shadow: var(--shadow-normal) !important;
			background-color: var(--color-tertiary) !important;
			color: var(--color-text);
			border-radius: .5rem;
		}
		.text-content > *:first-child {
			margin-top: 0 !important;
		}
		.text-content > *:last-child, #script-meta > *:last-child {
			margin-bottom: 0 !important;
		}
		
		
	@media only screen and (min-width: 940px) { 
		
		
		body {
			margin-top: 44px;
		}
		
		
		
		

		/* HEADER */
		#main-header {
			position: fixed;
			top: 0;
			width: 100%;
			height: 44px;
			padding: 0;
			z-index: 5;
			background-image: none;
			background-color: var(--color-primary);
			backdrop-filter: blur(10px);
		}
		#main-header > .width-constraint {
			max-width: 100%;
			padding-left: 10px;
			padding-right: 10px;
			display: flex !important;
			align-items: center;
			margin: auto !important;
		}
		#site-name {
			position: absolute;
			width: 150px;
			min-width: 150px;
			height: 30px;
			margin-top: auto;
			margin-bottom: auto;
		}
		#site-name img {
			height: 30px;
		}
		#site-name-text {
			margin-top: 0 !important;
		}
		#site-name-text > h1 {
			height: 30px;
			font-size: 25px;
			font-weight: 600;
		}

		#site-nav {
			display: flex !important;
			height: 40px;
			padding-top: 1px;
			width: auto;
			align-items: center;
			margin-top: 0 !important;
			width: 100%;
			justify-content: flex-end;
		}
		#site-nav > * {
			position: relative !important;
		}
		#site-nav > nav {
			width: 100% !important;
			height: 20px;
			display: flex;
			align-items: center;
			justify-content: flex-end;
		}
		#nav-user-info {
			width: auto;
			order: 2;
			height: 20px;
			display: flex;
			align-items: center;
		}
		#nav-user-info .sign-out-link, #nav-user-info .sign-in-link {
			width: max-content !important;
		}
		#nav-user-info > form > select {
			margin: 0 0 0 26px;
			height: 32px;
		}
		
		#site-nav > nav > li + li {
			margin-left: 1em;
		}
		#nav-user-info .user-profile-link a, #nav-user-info .sign-out-link a {
			text-decoration: none;
			font-size: 16px;
		}
		#nav-user-info .sign-out-link {
			font-size: 0;
			margin-left: 16px;
		}
		#nav-user-info .with-submenu {
			padding-right: 16px;
		}
		#nav-user-info a:hover {
			text-decoration: underline;
		}
		.with-submenu > nav {
			background-color: var(--color-primary);
			backdrop-filter: blur(10px);
		}
		
		/* SIDEBAR */
		.sidebar ~ div {
			max-width: 50rem;
		}
		.sidebar {
			position: sticky;
			top: 44px;
			order: -1;
			margin: -10px 15px -10px -10px;
			padding: 20px 0 20px 10px;
			height: calc(100vh - 84px);
			max-height: calc(100vh - 84px);
			overflow-y: auto;
			overflow-x: hidden;
			z-index: 6;
			text-decoration: none !important;
			
			scrollbar-color: var(--color-primary) transparent;
			scrollbar-width: thin;
		}
			.sidebar-search {
				position: fixed;
				top: 5px;
				left: 180px;
				
			}
				.sidebar-search input[type="search"] {
					height: 32px;
					border: none !important;
					border-radius: .3rem !important;
					width: 170px;
					text-align: center;
					color: var(--color-text) !important;
					padding-inline-end: 30px;
					box-shadow: 0px 0px 2px rgba(0,0,0,0.1) !important;
					background-color: var(--color-primary) !important;
					color: white !important;
					font-weight: 700;
					filter: opacity(.5);
					transition: width .2s, background-color .5s, color .5s, filter .2s; 
				}
				.sidebar-search input[type="search"]:focus, .sidebar-search input[type="search"]:hover {
					width: calc(100vw - 450px);
					transition: width .5s, background-color .2s, color .2s, filter .2s; 
					filter: opacity(1);
					background-color: var(--color-secondary) !important;
					color: var(--color-text) !important;
				}
				.sidebar-search input[type="submit"] {
					display: none;
				}
			#script-list-option-groups > div, .list-option-group {
				padding: 10px;
				color: var(--color-text);
				
				background-color: var(--color-secondary);
				border-radius: .3rem;
				box-shadow: 0px 0px 2px rgba(0,0,0,0.1);
			}
				#script-list-option-groups > div > ul, .list-option-group > ul {
					background-color: transparent;
					box-shadow: none;
					border: none;
					margin: -10px;
				}
				.list-current {
					border-left-color: var(--color-primary) !important;
					border-left-width: 4px !important;
				}
				if darkmode {
					.list-current {
						background: none !important;
						background-color: var(--color-tertiary) !important;
						color: var(--color-text);
					}
					.list-option-group a:hover, .list-option-group a:focus {
						background: none !important;
						background-color: var(--color-tertiary) !important;
						box-shadow: none !important;
					}
				}
					
					
	
					
					
					
		/* LISTS */
		.sidebarred-main-content {
			margin-top: 10px !important;
		}
		.sidebarred-main-content > h2 {
			margin-top: 0;
		}
		#browse-script-list {
			margin-top: 0;
		}
		#browse-script-list, #user-script-list, #user-deleted-script-list {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
			grid-gap: 10px;
			border: none;
			box-shadow: none;
			background-color: transparent;
		}
		
		
	}
		
		
			#browse-script-list > li, #user-script-list > li, #user-deleted-script-list > li {
				border: var(--border-button) !important;
				border-radius: .5rem;
				background-color: var(--color-tertiary);
				transition: box-shadow .2s;
				color: var(--color-text);
				display: flex;
			}
			#browse-script-list > li:hover, #user-script-list > li:hover, #user-deleted-script-list > li:hover {
				box-shadow: 0px 2px 20px rgba(0,0,0,0.1);
			}
				#browse-script-list > li > article, #user-script-list > li > article, #user-deleted-script-list > li > article {
					height: 100%;
					display: flex;
					flex-wrap: wrap;
					width: auto !important;
					flex-grow: 1 !important;
					max-width: 100% !important;
				}
					#browse-script-list > li > article > h2 {
						overflow: hidden;
						max-height: 100px;
					}
					.inline-script-stats {
						margin-top: auto;
						width: 100%;
					}
					.inline-script-stats dd {
						max-width: 100%;
					}
					#browse-script-list > li > article > h2 > a {
						font-weight: 600;
					}
					#browse-script-list > li > article > h2::before {
						content: "";
						display: flex;
						position: relative;
						z-index: 2;
						width: 100%;
						height: 40px;
						color: var(--color-tertiary);
						background: linear-gradient(transparent, currentColor);
						box-shadow: 0 10px 0 var(--color-tertiary);
						margin-top: -40px;
						transform: translateY(100px);
						pointer-events: none;
					}
					/* Greasy Fork Tweaks Thumbnail Images */
					#browse-script-list > li > article ~ div,
 					#user-script-list > li > article ~ div,
					#user-deleted-script-list > li > article ~ div {
						max-height: 185px !important;
						height: calc(100% + 2em) !important;
						width: auto !important;
						max-width: 40% !important;
						margin-right: -1em !important;
						margin-top: -1em !important;
						margin-bottom: -1em !important;
						margin-left: 1em !important;
						border-top-right-radius: .5rem !important;
						border-bottom-right-radius: .5rem !important;
						padding: 0 !important;
						transition: max-width .5s, width .5s;
						display: flex !important;
						transition: max-width .5s;
						justify-content: center;
					}
					#browse-script-list > li > article ~ div > img,
 					#user-script-list > li > article ~ div > img,
					#user-deleted-script-list > li > article ~ div > img {
						max-width: 100% !important;
						width: 100% !important;
						align-self: center;
					}
					#browse-script-list #script-list-ea {
						width: 100%;
					}
					#browse-script-list #script-list-ea + div:last-of-type {
						display: none !important;
						width: 0 !important;
					}
				
			.script-list li:not(.ad-entry) {
				border-right: 1px solid #DDDDDD;
			}
			.ad-entry, #codefund {
				grid-column: 1/-1;
			}
			.ad-entry > div {
				height: auto !important;
				padding: 0 !important;
			}
			[data-ea-publisher].loaded .ea-content a:link, [data-ea-type].loaded .ea-content a:link {
				color: var(--color-link) !important;
			}
			
			
		.sidebarred-main-content {
			display: flex;
			flex-wrap: wrap;
			height: min-content;
		}
		.sidebarred-main-content > * {
			width: 100%;
			
		}
		.sidebarred-main-content > p {
			width: auto;
			margin: 1em 0 0;
		}
		.sidebarred-main-content > p:last-child {
			order: -1;
		}
			
		/*** FILTER BY SITES PAGE ***/
		
		#by-site-list > li > a {
			font-size: inherit !important;
		}

		/*** SCRIPT DETAILS PAGE ***/
		
		#script-info {
			display: flex;
			flex-wrap: wrap;
			
			background: none !important;
		}
		#script-info > * {
			width: 100%;
		}
		#script-info, #additional-info, #user-profile {
			background: none;
			background-color: var(--color-tertiary);
			box-shadow: none;
			color: var(--color-text);
		}
		#script-info > header {
			order: -1;
			width: 100%;
		}
		#script-info header h2 {
			font-weight: 600;
		}
		#script-links {
			margin: 12px 0;
			padding-top: 12px !important;
			padding: 0;
			display: flex;
			flex-wrap: wrap;
			
			position: sticky;
			top: 45px;
			display: inline;
			width: 150px;
			height: min-content;
			max-height: calc(100vh - 58px);
			overflow-y: auto;
		}
		#script-links .current {
			border: none !important;
			box-shadow: none;
		}
		#script-links li {
			margin: 8px 0px;
		}
		.script-show-applies-to .inline-list {
			display: flex;
			flex-wrap: wrap;
		}
		#script-content {
			margin: 20px;
			width: calc(100% - 200px);
			display: flex;
			flex-wrap: wrap;
			height: min-content;
		}
		#script-content > * {
			width: 100%;
		}
		.install-link {
			background-color: var(--color-highlighted) !important;
		}
		#script-feedback-suggestion, .script-in-sets, #install-area {
			margin: 0;
			width: auto !important;
			display: flex;
			flex-wrap: wrap;
			font-size: 0;
		}
		#script-feedback-suggestion a, .script-in-sets *, #install-area a,
 		.post-discussion > p:first-child a,
 		.sidebarred-main-content > p a {
			font-size: 14px;
			margin: 0;
			margin-right: 8px;
			margin-bottom: 1em;
		}
		.discussion-snippet {
			white-space: normal !important;
		}
		.script-in-sets {
			order: 1;
			width: 100% !important;
		}
		#script-meta {
			order: 2;
			max-width: none;
			flex: 1 1 400px;
		}
		#script-meta dt {
			max-width: none !important;
		}
		
		#script-show-info-ad {
			order: 3;
			margin-left: 1em !important;
			flex: 1 1 200px;
		}
		#additional-info {
			order: 3;
			display: flex;
			flex-wrap: wrap;
		}
		#additional-info > * {
			width: 100%;
		}
		.user-screenshots {
			order: -1;
			margin-top: 0 !important;
			margin-bottom: 1em;
			width: 100%;
		}
		.post-discussion {
			width: 100%;
		}
		
		section > *:first-child, #script-content > *:first-child, #script-content p, #script-content h3, form > p:first-of-type,
 		.discussion-header {
			margin-top: 0 !important;
		}
		.multiform-page {
			padding: 0 !important;
		}
		
		canvas {
			background-color: white !important;
		}
		/*** FORUMS ***/
		.discussion-read {
			background-color: var(--color-secondary) !important;
		}
		.discussion-list-item {
			border-top: var(--border-button) !important;
			border-bottom: var(--border-button) !important;
		}
		.user-content {
			background: none;
		}
		.comment-meta-item a {
			margin-bottom: -100px;
		}
		.discussion-header h2 {
			margin-top: .5rem;
		}
		
		/* FAVORITES LIST */
		.post-discussion > div:last-of-type {
			order: 5;
		}
			
		/*** USER PAGE ***/
		/* About User */
		
		a.report-link.report-link-abs {
			margin-top: 1em !important;
		}
		/* Control Panel */
		#user-control-panel, #script-content > ul {
			display: flex;
			flex-wrap: wrap;
			grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
			grid-gap: 10px;
			padding: 10px;
			list-style: none;
		}
			#user-control-panel > li {
				text-decoration: none;
				list-style: none;
				text-align: center;
				background-color: var(--color-secondary);
				padding: 5px 16px;
				border-radius: .3rem;
			}
			
		.post-discussion > div > .inline-list {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
			grid-gap: 4px 6px;
		}
			.post-discussion > div > .inline-list > li a {
				display: block;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		


		/*** HOMEPAGE ***/
		body .width-constraint > .text-content > h2 {
			z-index: 2;
			position: relative;
			margin-bottom: 1rem;
			margin-top: 2rem !important;
		}
		#home-script-nav {
			margin-bottom: 60px;
			z-index: 1;
			width: max-content;
			max-width: none;
			border: none !important;
		}
		
		#home-top-sites {
			margin-top: 1rem;
			z-index: 2;
			position: relative;
			font-size: 0;
		}

		/*** POPUPS ***/
		.lum-lightbox {
			z-index: 100;
		}


		
	}

Reviews

pluff reviewed and gave 5/5 ⭐ on July 24, 2021 at 05:59
always a fan of more compactness and seems to be working well.