diff options
author | silverwind <me@silverwind.io> | 2024-04-30 16:52:46 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2024-04-30 14:52:46 +0000 |
commit | 564102ce89f53d6bd2fdbaa33416e4287d6fe9a8 (patch) | |
tree | 27a99fad3cd53e7fef837f5bbbe8a8d81b2a38df /web_src/js/modules/tippy.js | |
parent | 5f05e7b41a57972cc418a125d9263173b7b9838f (diff) | |
download | gitea-564102ce89f53d6bd2fdbaa33416e4287d6fe9a8.tar.gz gitea-564102ce89f53d6bd2fdbaa33416e4287d6fe9a8.zip |
Rework and fix stopwatch (#30732)
Fixes https://github.com/go-gitea/gitea/issues/30721 and overhauls the
stopwatch. Time is now shown inside the "dot" icon and on both mobile
and desktop. All rendering is now done by `<relative-time>`, the
`pretty-ms` dependency is dropped.
Desktop:
<img width="557" alt="Screenshot 2024-04-29 at 22 33 27"
src="https://github.com/go-gitea/gitea/assets/115237/3a46cdbf-6af2-4bf9-b07f-021348badaac">
Mobile:
<img width="640" alt="Screenshot 2024-04-29 at 22 34 19"
src="https://github.com/go-gitea/gitea/assets/115237/8a2beea7-bd5d-473f-8fff-66f63fd50877">
Note for tippy:
Previously, tippy instances defaulted to "menu" theme, but that theme is
really only meant for `.ui.menu`, so it was not optimal for the
stopwatch popover.
This introduces a unopinionated `default` theme that has no padding and
should be suitable for all content. I reviewed all existing uses and
explicitely set the desired `theme` on all of them.
Diffstat (limited to 'web_src/js/modules/tippy.js')
-rw-r--r-- | web_src/js/modules/tippy.js | 6 |
1 files changed, 4 insertions, 2 deletions
diff --git a/web_src/js/modules/tippy.js b/web_src/js/modules/tippy.js index 83b28e5745..a18c94cafb 100644 --- a/web_src/js/modules/tippy.js +++ b/web_src/js/modules/tippy.js @@ -37,8 +37,10 @@ export function createTippy(target, opts = {}) { return onShow?.(instance); }, arrow: arrow || (theme === 'bare' ? false : arrowSvg), - role: role || 'menu', // HTML role attribute - theme: theme || role || 'menu', // CSS theme, either "tooltip", "menu", "box-with-header" or "bare" + // HTML role attribute, ideally the default role would be "popover" but it does not exist + role: role || 'menu', + // CSS theme, either "default", "tooltip", "menu", "box-with-header" or "bare" + theme: theme || role || 'default', plugins: [followCursor], ...other, }); |