D&D Forums - MyBB Plugins & Themes
[Fixed] Emerald: Change where post ID links start - Printable Version

+- D&D Forums - MyBB Plugins & Themes (https://developement.design/forum)
+-- Forum: MyBB Ressources (https://developement.design/forum/forumdisplay.php?fid=5)
+--- Forum: Premium MyBB Themes (https://developement.design/forum/forumdisplay.php?fid=9)
+---- Forum: Support (https://developement.design/forum/forumdisplay.php?fid=18)
+---- Thread: [Fixed] Emerald: Change where post ID links start (/showthread.php?tid=27998)



[Fixed] Emerald: Change where post ID links start - joshuaboniface - 06-15-2023

I'm using the Emerald theme in both light and dark variants. However the issue I'm describing seems to affect every forum with this theme, including this one.



When clicking a post ID link (e.g. https://developement.design/forum/showthread.php?tid=13833&pid=28969#pid28969), the page view jumps to the start of the content of the message, rather to the head of the post like the default theme.



Here's an example image of what is happening (on this forum):



   



Versus where I would expect it to end up:



   



Versus how it looks on a forum with another theme (the main mybb.org forums):



   



Any advice on how to fix this? At least on our own forums (example https://forum.jellyfin.org/thread-13-post-41.html#pid41), this looks even more cut-off than here due to the presence of some other plugins (specifically, ABP Solve It) adding more padding around the message content, and I would thus very much like to fix it.

And ended up finding a solution based on some Stack Overflow posts, specifically https://stackoverflow.com/a/55683966

Adding the following into `global.css` will correct this. For my forum, 68px was the correct offset to show a tiny sliver of the background before the main post body, but you can of course adjust this to fit your needs.

Code:
:target {
        scroll-margin-top: 68px;
        scroll-padding-top: 68px;
        scroll-snap-margin-top: 68px;
        scroll-snap-padding-top: 68px;
}

It seems like it's the `padding` ones that actually do it, but I kept both for good measure. The `scroll-snap` versions are apparently for Safari support, and again kept for good measur