fixed fonts
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
hardik
parent
0c882a3203
commit
1a3d2689f2
|
|
@ -42,3 +42,9 @@
|
|||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Helvetica Neue';
|
||||
src: url('../src//fonts/HelveticaNeue.ttc') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -54,13 +54,13 @@ const Header: React.FC = () => {
|
|||
|
||||
{/* Desktop Navigation */}
|
||||
<Box sx={{ display: { xs: "none", md: "flex" }, gap: 3, fontFamily: "Helvetica" }}>
|
||||
<Button sx={{ fontFamily: "Helvetica", textTransform: "capitalize" }} color="inherit">Home</Button>
|
||||
<Button sx={{ fontFamily: "Helvetica", textTransform: "capitalize" }} color="inherit">About</Button>
|
||||
<Button sx={{ fontFamily: "Helvetica", textTransform: "capitalize" }} color="inherit">Team</Button>
|
||||
<Button sx={{ fontFamily: "Helvetica", textTransform: "capitalize" , color:"#2F2E41"}} >Home</Button>
|
||||
<Button sx={{ fontFamily: "Helvetica", textTransform: "capitalize" , color:"#2F2E41" }} >About</Button>
|
||||
<Button sx={{ fontFamily: "Helvetica", textTransform: "capitalize" ,color:"#2F2E41" }} >Team</Button>
|
||||
<Button
|
||||
sx={{
|
||||
padding: "7px 20px",
|
||||
backgroundColor: "#0841adcc",
|
||||
backgroundColor: "#317AF6",
|
||||
color: "white",
|
||||
fontFamily: "Helvetica",
|
||||
textTransform: "capitalize",
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@ const HomePage: React.FC = () => {
|
|||
},
|
||||
},
|
||||
typography: {
|
||||
fontFamily: "SF Pro Rounded Regular, Arial, sans-serif",
|
||||
fontFamily: "SF Pro Regular, Arial, sans-serif",
|
||||
h4: {
|
||||
color: "#333333",
|
||||
},
|
||||
|
|
@ -118,7 +118,8 @@ const HomePage: React.FC = () => {
|
|||
textAlign: "center",
|
||||
color:'#333333',
|
||||
height:'107px',
|
||||
fontSize:{xs:'12px' , sm:'16px'}
|
||||
fontSize:{xs:'12px' , sm:'16px'},
|
||||
fontFamily: "SF Pro Regular, Arial, sans-serif",
|
||||
}}
|
||||
>
|
||||
<Typography variant="body1">{text}</Typography>
|
||||
|
|
@ -374,18 +375,18 @@ const HomePage: React.FC = () => {
|
|||
</Box>
|
||||
</Grid>
|
||||
{/* mobile only */}
|
||||
<Grid container spacing={2} rowSpacing={{ xs: 24, sm: 36, md: 38 }}
|
||||
<Grid container spacing={2} rowSpacing={{ xs: 24, sm: 36, md: 30 }}
|
||||
sx={{
|
||||
display: { xs: "flex", md: "flex", lg: 'none' },
|
||||
backgroundImage: { lg: null, xs: `url(${mobileback})` },
|
||||
backgroundSize: { xs: "60%", md: "70%", sm:'70%' },
|
||||
backgroundSize: { xs: "60%", md: "50%", sm:'70%' },
|
||||
backgroundPosition: { xs: "50% 60%", md: '50% 57%' },
|
||||
backgroundRepeat: "no-repeat",
|
||||
}}>
|
||||
{/* Reuse */}
|
||||
<Grid item xs={6}>
|
||||
<Box sx={{ p: 2, textAlign: { xs: "left", md: 'center' }, borderRadius: 2 }}>
|
||||
<Box sx={{ background: "#95CD41", p: 1, height: { xs: 175, sm: 131, md: 118 }, maxHeight: 270 }}>
|
||||
<Box sx={{ background: "#95CD41", p: 1, height: { xs: 175, sm: 138, md: 118 }, maxHeight: 270 }}>
|
||||
<Typography variant="h4" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Reuse</Typography>
|
||||
<Typography variant="body2" sx={{fontSize:{xs:"12px" , sm:'16px'}}}>
|
||||
We help businesses reuse their old electronic devices, repurposing functional parts and components for future use or resale, reducing overall environmental impact.
|
||||
|
|
@ -407,7 +408,7 @@ const HomePage: React.FC = () => {
|
|||
{/* Repair */}
|
||||
<Grid item xs={6}>
|
||||
<Box sx={{ p: 2, textAlign: { xs: "left", md: 'center' }, borderRadius: 2 }}>
|
||||
<Box sx={{ background: "#95CD41", p: 1, height: { xs: 175, sm: 131, md: 118 }, maxHeight: 270 }}>
|
||||
<Box sx={{ background: "#95CD41", 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="body2" sx={{fontSize:{xs:"12px" , sm:'16px'}}}>
|
||||
Loop Sustainability steps in to repair damaged or outdated electronics.
|
||||
|
|
@ -439,7 +440,7 @@ const HomePage: React.FC = () => {
|
|||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box sx={{ background: "#95CD41", p: 1, height: { xs: 175, sm: 131 , md:118}, maxHeight: 270 }}>
|
||||
<Box sx={{ background: "#95CD41", p: 1, height: { xs: 175, sm: 138 , md:118}, maxHeight: 270 }}>
|
||||
<Typography variant="h4" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Disintegrate</Typography>
|
||||
<Typography variant="body2"sx={{fontSize:{xs:"12px" , sm:'16px'}}} >When electronics can no longer be repaired or reused, we safely disintegrate them into valuable materials, ensuring they are properly processed and recycled.</Typography>
|
||||
|
||||
|
|
@ -459,7 +460,7 @@ const HomePage: React.FC = () => {
|
|||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box sx={{ background: "#95CD41", p: 1, textAlign: { xs: "left", md: 'center' }, height: { xs: 175, sm: 131 , md:118} }}>
|
||||
<Box sx={{ background: "#95CD41", p: 1, textAlign: { xs: "left", md: 'center' }, height: { xs: 175, sm: 138 , md:118} }}>
|
||||
<Typography variant="h4" sx={{fontSize:{xs:"18px" , sm:'36px'},fontFamily: "Helvetica Neue",}}>Remine</Typography>
|
||||
<Typography variant="body2"sx={{fontSize:{xs:"12px" , sm:'16px'}}} >We take the disintegrated materials and remines them for precious metals, turning waste back into usable resources. closing the loop on electronic waste.</Typography>
|
||||
</Box>
|
||||
|
|
|
|||
|
|
@ -56,15 +56,15 @@ const OurTeam: React.FC = () => {
|
|||
display="flex"
|
||||
alignItems="center"
|
||||
gap={1}
|
||||
sx={{ cursor: "pointer", marginBottom: 10 }}
|
||||
sx={{ cursor: "pointer", marginBottom: 5 }}
|
||||
onClick={() => setShowTeam(!showTeam)}
|
||||
>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
fontWeight: "bold",
|
||||
|
||||
fontSize: { xs: "20px", sm: "48px" },
|
||||
fontFamily: "SF Pro Rounded Regular, Arial, sans-serif",
|
||||
fontFamily: "SF Pro Regular, Arial, sans-serif",
|
||||
color: "#333333",
|
||||
}}
|
||||
>
|
||||
|
|
@ -81,8 +81,8 @@ const OurTeam: React.FC = () => {
|
|||
sx={{
|
||||
color: "#4D4D4D",
|
||||
fontSize: { xs: "12px", sm: "20px" },
|
||||
fontFamily: "SF Pro Rounded Regular, Arial, sans-serif",
|
||||
padding:"20px",
|
||||
fontFamily: "SF Pro Regular, Arial, sans-serif",
|
||||
padding:"30px",
|
||||
textAlign:'center'
|
||||
}}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -11,6 +11,8 @@ const Circle = styled(Box)(({ theme }) => ({
|
|||
justifyContent: "center",
|
||||
border: "5px solid",
|
||||
transition: "0.3s",
|
||||
textAlign: "center",
|
||||
padding: "10px",
|
||||
[theme.breakpoints.down("sm")]: {
|
||||
width: 120, // Adjusting for mobile
|
||||
height: 120,
|
||||
|
|
@ -27,22 +29,40 @@ const items = [
|
|||
const WhyChooseUs: React.FC = () => {
|
||||
return (
|
||||
<Box sx={{ textAlign: "center", mt: 5 }}>
|
||||
<Typography variant="h4" sx={{ fontWeight: "bold", color: '#333333', mb: 4, fontSize: { xs: "20px", sm: "48px" } }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
|
||||
color: "#333333",
|
||||
mb: 4,
|
||||
fontSize: { xs: "20px", sm: "48px" },
|
||||
fontFamily: "SF Pro Rounded, sans-serif",
|
||||
}}
|
||||
>
|
||||
Why Choose Us?
|
||||
</Typography>
|
||||
<Grid
|
||||
container
|
||||
spacing={1}
|
||||
justifyContent="center"
|
||||
alignItems="center"
|
||||
>
|
||||
<Grid container spacing={2} justifyContent="center" alignItems="center">
|
||||
{items.map((item, index) => (
|
||||
<Grid item key={index} xs={6} sm={2} display="flex" justifyContent="center">
|
||||
<Grid
|
||||
item
|
||||
key={index}
|
||||
xs={6}
|
||||
sm={2}
|
||||
display="flex"
|
||||
justifyContent="center"
|
||||
>
|
||||
<Circle sx={{ borderColor: item.color }}>
|
||||
<Typography variant="body1" fontWeight="400" fontFamily="Roboto" sx={{fontSize:{xs:'12px', sm:'24px'}}}>
|
||||
<Typography
|
||||
variant="body1"
|
||||
fontWeight="400"
|
||||
sx={{
|
||||
fontSize: { xs: "12px", sm: "20px" },
|
||||
fontFamily: "Roboto, sans-serif",
|
||||
textAlign: "center",
|
||||
}}
|
||||
>
|
||||
{item.text}
|
||||
</Typography>
|
||||
|
||||
</Circle>
|
||||
</Grid>
|
||||
))}
|
||||
|
|
|
|||
Binary file not shown.
Loading…
Reference in New Issue