Skip to content

Instantly share code, notes, and snippets.

@zetix
Created September 16, 2024 15:00
Show Gist options
  • Save zetix/3073e2d230a8e768bff4c797ce2c9545 to your computer and use it in GitHub Desktop.
Save zetix/3073e2d230a8e768bff4c797ce2c9545 to your computer and use it in GitHub Desktop.
Steam What's New Fix

Steam What's New Fix

Provides instructions on how to hide/remove Steam's What's New content on top of Library.

Working as of 2024-09-16:

CSS appears to be randomly generated now so this would most likely break with every update.

File to change: chunk~2dcc5aaf7.css

Full file path is: C:\Program Files (x86)\Steam\steamui\css\chunk~2dcc5aaf7.css, assuming no changes to default steam install location.

Triple left click the block to select the entire line to copy and search for.

Search for:

_17uEBe5Ri8TMsnfELvs8-N{box-sizing:border-box;padding:16px 16px 0px 24px;position:relative;height:324px;overflow:hidden;background-image:linear-gradient(to top, #171d25 0%, #2d333c 80%)}

and replace with:

_17uEBe5Ri8TMsnfELvs8-N{display: none !important;                                                                                                                                        }

How to find the css class names to hide

Trying to make this as simple as possible, but it may be difficult to follow for the casual user. But front end developers should be able to understand the instructions roughly.

  1. Go to Steam application directory and right click Steam.exe and under Send to, select Desktop to create a shortcut. The UI may be different in Windows 11, but essentially we just want to create a shortcut on desktop to the Steam.exe.
  2. Right click on the shortcut and open Properties.
  3. Add -dev -offline to the end of Target field.
  4. Exit steam completely and open steam with the shortcut instead. You'll know if the shortcut is working correctly if you have a new Console tab on the top of your steam.
  5. Go to Library tab and press F12 on your keyboard to open the developer console. This should open 2 new windows, DevTools - Steam, and DevTools - SharedJSContext. We want to use DevTools - Steam.
  6. On DevTools - Steam window, select the Box with an Arrow next to Elements tab on the top.
  7. Click on the What's New section in your Library tab.
  8. On DevTools - Steam, it should now display the styles that's used on What's New. In this example, it will be _17uEBe5Ri8TMsnfELvs8-N.
  9. Find this class in the *.css file shown next to the class name in your steamui/css directory.
  10. Do the steps above to replace the contents inside {} to display: none !important; followed by however many spaces for each character/symbol in the css class.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment