Skip to content

Instantly share code, notes, and snippets.

@dracos
Created May 8, 2019 14:33
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dracos/e48d6feb25d3f7a8d706a2945fbf1930 to your computer and use it in GitHub Desktop.
Save dracos/e48d6feb25d3f7a8d706a2945fbf1930 to your computer and use it in GitHub Desktop.
Collapse GitHub project columns
// ==UserScript==
// @name Collapse project columns
// @namespace mysociety.github.projects.collapse
// @description Collapse project columns (based on https://gist.github.com/yuyuvn/268c754325e945ceda24e4ce661a27ce)
// @include https://github.com/*/*/projects/*
// @version 1.0
// @grant none
// ==/UserScript==
document.querySelectorAll(".js-details-container").forEach(function(node){
var hdr = node.querySelector('div:first-child');
var div = document.createElement('div');
var expand_button='<button class="expand-button float-right btn-octicon p-1 tooltipped tooltipped-w" type="button" aria-label="Expand this column" aria-expanded="false"style="display:none">\
<svg class="octicon octicon-chevron-right" aria-hidden="true" height="16" version="1.1" viewBox="0 0 8 16" width="12">\
<path fill-rule="evenodd" d="M7.5 8l-5 5L1 11.5 4.75 8 1 4.5 2.5 3z"></path>\
</svg>\
</button>'
div.innerHTML = expand_button;
expand_button = div.childNodes[0];
expand_button.addEventListener("click", function(){
var col = this.parentElement.parentElement;
col.querySelector('div').querySelector('div').style.display = '';
col.querySelector('.js-project-column-cards').style.display = '';
col.querySelector('.js-project-column-automation-footer').style.display = '';
col.setAttribute("style","");
this.setAttribute("style","display:none");
col.querySelector('.collapse-button').style.display = '';
})
node.insertBefore(expand_button, node.firstChild)
var collapse_button='<button class="collapse-button float-right btn-octicon p-1 tooltipped tooltipped-w" type="button" aria-label="Collapse this column" aria-expanded="false">\
<svg class="octicon octicon-chevron-left" aria-hidden="true" height="16" version="1.1" viewBox="0 0 8 16" width="12">\
<path fill-rule="evenodd" d="M5.5 3L7 4.5 3.25 8 7 11.5 5.5 13l-5-5z"></path>\
</svg>\
</button>'
div.innerHTML = collapse_button;
collapse_button = div.childNodes[0];
collapse_button.addEventListener("click", function(){
var col = this.parentElement.parentElement.parentElement;
col.querySelector('div').querySelector('div').style.display = 'none';
col.querySelector('.js-project-column-cards').style.display = 'none';
col.querySelector('.js-project-column-automation-footer').style.display = 'none';
col.setAttribute("style","min-width:2em");
this.setAttribute("style","display:none");
col.querySelector('.expand-button').style.display = '';
})
hdr.insertBefore(collapse_button, hdr.firstChild)
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment