Skip to content

curseforge.com make content use ALL screen area by osirisgothra

Details

Authorosirisgothra

LicenseShare Alike, Creative Commons

Categorycurseforge.com

Created

Updated

Size3.6 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Forces curseforge content pages to use the WHOLE screen.

Notes

This is an alternative to my other style that makes auto-sizes the file column which is meant for smaller screens that cant fit
filenames on the same line without overlapping content.

If you use a large wide screen, this is the style for you.
If you use a tiny screen, use my other curseforge style.

Both are meant to help with items that are too long that they use elipses (... replaces readable text)

Source code

/* ==UserStyle==
@name         curseforge.com make content use ALL screen area
@version      20240705.18.57
@namespace    https://userstyles.world/user/osirisgothra
@description  Forces curseforge content pages to use the WHOLE screen.
@author       osirisgothra
@license      Share Alike, Creative Commons
==/UserStyle== */

@-moz-document domain("curseforge.com") {
/*
curseforge.com make content use ALL screen width

by osirisgothra

v1.02

The margin is there to prevent eye strain but you can set it to whatever you want below

This is an alternative to my other style that makes auto-sizes the file column which is meant for smaller screens that cant fit
filenames on the same line without overlapping content.

Update:
  1.02
    * HACK: move the "v DOWNLOAD FILE" into a button
      that covers the hamburger menu and just gives you
      an already visible button for download
      (since I had to hack out and isolate the menu in ways that are normally impossible for an outsider, it might not look right on all screens, good luck!)

    * greenified the correct download button (install still works too but is faded)
    * decluttered game header
    * removed some clutter, tweaked some values and removed annoying slow box shadows

If you use a large wide screen, this is the style for you. 
If you use a tiny screen, use my other curseforge style(s)

If you need to unclutter the download page, please check out my
download-page specific style for hiding clutter on userstyles.world


*/
div#__next div.container.project-page
{
	--margin-size: 6px;	
	min-width: calc(100% - calc( var(--margin-size) * 2 )) !important;		
	margin-left: var(--margin-size) !important;	
	margin-right: var(--margin-size) !important;	
	margin-top: 0px;
	margin-bottom: 0px;	
}
#__next > div > main > div.ads-layout > div > div > section > div.files-table-container.columns-7 > div > div > div > div > ul
{
    opacity: 1 !important;
    color: #ccc !important;
    background-color: transparent !important;
    pointer-events: all !important;
    top: 10px;
    overflow: hidden;
    font-size: 0px;    
    left: 10px;
    
}
#__next > div > main > div.ads-layout > div > div > section > div.files-table-container.columns-7 > div > div > div > div > ul>li:nth-of-type(1)
{
    display: none;        
}
#__next > div > main > div.ads-layout > div > div > section > div.files-table-container.columns-7 > div > div > div > div > button
{
    pointer-events: none;
}
#__next > div > main > div.ads-layout > div > div > section > div.files-table-container.columns-7 > div > div > div > div > ul,
#__next > div > main > div.ads-layout > div > div > section > div.files-table-container.columns-7 > div > div > div > div > ul *
{    
    box-shadow: none !important;
    width: 70px;
    padding: 0px !important;
    margin: 0px !important;
}
#__next > div > main > div.ads-layout > div > div > section > div.files-table-container.columns-7 > div > div > div > div > ul a
{
    width: 20px;
    background: #1a1a1a;
}
#__next > div > main > div.ads-layout > div > div > section > section > h2 > div > div > a.btn-cta.download-cta
{
    background: green;
}
#__next > div > main > div.ads-layout > div > div > section > section > h2 > div > div > a:nth-child(2)
{
    opacity: 0.125
}
#__next > div > main > div.game-header
{
    display: block;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vw;
    z-index: -1;
}
#__next > div > main > div.ads-layout > div > * > *
{
    backdrop-filter: blur(2px) saturate(20%);
    border-radius: 10px;
    
}


}

Reviews

No reviews yet.