SteamGifts v2 Dark Userstyle


Bright/light sites can be hard on the eyes so for us ocular challenged people i created a darker version. Works on www.steamgifts.com, www.steamtrades.com, www.sgtools.info . Compatible with most scripts found in the addon registry..

Also check out my other style SG Dark Grey.

Note: Style is now hosted on github as userstyles.org is no longer supported.


Install Stylus for either Firefox, Chrome or Opera and then install the style using one of these methods:

📦 Install the usercss which supports automatic updates and customization.
📦 Install manually from GitHub with no customization. The style is in Mozilla format.
📦 Install script which supports automatic updates but no customization.
📦 Install script from greasyfork which supports automatic updates and customization has settings menu via slide tab top right corner.


Last updated September 7 2020 version 1.6.3


Instructions for script version on greasyfork

Hover over tab in top right corner click Dark/Light to toggle between the two, click settings to access settings. (see pic below)

Settings

Save button apply and save color choices.
Reset button resets current theme back to the default Dark theme.
Cancel button closes settings without changing anything.

  • Steamgifts featured background image will be used if "Featured Background" is set to on(1 = on, 0 = off), otherwise it will apply a gradient of the color you chose.
  • Entering "water" or "halloween" (without quotation marks) into any theme input area will set that theme to the included water or halloween theme.
  • Settings tab (top right corner) colored according to "Header/Footer" for background, "Navigation Text" for text.
  • Colored "Names/Levels" (1 = on, 0 = off), Color is generated from game picture on featured giveaway or player avatar on profiles/SG++ Hover info.
  • Text shadow opacity setting has a range from -1(transparent) to 1(opaque) where 0 represents the default value(which is not shown).
    Negative values make it more transparent and positive values make it less transparent starting from its default value.

Hotkeys

  • Shift+Alt+1 = switch to theme #1
  • Shift+Alt+2 = switch to theme #2
  • Shift+Alt+3 = switch to theme #3
  • Shift+Alt+X = bring up settings menu
  • Shift+Alt+C = toggle current theme on or off

Screenshots

Screenshot Album

View attached image.
View attached image.
View attached image.
View attached image.
View attached image.
View attached image.
View attached image.
View attached image.
View attached image.
5 years ago*

Comment has been collapsed.

Test

1 year ago
Permalink

Comment has been collapsed.

There is a test? omg i never studied 😱

1 year ago
Permalink

Comment has been collapsed.

That's why you bombed this semester.

1 year ago
Permalink

Comment has been collapsed.

Skin seem to broke with ESG any idea how to fix it

1 year ago
Permalink

Comment has been collapsed.

Works but ESG needs fixing

1 year ago
Permalink

Comment has been collapsed.

do you know whats wrong with it

1 year ago
Permalink

Comment has been collapsed.

If i recall there was a jquery conflict if you used greasemonkey, but tampermonkey was fine.

1 year ago
Permalink

Comment has been collapsed.

im using tampermonkey tho
https://i.imgur.com/yKbwhQ3.png

1 year ago
Permalink

Comment has been collapsed.

You might want to reinstall it then, but make sure you export everything to import later.

1 year ago
Permalink

Comment has been collapsed.

Deleted

This comment was deleted 1 year ago.

1 year ago
Permalink

Comment has been collapsed.

I fixed it thanks for the help

1 year ago
Permalink

Comment has been collapsed.

Please tell us that you'll be coming out with a fix for this "subscribed" eyesore?

View attached image.
10 months ago
Permalink

Comment has been collapsed.

Absolutely 😉

10 months ago
Permalink

Comment has been collapsed.

Version 1.5.6.3

  • RAchart fixes

Version 1.5.6.2

  • Christmas Calendar

Version 1.5.6.1

  • Subscribed discussion categories, Discussion bookmarks
10 months ago*
Permalink

Comment has been collapsed.

Looking good... Now if only there were a "Fixed width" option on Stylish, then it would be perfect!

Edit/
Not to nitpick but ain't the "Subscribed box" a wee bit lighter in color, or is it the other way around?

View attached image.
10 months ago*
Permalink

Comment has been collapsed.

No colors have changed just the extra background removed, it probably looks lighter because it is a gradient so the longer it is the more light color you will have near the top.

The stylus version i have been working on since forever currently has 100+ settings.

View attached image.
10 months ago
Permalink

Comment has been collapsed.

I don't get it... Where's the install button?
I need to get my grubby little hands on it!

Also, what I meant was the "Fixed width" option on Stylish is "broken".

View attached image.
10 months ago
Permalink

Comment has been collapsed.

Oops 😳 corrected now, as for the other version i'm crossing my fingers for this month.

10 months ago
Permalink

Comment has been collapsed.

