User:Ilikecomputers/cosmos.js: Difference between revisions
Content added Content deleted
(remove debug console log) |
(all this functionality moved somewhere else) Tag: Replaced |
||
| Line 1: | Line 1: | ||
//goodbye! i don't need you any more! |
|||
//A very hackey way to fix a niche styling issue: |
|||
//Example markup: |
|||
// * This is a bullet point |
|||
// ** {{quote|this is a quote}} |
|||
// ** This is a bullet point after a quote <-- this will have double bullet points |
|||
document.querySelectorAll('table').forEach(function (e) { |
|||
if (e.nextElementSibling && e.nextElementSibling.nodeName === 'UL') { |
|||
var sibling = e.nextElementSibling; |
|||
var curSibling = sibling.childNodes[0]; |
|||
while (curSibling.childNodes.length > 0 && curSibling.childNodes[0].nodeName === 'UL') { |
|||
curSibling.classList.add('nodoublebullet'); |
|||
curSibling = curSibling.childNodes[0].childNodes[0]; |
|||
} |
|||
} |
|||
}) |
|||
document.styleSheets[0].insertRule(".nodoublebullet::marker {content: ''}"); |
|||
//combines the function of the toggle spoiler and spoiler hover gadgets |
|||
//hover over spoilers to reveal them, they'll disappear after the cursor leaves the box |
|||
//click on spoilers to permanently reveal them, then click on them again to hide them |
|||
//also fixes hyperlinks in spoilers visible by default in the cosmos skin |
|||
document.querySelectorAll('a').forEach(function (e) { if (e.parentNode.classList.contains('spoiler')) e.style.color = 'white' }); |
|||
function changeLinksColor(showLink, element) { |
|||
element.childNodes.forEach(function (f) { |
|||
if (f.nodeName === 'A') { |
|||
f.style.color = showLink ? 'rgb(6, 69, 173)' : 'white'; |
|||
} |
|||
}); |
|||
} |
|||
document.querySelectorAll('.spoiler').forEach(function (e) { |
|||
e.classList.remove('spoilerhidden'); //this fidgety hack removes the !important colour rule added by the spoilerhidden class |
|||
e.style.color = 'white'; |
|||
e.addEventListener('mouseover', function () { |
|||
changeLinksColor(true, e); |
|||
e.style.color = 'black'; |
|||
}); |
|||
e.addEventListener('mouseout', function () { |
|||
e.style.color = 'white'; |
|||
if (!e.classList.contains('spoilerRevealed')) { |
|||
changeLinksColor(false, e); |
|||
} |
|||
}) |
|||
e.addEventListener('click', function () { |
|||
if (e.classList.contains('spoilerRevealed')) { |
|||
e.classList.remove('spoilerRevealed'); |
|||
} else { |
|||
e.classList.add('spoilerRevealed'); |
|||
} |
|||
}) |
|||
}) |
|||
document.styleSheets[0].insertRule(".spoilerRevealed {color: black !important}"); |
|||
document.styleSheets[0].insertRule(".spoiler {cursor: pointer}"); |
|||