Fixed some alignment issues.

This commit is contained in:
Batuhan Basoglu 2021-03-31 18:04:57 -04:00
parent efc12682d6
commit f594745b2f
6 changed files with 34 additions and 27 deletions

View file

@ -1,7 +1,6 @@
import React, { Component } from "react"; import React, { Component } from "react";
import Agents from './Agents' import Agents from './Agents'
import './agent-page.css'; import './agent-page.css';
import Carousel from 'react-bootstrap/Carousel'
import Agent1 from "../images/Agent1.jpg"; import Agent1 from "../images/Agent1.jpg";
import Agent2 from "../images/Agent2.jpg"; import Agent2 from "../images/Agent2.jpg";
import Agent3 from "../images/Agent3.jpg"; import Agent3 from "../images/Agent3.jpg";

View file

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import AgentPage from "./AgentPage";
/* import {Link} from 'react-router-dom' */ /* import {Link} from 'react-router-dom' */
import Card from "react-bootstrap/Card"; import Card from "react-bootstrap/Card";
import Button from "react-bootstrap/Button"; import Button from "react-bootstrap/Button";
@ -9,15 +8,17 @@ const Agents = ({ agents }) => {
return ( return (
<div className="agent" key={agent.id}> <div className="agent" key={agent.id}>
{} {}
<Card style={{ width: "22rem", height: "40rem" }}> <Card style={{ width: "22rem", height: "42rem" }}>
<Card.Img variant="top" style={{ height: "22rem" }} src={agent.src} /> <Card.Img variant="top" style={{ height: "22rem" }} src={agent.src} />
<Card.Body> <Card.Body>
<Card.Title>{agent.title}</Card.Title> <Card.Title>{agent.title}</Card.Title>
<Card.Text>{agent.name}</Card.Text> <Card.Text>{agent.name}</Card.Text>
<Card.Text> <Card.Text style={{ height: "7rem" }}>
{agent.word} {agent.word}
</Card.Text> </Card.Text>
<div className="buttonfriend">
<Button variant="primary">VIEW</Button> <Button variant="primary">VIEW</Button>
</div>
</Card.Body> </Card.Body>
</Card> </Card>
</div> </div>

View file

@ -21,3 +21,8 @@
.agent{ .agent{
padding-left: 16%; padding-left: 16%;
} }
.buttonfriend{
padding-top: 15px;
padding-left: 120px;
}

View file

@ -1,3 +1,4 @@
// eslint-disable-next-line
import React, { useState, useEffect, Component } from "react"; import React, { useState, useEffect, Component } from "react";
import { import {
GoogleMap, GoogleMap,

View file

@ -1,3 +1,4 @@
// eslint-disable-next-line
export default [ export default [
{ {
"featureType": "all", "featureType": "all",

View file

@ -6,13 +6,13 @@ const Navbar = () => {
return ( return (
/* Nav Bar */ /* Nav Bar */
<div className="Navbar"> <div className="Navbar">
<nav class="navbar navbar-expand-lg navbar-dark"> <nav className="navbar navbar-expand-lg navbar-dark">
<img src=""></img> <img src="" alt="Logo&emsp;"></img>
<a href="/" class="navbar-brand"> <a href="/" className="navbar-brand">
Kene's Cribs Kene's Cribs
</a> </a>
<button <button
class="navbar-toggler" className="navbar-toggler"
type="button" type="button"
data-toggle="collapse" data-toggle="collapse"
data-target="#navbarTogglerDemo02" data-target="#navbarTogglerDemo02"
@ -20,22 +20,22 @@ const Navbar = () => {
aria-expanded="false" aria-expanded="false"
aria-label="Toggle navigation" aria-label="Toggle navigation"
> >
<span class="navbar-toggler-icon"></span> <span className="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02"> <div className="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav ml-auto"> <ul className="navbar-nav ml-auto">
<li class="nav-item"> <li className="nav-item">
<Link class="nav-link" exact to="/"> <Link className="nav-link" exact to="/">
Home Home
</Link> </Link>
</li> </li>
<li class="nav-item"> <li className="nav-item">
<Link class="nav-link" to="/listings"> <Link className="nav-link" to="/listings">
Listings Listings
</Link> </Link>
</li> </li>
<li class="nav-item"> <li className="nav-item">
<Link class="nav-link" to="/agents"> <Link className="nav-link" to="/agents">
Agents Agents
</Link> </Link>
</li> </li>