styling and optmize

This commit is contained in:
Priyatham Sai Chand 2021-01-19 20:08:27 +05:30
parent 36599e4639
commit 1f7cc6ea81
4 changed files with 17 additions and 8 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 187 KiB

After

Width:  |  Height:  |  Size: 177 KiB

BIN
public/skyscraper1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

View File

@ -10,12 +10,16 @@ import {
const ContainerPadded = styled(Container)`
padding: 7% 15%;
`;
const WhiteSection = styled.footer`
background: ${ props => props.background || "white"};
`;
`;
const ContainerCentered = styled.div`
text-align: center;
`;
const FacebookIcon = styled(Facebook)`
margin: 20px 10px;
width: 16px;
@ -43,6 +47,7 @@ const Footer = (props) => {
return (
<WhiteSection>
<ContainerPadded fluid>
<ContainerCentered>
<FacebookIcon />
<TwitterIcon />
<InstagramIcon />
@ -51,7 +56,8 @@ const Footer = (props) => {
<p>© Copyright 2020 Locaft</p>
<p><a href="/tc">Terms and Conditions</a></p>
<p><a href="/pp">Privacy Policy</a></p>
</ContainerPadded>
</ContainerCentered>
</ContainerPadded>
</WhiteSection>
)

View File

@ -19,8 +19,8 @@ import { Bullseye } from "@styled-icons/fa-solid";
import { StyledIconBase } from '@styled-icons/styled-icon'
const IconStyler = styled.div`
${StyledIconBase} {
width: ${props => props.w ? props.w : 26}px;
height: ${props => props.height ? props.height : 26}px;
width: ${props => props.width ? props.width : 26}px;
height: ${props => props.height ? props.height : 26};
color: ${ props => props.color ? props.color: "white"};
@ -146,19 +146,22 @@ export default function HomePage() {
<Row>
<FeatureCol lg="4">
<IconStyler width={100} height= {100} color="#66bfbf"><CheckCircle /></IconStyler>
<IconStyler color="#66bfbf" width={50} height={50}><CheckCircle /></IconStyler>
<br/>
<FeatureTitle>Easy to use.</FeatureTitle>
<p>Get relocated.We'll take care of everything.</p>
</FeatureCol>
<FeatureCol lg="4">
<IconBullseye />
<FeatureTitle>Efficient</FeatureTitle>
<IconStyler color="#66bfbf" width={50} height={50}><Bullseye /></IconStyler>
<br />
<FeatureTitle>Efficient</FeatureTitle>
<p>Get highest number of services for lowest cost possible.</p>
</FeatureCol>
<FeatureCol lg="4">
<IconHeart />
<IconStyler color="#66bfbf" width={50} height={50}><Heart /></IconStyler>
<br />
<FeatureTitle>Relax</FeatureTitle>
<p>Sit back , we'll do the dirty work.</p>
</FeatureCol>