diff --git a/src/components/header.tsx b/src/components/header.tsx
index 61a0db1..889bb68 100644
--- a/src/components/header.tsx
+++ b/src/components/header.tsx
@@ -19,6 +19,8 @@ const Header: React.FC = () => {
sx={{
backgroundColor: "#7c77770d",
margin: "20px 20px 10px 20px",
+
+ boxShadow: "none",
width: {
xs: "91.6vw",
sm: "95.5vw",
@@ -36,7 +38,7 @@ const Header: React.FC = () => {
diff --git a/src/components/homepage.tsx b/src/components/homepage.tsx
index a91ee6e..2718c3a 100644
--- a/src/components/homepage.tsx
+++ b/src/components/homepage.tsx
@@ -67,15 +67,15 @@ const HomePage: React.FC = () => {
},
},
- typography: {
- fontFamily: "SF Pro Rounded Medium, Arial, sans-serif",
- h4: {
- color: "#333333",
- },
- body2:{
- color:"#77808B"
- }
- },
+ // typography: {
+ // fontFamily: "SF Pro Rounded Medium, Arial, sans-serif",
+ // h4: {
+ // color: "#333333",
+ // },
+ // body2:{
+ // color:"#77808B"
+ // }
+ // },
});
diff --git a/src/components/imageandgif/Loop Transforming waste.svg b/src/components/imageandgif/Loop Transforming waste.svg
new file mode 100644
index 0000000..1c2e4de
--- /dev/null
+++ b/src/components/imageandgif/Loop Transforming waste.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/components/imageandgif/Soil & Water Contamination.svg b/src/components/imageandgif/Soil & Water Contamination.svg
new file mode 100644
index 0000000..a560155
--- /dev/null
+++ b/src/components/imageandgif/Soil & Water Contamination.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/components/wastemanagement.tsx b/src/components/wastemanagement.tsx
index 9600169..e03a157 100644
--- a/src/components/wastemanagement.tsx
+++ b/src/components/wastemanagement.tsx
@@ -1,6 +1,7 @@
-import { createTheme, ThemeProvider, useMediaQuery, useTheme, Box, Grid } from "@mui/material";
-import wasteimage from "../components/imageandgif/loopwastemanage.png";
-import mobileWasteImage from "../components/imageandgif/Soil & Water Contamination mob.png";
+import { createTheme, ThemeProvider, useMediaQuery, useTheme, Grid } from "@mui/material";
+import wasteimage from "../components/imageandgif/Loop Transforming waste.svg";
+import { ReactComponent as MobileWasteImage } from "../components/imageandgif/Soil & Water Contamination.svg";
+
const customTheme = createTheme({
breakpoints: {
values: {
@@ -14,38 +15,42 @@ const customTheme = createTheme({
});
const WasteImageSection = () => {
- const theme = useTheme(); // Use the theme inside the component
+ const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("md"));
- // Function to scroll to the ref
- const scrollToRef = (ref: React.RefObject) => {
- if (ref.current) {
- ref.current.scrollIntoView({ behavior: "smooth", block: "center" });
- }
- };
-
return (
- 
+ {isMobile ? (
+
+ ) : (
+ 
+ )}
);
};
diff --git a/src/components/whyus.tsx b/src/components/whyus.tsx
index 723b6d5..413d8e9 100644
--- a/src/components/whyus.tsx
+++ b/src/components/whyus.tsx
@@ -3,8 +3,8 @@ import { Box, Grid, Typography } from "@mui/material";
import { styled } from "@mui/system";
const Circle = styled(Box)(({ theme }) => ({
- width: 150, // Increased size
- height: 150,
+ width: 170, // Increased size
+ height: 170,
borderRadius: "50%",
display: "flex",
alignItems: "center",
@@ -27,7 +27,7 @@ const items = [
const WhyChooseUs: React.FC = () => {
return (
-
+
Why Choose Us?