finn/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Use separate class for tippy targets (#20742)

Browse source 
Previous solution that re-purposed the 'hide' class by making it
`!important` had various unintended side-effects where jQuery .show() was
not able to outweight it. Use a separate class to prevent these
interactions.
This commit is contained in:
silverwind 2022-08-10 16:47:28 +02:00 • committed by GitHub
parent 58de07e5fd
commit d751e35d81
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 13 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

7
web_src/js/modules/tippy.js
View file

@ -12,10 +12,11 @@ export function createTippy(target, opts = {}) {
...opts,
});
// for popups where content refers to a DOM element, we use the 'hide' class to initially hide
// the content, now we can remove it as the content has been removed from the DOM by tippy
// for popups where content refers to a DOM element, we use the 'tippy-target' class
// to initially hide the content, now we can remove it as the content has been removed
// from the DOM by tippy
if (opts.content instanceof Element) {
opts.content.classList.remove('hide');
opts.content.classList.remove('tippy-target');
}
return instance;

2
web_src/less/_base.less
View file

@ -1315,7 +1315,7 @@ footer {
}
.hide {
display: none !important;
display: none;
&.show-outdated {
display: none !important;

5
web_src/less/modules/tippy.less
View file

@ -1,5 +1,10 @@
/* styles are based on node_modules/tippy.js/dist/tippy.css */
// class to hide tippy target elements on page load
.tippy-target {
display: none !important;
}
[data-tippy-root] {
max-width: calc(100vw - 10px);
}