fix: z-index in app

Barresi · Apr 18, 2024 · bd9a8e7 · bd9a8e7
1 parent d388f9f
commit bd9a8e7
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 8 deletions.
diff --git a/src/entities/row-friends/ui/row-friends.tsx b/src/entities/row-friends/ui/row-friends.tsx
@@ -12,11 +12,11 @@ const RowFriends: FC<IRowFriendsProps> = ({ avatars }) => {
   const maxCount = isMobile ? 3 : 5
 
   const imgClasses = [
-    'mr-[-20px] z-[100]',
-    'mr-[-20px] z-[90]',
-    'mr-[-20px] z-[80]',
-    'mr-[-20px] z-[70]',
-    'mr-[-20px] z-[60]'
+    'mr-[-20px] z-[6]',
+    'mr-[-20px] z-[5]',
+    'mr-[-20px] z-[4]',
+    'mr-[-20px] z-[3]',
+    'mr-[-20px] z-[2]'
   ]
 
   const renderImg = (avatars: string[]): JSX.Element[] => {

diff --git a/src/shared/ui/input-send-message.tsx b/src/shared/ui/input-send-message.tsx
@@ -34,7 +34,7 @@ const InputSendMessage: FC<IInputSendMessageProps> = ({
       {withAvatar && (
         <UserAvatar
           src={avatar}
-          className='absolute top-[10px] z-50 left-[30px] w-[40px] h-[40px]'
+          className='absolute top-[10px] z-[2] left-[30px] w-[40px] h-[40px]'
         />
       )}
       <Input

diff --git a/src/widgets/header/ui/header.tsx b/src/widgets/header/ui/header.tsx
@@ -17,7 +17,7 @@ const Header: FC<IHeaderProps> = ({ className, ...props }) => {
   return (
     <header
       className={cn(
-        'fixed left-0 right-0 top-0 max-w-[100%] h-[54px] md:h-[84px] flex items-center justify-between py-[10px] px-[20px] lg:py-[20px] lg:px-[30px] bg-white dark:bg-grayBlue lg:rounded-[10px] lg:relative z-40',
+        'fixed left-0 right-0 top-0 max-w-[100%] h-[54px] md:h-[84px] flex items-center justify-between py-[10px] px-[20px] lg:py-[20px] lg:px-[30px] bg-white dark:bg-grayBlue lg:rounded-[10px] lg:relative z-10',
         className
       )}
       {...props}

diff --git a/src/widgets/mobile-nav/ui/mobile-nav.tsx b/src/widgets/mobile-nav/ui/mobile-nav.tsx
@@ -11,7 +11,7 @@ const MobileNav: FC = () => {
   const userChats = useAppSelector(selectMessengerUserChats)
   const totalUnreadMessages = userChats.reduce((acc, cur) => acc + cur.unread, 0)
   return (
-    <div className='flex w-full fixed bottom-0 left-0 items-center justify-between lg:gap-[10px] bg-white dark:bg-grayBlue text-signalBlack dark:text-smokyWhite lg:px-[20px] rounded-tl-[10px] rounded-tr-[10px] z-40 border-t border-t-smokyWhite dark:border-t-cadet'>
+    <div className='flex w-full fixed bottom-0 left-0 items-center justify-between lg:gap-[10px] bg-white dark:bg-grayBlue text-signalBlack dark:text-smokyWhite lg:px-[20px] rounded-tl-[10px] rounded-tr-[10px] z-10 border-t border-t-smokyWhite dark:border-t-cadet'>
       <ButtonNav
         className='w-full h-full flex-col px-0 justify-center items-center text-center text-[12px] md:text-[14px]'
         icon='user'