diff --git a/web_src/js/components/ActivityHeatmap.vue b/web_src/js/components/ActivityHeatmap.vue
index 5de6b8f1ef829..90d4bd8178850 100644
--- a/web_src/js/components/ActivityHeatmap.vue
+++ b/web_src/js/components/ActivityHeatmap.vue
@@ -68,18 +68,14 @@ export default {
   />
 </template>
 <style>
-/* A quick patch for vue3-calendar-heatmap's tooltip padding, to avoid conflicting with other tippy contents.
+/* A quick patch for vue3-calendar-heatmap's tooltip padding.
 At the moment we could only identify the tooltip by its transition property.
 https://github.com/razorness/vue3-calendar-heatmap/blob/955626176cb5dc3d3ead8120475c2e5e753cc392/src/components/CalendarHeatmap.vue#L202
 This selector should be replaced by a more specific one if the library adds a CSS class.
-TODO: Remove this after https://github.com/razorness/vue3-calendar-heatmap/pull/34 is merged and released,
-and then all styles could be merged into `.tippy-box` selector.
+TODO: Remove this after https://github.com/razorness/vue3-calendar-heatmap/pull/34 is merged and released.
 */
-[data-tippy-root][style*="transition: transform 0.1s ease-out"] .tippy-box {
+.tippy-box:not([data-theme]) {
   border: none;
-}
-/* some styles are put on the tippy-content intentionally, otherwise there will be strange animations */
-[data-tippy-root][style*="transition: transform 0.1s ease-out"] .tippy-box .tippy-content {
   transition: none !important;
   padding: 0.5rem 1rem;
   background-color: var(--color-tooltip-bg);