Skip to content

Commit

Permalink
new branch. nav edit. header edit.
Browse files Browse the repository at this point in the history
  • Loading branch information
Nguyephi committed May 10, 2019
1 parent 1f7f66c commit 03dc080
Show file tree
Hide file tree
Showing 3 changed files with 134 additions and 45 deletions.
98 changes: 71 additions & 27 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,15 @@
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel='icon' href='img/platypus-favicon.png' type='image/x-icon'>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="style.css">
</head>

<body>
<nav class="bg-black fixed-top row">
<div class="container navbar-nav navbar-light navbar-expand-lg py-2">
<nav class="bg-black fixed-top">
<div class="container navbar-nav navbar-light navbar-expand-lg py-2 nav-flex">
<a href="#" class="navbar-brand"><img src="img/platypus-logo.png" alt="Startup-logo" height="45px"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
Expand Down Expand Up @@ -65,6 +63,7 @@ <h4 class="header-subtitle">"Because the platypus both lays eggs and produces mi
</div>
</div>
</header>
<<<<<<< HEAD
<section class="" style="background-color: #D86000">
<div class="environment container py-5">
<div class="card" style="width: 18rem">
Expand Down Expand Up @@ -96,40 +95,77 @@ <h5 class="card-title">EXTRA TIPS</h5>
license to handle platypus can rescue them. After rehab platypus
are released back into the wild.</p>
<a href="#" class="btn btn-primary">More Info</a>
=======
<section class="">
<div class="environment container py-5 ">
<div class="card environment-card " style="width: 18rem ">
<img src="img/platypus-food.webp " class="card-img-top " alt="Platypus and Food ">
<div class="card-body card-body-flex ">
<h5 class="card-title environment-title">FOOD</h5>
<p class="card-text environment-text">platypus are carnivores</p>
<p class="card-text environment-text border-top pt-3">they feed on annelid worms, insect larvae, freshwater shrimp, and freshwater yabby (crayfish)</p>
<p class="card-text environment-text border-top pt-3">platypus eats 20% of its body weight (equivalent to a 150lb human eating 30lbs of food)</p>
<a href="# " class="btn btn-primary ">More Info</a>
</div>
</div>
<div class="card environment-card " style="width: 18rem ">
<img src="img/platypus-environment.jpg " class="card-img-top " alt="Platypus Environment ">
<div class="card-body card-body-flex ">
<h5 class="card-title environment-title">ENVIRONMENT</h5>
<p class="card-text environment-text">platypus needs a constant source of water (i.e. freshwater lakes, rivers, lagoons, farm dams, and streams)</p>
<p class="card-text environment-text border-top pt-3">they are considered nocturnal and are non-sociable. They tend to only gather during mating season.</p>
<a href="# " class="btn btn-primary ">More Info</a>
</div>
</div>
<div class="card environment-card " style="width: 18rem ">
<img src="img/platypus-tips.jpg " class="card-img-top " alt="Some Tips ">
<div class="card-body card-body-flex ">
<h5 class="card-title environment-title">EXTRA TIPS</h5>
<p class="card-text environment-text">platypus have venomous barb. Be careful when handling them</p>
<p class="card-text environment-text border-top pt-3">it’s actually ILLEGAL to own a platypus, bylaw according to Australian wildlife</p>
<p class="card-text environment-text border-top pt-3">Those with a license to handle platypus can rescue them. After rehab platypus are released back into the wild.</p>
<a href="# " class="btn btn-primary ">More Info</a>
>>>>>>> 2e6c39ea0b37a723919f4fc34e2581b7599f9e7c
</div>
</div>
</div>
</section>
<section class="" style="background-color: #189090">
<div class="container employees py-5">
<div class="card bg-transparent no-border card-body-flex" style="width: 18rem;">
<img src="img/Phil.png" class="avatar" alt="Phil's Avatar">
<section class=" " style="background-color: #189090 ">
<div class="container employees p-5 ">
<div class="card bg-transparent no-border card-body-flex " style="width: 18rem; ">
<img src="img/Phil.png " class="avatar " alt="Phil 's Avatar">
<div class="card-body">
<h5 class="card-title employee-name text-danger">PHIL</h5>
<h5 class="card-title employee-name text-danger px-4">PHIL</h5>
<p class="card-text text-warning">Product Owner</p>
</div>
</div>
<div class="card bg-transparent no-border card-body-flex" style="width: 18rem;">
<img src="img/Loc.png" class="avatar" alt="Loc's Avatar">
<div class="card-body">
<h5 class="card-title employee-name text-danger">LOC</h5>
<p class="card-text text-warning">Developer</p>
<img src="img/Loc.png" class="avatar" alt="Loc's Avatar ">
<div class="card-body ">
<h5 class="card-title employee-name text-danger px-4">LOC</h5>
<p class="card-text text-warning ">Developer</p>
</div>
</div>
<div class="card bg-transparent no-border card-body-flex" style="width: 18rem;">
<img src="img/Anh.png" class="avatar" alt="Anh' Avatar">
<div class="card bg-transparent no-border card-body-flex " style="width: 18rem; ">
<img src="img/Anh.png " class="avatar " alt="Anh ' Avatar">
<div class="card-body">
<h5 class="card-title employee-name text-danger">ANH</h5>
<h5 class="card-title employee-name text-danger px-4">ANH</h5>
<p class="card-text text-warning">Scrum Master</p>
</div>
</div>
</div>
</section>
<footer class="">
<div class="container row">
<<<<<<< HEAD
<a href="#" class="navbar-brand" style="margin-top: 50px;"><img src="img/platypus-logo.png"
alt="Startup-logo" height="85px"></a>
<div class="footer-links d-flex col-6">
=======
<a href="#" class="navbar-brand" style="margin-top: 50px;"><img src="img/platypus-logo.png" alt="Startup-logo"
height="85px"></a>
<div class="footer-links d-flex col-7">
>>>>>>> 2e6c39ea0b37a723919f4fc34e2581b7599f9e7c
<div class="list-header"><a class="font-weight-bold">Company</a>
<ul class="footer-list text-muted">
<li><a>About</a></li>
Expand All @@ -153,26 +189,34 @@ <h5 class="card-title employee-name text-danger">ANH</h5>
</ul>
</div>
</div>
<<<<<<< HEAD
<div class="social-media-btn col-4">
<ul class="row">
<li><a href="#" class="fa fa-instagram"></a></li>
<li><a href="#" class="fa fa-twitter"></a></li>
<li><a href="#" class="fa fa-facebook"></a></li>
</ul>
</div>
=======
<div class="social-media-btn col-3">
<ul class="row">
<li><a href="#" class="fa fa-instagram"></a></li>
<li><a href="#" class="fa fa-twitter"></a></li>
<li><a href="#" class="fa fa-facebook"></a></li>
</ul>
</div>

