fix/layout #23

Merged
mihir merged 3 commits from fix/layout into main 2025-02-20 17:43:32 +05:30
11 changed files with 21 additions and 18 deletions
Showing only changes of commit 120e9e49df - Show all commits

View File

@ -13,7 +13,7 @@ const Footer: React.FC = () => {
<Grid container spacing={4}> <Grid container spacing={4}>
{/* Loop Sustainability */} {/* Loop Sustainability */}
<Grid item xs={12} md={3}> <Grid item xs={12} md={3}>
<Typography variant="h6" fontWeight="bold" sx={{ color: "#333333", fontFamily: "Helvetica, Arial, sans-serif" }}> <Typography variant="h6" sx={{ color: "#333333", fontFamily: "Helvetica, Arial, sans-serif" }}>
Loop Sustainability Loop Sustainability
</Typography> </Typography>
<Typography variant="body2" sx={{ mt: 1, color: "#77808B", fontFamily: "Helvetica, Arial, sans-serif" }}> <Typography variant="body2" sx={{ mt: 1, color: "#77808B", fontFamily: "Helvetica, Arial, sans-serif" }}>
@ -23,7 +23,7 @@ const Footer: React.FC = () => {
{/* Get in Touch */} {/* Get in Touch */}
<Grid item xs={7} md={3}> <Grid item xs={7} md={3}>
<Typography variant="h6" fontWeight="bold" sx={{ color: "#333333", fontFamily: "Helvetica, Arial, sans-serif" }}> <Typography variant="h6" sx={{ color: "#333333", fontFamily: "Helvetica, Arial, sans-serif" }}>
Get in Touch Get in Touch
</Typography> </Typography>
<Box display="flex" alignItems="flex-start" sx={{ mt: 1, color: "#77808B" }}> <Box display="flex" alignItems="flex-start" sx={{ mt: 1, color: "#77808B" }}>
@ -48,7 +48,7 @@ const Footer: React.FC = () => {
{/* Company Links */} {/* Company Links */}
<Grid item xs={5} md={3} textAlign="center"> <Grid item xs={5} md={3} textAlign="center">
<Typography variant="h6" fontWeight="bold" sx={{ color: "#333333", fontFamily: "Helvetica, Arial, sans-serif" }}> <Typography variant="h6" sx={{ color: "#333333", fontFamily: "Helvetica, Arial, sans-serif" }}>
Company Company
</Typography> </Typography>
<Box sx={{ mt: 1 }}> <Box sx={{ mt: 1 }}>
@ -60,7 +60,7 @@ const Footer: React.FC = () => {
display="block" display="block"
sx={{ sx={{
color: "#77808B", color: "#77808B",
mt: 0.5, mt: 1,
textDecoration: "none", textDecoration: "none",
fontFamily: "Helvetica, Arial, sans-serif", fontFamily: "Helvetica, Arial, sans-serif",
"&:hover": { textDecoration: "underline" }, "&:hover": { textDecoration: "underline" },

View File

@ -26,10 +26,12 @@ import sustainability from "../components/imageandgif/Untitled-2.png"
import wasteimage from "../components/imageandgif/loopwastemanage.png" import wasteimage from "../components/imageandgif/loopwastemanage.png"
import WhyChooseUs from "./whyus"; import WhyChooseUs from "./whyus";
import WasteImageSection from "./wastemanagement"; import WasteImageSection from "./wastemanagement";
import loopgif from "../components/imageandgif/loop hero new (1).gif" import loopgif from "../components/imageandgif/Loopherosectionmobiless.gif"
import gifsevenm from "../components/imageandgif/disintegrate mobile.gif"; import gifsevenm from "../components/imageandgif/disintegrate mobile (2).gif";
import gifeightm from "../components/imageandgif/gifeight.gif"; import gifeightm from "../components/imageandgif/reminemobile.gif";
import giffivem from "../components/imageandgif/repairm.gif";
import gifsixm from "../components/imageandgif/newusenewuse.gif";
import gifonem from "../components/imageandgif/mine mobile.gif";
@ -168,7 +170,7 @@ const HomePage: React.FC = () => {
}}> }}>
<Box sx={{ width: { xs: "60%", md: "70%" } }}> <Box sx={{ width: { xs: "60%", md: "70%" } }}>
<img src={gifone} alt="Gif" style={{ width: "91%" }} /> <img src={gifonem} alt="Gif" style={{ width: "91%" }} />
</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" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Mine from nature</Typography> <Typography variant="h4" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Mine from nature</Typography>
@ -395,7 +397,7 @@ const HomePage: React.FC = () => {
<Box sx={{ display: "flex", justifyContent: "center" }}> <Box sx={{ display: "flex", justifyContent: "center" }}>
<Box sx={{ width: { xs: "100%", md: "60%" } }}> <Box sx={{ width: { xs: "100%", md: "60%" } }}>
<img <img
src={gifsix} src={gifsixm}
alt="Reuse Gif" alt="Reuse Gif"
style={{ width: "100%" }} style={{ width: "100%" }}
/> />
@ -408,7 +410,7 @@ const HomePage: React.FC = () => {
{/* Repair */} {/* Repair */}
<Grid item xs={6}> <Grid item xs={6}>
<Box sx={{ p: 2, textAlign: { xs: "left", md: 'center' }, borderRadius: 2 }}> <Box sx={{ p: 2, textAlign: { xs: "left", md: 'center' }, borderRadius: 2 }}>
<Box sx={{ background: "#95CD41", p: 1, height: { xs: 175, sm: 138, md: 118 }, maxHeight: 270 }}> <Box sx={{ background: "#95CD41",marginBottom:'30px', p: 1, height: { xs: 175, sm: 138, md: 118 }, maxHeight: 270 }}>
<Typography variant="h4" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Repair</Typography> <Typography variant="h4" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Repair</Typography>
<Typography variant="body2" sx={{fontSize:{xs:"12px" , sm:'16px'}}}> <Typography variant="body2" sx={{fontSize:{xs:"12px" , sm:'16px'}}}>
Loop Sustainability steps in to repair damaged or outdated electronics. Loop Sustainability steps in to repair damaged or outdated electronics.
@ -419,7 +421,7 @@ const HomePage: React.FC = () => {
<Box sx={{ display: "flex", justifyContent: "center" }}> <Box sx={{ display: "flex", justifyContent: "center" }}>
<Box sx={{ width: { xs: "100%", md: "60%" } }}> <Box sx={{ width: { xs: "100%", md: "60%" } }}>
<img <img
src={giffive} src={giffivem}
alt="Reuse Gif" alt="Reuse Gif"
style={{ width: "100%" }} style={{ width: "100%" }}
/> />
@ -434,7 +436,7 @@ const HomePage: React.FC = () => {
<Box sx={{ display: "flex", justifyContent: "center" }}> <Box sx={{ display: "flex", justifyContent: "center" }}>
<Box sx={{ width: { xs: "100%", md: "60%" } }}> <Box sx={{ width: { xs: "100%", md: "60%" } }}>
<img <img
src={gifseven} src={gifsevenm}
alt="Reuse Gif" alt="Reuse Gif"
style={{ width: "100%" }} style={{ width: "100%" }}
/> />
@ -452,9 +454,9 @@ const HomePage: React.FC = () => {
<Grid item xs={6} sx={{ mt: 2 }}> <Grid item xs={6} sx={{ mt: 2 }}>
<Box sx={{ p: 2, textAlign: { xs: "left", md: 'center' }, borderRadius: 2, maxHeight: 270 }}> <Box sx={{ p: 2, textAlign: { xs: "left", md: 'center' }, borderRadius: 2, maxHeight: 270 }}>
<Box sx={{ display: "flex", justifyContent: "center" }}> <Box sx={{ display: "flex", justifyContent: "center" }}>
<Box sx={{ width: { xs: "100%", md: "60%" } }}> <Box sx={{ width: { xs: "100%", md: "60%" } ,marginTop:'27px' }}>
<img <img
src={gifeight} src={gifeightm}
alt="Reuse Gif" alt="Reuse Gif"
style={{ width: "100%" }} style={{ width: "100%" }}
/> />

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 121 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 872 KiB

View File

@ -82,8 +82,9 @@ const OurTeam: React.FC = () => {
color: "#4D4D4D", color: "#4D4D4D",
fontSize: { xs: "12px", sm: "20px" }, fontSize: { xs: "12px", sm: "20px" },
fontFamily: "SF Pro Regular, Arial, sans-serif", fontFamily: "SF Pro Regular, Arial, sans-serif",
padding:"30px", paddingLeft:"60px",
textAlign:'center' textAlign:'center',
paddingRight:"60px",
}} }}
> >
For over a decade, our team members have been actively involved in For over a decade, our team members have been actively involved in