Added some css and fixed some alignment.

This commit is contained in:
Arctichawk1 2021-03-31 16:30:37 -04:00
parent 6109216ec7
commit e5da456c2a
6 changed files with 141 additions and 120 deletions

View file

@ -24,13 +24,17 @@ import Agent6 from "../images/Agent6.jpg";
} }
render() { render() {
return ( return (
<div className="container"> <div>
<div className="center blue-text text-darken-4"> <div className="center blue-text text-darken-4">
<h1>Meet the team</h1> <h1 style={{ fontFamily: "Georgia" }} >Meet the Team</h1>
</div> </div>
<div className="container">
<Agents agents={this.state.agents} /> <Agents agents={this.state.agents} />
</div> </div>
</div>
) )
} }
displayAgents = (agent) => { displayAgents = (agent) => {

View file

@ -9,8 +9,8 @@ const Agents = ({ agents }) => {
return ( return (
<div className="agent" key={agent.id}> <div className="agent" key={agent.id}>
{} {}
<Card style={{ width: "18rem" }}> <Card style={{ width: "22rem", height: "40rem" }}>
<Card.Img variant="top" 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>

View file

@ -12,8 +12,12 @@
} }
.center{ .center{
height: 25vh; /* Magic here */ height: 25vh; /* Magic here */
background-color: yellow; background-color: #ffe609;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.agent{
padding-left: 16%;
}

View file

@ -14,6 +14,13 @@
font-family: "Georgia"; font-family: "Georgia";
} }
#features .container-fluid {
padding: 2% 48% 2%;
text-align: left;
font-family: "Georgia";
}
.housesIntro{ .housesIntro{
padding: 4% 5%; padding: 4% 5%;
} }

View file

@ -158,7 +158,11 @@ class ListingsPage extends Component {
<div class="col-12"> <div class="col-12">
<section className="colored-section" id="features">
<div className="container-fluid">
<h2> Map </h2> <h2> Map </h2>
</div>
</section>
<div style={{ width: "100vm", height: "800px" }}> <div style={{ width: "100vm", height: "800px" }}>
<MapWrapped <MapWrapped

View file

@ -1,3 +1,5 @@
.Navbar{ .Navbar{
background-color: pink; background-color: rgb(56, 55, 55);
padding-top: 20px;
padding-bottom: 24px;
} }