feat: ajust UI after upgrade Mantine

stephane-r · Oct 19, 2023 · 79b8a6e · 79b8a6e
1 parent f8f690c
commit 79b8a6e
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 14 deletions.
diff --git a/src/components/ButtonDownload.tsx b/src/components/ButtonDownload.tsx
@@ -24,7 +24,7 @@ export const ButtonDownload: React.FC<ButtonDownloadProps> = memo(
     return (
       <Menu>
         <Menu.Target>
-          <ActionIcon title={t("download.sound")}>
+          <ActionIcon color="transparent" title={t("download.sound")}>
             <IconDownload size={iconSize} />
           </ActionIcon>
         </Menu.Target>

diff --git a/src/components/ButtonPlayerModeVideo.tsx b/src/components/ButtonPlayerModeVideo.tsx
@@ -1,4 +1,4 @@
-import { ActionIcon, Menu, Tooltip } from "@mantine/core";
+import { ActionIcon, Menu } from "@mantine/core";
 import { IconVideo } from "@tabler/icons-react";
 import { memo } from "react";
 import { useTranslation } from "react-i18next";
@@ -35,14 +35,14 @@ export const ButtonPlayerModeVideo: React.FC<ButtonPlayerModeVideoProps> = memo(
     }
 
     return (
-      <Tooltip label={t("video.mode")}>
-        <ActionIcon
-          onClick={handleClick}
-          variant={playerMode === "video" ? "filled" : undefined}
-        >
-          <IconVideo size={iconSize} />
-        </ActionIcon>
-      </Tooltip>
+      <ActionIcon
+        onClick={handleClick}
+        color="transparent"
+        title={t("video.mode")}
+        variant={playerMode === "video" ? "filled" : undefined}
+      >
+        <IconVideo size={iconSize} />
+      </ActionIcon>
     );
   },
 );
diff --git a/src/components/ButtonRepeat.tsx b/src/components/ButtonRepeat.tsx
@@ -30,7 +30,7 @@ export const ButtonRepeat: React.FC<ButtonRepeatProps> = memo(
     };
 
     return (
-      <ActionIcon onClick={handleClick}>
+      <ActionIcon color="transparent" onClick={handleClick} title="Repeat">
         {playerState.repeat ? (
           <IconRepeatOnce size={iconSize ?? undefined} />
         ) : (

diff --git a/src/components/ButtonShare.tsx b/src/components/ButtonShare.tsx
@@ -49,7 +49,7 @@ export const ButtonShare: React.FC<ButtonDownloadProps> = memo(
     return (
       <Menu shadow="md" width={220}>
         <Menu.Target>
-          <ActionIcon title={t("button.share.video")}>
+          <ActionIcon color="transparent" title={t("button.share.video")}>
             <IconShare size={iconSize} />
           </ActionIcon>
         </Menu.Target>

diff --git a/src/components/Player.tsx b/src/components/Player.tsx
@@ -137,7 +137,7 @@ export const ButtonVolume = memo(() => {
   return (
     <Popover shadow="md">
       <Popover.Target>
-        <ActionIcon>
+        <ActionIcon color="transparent">
           <IconVolume size={20} />
         </ActionIcon>
       </Popover.Target>
@@ -170,7 +170,7 @@ const PlayerPlaylist = memo(() => {
           <VideoList videos={videosPlaylist} />
         </ScrollArea>
       </Drawer>
-      <ActionIcon onClick={() => setOpened(true)}>
+      <ActionIcon color="transparent" onClick={() => setOpened(true)}>
         <IconPlaylist size={20} />
       </ActionIcon>
     </>