1. TurkerHub is now TurkerView Forum!

    To better integrate the services & streamline user experience we've moved the forum to TurkerView's domain. From now on you'll only have to log in once across both services and you'll have access to all the features available on what used to be two different websites.

    If you notice any bugs please let us know!

    Dismiss Notice

[Script] MTurk Worker Site Dark Themes [BETA]

Discussion in 'mTurk Scripts & Resources' started by Trickydude24, Oct 4, 2017.

  1. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    A lot of turkers like to work throughout the night or start early morning, but staring at the the new worker site (https://worker.mturk.com/) that is extremely bright and white makes for an unpleasant experience. So I set out and created some dark themes to counter that.

    1. Install Extension

    To install these themes, you will need to install a browser extension. If not already installed, download one of the available extensions listed below, according to the browser that you use:
    Note: Other browsers are untested - feel free to try without official support.

    2. Install Theme

    DARK GREY THEME
    Latest Version: 0.12-BETA [May 11th, 2018]
    Download Here
    - https://userstyles.org/styles/149148/mturk-worker-site-dark-theme-beta
    DARK BLUE THEME
    Latest Version: 0.9-BETA [May 11th, 2018]
    Download Here
    - https://userstyles.org/styles/149700/mturk-worker-site-dark-blue-theme-beta


    Screenshots
    [​IMG]
    Dark Grey Theme - HIT Page - Dark rows = unqualified HITs, Lighter rows = qualified HITs.

    [​IMG]
    Dark Blue Theme - HIT Page - Dark rows = unqualified HITs, Lighter rows = qualified HITs.


    How to Update Themes

    Stylish does not support auto-updating at this time, so you'll have to either update it manually or install the script via the userscript (which updates the theme automatically within 24 hours of a pushed fix). If you prefer using Stylish, there are a few ways you can manually update:
    • Go to the link of the theme above and click the big green "Update Style" button.
    OR
    • Click the Stylish extension icon in your browser, then the 3 vertical dots (next to Stylish ON) and click Manage All Styles. Click Check for Updates, then Install Updates.

    NOTICE FOR MTURK SUITE USERS

    If you are using MTS's built-in themes for MTurk prior to installing one of my themes, make sure to turn their theme off by setting it to "MTurk - Default", otherwise the themes will clash.
    Likewise, if you've previously used my theme(s) and switch over to MTS's themes, make sure you disable my theme(s) on Stylish, otherwise the themes will clash.

    Let me know of any issues not listed below and I'll try my best to fix them when I can.


    Known Issues:
    - Arrows on Service Health page are images, will need to be replaced
    - Some scripts rely on the worker site's stylesheets (colors), so some of the dark theme's coloring may carry over. I've noticed this happened with Overwatch, so I added additional stylesheet information to exclude that from happening to that particular script.


    Additional Notes:
    In addition to the dark theme, I recommend checking out f.lux, which reduces blue light from your monitor by turning your screen an orangish hue (similar to how Gunnar glasses work). A lot of people hate f.lux at first, but tweak the settings and give it an honest chance. Once you get used to it, temporarily disable it and you'll be able to tell how much it really does help.
    I also recommend PangoBright, a piece of software that controls your monitors' brightness without having to navigate the cumbersome monitor menus (especially if you have more than 1 monitor). With PangoBright, you check which monitors are affected as well.

     
    • Love Love x 10
    • Like Like x 5
    • Useful / Informative Useful / Informative x 3
    • 5/5 Pay 5/5 Pay x 1
    Last edited: Aug 29, 2018
  2. ChrisTurk

    ChrisTurk Administrator

    Messages:
    31,589
    Ratings:
    +79,638
    I generally dislike dark themes but I actually like this a lot.

    CC: @NBadger @GoldGuardian tell me why I'm wrong because I wanna steal it for TH's dark theme. @Trickydude24 can I steal the CSS for TH? Lol
     
    • Like Like x 1
    • Love Love x 1
  3. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Haha of course! I'm glad you like it :)
     
  4. GoldGuardian

    GoldGuardian Black Order

    Messages:
    7,692
    Gender:
    Male
    Ratings:
    +15,493
    [​IMG]
     
    • LOL LOL x 2
  5. NBadger

    NBadger Mod of Cat-Gifs

    Messages:
    13,512
    Gender:
    Female
    Ratings:
    +37,619
    Nope, I actually really like it :ay:

    The only thing I dislike is the color of the transfer earnings/preview and accept/search buttons, as it sticks out more than it needs to on the dark background, but that's pretty minor.
     
    • Love Love x 2
  6. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Thanks for the feedback! Yeah, those buttons are the default colors, as I haven't really touched them yet. In the next update or so I'll mess with them and see what looks good :)
     
    • Love Love x 2
  7. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Updated the theme to 0.4-BETA.

    Changelog:
    Fixed "Report HIT" arrow color, change button colors to a darker color, other minor color tweaks. I also replaced the screenshots in the OP to the updated changes.

    As always, I appreciate comments on pages/sections that still need skinned. I'm aware it's not complete yet, but it helps to have another set of eyes sometimes if I miss something.

    It's going to get harder to tweak the theme to everyone's preferences, so please be aware that anyone is free to modify this theme's CSS if you know what you're doing. I won't be able to provide support on things you change, nor have time to teach people how to make changes. I left comments in the CSS to explain what each section modifies, so it's relatively easy to understand.

    One last thing - apologies for the many updates, I can only work on this in my free time and I try to push out fixes as soon as I can. Also, given Stylish's apparent manual-update requirement (aka no auto-updates), it makes it a little tougher to get the word out about changes. From here on out, unless there's a major issue, I won't be providing updates as often, maybe once a month or so, if needed.

    Thanks for all the support, it's great to see almost 20 downloads already!
     
  8. knottypiper

    knottypiper Survey Slinger

    Messages:
    5,734
    Gender:
    Female
    Ratings:
    +12,707
    Fucking awesome. Thank you. :)
     
    • Love Love x 1
  9. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Thanks so much! :ba:
     
  10. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Brand new dark blue theme added that I worked on over the weekend a bit. As always, it's listed in BETA, but feel free to check it out and let me know of issues! :ba:
     
  11. Ducky

    Ducky Active Turker

    Messages:
    228
    Gender:
    Female
    Ratings:
    +378
    I'm loving this. Using the grey one :emoji_ok_hand:
     
    • Love Love x 1
  12. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Thanks everyone for all the support on the themes, it means more than you know!

    I do have a few statements to make and a question to ask people though, so if anyone could provide any insight, I'd greatly appreciate it.

    1. First off, Stylish is a cool browser extension, as it makes things on the front-end relatively painless. HOWEVER, on the back-end, it doesn't allow auto-updates and excluding is a pain in the butt (Sure I can add include-only URLs, but certain scripts play funky with URLs, so I'd rather have excludes). I have to keep pestering people to manually update and that just becomes a mess and annoys people.
    2. Secondly, some 3rd party scripts rely on MTurk's color themes and pulls them directly from the site's global stylesheets - in other words, if MTurk's background is yellow, the script's background will be yellow (unless of course the script author included their own styles). The problem with this is if my themes are applied, it can pull certain colors (and not others) and create this ugly clash of colors that look like a terrible half-themed script.

    So my question comes to this - would the majority of people support going Userscript install only? Meaning you'd install the theme via Tampermonkey or Greasemonkey and you'll never have to worry about future updates again. Plus, I can have better control over excluding certain scripts as they come out. Furthermore, most people have TM or GM installed, so it shouldn't be too big of a deal.

    It should also be noted that not all of Worker has pages created, so there are bound to be more pages to theme when they force us over to the new site (RIP www).

    Thoughts? Thanks in advance! :ba:

    tl;dr - May go userscript-install only (Tampermonkey/Greasemonkey), get rid of Stylish, due to lack of auto-updates and customization options.
     
  13. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Hey folks - another major update for ya, as www begins to phase out.

    First off, thank you for 300+ installs on the dark grey theme (holy crap) and over 75 on the dark blue theme! Here's the latest update.

    What's Changed?
    (These changes apply to both themes!)
    • Requester pages have been themed (when you click a requester's name) as well as the new Contact (Amazon) page.
    • HIT Qualification section has been modified to differentiate between the quals
      • Before: [​IMG]
      • After: [​IMG]
    • Fixed HIT Details text color so it is easier to read
    • Added new CSS for page headers, current-page-link color, and the divider located between the "Hide Details" and "Items per Page" areas above the HITs grid, so they can now be easily modified.
    • Updated the hover/mouseover link colors so they reflect the theme's accent color.
    • Temporarily (?) overrode TurkerView's small export button, as well as TurkerView's pop-over detail panel (this was showing white text on a white background before)
    • Other general color improvements.
    Keep in mind, MTurk is still modifying worker-side details, so naturally any new pages they create will be unthemed until I can fix it. Another note, the reason why I don't do a wildcard apply-theme-to-anything-worker.mturk.com-related is because that will conflict with 3rd party scripts' CSS that pull from MTurk's native CSS code. This results in scenarios like white-text on white-backgrounds - not good.

    The latest version of these themes are:
    Stylish users will have to manually update (visit page, click the green Update button). Userscript users will get pushed an update within the next 24 hours.

    Enjoy! Let me know of any issues!
     
    • Like Like x 2
  14. Dr McCoy

    Dr McCoy Active Turker

    Messages:
    401
    Gender:
    Male
    Ratings:
    +823
    I keep trying this, and when I first go on to the worker site, I get a flash of the dark blue theme, and then it turns in to this mess:

    [​IMG]

    [​IMG]

    The black box in the center created by me to cover up my work and earnings. I'm pointing out how the right side is white and the left side is dark, but I have installed the dark blue theme. Regardless, it doesn't cover the entire page.
     
  15. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Did you install this via Stylish or Userscript?
    If userscript, are you using TamperMonkey or Greasemonkey?
    Also what browser are you using?

    Odd that is happening, but I'll look into it once I hear back some details!
     
    • Like Like x 1
  16. Dr McCoy

    Dr McCoy Active Turker

    Messages:
    401
    Gender:
    Male
    Ratings:
    +823
    I tried installing in Stylish, and what happens is that when I first install it, I will get the dark blue theme, but as soon as I click on another page, it gives me what I showed you above.

    Chrome.

    I then tried to install via tapermonkey which didn't do any better.
     
  17. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    That is odd, it seems like there's something conflicting with the theme for some reason. I've verified that the userscript and stylish versions work on the latest version and I've not seen any other reports mention it so far. I'll keep a lookout in the meantime and see if I can figure it out. Are you using any special version of Chrome (like Canary, etc) or a beta version or an old version?

    Are you getting any console errors in Chrome? Press F12 and if you see a red X, click that and copy/paste the red highlighted lines.

    In the meantime, can you try temporarily disabling your Chrome extensions and other TamperMonkey scripts to see if that fixes it? Would like to see what is going on. Sorry you're having this issue! Hoping we can get to the bottom of this for ya.
     
    • Like Like x 1
  18. Dr McCoy

    Dr McCoy Active Turker

    Messages:
    401
    Gender:
    Male
    Ratings:
    +823
    It's version 63.

    I did just find out it works perfectly fine on Waterfox that I haven't updated in forever.
     
  19. Dr McCoy

    Dr McCoy Active Turker

    Messages:
    401
    Gender:
    Male
    Ratings:
    +823
    Found it. Now that I did, it makes sense why it was conflicting.

    "Worker Site Async (Nonblocking) CSS"

    I don't even know what that is, but I loaded it anyway to see what it was...oh well.

    And thanks for the script. It is much better than glaring white background.
     
    • Love Love x 1
  20. Trickydude24

    Trickydude24 Survey Slinger

    Messages:
    2,533
    Gender:
    Male
    Ratings:
    +4,649
    Glad you were able to narrow it down and find the issue! I figured it was something odd blocking it or something lol. And no problem, I'm glad you like the theme, and appreciate you helping with the troubleshooting!