Let me make you some userstyles and userscripts.

Discussion in 'Discussions' started by Daynab, Nov 17, 2012.

  1. Daynab

    Daynab Community Moderator Staff Member

    Hi, so some of you may know but I'm studying in web development/web design (but more coding than design lately). I thought it might be some good side practice for me to do this for people:

    -------------------------------------------------
    Basically, Userstyles are custom css files that you can load in your browser to change the look of a site (most easily through the Stylish addon: for Firefox, for Chrome.) Pretty much your own little redesign.

    You can browse this site for thousands of examples and more complete redesigns than I wouldn't even attempt to tackle. But what I *can* do for you is change anything you might find annoying about a specific site, or something you'd like to look different, I don't know. Like when someone asked me to remove all images in forum signatures on another forum, for example. Or make a certain site darker so it would be more pleasing on the eyes.
    Lots of possibilities, really.

    UserScripts are little custom javascript snippets that also change things about a website but can generally do a lot more than the appearance. They don't even have to be limited to a specific site. For example, a popular one makes all text links automatically change into clickable links.

    Easiest way to install those is through the Greasemonkey addon for Firefox and Tampermonkey for Chrome.
    You can browse for some at https://userscripts.org/

    As scripts are definitely more complex I can't really say what I can and cannot do, just ask and I'll take a crack at it and tell you if it's possible for me.
    -------------------------------------------------

    Anyways. Help me practice/study while helping you (maybe)!
     
    Kazeto and OmniaNigrum like this.
  2. SkyMuffin

    SkyMuffin Member

    Here's one to try: fix the overflow issues I have on the CNN website.

    http://www.cnn.com/

    dammit cnn
    y u no em or % scaling

    I have minimum font set to 16 for all fields in Chrome, and the general font size setting set at medium. No zoom. I think the minimum font size setting is causing this, overflowing text in elements that have been hard-coded with specific pixel dimensions instead of scaled with the standard em.

    I think it's kind of shameful that one of the most popular news organizations in the world can't even do accesibility for vision impaired users right.
     
    OmniaNigrum likes this.
  3. Daynab

    Daynab Community Moderator Staff Member

    Oh yeah, definitely. I'll look into it and see how big a project that is (might be since it's a lot of things) and get back to you soon!
     
    OmniaNigrum likes this.
  4. Daynab

    Daynab Community Moderator Staff Member

    Working on this, this is actually a bigger task than I expected mostly because of how the site was coded in the first place.

    I am running into an issue with the main menu. Ideally I want everything to work with any reasonable font size (since this is the whole point of the thing after all), so there's only two things I can do (unless I dream of something up when I go sleep).

    Either this or this. Both options work with any font size, but the alignment sucks. I can sort of align it in the center, but the problem is even with relative scalings like ems, if you change the font size too much it still goes off to one side or the other.

    One option would be to just style it just so it suits the size you chose. That would be really simple and probably what I'll choose to do if I don't figure out another solution.
     
    OmniaNigrum likes this.
  5. Daynab

    Daynab Community Moderator Staff Member

    What the hell cnn, this isn't how you name elements at all.
    [​IMG]
    Hire a competent web dev please.

    (style is going well, but I decided to make it for your font size as it would be insane otherwise)

    edit: finished the front page!
     
    OmniaNigrum likes this.
  6. Daynab

    Daynab Community Moderator Staff Member

    Okay! Version 1 is done. Grab it here and let me know if there's any glaring issues or things I missed.
    http://userstyles.org/styles/78863/cnn-corrected-for-bigger-minimum-fonts?r=1353575567

    This doesn't support the random cnn bysites like sports or celebrities (do you need them to?), but it supports the US and International news pages, articles and various things.

    Let me know how you like it! and if there are things to fix, what.

    PS: the CNN website is terribly coded so my code reflects that.
     
    OmniaNigrum likes this.
  7. SkyMuffin

    SkyMuffin Member

    whoa, it looks a lot better. thanks :)

    http://i.imgur.com/4ZS0r.png still some cut off but it is a lot more "open" than the original iteration.
     
  8. Daynab

    Daynab Community Moderator Staff Member

    Oh, this new "this weekend" bar wasn't there when I made the style. I fixed it now, you can click "check for updates" in the manage styles menu, then click install and it will update it. :)


    Anyone have anything else for me to do?
     
    OmniaNigrum likes this.
  9. Daynab

    Daynab Community Moderator Staff Member

    Bump! anyone have any ideas? Finding stuff to do is my weakness.
     
    OmniaNigrum likes this.
  10. OmniaNigrum

    OmniaNigrum Member

    I suggest you waste some time playing games until something falls into your lap to fix. :)
     
  11. Kaidelong

    Kaidelong Member

    data.worldbank.org doesn't let you create a custom field out of existing ones. For example, what if you wanted to order countries based on the ratio of GDP over kt of oil use equivalent over the portion of energy supplied by renewables?

    This may not be very relevant to what you want to do, but it's an interesting thing I tackled myself very recently.
     
    OmniaNigrum likes this.
  12. Daynab

    Daynab Community Moderator Staff Member

    I've been pretty busy learning python lately (fun!) but I'll look into this soon.
     
    OmniaNigrum likes this.