Quick fix... Many thanks :)

View attached image.
10 months ago
Permalink

Comment has been collapsed.

Now available for testing SGv2 Dark with stylus options , Stylus required.

7 months ago
Permalink

Comment has been collapsed.

Test commenced...
Sets "Page Width to Fixed" so far so good ;)

View attached image.
7 months ago
Permalink

Comment has been collapsed.

Found something... If SGv2 Dark is enabled this add-on won't work.
When you try to enter the App ID the whole box just disappears.

7 months ago
Permalink

Comment has been collapsed.

Happens when RaChart Enhancer is loaded before SteamGifts Library Checker because they both use the same css id. You can correct by uninstalling RaChart Enhancer and then installing again, or wait for me to update to correct for that scenario.

7 months ago
Permalink

Comment has been collapsed.

View attached image.
7 months ago
Permalink

Comment has been collapsed.

That fix is was included in the update i pushed out last night ;)

6 months ago
Permalink

Comment has been collapsed.

Seems to work as advertised ;)

View attached image.
6 months ago
Permalink

Comment has been collapsed.

I have a tiny issue with the theme: in the RaChart Enhancer settings, the "Reset Colors" button pushes down the first checkbox option, so it overlaps with the second one (it doesn't happen with the default theme, but that's fairly obvious because the whole layout of that settings window is different). https://ibb.co/qrQSYyS

8 months ago
Permalink

Comment has been collapsed.

Updated with RAchart fixes

8 months ago
Permalink

Comment has been collapsed.

Perfect, thanks! :)

8 months ago
Permalink

Comment has been collapsed.

Well. Now my eyes wont fell. Thanks for help :D

6 months ago
Permalink

Comment has been collapsed.

Dropped support for userstyles.org, you will need to reinstall for github hosting.

Version 1.5.9

  • ESGST fixes, up to date as of v8.6.0

Version 1.6.0

  • esgst giveaway description popup
  • esgst settings
  • esgst tag button
  • esgst whitelist/blacklist highlight
  • esgst giveaway maker
  • esgst gridview popout heading
  • esgst group giveaway loader panel
6 months ago*
Permalink

Comment has been collapsed.

Version 1.6.1

  • esgst fixed elements
  • esgst subscribe button
  • esgst narrow sidebar
  • esgst gridview popout camera icon

ESGST up to date as of v8.7.2

4 months ago
Permalink

Comment has been collapsed.

Hi, I just switched from ESGST version to Stylus version of SGv2 Dark. I have 2 questions:

1) The Stylus shows there are 187 issues for SGv2 Dark. Is it normal?
2) When selecting the text, the color of the text becomes green which is good but if space is part of the selection, I can't see clearly if I have selected it or not(used to be white text and blue background). How can I change or improve that?

Thanks!

1 month ago
Permalink

Comment has been collapsed.

  1. this is normal, you can diasble the css linter if you don't wish to see.
  2. Seems background color and options for this were omitted when switched to github. I will correct that for the next version, if you wish to make changes in the meantime here is the code to change.
::-moz-selection {
    color: hsl(91, 45%, 38%);
    background: hsla(0, 0%, 43%, 0.5);
}
::selection {
    color: hsl(91, 45%, 38%);
    background: hsla(0, 0%, 43%, 0.5);
}
1 month ago
Permalink

Comment has been collapsed.

  1. Oh, I see. I have no problem with that if this is normal.
  2. I have added that 2 lines of code and it works like charm!

Thank you! All problem sovled!

1 month ago
Permalink

Comment has been collapsed.

Hi, again. Is it possible to remove/adjust the weird "square frame" on the bookmarked giveaway page? And the layout seems different from the main page?

View attached image.
1 month ago*
Permalink

Comment has been collapsed.

If i understand correctly that should be fixed in the next version. Since themes will be removed in the next esgst version i also added options for the selection colors, as well as giveaway enter buttons.

1 month ago
Permalink

Comment has been collapsed.

Sounds great! Looking forward to it! Thanks!

1 month ago
Permalink

Comment has been collapsed.

Hi, I used to have this installed directly in ESGST but since theme option will be removed I installed the script from greasyfork and I use tampermonkey.
I have fixed page width option to 1. But its still wide. Is there an option Im missing or is the feature broken?

1 month ago*
Permalink

Comment has been collapsed.

It is functional however there appears to be a alignment issue in firefox where the input for fixed page is actually in line with General Text, I will correct that for the next version.

1 month ago
Permalink

Comment has been collapsed.

General text fixed it. I have always thought fixed width was better. But now when I used wide for a day I kind of got used to it and thought it was better. At least in the disussions :)

1 month ago
Permalink

Comment has been collapsed.