>>>>>>> 2e6c39ea0b37a723919f4fc34e2581b7599f9e7c

</div>
</footer>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<script src="" async defer></script>
</body>

Expand Down
12 changes: 7 additions & 5 deletions readme.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,19 @@
## Adopt Platypus ##

Create landing page and about us page
Landing page: A website that will help people to adopt a platypus. It has info on how to care for platypus. It also has about us section.

A website that will help people to adopt a platypus. It has info on how to care for platypus. It also has about us section.


## Team Members ##

Phil (Product Owner)
Anh (Scrum Master)
Austin (DEV)
* Phil (*Product Owner*)
* Anh (*Scrum Master*)
* Austin (*DEV*)
* Vy (*DEV*)

## View At ##


https://github.com/vietanhdtd/adopt-platypus


Expand Down
69 changes: 56 additions & 13 deletions style.css
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
/*page-structure*/

/* page-structure */

* {
margin: 0;
Expand Down Expand Up @@ -42,7 +43,7 @@ header {
}

footer {
background-color: black;
background-color: #301818;
min-height: 100px;
color: white;
}
Expand Down Expand Up @@ -147,33 +148,59 @@ nav ul {
}

/* footer style */
.container {


footer .container {
display: flex;
justify-content: space-between;
margin: auto;

padding-top: 30px;
}

li {
footer li {
list-style: none;
color: #F09048;
}
li:hover{
color: #D86000;
cursor: pointer;
}

.footer-links {

footer li:hover{
color: #189090;
cursor: pointer;
}

.list-header {
width: 100%;
width: 150px;
color: #D86000;
line-height: 50px;
margin-top: 50px;
padding-bottom: 70px;
}

<<<<<<< HEAD
=======
.social-media-btn {
justify-content: center;
display: flex;
margin-top: 50px;
}

.fa {
margin: 0px 20px 0 0;
padding: 15px;
font-size: 50px;
text-align: center;
border-radius: 50%;
color: #D86000;
text-decoration: none;
}
.fa:hover{
color: #189090;
cursor: pointer;
}
footer a:hover {
text-decoration: none;
}

>>>>>>> 2e6c39ea0b37a723919f4fc34e2581b7599f9e7c
/* environment-style */

.card-body-flex {
Expand All @@ -198,4 +225,20 @@ li:hover{
.avatar {
border-radius: 50%;
width: 200px;
}
<<<<<<< HEAD
}
=======
}

#header-button {
font-family: 'Sanomat Grab Web Regular', sans-serif;
font-size: 1.146em;
font-weight: 400;
color: #D86000;
border-color: #D86000;
}

#header-button:hover {
background-color: black;
}
>>>>>>> 2e6c39ea0b37a723919f4fc34e2581b7599f9e7c

0 comments on commit 03dc080

Please sign in to comment.