Skip to content

Commit

Permalink
added basic team page, also there is no navbar so i made my own in th…
Browse files Browse the repository at this point in the history 
…e file
  • Loading branch information
@slzakaria
slzakaria committed Oct 2, 2021
1 parent 9743d99 commit 79534d9
Show file tree
Hide file tree
Showing 4 changed files with 162 additions and 50 deletions.
1 change: 1 addition & 0 deletions assets/Simple Shiny.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
91 changes: 55 additions & 36 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,46 +1,65 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="style.css">
<title>MYTrees</title>

<link rel="stylesheet" href="/style.css">
<title>MYTrees</title>

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

</head>

<body>

<header> <h1> My Trees</h1></header>
<div class="container justify-content-center">

<div class="row">
<img src="https://images.pexels.com/photos/1632790/pexels-photo-1632790.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">
</div>
<div class="col">
<p>A banyan, also spelled "banian", is a fig that begins its life as an epiphyte, i.e. a plant that grows on another plant, when its seed germinates in a crack or crevice of a host tree or edifice.</p>
</div>
</div>
<div class="container justify-content-center">

<div class="row">
<img src="assets/pride_of_india.jpg">
</div>
<div class="col d-flex flex-column">
<h5>Name:<h5><h6>Pride of India</h5>
<h5>Scientific Name:<h5><h6>Lagerstroemia speciosa </h5>
<ul>
<li><p>A large tree blooms in hot summer with pink flowers.</p></li>
<li><p>A postal stamp was issued by the Indian Postal Department to commemorate this flower</p></li>
</ul>


</div>
</div>

<img src="tree.png" alt="">
<header>
<h1> My Trees</h1>
<div>
<a href="./pages/contact/index.html">Contact page</a>
</div>
</header>
<div class="container justify-content-center">

<div class="row">
<img
src="https://images.pexels.com/photos/1632790/pexels-photo-1632790.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">
</div>
<div class="col">
<p>A banyan, also spelled "banian", is a fig that begins its life as an epiphyte, i.e. a plant that grows on
another plant, when its seed germinates in a crack or crevice of a host tree or edifice.</p>
</div>
</div>
<div class="container justify-content-center">

<div class="row">
<img src="assets/pride_of_india.jpg">
</div>
<div class="col d-flex flex-column">
<h5>Name:<h5>
<h6>Pride of India
</h5>
<h5>Scientific Name:<h5>
<h6>Lagerstroemia speciosa
</h5>
<ul>
<li>
<p>A large tree blooms in hot summer with pink flowers.</p>
</li>
<li>
<p>A postal stamp was issued by the Indian Postal Department to commemorate this flower</p>
</li>
</ul>


</div>
</div>

<img src="tree.png" alt="">

</body>
</html>

</html>
93 changes: 93 additions & 0 deletions pages/contact/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meet the team !</title>
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/gh/Rapsssito/github-profile-badge@latest/src/widget.min.js"></script>
</head>

<body class="card">
<header class=" card-header shadow-lg container-fluid">
<nav class="navbar-brand nav">
<div class="container text-success">
<h3 class="d-sm-flex">My trees</h3>
</div>
<div class="container col">
<ul class="d-flex justify-content-between align-content-center list-unstyled">
<li class="">
<a class="btn btn-outline-success" href="../../index.html">Homepage</a>
</li>
<li>
<a class="btn btn-outline-success" href="../about/index.html">About us</a>
</li>
<li><a class="btn btn-outline-success" href="./index.html">Contact us</a></li>
</ul>
</div>
</nav>
</header>

<main class="">
<div class="container">
<h2 class="text-center mt-5">Meet out planet loving , tree carring team ! </h2>
</div>
<section class="container mt-3 d-flex justify-content-between flex-row flex-wrap w-50">
<div class="mt-2 mb-4">
<h4 class="text-muted mb-2 p-2">qw-erty</h4>
<div class="github-profile-badge" data-user="qw-erty">
<a href="https://github.com/qw-erty" target="_blank" class="github-profile-badge-wrapper">
<div class="github-profile-badge-img-wrapper"><img src="https://avatars.githubusercontent.com/qw-erty"
alt="qw-erty GitHub Profile" class="github-profile-badge-img"><img
src="https://github.com/fluidicon.png" alt="GitHub logo" class="github-profile-badge-logo"></div>
</a>
</div>
<div class="mt-4">
<h4 class="text-muted mb-2 p-2">Chetana16032002</h4>
<div class="github-profile-badge" data-user="chetana">
<a href="https://github.com/Chetana16032002" target="_blank" class="github-profile-badge-wrapper">
<div class="github-profile-badge-img-wrapper"><img
src="https://avatars.githubusercontent.com/u/91176005?v=4" alt="chitana GitHub Profile"
class="github-profile-badge-img"><img src="https://github.com/fluidicon.png" alt="GitHub logo"
class="github-profile-badge-logo"></div>
</a>
</div>
<div class="mt-4">
<h4 class="text-muted mb-2 p-2">dazzlerkumar</h4>
<div class="github-profile-badge" data-user="dazzlerkumar">
<a href="https://github.com/dazzlerkumar" target="_blank" class="github-profile-badge-wrapper">
<div class="github-profile-badge-img-wrapper"><img
src="https://avatars.githubusercontent.com/dazzlerkumar" alt="chitana GitHub Profile"
class="github-profile-badge-img"><img src="https://github.com/fluidicon.png" alt="GitHub logo"
class="github-profile-badge-logo"></div>
</a>
</div>
<div class="mt-4">
<h4 class="text-muted mb-2 p-2">greenchul</h4>
<div class="github-profile-badge" data-user="greenchul">
<a href="https://github.com/greenchul" target="_blank" class="github-profile-badge-wrapper">
<div class="github-profile-badge-img-wrapper"><img
src="https://avatars.githubusercontent.com/greenchul" alt="chitana GitHub Profile"
class="github-profile-badge-img"><img src="https://github.com/fluidicon.png" alt="GitHub logo"
class="github-profile-badge-logo"></div>
</a>
</div>
<div class="mt-4">
<h4 class="text-muted mb-2 p-2">Swatigupta-droid</h4>
<div class="github-profile-badge" data-user="Swatigupta-droid">
<a href="https://github.com/Swatigupta-droid" target="_blank" class="github-profile-badge-wrapper">
<div class="github-profile-badge-img-wrapper"><img
src="https://avatars.githubusercontent.com/Swatigupta-droid" alt="chitana GitHub Profile"
class="github-profile-badge-img"><img src="https://github.com/fluidicon.png" alt="GitHub logo"
class="github-profile-badge-logo"></div>
</a>
</div>
</section>
</main>
</body>

</html>
27 changes: 13 additions & 14 deletions style.css
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,19 @@
h1{
color: #32502E;
font-family: sans-serif;
h1 {
color: #32502e;
font-family: sans-serif;
}

body{
background-color:wheat;
body {
background-color: wheat;
}

.container
{
margin:10px;
display: flex;
flex-direction: row;
justify-content: space-around;
flex-wrap: wrap;
.container {
margin: 10px;
display: flex;
flex-direction: row;
justify-content: space-around;
flex-wrap: wrap;
}
header > h1{
align-items: center;
header > h1 {
align-items: center;
}

0 comments on commit 79534d9

Please sign in to comment.