Version 1.6.2

  • Changes for ESGST v8.7.4
  • Options for enter buttons, selection highlight, notifications
1 month ago
Permalink

Comment has been collapsed.

Thank you!!! Works great and looking awesome!!! 💯❗

1 month ago
Permalink

Comment has been collapsed.

Happy cake day

🍰

1 month ago
Permalink

Comment has been collapsed.

Thank you!!!

View attached image.
1 month ago*
Permalink

Comment has been collapsed.

Now that ESGST dropped themes, using the greasyfork script of this is causing a problem that didn't happen with the ESGST theme version.

User tags from ESGST that use dark text are basically unreadable now because of the text shadow (I think? I already have text shadow opacity set at 0 though). I don't know why this wasn't an issue on the ESGST version but is through the script.

There's also a black border around the notifications at the top (number of new messages, etc) which wasn't on the ESGST version, which I would like to get rid of but don't know how.

But that's nowhere near as important as making user tags with black text readable again.

Edit: setting text shadow transparency to -1 fixes the user tags being unreadable. As a new person to using the script version, it seems not very intuitive that a negative number is what turns it off rather than zero.

Tbh it would be helpful if there was a way to turn off text shadow opacity for ESGST user tags specifically, but keep the text shadow on otherwise. I don't know if that would be possible, especially now that the theme was removed from ESGST.

Example (without theme, then dark theme with text shadow opacity at zero):

View attached image.
View attached image.
3 weeks ago*
Permalink

Comment has been collapsed.

I'll see what i can come up with, did you miss the the explanation of the opacity in the OP or was it unclear?

3 weeks ago
Permalink

Comment has been collapsed.

The explanation is kind of confusing. "0 represents the default value(which is not shown)" makes it sound like 0 is off, because "not shown" sounds like text shadow would not be shown at all. That's the key part that caused confusion.

"Negative values make it more transparent and positive values make it less transparent starting from its default value." that part being after what I previously quoted, gave me the initial impression that:
it defaults to 0 (completely off), and then because I already had that impression for 0
positive values turn it on and make it stronger (sort of like going from normal text to bold text, but with the shadow instead)
negative values turn it on but with weaker amount the more negative (starting with just a little transparent, going to mostly invisible)

A was also tired though, so take my misinterpreting with a grain of salt. I was just going to check SG quickly before getting ready to go to sleep, and then all of a sudden there was no dark theme anymore. Which lead to me installing the script when I wasn't mentally at my best :/

The part where it says "0 represents the default value(which is not shown)" I think would have confused me no matter what though. "Not shown" would mean "off" to me no matter how I look at it.

3 weeks ago
Permalink

Comment has been collapsed.

Version 1.6.3

  • ESGST: reduce sidebar heading width
  • ESGST: pinned giveaways not hidden when filtered
  • ESGST: removed text shadow from tags, giveaway copy highlighter
3 weeks ago
Permalink

Comment has been collapsed.

Hey, which option would cause least amount of resources to run? Already have installed Tampermonkey and tried greasyfork, which works fine. Tried stylus version which might be better (had to to install just for this skin) and I like that I didn't even needed to reload page for it to work.

2 weeks ago
Permalink

Comment has been collapsed.

Stylus is the better option and uses next to nothing on resources.

2 weeks ago
Permalink

Comment has been collapsed.

Thanks for reply and all your hard work.

2 weeks ago
Permalink

Comment has been collapsed.

Since installing the Greasyfork version, sometimes the game titles which is almost expiring turns purple for some reason (including the clock and username), is there any fix for this? I tried looking around in the setting and couldn't find anything purple.

It might be because the game cover is purple? Anyways I'd appreciate if you could guide me to which option this belongs to :P

2 weeks ago
Permalink

Comment has been collapsed.

Steamgifts colors the clock and username from the dominant color of the cover picture. The script will apply that color to the game title if "Colored Name/Level" is set to 1, same thing applies on user profiles name/contributor level.

2 weeks ago
Permalink

Comment has been collapsed.

Thank you! Any way to use the default notification bubble thingy instead of the userstyle's? :)

2 weeks ago
Permalink

Comment has been collapsed.

notification bubble thingy

what is that?

2 weeks ago
Permalink

Comment has been collapsed.

View attached image.
2 weeks ago
Permalink

Comment has been collapsed.

Nothing specific for that but Navigation Text, Text Shadows and Text Shadow Opacity settings will affect it. Other than that you would have to edit changes which would need to be reapplied every update.

2 weeks ago
Permalink

Comment has been collapsed.

thank you SquishedPotatoe!!! I mean, my eyes thank you

2 weeks ago
Permalink

Comment has been collapsed.

Sign in through Steam to add a comment.