Created
August 2, 2023 15:29
-
-
Save johnfmorton/90511048466c6278aa27568d9a19bf46 to your computer and use it in GitHub Desktop.
Doxter CP sticky header position tweak for Craft CMS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This is a small fix for the sticky header position for Doxter, https://github.com/verbb/doxter | |
// I've included it in the Craft CMS control panel with another plugin, https://github.com/doublesecretagency/craft-cpjs | |
// but it could also be included in a custom module. | |
let resizeTimeout | |
let styleTag | |
let ruleIndex | |
window.addEventListener('resize', () => { | |
clearTimeout(resizeTimeout) | |
resizeTimeout = setTimeout(resetDoxterHeaderTop, 350) | |
}) | |
window.addEventListener('load', () => { | |
// Create a style tag once on page load | |
styleTag = document.createElement('style') | |
document.head.appendChild(styleTag) | |
resetDoxterHeaderTop() | |
}) | |
function resetDoxterHeaderTop() { | |
// get rid of old styleTag | |
if (ruleIndex !== undefined) { | |
styleTag.sheet.deleteRule(ruleIndex) | |
} | |
// get #header element | |
const header = document.getElementById("header"); | |
if (header){ | |
ruleIndex = styleTag.sheet.insertRule( | |
`.doxter .editor-toolbar { | |
z-index:2; | |
top: ${header.clientHeight}px; | |
} `, | |
0 | |
) | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment