add

gangaweerakkody · Dec 22, 2024 · c1a8dd0 · c1a8dd0
1 parent 9169d07
commit c1a8dd0
Show file tree

Hide file tree

Showing 9 changed files with 203 additions and 115 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -43,5 +43,8 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "gh-pages": "^6.2.0"
   }
 }
diff --git a/src/Components/About.js b/src/Components/About.js
@@ -73,7 +73,7 @@ const About = () => {
             variant="contained"
             color="primary"
             startIcon={<LinkedInIcon />}
-            href="https://www.linkedin.com/in/your-linkedin-username" // Replace with your LinkedIn URL
+            href="https://www.linkedin.com/in/ganga-weerakkody-1587a92a9/" // Replace with your LinkedIn URL
             target="_blank"
             rel="noopener noreferrer"
             sx={{

diff --git a/src/Components/Contact.js b/src/Components/Contact.js
@@ -98,14 +98,16 @@ const Contact = () => {
                             <Button
                                 type="submit"
                                 variant="contained"
-                                color="primary"
+                                color='#BA55D3'
+
                                 sx={{
                                     px: 5,
                                     py: 1.5,
                                     mr: 2,
                                     textTransform: 'none',
                                     fontWeight: 'bold',
                                     fontSize: '1rem',
+
                                 }}
                             >
                                 Send Message

diff --git a/src/Components/Home.js b/src/Components/Home.js
@@ -1,116 +1,76 @@
 import React from 'react';
 import { Typography, Box, Button, Container } from '@mui/material';
-import { Swiper, SwiperSlide } from 'swiper/react';
-import 'swiper/css';
-import 'swiper/css/effect-fade';
-import 'swiper/css/navigation';
-import 'swiper/css/pagination';
-import 'swiper/css/autoplay'; // Explicit import for autoplay styles
 import Profile from '../Images/Profile.jpg';
-import { Autoplay, Pagination, Navigation } from 'swiper/modules';
-
-const slides = [
-  {
-    title: "I'm Isuru Ganga Weerakkody",
-    subtitle: 'Freelance Web Designer & Developer',
-    image: Profile,
-    actions: [
-      { label: 'Hire Me', link: '#' },
-      { label: 'Download CV', link: '#' },
-    ],
-  },
-  {
-    title: 'Crafting Beautiful Websites',
-    subtitle: 'Transforming ideas into digital experiences',
-    image: 'https://via.placeholder.com/500',
-    actions: [
-      { label: 'View Portfolio', link: '#' },
-    ],
-  },
-  {
-    title: 'Building Scalable Solutions',
-    subtitle: 'Creating efficient and robust applications',
-    image: 'https://via.placeholder.com/500',
-    actions: [
-      { label: 'Learn More', link: '#' },
-    ],
-  },
-];
 
 const Home = () => {
   return (
-    <Box id="home" sx={{ backgroundColor: '#BA55D3' }}>
-      <Container maxWidth="lg">
-        <Swiper
-          modules={[Autoplay, Pagination, Navigation]}
-          effect="fade"
-          navigation
-          pagination={{ clickable: true }}
-          autoplay={{ delay: 5000, disableOnInteraction: false }}
-          loop
-          style={{ padding: '30px 0' }}
-        >
-          {slides.map((slide, index) => (
-            <SwiperSlide key={index}>
-              <Box
-                sx={{
-                  display: 'flex',
-                  flexDirection: { xs: 'column', md: 'row' },
-                  alignItems: 'center',
-                  justifyContent: 'space-between',
-                  textAlign: { xs: 'center', md: 'left' },
-                  color: 'white',
-                  padding: 3,
-                }}
-              >
-                {/* Image Section */}
-                <Box
-                  sx={{
-                    width: 250,
-                    height: 250,
-                    borderRadius: '50%',
-                    overflow: 'hidden',
-                    backgroundImage: `url(${slide.image})`,
-                    backgroundSize: 'cover',
-                    backgroundPosition: 'center',
-                    flexShrink: 0,
-                    mb: { xs: 3, md: 0 },
-                  }}
-                />
-
-                {/* Text Section */}
-                <Box>
-                  <Typography variant="h3" fontWeight="bold" mb={2}>
-                    {slide.title}
-                  </Typography>
-                  <Typography variant="h5" color="textSecondary" mb={3}>
-                    {slide.subtitle}
-                  </Typography>
+    <Box
+      id="home"
+      sx={{
+        backgroundColor: '#1E1E1E', 
+        color: 'white', 
+        minHeight: '100vh',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        textAlign: 'center',
+      }}
+    >
+      <Container maxWidth="sm">
+        {/* Profile Image */}
+        <Box
+          sx={{
+            width: 200,
+            height: 200,
+            borderRadius: '50%',
+            overflow: 'hidden',
+            backgroundImage: `url(${Profile})`,
+            backgroundSize: 'cover',
+            backgroundPosition: 'center',
+            mx: 'auto',
+            mb: 3,
+          }}
+        />
+
+        <Typography variant="h3" fontWeight="bold" mb={2}>
+          I'm Isuru Ganga Weerakkody
+        </Typography>
+        <Typography variant="h5" mb={3}>
+         Software Engineer
+        </Typography>
 
-                  {/* Buttons */}
-                  {slide.actions.map((action, i) => (
-                    <Button
-                      key={i}
-                      variant="outlined"
-                      sx={{
-                        color: 'white',
-                        borderColor: 'white',
-                        mr: 2,
-                        '&:hover': {
-                          backgroundColor: 'white',
-                          color: '#BA55D3',
-                        },
-                      }}
-                      href={action.link}
-                    >
-                      {action.label}
-                    </Button>
-                  ))}
-                </Box>
-              </Box>
-            </SwiperSlide>
-          ))}
-        </Swiper>
+
+        <Box>
+          <Button
+            variant="outlined"
+            sx={{
+              color: 'white',
+              borderColor: 'white',
+              mr: 2,
+              '&:hover': {
+                backgroundColor: 'white',
+                color: '#1E1E1E',
+              },
+            }}
+            href="#"
+          >
+            Hire Me
+          </Button>
+          <Button
+            variant="outlined"
+            sx={{
+              color: 'white',
+              borderColor: 'white',
+              '&:hover': {
+                backgroundColor: 'white',
+                color: '#1E1E1E',
+              },
+            }}
+            href="#"
+          >
+            Download CV
+          </Button>
+        </Box>
       </Container>
     </Box>
   );