User:Brettz9/common.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* 

CONTENTS

1. Diagnonal headers (taken from https://bahai9.com/index.php?title=MediaWiki:Common.css )
2. Collapsible lists (taken from https://bahai9.com/index.php?title=MediaWiki:Common.css )
*/

th.rotate {
  /* Something you can count on */
  height: 140px;
  white-space: nowrap;
}

th.rotate > div {
  transform: 
    /* Magic Numbers */
    translate(25px, 51px)
    /* 45 is really 360 - 45 */
    rotate(315deg);
  width: 30px;
}
th.rotate > div > span {
  border-bottom: 1px solid #ccc;
  padding: 5px 10px;
}


/*
JUST ADD .collapsibleList TO UL tag; see https://bahai9.com/wiki/User:Brettz9/test-collapsibleLists
note the new code for this listed below at https://iamkate.com/code/tree-views/
is good in being CSS only but requires details/summary which are not supported
yet in MW, and which are cumbersome to add

User:Brettz9 added these styles for auto-added classes as per the code from http://code.stephenmorley.org/javascript/collapsible-lists/ with the license per http://code.stephenmorley.org/about-this-site/copyright/ being under http://creativecommons.org/publicdomain/zero/1.0/legalcode
If applying for DL or DD/DT, ensure to add these as well
*/
.collapsibleList li > span {
    list-style-image: none;
    padding: 0;
    background: none;
    cursor: auto;
}

ol.collapsibleList > li.collapsibleListOpen > span,
.collapsibleList ol > li.collapsibleListOpen > span {
  background:url('https://bahai.media/images/9/9c/Button-open.png') no-repeat 0 5px;
  cursor:pointer;
}
.collapsibleList ol > li.collapsibleListClosed > span,
ol.collapsibleList > li.collapsibleListClosed > span {
  background:url('https://bahai.media/images/0/00/Button-closed.png') left center no-repeat;
  cursor:pointer;
}
ul.collapsibleList > li.collapsibleListOpen > span,
.collapsibleList ul > li.collapsibleListOpen > span {
  list-style-image:url('https://bahai.media/images/9/9c/Button-open.png');
  cursor:pointer;
}
ul.collapsibleList > li.collapsibleListClosed > span,
.collapsibleList ul > li.collapsibleListClosed > span {
  list-style-image:url('https://bahai.media/images/0/00/Button-closed.png');
  cursor:pointer;
}