Gitlab 'hacks'

twitter logo github logo Updated on ・1 min read

Ever wanted to look 'productive' on Gitlab? Paste this into your console. What are your favourite git related hacks?

colors = [`rgb(172, 213, 242)`,
`rgb(127, 168, 201)`,
`rgb(82, 123, 160)`,
`rgb(37, 78, 119)`]

$(".user-contrib-cell").each(function(){ $(this).attr("fill", colors[Math.floor(Math.random()*colors.length)])})

See image below for results!

Graph of pixels representing coding activity on Gitlab homepage, with varying shades of blue. The darker, the more productive.

Thanks to lukeshiru for their vanilla javascript solutions + GitHub script



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">

You have a typo there, it should be colors.length instead of items.length. Also, you could write it with vanilla JS this way:

((colors, query) =>
    Array.from(document.querySelectorAll(query)).forEach(cell =>
        cell.setAttribute(
            "fill",
            `#${colors[Math.floor(Math.random() * colors.length)]}`
        )
    ))(["acd5f2", "7fa8c9", "527ba0", "254e77"], ".user-contrib-cell");

And for GitHub, you can just change the parameters this way:

((colors, query) =>
    Array.from(document.querySelectorAll(query)).forEach(cell =>
        cell.setAttribute(
            "fill",
            `#${colors[Math.floor(Math.random() * colors.length)]}`
        )
    ))(["c6e48b", "7bc96f", "239a3b", "196127"], ".js-calendar-graph-svg rect");
twitter logo DISCUSS (3)
markdown guide
 
 

You have a typo there, it should be colors.length instead of items.length. Also, you could write it with vanilla JS this way:

((colors, query) =>
    Array.from(document.querySelectorAll(query)).forEach(cell =>
        cell.setAttribute(
            "fill",
            `#${colors[Math.floor(Math.random() * colors.length)]}`
        )
    ))(["acd5f2", "7fa8c9", "527ba0", "254e77"], ".user-contrib-cell");

And for GitHub, you can just change the parameters this way:

((colors, query) =>
    Array.from(document.querySelectorAll(query)).forEach(cell =>
        cell.setAttribute(
            "fill",
            `#${colors[Math.floor(Math.random() * colors.length)]}`
        )
    ))(["c6e48b", "7bc96f", "239a3b", "196127"], ".js-calendar-graph-svg rect");
 

Good catch! I changed variables and forgot to update my copy/paste last minute!

Classic DEV Post from Dec 22 '18

Generate and Set Pseudorandom Hexadecimal Background Color Using JavaScript

I'm working on a project that deals with pseudo random event-driven color chang...

shushugah profile image
Passionate about human rights, community, Ruby and caffeine