fix: remove 100% height from tooltip container to fix layout issues (#3980)

src/actions/actionCanvas.tsx

@@ -160,7 +160,7 @@ export const actionResetZoom = register({
     };
   },
   PanelComponent: ({ updateData, appState }) => (
-    <Tooltip label={t("buttons.resetZoom")}>
+    <Tooltip label={t("buttons.resetZoom")} style={{ height: "100%" }}>
       <ToolButton
         type="button"
         className="reset-zoom-button"

src/components/Tooltip.scss

@@ -29,7 +29,6 @@
 // wraps the element we want to apply the tooltip to
 .excalidraw-tooltip-wrapper {
   display: flex;
-  height: 100%;
 }
 
 .excalidraw-tooltip-icon {

src/components/Tooltip.tsx

@@ -62,9 +62,15 @@ type TooltipProps = {
   children: React.ReactNode;
   label: string;
   long?: boolean;
+  style?: React.CSSProperties;
 };
 
-export const Tooltip = ({ children, label, long = false }: TooltipProps) => {
+export const Tooltip = ({
+  children,
+  label,
+  long = false,
+  style,
+}: TooltipProps) => {
   useEffect(() => {
     return () =>
       getTooltipDiv().classList.remove("excalidraw-tooltip--visible");
@@ -84,6 +90,7 @@ export const Tooltip = ({ children, label, long = false }: TooltipProps) => {
       onPointerLeave={() =>
         getTooltipDiv().classList.remove("excalidraw-tooltip--visible")
       }
+      style={style}
     >
       {children}
     </div>