fix(): Fixing the landing page

Author: ar1603

Plan.md

@@ -0,0 +1,38 @@
+Section Division:
+
+AR-----------------------------------------------------------[Work, About, Blogs, Skills (Contact me)]-[Command-K] {Fixed}
+
+
+
+
+
+
+
+    Hello, I am {size bit smaller}                       Character                                 [RobotIcon]                  
+
+    [Amit Raikwar]
+
+
+
+
+
+
+
+
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+
+
+About Me 
+
+    I am a Software Developer, I have been working in the field of Software Development for the past 2 years. I have worked on various projects and have experience in developing Web Applications, Mobile Applications, and Desktop Applications. I have worked on various technologies like React, React Native, Node.js, Express.js, MongoDB, MySQL, and many more. I am always eager to learn new technologies and work on new projects. I am a quick learner and can adapt to new technologies quickly. I am always ready to take on new challenges and work on new projects. I am a team player and can work well in a team. I am always ready to help my team members and work together to achieve the goals of the project
+
+
+
+
+
+
+
+Work Experience

jest.js

@@ -3,3 +3,25 @@ import '@localization/config';
 jest.useFakeTimers();
 
 jest.mock('zustand');
+
+jest.mock('@tsparticles/react', () => {
+  return {
+    __esModule: true,
+    default: jest.fn(),
+  };
+});
+
+jest.mock('@tsparticles/slim', () => {
+  return {
+    __esModule: true,
+    default: jest.fn(),
+  };
+});
+
+// Mock font @fontsource/space-mono
+jest.mock('@fontsource/space-mono', () => {
+  return {
+    __esModule: true,
+    default: jest.fn(),
+  };
+});

package.json

@@ -26,6 +26,7 @@
     "@chakra-ui/react": "^2.8.2",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
+    "@fontsource/space-mono": "^5.1.2",
     "@react-three/drei": "^9.121.2",
     "@react-three/fiber": "^8.17.12",
     "@react-three/postprocessing": "^2.16.6",

public/favicon.ico

@@ -3,7 +3,6 @@ import { LinkButtonProps } from './types';
 import { ArrowIcon } from '@assets';
 import { useCursor } from '../../Cursor';
 import { useRef, useState } from 'react';
-import { useMousePositions } from '@hooks';
 
 const LinkButton = ({
   text,
@@ -41,7 +40,7 @@ const LinkButton = ({
 
   const translationProps = isHovered
     ? {
-        transform: 'translateY(15px)',
+        transform: 'translateY(12px)',
         transition: 'transform 0.2s',
       }
     : {
@@ -59,6 +58,7 @@ const LinkButton = ({
       color={'white'}
       colorScheme="violet"
       fontSize={fontSize}
+      fontWeight={'300'}
       borderRadius={0}
       overflow={'clip'}
       px={2}

src/assets/images/AmitRaikwarLogo.png

@@ -1,19 +1,22 @@
-import { Box } from '@chakra-ui/react';
+import { Box, Heading } from '@chakra-ui/react';
 import { Cover } from './Cover';
 
 const CoverText = ({
   text,
   highlightedText,
+  role,
 }: {
   text: string;
   highlightedText: string;
+  role: string;
 }) => {
   return (
-    <Box position={'absolute'} left={56} top={'200px'}>
-      <h1 className="text-4xl md:text-4xl lg:text-6xl font-semibold max-w-7xl mx-auto  mt-6 relative z-20 py-6 bg-clip-text text-transparent bg-gradient-to-b from-neutral-800 via-neutral-700 to-neutral-700 dark:from-neutral-800 dark:via-white dark:to-white">
-        {text} <br />
-        <br /> <Cover>{highlightedText}</Cover>
-      </h1>
+    <Box position={'absolute'} left={32} top={'200px'}>
+      <Heading className="text-2xl md:text-4xl lg:text-6xl font-semibold max-w-7xl mx-auto  mt-6 relative z-20 py-6 bg-clip-text text-transparent bg-gradient-to-b from-neutral-800 via-neutral-700 to-neutral-700 dark:from-neutral-800 dark:via-white dark:to-white">
+        <h2 className="text-xl md:text-3xl lg:text-4xl pb-6">{text}</h2>
+        <Cover>{highlightedText}</Cover>
+        <h2 className="text-xl md:text-3xl lg:text-4xl pt-6">{role}</h2>
+      </Heading>
     </Box>
   );
 };

src/components/Button/LinkButton/LinkButton.tsx

@@ -4,16 +4,16 @@ const Lights = () => {
   return (
     <>
       <Box
-        position={'fixed'}
+        position={'absolute'}
         top={0}
         right={0}
         boxShadow={
           '0 0 40px 10px blue, 0 0 100px 40px blue, 0 0 140px 60px blue'
         }
       />
       <Box
-        position={'fixed'}
-        top={'30%'}
+        position={'absolute'}
+        top={'450px'}
         left={-10}
         boxShadow={
           '0 0 40px 10px violet, 0 0 100px 20px violet, 0 0 140px 30px violet, 0 0 200px 40px violet, 0 0 300px 60px violet'

src/components/CoverText/CoverText.tsx

@@ -1,6 +1,7 @@
 import { ThemeConfig, extendTheme } from '@chakra-ui/react';
 import colors from './colors';
 import { fontSize, fontWeight, lineHeight, zIndices } from './fonts';
+import '@fontsource/space-mono';
 
 const config: ThemeConfig = {
   initialColorMode: 'light',
@@ -12,6 +13,9 @@ const themeData = {
   config: { ...config },
   colors: { ...colors },
   fontSizes: { ...fontSize },
+  fonts: {
+    heading: `'Space Mono', monospace`,
+  },
   fontWeights: { ...fontWeight },
   lineHeights: { ...lineHeight },
   zIndices: { ...zIndices },

src/components/Lights/Lights.tsx

@@ -19,3 +19,8 @@
   border-radius: 10px;
   box-shadow: 0 0 10px rgb(0, 0, 0);
 }
+
+::selection {
+  background-color: rgba(193, 129, 193, 0.576);
+  color: black; /* Optional: set text color within selection */
+}