From 40cf00d385e5d9810327e1f2b0e1f92ef55e1726 Mon Sep 17 00:00:00 2001
From: Ron Lucke <lucke@elan-ev.de>
Date: Wed, 15 Jan 2025 11:36:40 +0000
Subject: Fehler bei Hochkontrastmodus in der Kopfzeile

Closes #5027

Merge request studip/studip!3829
---
 resources/assets/javascripts/bootstrap/tooltip.js | 6 ++++--
 resources/assets/stylesheets/scss/tooltip.scss    | 9 +++++++++
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/resources/assets/javascripts/bootstrap/tooltip.js b/resources/assets/javascripts/bootstrap/tooltip.js
index 4b17cb0..0792f5a 100644
--- a/resources/assets/javascripts/bootstrap/tooltip.js
+++ b/resources/assets/javascripts/bootstrap/tooltip.js
@@ -11,11 +11,13 @@ STUDIP.Tooltip.threshold = 6;
 $(document).on('mouseenter mouseleave focusin focusout', '[data-tooltip],.tooltip:has(.tooltip-content)', function(event) {
     let data = $(this).data();
 
+    const inTopBar = $(this).parents('#top-bar').length > 0;
     const visible = ['mouseenter', 'focusin'].includes(event.type);
     const offset = $(this).offset();
     const x = offset.left + $(this).outerWidth(true) / 2;
-    const y = offset.top;
+    const y = inTopBar ? offset.top + 160 : offset.top;
     const delay = data.tooltipDelay ?? 300;
+    const tooltipClasses = inTopBar ? 'studip-tooltip studip-tooltip-top' : '';
 
     let content;
     let tooltip;
@@ -38,7 +40,7 @@ $(document).on('mouseenter mouseleave focusin focusout', '[data-tooltip],.toolti
         $(this).attr('title', null);
         $(this).attr('data-tooltip', content);
 
-        tooltip = new STUDIP.Tooltip(x, y, content);
+        tooltip = new STUDIP.Tooltip(x, y, content, tooltipClasses);
 
         data.tooltipObject = tooltip;
 
diff --git a/resources/assets/stylesheets/scss/tooltip.scss b/resources/assets/stylesheets/scss/tooltip.scss
index 223b72b..60728ae 100644
--- a/resources/assets/stylesheets/scss/tooltip.scss
+++ b/resources/assets/stylesheets/scss/tooltip.scss
@@ -21,6 +21,15 @@
 
 .studip-tooltip {
     @extend %tooltip;
+    &.studip-tooltip-top {
+        @include arrow-top-border(9px, $dark-gray-color-5, 1px, $dark-gray-color-30, 5px);
+        &::before {
+            top: -18px;
+        }
+        &::after {
+            top: -16px;
+        }
+    }
 }
 
 .tooltip {
-- 
cgit v1.0