Hi! I created a Stylus theme for srcom! Stylus is a browser extension that allows you to modify the Stylesheets (CSS) of a website. You can find the style here: https://gist.github.com/shenef/3dd4b99e74882873d7fb45cb5549f5b1

Comparison images: https://imgur.com/a/x5Z01C7

Features | design changes | fixes | improvements:

• adjustable settings for the maximum page width, video height, profile picture size and forum post width
• the load more games button on the games page is not moving anymore while game images are still loading
• long drop down menus, for example in the variable selector or some misc category lists, now have a scrollbar
• better wide screen support
• if your screen is wide enough multiple rows of categories or sub-categories collapse back into one row
• larger and better visible game name on leaderboards
• leaderboard content is now aligned to the left
• videos on run pages are larger (they use 87% of the screen height so you can still see the category, time, etc below the video)
• the end of the messages page doesn't touch the bottom of the screen anymore
• better scroll bar
• better audit log layout
• several small UI fixes

Issues:

• Statistics get too large on wide screens since they dynamically scale with the screen width. Since they are in a canvas element i can't even fix that.

How to use this:

1. install the stylus extension for chrome or firefox https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne https://addons.mozilla.org/firefox/addon/styl-us/
2. open speedrun.com, click on the extension and in "write a style for" select "speedrun.com"
3. copy/paste the contents of the gist and hit save

Keep in mind that changes on the site can break parts of the theme. If you have any suggestions or issues you can contact me on discord or comment here or on the gist.

Not a huge fan of everything this does, I feel like the extra width just creates a lot of dead space on the main part of the page which isn't so great on leaderboards especially, but some of this stuff is actually really nice, most notably for me is the change to the All Games page.

What exactly do you mean by "fix statistics"?

If you want it to be less wide you can change the max-width value at line 63, i think the default value is around 45%. If your browser window is less than 1600px wide it uses the default content width values of the page. That the page can become too wide is a problem i'm aware of, there are some things i'd like to do but can't because i'm restricted to only CSS. For example add a description column to leaderboards or add more than just the default category to Individual Level leaderboards (with a max of 20 categories, otherwise it's too much, even for a 21:9 screen).

The max-width value also breaks the statistics for very wide screens since their height scales with the page width. That causes them to become higher than the viewable area of the page.

First update:

• added a few easily adjustable settings (page width, video height and profile pic size)
• improved the audit log layout and usability
• small improvements to image size and scaling
• limited messages page height
• cleaned up the CSS and added comments

To update just replace your current CSS with the updated contents of this: https://gist.github.com/shenef/3dd4b99e74882873d7fb45cb5549f5b1 (same link as in the first post)

Second update:

• Finally made some comparison images: https://imgur.com/a/x5Z01C7
• added a forum post line length setting
• fixed distorted favicon icons if they are not square
• removed the nearest neighbor scaling on icons and images
• some more "code" comments and explanations
• small changes to the default values
• improved "(empty)" marker visibility on some leaderboard color combinations

It looks like the site is slowly fixing some things, so i will probably remove a few features soon.

To update just replace your current CSS with the updated contents of this: https://gist.github.com/shenef/3dd4b99e74882873d7fb45cb5549f5b1 (same link as in the first post)

Another update :)

• the last site update broke the front page so i fixed it
• the category selection on leaderboard now always takes up the full width (thx to @10 for suggesting that)
• better sizing for elements in the audit log (thx to @10 for suggesting that)
• if you don't like the new sidebar and font on the frontpage, you can remove it by uncommenting the last few lines of the CSS

As always, to update just replace your current CSS with the contents of this: https://gist.github.com/shenef/3dd4b99e74882873d7fb45cb5549f5b1