Compare commits
No commits in common. "513e1850bbf2812e6042a53f60872e0d86736bae" and "ebbb137d164b741c1963af3ce533440f80af5ae7" have entirely different histories.
513e1850bb
...
ebbb137d16
|
|
@ -36,9 +36,3 @@
|
||||||
transform: rotate(360deg);
|
transform: rotate(360deg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@font-face {
|
|
||||||
font-family: 'SF Pro Medium';
|
|
||||||
src: url('../src/fonts/SF-Pro-Medium.otf') format('opentype');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -67,16 +67,6 @@ const HomePage: React.FC = () => {
|
||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
typography: {
|
|
||||||
fontFamily: "SF Pro Rounded Medium, Arial, sans-serif",
|
|
||||||
h4: {
|
|
||||||
color: "#333333",
|
|
||||||
},
|
|
||||||
body2:{
|
|
||||||
color:"#4D4D4D"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -166,7 +156,7 @@ const HomePage: React.FC = () => {
|
||||||
</Box>
|
</Box>
|
||||||
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
||||||
<Typography variant="h4">Mine from nature</Typography>
|
<Typography variant="h4">Mine from nature</Typography>
|
||||||
<Typography variant="body2">Raw materials are extracted through destructive mining practices, causing habitat loss, soil erosion, and water contamination. </Typography>
|
<p>Raw materials are extracted through destructive mining practices, causing habitat loss, soil erosion, and water contamination. </p>
|
||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
@ -189,7 +179,7 @@ const HomePage: React.FC = () => {
|
||||||
}}>
|
}}>
|
||||||
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
||||||
<Typography variant="h4">Manufacturing</Typography>
|
<Typography variant="h4">Manufacturing</Typography>
|
||||||
<Typography variant="body2">Materials are processed in energy-intensive factories that rely on fossil fuels, generating high carbon emissions </Typography>
|
<p>Materials are processed in energy-intensive factories that rely on fossil fuels, generating high carbon emissions </p>
|
||||||
</Box>
|
</Box>
|
||||||
<Box sx={{ width: { lg: '50%' , md:'67%' } }}>
|
<Box sx={{ width: { lg: '50%' , md:'67%' } }}>
|
||||||
<img src={giftwo} alt="Gif" style={{ width: "100%" }} />
|
<img src={giftwo} alt="Gif" style={{ width: "100%" }} />
|
||||||
|
|
@ -221,7 +211,7 @@ const HomePage: React.FC = () => {
|
||||||
</Box>
|
</Box>
|
||||||
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
||||||
<Typography variant="h4">Assemble</Typography>
|
<Typography variant="h4">Assemble</Typography>
|
||||||
<Typography variant="body2">Materials are processed in energy-intensive factories that rely on fossil fuels, generating high carbon emissions </Typography>
|
<p>Materials are processed in energy-intensive factories that rely on fossil fuels, generating high carbon emissions </p>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
</Box>
|
</Box>
|
||||||
|
|
@ -245,7 +235,7 @@ const HomePage: React.FC = () => {
|
||||||
}}>
|
}}>
|
||||||
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
<Box sx={{ width: "100%", paddingLeft: { xs: "0", md: "10px" }, textAlign: { lg: 'left', xs: 'center' } }}>
|
||||||
<Typography variant="h4">Use</Typography>
|
<Typography variant="h4">Use</Typography>
|
||||||
<Typography variant="body2">Devices are used by consumers and businesses, but their production and usage contribute significantly to carbon footprints, energy consumption, and waste generation.</Typography>
|
<p>Devices are used by consumers and businesses, but their production and usage contribute significantly to carbon footprints, energy consumption, and waste generation.</p>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
<Box sx={{ width: { xs: "60%",md:'70%' } }}>
|
<Box sx={{ width: { xs: "60%",md:'70%' } }}>
|
||||||
|
|
@ -369,7 +359,7 @@ const HomePage: React.FC = () => {
|
||||||
</Box>
|
</Box>
|
||||||
</Grid>
|
</Grid>
|
||||||
{/* mobile only */}
|
{/* mobile only */}
|
||||||
<Grid container spacing={2} rowSpacing={{ xs: 18, sm: 26, md: 40 }}
|
<Grid container spacing={2} rowSpacing={{ xs: 12, sm: 26, md: 40 }}
|
||||||
sx={{
|
sx={{
|
||||||
display: { xs: "flex", md: "flex", lg: 'none' },
|
display: { xs: "flex", md: "flex", lg: 'none' },
|
||||||
backgroundImage: { lg: null, xs: `url(${mobileback})` },
|
backgroundImage: { lg: null, xs: `url(${mobileback})` },
|
||||||
|
|
|
||||||
|
|
@ -11,11 +11,3 @@ code {
|
||||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||||
monospace;
|
monospace;
|
||||||
}
|
}
|
||||||
@font-face {
|
|
||||||
font-family: 'SF Pro Medium';
|
|
||||||
src: url('../src//fonts//SF-Pro-Medium.otf') format('opentype');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue