7 ms·

That’s called CSS. Use a user style, not javascript. The query is not applicable since its not offered by HN themselves.

stragies 6y ago
You are misunderstanding what grease-monkey can do, and what I'm proposing. e.g. try loading news.ycombinator.com?myColorVar=44ff55 , it will load normally, as usual. Of course, this variable means nothing to the HN backend, but this is where e.g. Grease-monkey comes in: It injects a bit of javascript of your choosing into the page context for the news.ycombinator.com/* pages. This scriplet can easily change the color of the header-bar, and add the colorVariable to all (non-external) links. Of course, you can add a line like the following to your local userContent.css: @-moz-document domain(news.ycombinator.com) { #hnmain>tbody>tr:first-of-type>td { background-color: lime !important; } , but this has the disadvantage of requiring a Firefox restart for each change, whereas my method requires only twiddling the value in the URL, and it's valid for all future requests, until you change it again. I hope, the above makes it clearer, what I meant the post above
- stragies 6y ago
  The following code snippet in a grease-monkey-script with // @include https://news.ycombinator.com/* https://news.ycombinator.com/* in the header will color the top-bar on HN pages with the color given in the URL such like https://news.ycombinator.com#MYC=lime https://news.ycombinator.com#MYC=lime or https://news.ycombinator.com#MYC=#ce1c01 https://news.ycombinator.com#MYC=#ce1c01 . (function() { if (color=document.location.href.match(/#MYC=(.)/)[1]) { document.querySelector("#hnmain>tbody>tr:first-of-type>td").setAttribute("bgcolor",color); document.querySelectorAll('a[href^="https://news.ycomb" https://news.ycomb"],a:not([href="/"])') .forEach(e => {e.href+="#MYC="+color}); } })(); This script colors the top bar, and adds the custom colour to all HN-internal links, so until you manually change the URL, further navigation in that tab within news.ycombinator.com will retain your chosen top-bar colour. (I hope the code comes out formatted in a legible way)
- turnipla 6y ago
  You’re missing the point of the query. What’s the point of using the query at all? OP suggested it as a way for users to customize their HN color; Then you suggested to take this query and make an extension out of it. If you want to customize your HN color, use CSS, not this roundabout way through a query parameter. The query never makes sense anyway. If HN were to allow customization they’d allow it in the options, not as a random query that you have to set manually.

stragies 6y ago

You are misunderstanding what grease-monkey can do, and what I'm proposing. e.g. try loading news.ycombinator.com?myColorVar=44ff55 , it will load normally, as usual. Of course, this variable means nothing to the HN backend, but this is where e.g. Grease-monkey comes in: It injects a bit of javascript of your choosing into the page context for the news.ycombinator.com/* pages. This scriplet can easily change the color of the header-bar, and add the colorVariable to all (non-external) links. Of course, you can add a line like the following to your local userContent.css: @-moz-document domain(news.ycombinator.com) { #hnmain>tbody>tr:first-of-type>td { background-color: lime !important; } , but this has the disadvantage of requiring a Firefox restart for each change, whereas my method requires only twiddling the value in the URL, and it's valid for all future requests, until you change it again. I hope, the above makes it clearer, what I meant the post above

stragies 6y ago
The following code snippet in a grease-monkey-script with // @include https://news.ycombinator.com/* https://news.ycombinator.com/* in the header will color the top-bar on HN pages with the color given in the URL such like https://news.ycombinator.com#MYC=lime https://news.ycombinator.com#MYC=lime or https://news.ycombinator.com#MYC=#ce1c01 https://news.ycombinator.com#MYC=#ce1c01 . (function() { if (color=document.location.href.match(/#MYC=(.)/)[1]) { document.querySelector("#hnmain>tbody>tr:first-of-type>td").setAttribute("bgcolor",color); document.querySelectorAll('a[href^="https://news.ycomb" https://news.ycomb"],a:not([href="/"])') .forEach(e => {e.href+="#MYC="+color}); } })(); This script colors the top bar, and adds the custom colour to all HN-internal links, so until you manually change the URL, further navigation in that tab within news.ycombinator.com will retain your chosen top-bar colour. (I hope the code comes out formatted in a legible way)
turnipla 6y ago
You’re missing the point of the query. What’s the point of using the query at all? OP suggested it as a way for users to customize their HN color; Then you suggested to take this query and make an extension out of it. If you want to customize your HN color, use CSS, not this roundabout way through a query parameter. The query never makes sense anyway. If HN were to allow customization they’d allow it in the options, not as a random query that you have to set manually.