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

index page insert

This commit is contained in:
Priyatham-sai-chand 2020-11-06 23:20:57 +05:30
parent b71b2c8420
commit e5a9d49dbf
11 changed files with 339 additions and 172 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/avasa.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

13
public/index.html
View File

@ -24,20 +24,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Montserrat|Ubuntu" rel="stylesheet">
<!-- CSS Stylesheets -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<!-- Font Awesome -->
<script defer src="https://use.fontawesome.com/releases/v5.0.7/js/all.js"></script>
<!-- Bootstrap Scripts -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<title>Locaft</title>
</head>
<body>

BIN
public/indigo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
public/locaft.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
public/logo192.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 5.2 KiB

BIN
public/logo512.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 9.4 KiB

BIN
public/nobroker.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
public/vrl.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.4 KiB

65
src/components/HomePage.js
View File

@ -1,17 +1,15 @@
import React, { Component } from 'react';
import Button from 'react-bootstrap/Button';
import 'C:\\Priyathamwork\\locaft\\locaft\\src\\style.css';
class HomePage extends Component {
render(){
return (
<div className="HomePage">
<section class="colored-section" id="title">
<div class="container-fluid">
//navbar
<nav class="navbar navbar-expand-lg navbar-dark">
@ -42,29 +40,29 @@ class HomePage extends Component {
</nav>
//Title
<div class="row">
<div className="row">
<div class="col-lg-6">
<div className="col-lg-6">
<h1 class="big-heading">Adapt to a new place easy peasy.</h1>
<button type="button" class="btn btn-info login">Log In</button>
<button type="button" class="btn btn-info loginb">Sign Up</button>
</div>
<div class="col-lg-6">
<img class="title-image" src="Images/LOCAFT.png" alt="locaft-mockup">
<img class="title-image" src={"C:\\Priyathamwork\\locaft\\locaft\\public\\locaft.png"} alt="locaft-mockup" />
</div>
</div>
</div>
</section>
<section class="white-section" id="features">
<div class="container-fluid">
<div class="row">
<div class="feature-box col-lg-4">
<i class="icon fas fa-check-circle fa-4x"></i>
<i className="icon fas fa-check-circle fa-4x"></i>
<h3 class="feature-title">Easy to use.</h3>
<p>Get relocated.We'll take care of everything.</p>
</div>
@ -85,21 +83,18 @@ class HomePage extends Component {
</div>
</section>
//testimonial
<section class="colored-section" id="testimonials">
<div id="testimonial-carousel" class="carousel slide" data-ride="false">
<div class="carousel-inner">
<div class="carousel-item active container-fluid">
<h2 class="testimonial-text">I had to shift from Bangalore to Hyderabad. Thanks to Locaft , it was easy to know about this place.</h2>
<img class="testimonial-image" src="Images/WhatsApp Image 2020-09-18 at 5.38.53 PM.jpeg" alt="mc-profile">
<img class="testimonial-image" src="Images/WhatsApp Image 2020-09-18 at 5.38.53 PM.jpeg" alt="mc-profile" />
<em>Mani , Hyderabad</em>
</div>
<div class="carousel-item container-fluid">
<h2 class="testimonial-text">Relocation took me 3 months previously , but thanks to Locaft , everything was done within 3 days.</h2>
<img class="testimonial-image" src="Images/WhatsApp Image 2020-09-18 at 5.38.39 PM.jpeg" alt="nishi-profile">
<img class="testimonial-image" src="Images/WhatsApp Image 2020-09-18 at 5.38.39 PM.jpeg" alt="nishi-profile" />
<em>Nishanth , Bangalore</em>
</div>
</div>
@ -112,21 +107,13 @@ class HomePage extends Component {
</div>
</section>
// press
<section class="colored-section" id="press">
<img class="press-logo" src="Images/download.png" alt="indigo-logo">
<img class="press-logo" src="Images/avasa.jpg" alt="avasa-logo">
<img class="press-logo" src="Images/download.jpg" alt="vrl-logo">
<img class="press-logo" src="Images/nobroker.png" alt="nobroker-logo">
<img class="press-logo" src="Images/download.png" alt="indigo-logo" />
<img class="press-logo" src="Images/avasa.jpg" alt="avasa-logo" />
<img class="press-logo" src="Images/download.jpg" alt="vrl-logo" />
<img class="press-logo" src="Images/nobroker.png" alt="nobroker-logo" />
</section>
//About us
<section class="white-section" id="about-us">
<div class="container-fluid">
@ -140,7 +127,7 @@ class HomePage extends Component {
<div class="feature-box col-lg-4">
<i class="icon fas fa-bullseye fa-4x"></i>
<h3 class="feature-title">Vision</h3>
<h2 class="feature-title">Vision</h2>
<p>Bringing all the basic amenities to the new place before your arrival.</p>
</div>
@ -154,7 +141,7 @@ class HomePage extends Component {
</section>
//blog
<section class="colored-section" id="cta">
<div class="container-fluid">
@ -167,20 +154,11 @@ class HomePage extends Component {
<div class="container-fluid">
<h2>Any comments ?</h2>
<p>Your comments are what help us improve.</p>
<form>
<div className="form-group">
<label for="comment">Give us your feedback &#128071;</label>
<textarea class="form-control comment" rows="5" id="comment"></textarea>
<a href="#" role="button"></a>
<input type="submit" class="btn btn-info submit" value="Submit">
</div>
</form>
</div>
</section>
//footer
<footer class="white-section" id="footer">
<div class="container-fluid">
<i class="social-icon fab fa-facebook-f"></i>
@ -195,6 +173,13 @@ class HomePage extends Component {
</div>
);

1
src/index.js
View File

@ -2,7 +2,6 @@ import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import reportWebVitals from './reportWebVitals';
ReactDOM.render(<App />,document.getElementById('root'));

196
src/style.css Normal file
View File

@ -0,0 +1,196 @@
body {
font-family: "Montserrat";
text-align: center;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Montserrat-Bold";
}
p {
color: #8f8f8f;
}
/* Headings */
.big-heading {
font-family: "Montserrat-Black";
font-size: 3.5rem;
line-height: 1.5;
}
.section-heading {
font-size: 3rem;
line-height: 1.5;
}
/* Containers */
.container-fluid{
padding: 7% 15%;
}
.comment{
padding-bottom: 5%;
}
.submit{
margin-top: 5%;
}
/* Sections */
.colored-section {
background-color:#66bfbf;
color: #fff;
}
.white-section {
background-color: #fff;
}
/* Navigation Bar */
.navbar {
padding: 0 0 4.5rem;
}
.navbar-brand {
font-family: "Ubuntu";
font-size: 2.5rem;
font-weight: bold;
}
.nav-item {
padding: 0 18px;
}
.nav-link {
font-size: 1.2rem;
font-family: "Montserrat-Light";
}
/* Buttons */
.loginb {
margin: 5% 3% 5% 0;
}
/* Title Section */
#title {
background-color: #66bfbf;
color: #fff;
text-align: left;
}
#title .container-fluid {
padding: 3% 15% 7%;
}
/* Title Image */
.title-image {
width: 70%;
position: absolute;
right: 5%;
}
/* Features Section */
#features {
position: relative;
}
.feature-title {
font-size: 1.5rem;
}
.feature-box {
padding: 4.5%;
}
.icon {
color: #66bfbf;
margin-bottom: 1rem;
}
.icon:hover {
color: #66bfbf;
}
/* Testimonial Section */
#testimonials {
background-color: #66bfbf;
}
.testimonial-text {
font-size: 3rem;
line-height: 1.5;
}
.testimonial-image {
width: 20%;
border-radius: 100%;
margin: 20px;
}
#press {
background-color: #66bfbf;
padding-bottom: 3%;
}
.press-logo {
width: 15%;
margin: 20px 20px 50px;
}
/* Pricing Section */
#pricing {
padding: 100px;
}
.price-text {
font-size: 3rem;
line-height: 1.5;
}
.pricing-column {
padding: 3% 2%;
}
/* CTA Section */
/* Footer Section */
.social-icon {
margin: 20px 10px;
}
@media (max-width: 1028px) {
#title {
text-align: center;
}
.title-image {
position: static;
transform: rotate(0);
}
}
/* Login Page */
.login-heading{
margin: 3% 5%;
}
.signup .signin{
margin: 10% 3%;
}