priyatham
/
Locaft
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

card placement

This commit is contained in:
Priyatham Sai Chand 2021-04-17 22:25:54 +05:30
parent 1f8b82a3ea
commit bd8c1d25a8
4 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/index.html
View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<link href="./src/style.css" rel="stylesheet"/> <link href="../src/index.css" rel="stylesheet"/>
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta <meta

20
src/components/HomePage.js
View File

@ -20,7 +20,7 @@ const IconStyler = styled.div`
height: ${props => props.height ? props.height : 26}; height: ${props => props.height ? props.height : 26};
color: ${ props => props.color ? props.color: "white"}; color: ${ props => props.color ? props.color: "white"};
} }
@ -32,12 +32,16 @@ const defaultOptions = {
rendererSettings: { rendererSettings: {
preserveAspectRatio: "xMidYMid slice" preserveAspectRatio: "xMidYMid slice"
} }
}; };
const ColoredSection = styled.section` const ColoredSection = styled.section`
background-color:#66bfbf; background-color:#66bfbf;
color: #fff; color: #fff;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
`; `;
@ -73,13 +77,13 @@ const BigHeading = styled.h1`
font-family: "Ubuntu"; font-family: "Ubuntu";
color: white; color: white;
font-weight: bold; font-weight: bold;
`; `;
const FeatureTitle = styled.h3` const FeatureTitle = styled.h3`
font-size: 1.5rem; font-size: 1.5rem;
color:#8f8f8f; color:#8f8f8f;
align-self: center; align-self: center;
`; `;
const TestimonalTitle = styled.h2` const TestimonalTitle = styled.h2`
font-size: 3rem; font-size: 3rem;
@ -106,7 +110,7 @@ export default function HomePage() {
<FeatureCol lg="6"> <FeatureCol lg="6">
<BigHeading>Adapt to a new place easy peasy.</BigHeading> <BigHeading>Adapt to a new place easy peasy.</BigHeading>
<Button variant="info" onClick={() => { <Button variant="info" onClick={() => {
history.push("/user/login") history.push("/user/login")
}} >Log In</Button> &nbsp; }} >Log In</Button> &nbsp;
@ -116,7 +120,7 @@ export default function HomePage() {
</FeatureCol> </FeatureCol>
<FeatureCol lg="6"> <FeatureCol lg="6">
<Lottie options= { defaultOptions } /> <Lottie options= { defaultOptions } />
</FeatureCol> </FeatureCol>
@ -228,7 +232,7 @@ export default function HomePage() {
</FeatureCol> </FeatureCol>
</Row> </Row>
</ContainerPadded> </ContainerPadded>
</ColoredSection> </ColoredSection>
<Sidebar logout="{logout}" /> <Sidebar logout="{logout}" />
<NavBar /> <NavBar />

14
src/components/Options.js
View File

@ -5,13 +5,14 @@ import Footer from "./Footer";
import styled from 'styled-components'; import styled from 'styled-components';
const CardList = styled.div` const CardList = styled.div`
display:flex; display:flex;
justify-content: space-between; justify-content: space-around;
align-items: center; align-items: stretch;
position: relative; position: relative;
margin: 45px 15px; margin: auto;
flex-direction: row;
flex-wrap: wrap;
flex-direction: row;
@ -91,6 +92,9 @@ export default function Options() {
</div> </div>
<CardList> <CardList>
<Card img="skyscraper.png"/> <Card img="skyscraper.png"/>
<Card img="skyscraper.png"/>
<Card img="skyscraper.png"/>
<Card img="skyscraper.png"/>
</CardList> </CardList>
<Footer /> <Footer />
</div> </div>

1
src/index.css
View File

@ -1,5 +1,6 @@
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700'); @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat|Ubuntu'); @import url('https://fonts.googleapis.com/css?family=Montserrat|Ubuntu');
* { * {
box-sizing: border-box; box-sizing: border-box;
font-family: "Roboto", sans-serif; font-family: "Roboto", sans-serif;