Collapse GitHub project columns

gistfile1.txt

// ==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)
})