From 78c759407a88ae5bc23278cfa7719b20266cfbec Mon Sep 17 00:00:00 2001
From: tomimarkus991 <tomimarkusalber@gmail.com>
Date: Mon, 2 Aug 2021 10:07:48 +0300
Subject: [PATCH] Dupdate

---
 tunduk/components/Cards/InviteCard.tsx        | 11 +++++--
 tunduk/components/Cards/MemberCard.tsx        |  5 ++--
 .../components/Containers/GroupsContainer.tsx | 29 +++++++++++++------
 .../components/Containers/LogsContainer.tsx   |  9 +++---
 tunduk/components/Invites/Invites.tsx         | 14 +++------
 tunduk/components/Text/LinkLabel.tsx          |  3 +-
 6 files changed, 40 insertions(+), 31 deletions(-)

diff --git a/tunduk/components/Cards/InviteCard.tsx b/tunduk/components/Cards/InviteCard.tsx
index ab65ccb..a88e1e2 100644
--- a/tunduk/components/Cards/InviteCard.tsx
+++ b/tunduk/components/Cards/InviteCard.tsx
@@ -19,10 +19,15 @@ export const InviteCard: React.FC<Props> = ({
   const { id, groups, sender } = invite;
   const { avatar_url, group_name } = groups;
   return (
-    <Box boxSizing="border-box" boxShadow="2xl" borderRadius={20} py="4">
+    <Box
+      boxSizing="border-box"
+      style={{ boxShadow: '1px 1px 8px 2px #DDCDBF' }}
+      borderRadius={20}
+      py="4"
+    >
       <Flex flexDirection="column" alignItems="center">
         <AvatarInvite src={avatar_url} />
-        <Box textAlign="center">
+        <Box my="4" textAlign="center">
           <Text fontSize={20}>
             <strong>{sender}</strong> invites you
           </Text>
@@ -32,7 +37,7 @@ export const InviteCard: React.FC<Props> = ({
           </Text>
         </Box>
 
-        <HStack mt="4" spacing="7">
+        <HStack spacing="7">
           <IconButton
             aria-label="decline"
             borderRadius="100"
diff --git a/tunduk/components/Cards/MemberCard.tsx b/tunduk/components/Cards/MemberCard.tsx
index c1b18f1..e4d6274 100644
--- a/tunduk/components/Cards/MemberCard.tsx
+++ b/tunduk/components/Cards/MemberCard.tsx
@@ -1,9 +1,8 @@
 import { Flex, Text } from '@chakra-ui/react';
-import { faUser } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import React from 'react';
 import { ProfileType } from '../../types';
 import { AvatarCard } from '../Avatar';
+import { BlackProfileIcon } from '../Icons/Profile/BlackProfileIcon';
 
 interface Props {
   member: ProfileType;
@@ -19,7 +18,7 @@ export const MemberCard: React.FC<Props> = ({ member }) => {
     >
       <AvatarCard
         src={avatar_url}
-        icon={<FontAwesomeIcon icon={faUser} size="2x" />}
+        icon={<BlackProfileIcon w="4.5rem" h="4.5rem" />}
       />
       <Text fontSize={28}>{username}</Text>
     </Flex>
diff --git a/tunduk/components/Containers/GroupsContainer.tsx b/tunduk/components/Containers/GroupsContainer.tsx
index 1aaaaea..abad680 100644
--- a/tunduk/components/Containers/GroupsContainer.tsx
+++ b/tunduk/components/Containers/GroupsContainer.tsx
@@ -1,13 +1,19 @@
-import { Box, Center, SimpleGrid, Text, VStack } from '@chakra-ui/react';
+import {
+  Box,
+  Center,
+  IconButton,
+  SimpleGrid,
+  Text,
+  VStack,
+} from '@chakra-ui/react';
 import React, { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { GroupType, StringOrUndefined } from '../../types';
-import { GradientButton } from '../Buttons';
 import { GroupCard } from '../Cards';
 import { Heading } from '../Headers';
+import { AddGroupIcon } from '../Icons/Doggo';
 import { DogPawn } from '../Icons/LightMode';
 import MainContainerLayout from '../Layouts/Containers';
-import { GradientButtonText } from '../Text';
 
 interface Props {
   userGroups: GroupType[] | undefined;
@@ -51,13 +57,18 @@ export const GroupsContainer: React.FC<Props> = ({
     <MainContainerLayout
       button={
         <Link to="/group/create-group">
-          <GradientButton
+          <IconButton
+            aria-label="Add new doggo group"
+            size="sm"
+            w="100%"
+            h="100%"
+            p={2}
+            borderRadius="100"
             isDisabled={isAddDoggoGroupDisabled || username === null}
-          >
-            <GradientButtonText fontSize={25}>
-              New Doggo Group
-            </GradientButtonText>
-          </GradientButton>
+            bgColor="transparent"
+            _hover={{ bgColor: 'transparent' }}
+            icon={<AddGroupIcon width="28" height="28" />}
+          />
         </Link>
       }
       isLoading={isLoading}
diff --git a/tunduk/components/Containers/LogsContainer.tsx b/tunduk/components/Containers/LogsContainer.tsx
index a9f6ffb..73ea2a4 100644
--- a/tunduk/components/Containers/LogsContainer.tsx
+++ b/tunduk/components/Containers/LogsContainer.tsx
@@ -53,12 +53,13 @@ export const LogsContainer: React.FC<Props> = ({}) => {
   return (
     <VStack id="VStack">
       <Flex
+        position="relative"
+        style={{ boxShadow: '1px 1px 8px 2px #DDCDBF' }}
         h="md"
         w="3xl"
         justifyContent="center"
         alignItems="center"
         borderRadius={20}
-        boxShadow="xl"
         mb="1em"
         // py="4"
         flexDirection="column"
@@ -93,9 +94,9 @@ export const LogsContainer: React.FC<Props> = ({}) => {
           </SimpleGrid>
           // </Flex>
         )}
-      </Flex>
-      <Flex w="3xl" justifyContent="flex-end">
-        <AddDutyLink />
+        <Box position="absolute" right="-10" bottom="-10">
+          <AddDutyLink />
+        </Box>
       </Flex>
     </VStack>
   );
diff --git a/tunduk/components/Invites/Invites.tsx b/tunduk/components/Invites/Invites.tsx
index dc815d5..14692eb 100644
--- a/tunduk/components/Invites/Invites.tsx
+++ b/tunduk/components/Invites/Invites.tsx
@@ -10,14 +10,13 @@ import {
   useDisclosure,
   VStack,
 } from '@chakra-ui/react';
-import { faEnvelope } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import React, { useEffect } from 'react';
 import { useAuth } from '../../context/authContext/AuthContext';
 import { InviteDataType, StringOrUndefined } from '../../types';
 import { supabase } from '../../utils/supabaseClient';
 import { GradientButton } from '../Buttons';
 import { InviteCard } from '../Cards';
+import { InvitesIcon } from '../Icons/Navbar';
 import { GradientButtonText, LinkLabel } from '../Text';
 
 interface Props {
@@ -131,14 +130,9 @@ const Invites: React.FC<Props> = ({
   }, [userInvites]);
 
   return (
-    <Box>
+    <>
       <VStack cursor="pointer" onClick={onOpen}>
-        <FontAwesomeIcon
-          id="Invites"
-          icon={faEnvelope}
-          color="#DDCDBF"
-          size="3x"
-        />
+        <InvitesIcon id="Invites" width="5.5rem" height="4rem" />
         <LinkLabel htmlFor="Invites" label="Invites" />
       </VStack>
 
@@ -176,7 +170,7 @@ const Invites: React.FC<Props> = ({
           </ModalFooter>
         </ModalContent>
       </Modal>
-    </Box>
+    </>
   );
 };
 export default Invites;
diff --git a/tunduk/components/Text/LinkLabel.tsx b/tunduk/components/Text/LinkLabel.tsx
index 28aaa25..65cd8fd 100644
--- a/tunduk/components/Text/LinkLabel.tsx
+++ b/tunduk/components/Text/LinkLabel.tsx
@@ -11,9 +11,8 @@ export const LinkLabel: React.FC<Props> = ({ htmlFor, label }) => {
       htmlFor={htmlFor}
       textAlign="center"
       fontSize="md"
-      m={0}
       cursor="pointer"
-      casing="uppercase"
+      textTransform="uppercase"
     >
       {label}
     </FormLabel>