diff --git a/src/components/helpers/tooltip/Tooltip.jsx b/src/components/helpers/tooltip/Tooltip.jsx
index 2a4f6283..61a55d39 100644
--- a/src/components/helpers/tooltip/Tooltip.jsx
+++ b/src/components/helpers/tooltip/Tooltip.jsx
@@ -10,16 +10,18 @@ function Tooltip({ children, title, style, placement, subtitle }) {
});
return (
-
setShowTooltip(true)}
- onMouseLeave={() => setShowTooltip(false)}
- onFocus={() => setShowTooltip(true)}
- onBlur={() => setShowTooltip(false)}
- ref={reference}
- >
- {children}
+ <>
+
setShowTooltip(true)}
+ onMouseLeave={() => setShowTooltip(false)}
+ onFocus={() => setShowTooltip(true)}
+ onBlur={() => setShowTooltip(false)}
+ ref={reference}
+ >
+ {children}
+
{showTooltip && (
{subtitle}
)}
-
+ >
);
}
diff --git a/src/components/widgets/background/scss/_photoinformation.scss b/src/components/widgets/background/scss/_photoinformation.scss
index d29c4802..268c4c40 100644
--- a/src/components/widgets/background/scss/_photoinformation.scss
+++ b/src/components/widgets/background/scss/_photoinformation.scss
@@ -199,6 +199,7 @@
.photoInformation {
@extend %basic;
+ animation: fadeIn 2s;
min-width: 300px;
font-size: 0.8em;
font-weight: 300;
@@ -361,3 +362,12 @@
@include basicIconButton(11px, 1.3rem, ui);
}
}
+
+@keyframes fadeIn {
+ 0% {
+ opacity: 0;
+ }
+ 100% {
+ opacity: 1;
+ }
+}
\ No newline at end of file