This is github
rah2408 opened this issue · comments
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<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://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/fontawesome.min.css">
<!--- font awesome-->
<script src="fontawesome-free-5.10.1-web/js/all.min.js"></script>
<!--- goole font-->
<title>project1</title>
![](js/image1.jpg)
skill
Hi I am rahul kumar and ravi kumar goplita
html5
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore at totam, praesentium rem dolores doloribus numquam quibusdam facilis laboriosam aut?
press here <!--- end of single col-->
<!--- single col-->
<div class="col-md-6 col-lg-3 text-center my-4">
<i class="fab fa-css3 fa-5x text-danger"></i>
<h3 class="text-uppercase my-3">css3</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore at totam, praesentium rem dolores doloribus numquam quibusdam facilis laboriosam aut?</p>
<a href="#" class="btn btn-outline-danger w-50 text-uppercase">press here</a>
</div>
<!--- end of single col-->
<!--- single col-->
<div class="col-md-6 col-lg-3 text-center my-4">
<i class="fab fa-node-js fa-5x text-danger"></i>
<h3 class="text-uppercase my-3">node.js</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore at totam, praesentium rem dolores doloribus numquam quibusdam facilis laboriosam aut?</p>
<a href="#" class="btn btn-outline-danger w-75 text-uppercase">press here</a>
</div>
<!--- end of single col-->
<!--- single col-->
<div class="col-md-6 col-lg-3 text-center my-2">
<i class="fab fa-js fa-5x text-danger"></i>
<h3 class="text-uppercase my-3">node.js</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore at totam, praesentium rem dolores doloribus numquam quibusdam facilis laboriosam aut?</p>
<a href="#" class="btn btn-outline-danger w-75 text-uppercase">press here</a>
</div>
</div>
</div>
<!--- end of single col-->
<!--- adout section -->
<section id="about" class="bg-info">
<div class="container-fluid">
<div class="row">
<!--- about img col -->
<div class="col-md-6 about-picture height-80"></div>
<!--- about img -->
<div class="col-md-6 about-text height-80 px-5 d-flex align-item-center justify-content-center">
<!--- this is for centering-->
<div class="about-text-center">
<div class="row">
<div class="col text-center">
<h1 class="display-4 text-uppercase text-dark mb-0">
<strong>about</strong>
</h1>
<div class="title-underline text-warning"></div>
<p class="mt-2 text-capitalize text-muted">Hi I am rahul kumar and ravi kumar goplita</p>
</div>
</div>
<!--- end of title-->
<!--- single item-->
<div class="checkbox-item d-flex">
<i class="fas fa-check fa-3x p-2 bg-warning mr-3"></i>
<p class="text-light lead">Lorem ipsum dolor sit amet, consectetur adipisicing </p>
</div>
<!--- single item-->
<div class="checkbox-item d-flex">
<i class="fas fa-check fa-3x p-2 bg-warning mr-3"></i>
<p class="text-light lead">Lorem ipsum dolor sit amet, consectetur adipisicing </p>
</div>
<!--- single item-->
<div class="checkbox-item d-flex">
<i class="fas fa-check fa-3x p-2 bg-warning mr-3"></i>
<p class="text-light lead">Lorem ipsum dolor sit amet, consectetur adipisicing </p>
</div>
</div>
</div>
</div>
</div>
</section>
<!--- end of about section -->
<!--- project-->
<section class="py-5 bg-secondary" id="projects">
<div class="container">
<!--- title-->
<div class="row">
<div class="col text-center">
<h1 class="display-4 text-uppercase text-dark mb-0">
<strong>project</strong>
</h1>
<div class="title-underline text-danger"></div>
</div>
<!--- end title-->
<!--- single project-->
<div class="row">
<div class="col-sm-6 col-md-4 my-3">
<img src="js/img.jpg" class="img-fluid rounded img-thumbnail border border-danger " alt="project">
</div>
<!--- end single project-->
<!--- single project-->
<div class="col-sm-6 col-md-4 my-3">
<img src="js/img1.jpg" class="img-fluid rounded img-thumbnail bg-danger border border-danger" alt="project">
</div>
<!--- end single project-->
<!--- single project-->
<div class="col-sm-6 col-md-4 my-3 mx-auto">
<img src="js/img2.jpg" class="img-fluid rounded-circle img-thumbnail" alt="project">
</div>
</div>
<!--- end single project-->
<!--- single project-->
<div class="row no-gutters">
<div class="col-sm-6 col-md-4 my-3">
<img src="js/img3.jpg" class="img-fluid" alt="project">
</div>
<!--- end single project-->
<!--- single project-->
<div class="col-sm-6 col-md-4 my-3">
<img src="js/img4.jpg" class="img-fluid " alt="project">
</div>
<!--- end single project-->
<!--- single project-->
<div class="col-sm-6 col-md-4 my-3">
<img src="js/img5.jpg" class="img-fluid" alt="project">
</div>
</div>
<!--- end single project-->
</div>
</div>
</section>
<!--- end of project section-->
<!--- starting with card-->
<section class="bg-light py-5" id="card" >
<div class="container" id="card1">
<!--- title-->
<div class="row">
<div class="col text-center">
<h1 class="display-4 text-uppercase text-dark mb-0">
<strong>team</strong>
</h1>
<div class="title-underline bg-warning"></div>
<p class="mt-2 text-capitalize text-muted">Hi I am rahul kumar and ravi kumar goplita</p>
</div>
</div>
<!--- end title-->
<div class="row">
<!--- team member-->
<div class="col-md-6 col-lg-4 my-3">
<div class="card">
<img src="js/img6.jpg" alt="member" class="card-img-top">
<div class="card-body">
<h5 class="card-title text-capitalize">team member</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum, quisquam.
</p>
<a href="#" class="btn btn-outline-warning text-uppercase">prass here</a>
</div>
<div class="card-footer bg-secondary d-flex justify-content-around">
<a href="#"><i class="fab fa-facebook fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-twitter fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-youtube fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-goole fa-2x text-dark"></i></a>
</div>
</div>
</div>
<!--- end of team member-->
<!--- team member-->
<div class="col-md-6 col-lg-4 my-3">
<div class="card">
<img src="js/img5.jpg" alt="member" class="card-img-top">
<div class="card-body">
<h5 class="card-title text-capitalize">team member</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum, quisquam.
</p>
<a href="#" class="btn btn-outline-warning text-uppercase">prass here</a>
</div>
<div class="card-footer bg-secondary d-flex justify-content-around">
<a href="#"><i class="fab fa-facebook fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-twitter fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-youtube fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-goole fa-2x text-dark"></i></a>
</div>
</div>
</div>
<!--- end of team member-->
<!--- team member-->
<div class="col-md-6 col-lg-4 my-3">
<div class="card">
<img src="js/img7.jpg" alt="member" class="card-img-top">
<div class="card-body">
<h5 class="card-title text-capitalize">team member</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum, quisquam.
</p>
<a href="#" class="btn btn-outline-warning text-uppercase">prass here</a>
</div>
<div class="card-footer bg-secondary d-flex justify-content-around">
<a href="#"><i class="fab fa-facebook fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-twitter fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-youtube fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-goole fa-2x text-dark"></i></a>
</div>
</div>
</div>
<!--- end of team member-->
<!--- team member-->
<div class="col-md-6 col-lg-4 my-3">
<div class="card">
<img src="js/img2.jpg" alt="member" class="card-img-top">
<div class="card-body">
<h5 class="card-title text-capitalize">team member</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum, quisquam.
</p>
<a href="#" class="btn btn-outline-warning text-uppercase">prass here</a>
</div>
<div class="card-footer bg-secondary d-flex justify-content-around">
<a href="#"><i class="fab fa-facebook fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-twitter fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-youtube fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-google fa-2x text-dark"></i></a>
</div>
</div>
</div>
<!--- end of team member-->
<!--- team member-->
<div class="col-md-6 col-lg-4 my-3">
<div class="card">
<img src="js/img1.jpg" alt="member" class="card-img-top">
<div class="card-body">
<h5 class="card-title text-capitalize">team member</h5>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum, quisquam.
</p>
<a href="#" class="btn btn-outline-warning text-uppercase">prass here</a>
</div>
<div class="card-footer bg-secondary d-flex justify-content-around">
<a href="#"><i class="fab fa-facebook fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-twitter fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-youtube fa-2x text-dark"></i></a>
<a href="#"><i class="fab fa-google fa-2x text-dark"></i></a>
</div>
</div>
</div>
<!--- end of team member-->
</div>
</div>
my first bootstrap website
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque voluptatem, eos a odit natus perspiciatis veritatis error, animi atque eum?
press herecontact section
Hi I am rahul kumar and ravi kumar goplita
new to bootstrap
new user sign in
username
<!--- font awesome -->
<div class="input-group my-3">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fas fa-user"></i></span>
</div>
<input type="text" class="form-control" id="group-username-1" placeholder="username">
<!--- append-->
<div class="input-group-append">
<button type="button" class="btn btn-primary">submit</button> </div></div>
<button type="button" class="btn btn-outline-dark btn-block text-uppercase">sign up here</button>
</form>
</div>
</div>
<!--- google map-->
<div class="col-md-6 my-3">
<div class="embed-responsive embed-responsive-4by3">
<iframe class="embed-responsive item" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d28815.40978784121!2d85.68942189036585!3d25.474138854673566!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x39f27bc9c227b881%3A0x640ed46ff59518fa!2sBarh%2C+Bihar+803213!5e0!3m2!1sen!2sin!4v1564996874185!5m2!1sen!2sin" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
</div>
<!--- end of google map-->
</div>
</div>
<!--- title-->
<div class="row">
<div class="col text-center">
<h1 class="display-4 text-uppercase text-dark mb-0">
<strong>progress</strong>
</h1>
<div class="title-underline bg-primary"></div>
<p class="mt-2 text-capitalize text-muted">Hi I am rahul kumar and ravi kumar goplita</p>
</div>
</div>
<!--- end title-->
<div class="row">
<div class="col-md-8 mx-auto">
<!--- progress bar single-->
<h1 class="text-white">html</h1>
<div class="progress bg-secondary">
<div class="progress-bar bg-success" style="width:20%"></div>
</div>
<!--- progress bar single-->
<h1 class="text-white">css</h1>
<div class="progress bg-secondary">
<div class="progress-bar bg-danger" style="width:40%"></div>
</div>
<!--- progress bar single-->
<h1 class="text-white">js</h1>
<div class="progress bg-secondary">
<div class="progress-bar bg-ingo" style="width:60%"></div>
</div>
<!--- progress bar single-->
<div class="prog my-3 text-white d-flex justify-content-between">
<h3>bootstrap</h3>
<h3>80%</h3>
</div>
<div class="progress bg-secondary">
<div class="progress-bar bg-warning" style="width:70%"></div>
</div>
</div>
</div>
</div>
pricing
Hi I am rahul kumar and ravi kumar goplita
<div class="col-md-4 ny-4">
<div class="card">
<!--- card header-->
<div class="card-header bg-primary text-white text-uppercase text-center py-4">
<h3>ease</h3>
</div>
<!--- card title-->
<div class="card-title text-center my-3">
<h4>
<sup>$</sup>7
<sub>/month</sub>
</h4>
</div>
<!--- list-->
<ul class="list-group list-group-flush text-center">
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
</ul>
<div class="card-footer">
<a href="#" class="btn btn-outline-dark btn-block text-capitalize">sign up</a>
</div>
</div>
</div>
<!--- end of card-->
<!--- card -->
<div class="col-md-4 ny-4">
<div class="card">
<!--- card header-->
<div class="card-header bg-primary text-white text-uppercase text-center py-4">
<h3>lowe stender</h3>
</div>
<!--- card title-->
<div class="card-title text-center my-3">
<h4>
<sup>$</sup>10
<sub>/month</sub>
</h4>
</div>
<!--- list-->
<ul class="list-group list-group-flush text-center">
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
</ul>
<div class="card-footer">
<a href="#" class="btn btn-outline-dark btn-block text-capitalize">sign up</a>
</div>
</div>
</div>
<!--- end of card-->
<!--- card -->
<div class="col-md-4 ny-4">
<div class="card">
<!--- card header-->
<div class="card-header bg-primary text-white text-uppercase text-center py-4">
<h3>standard</h3>
</div>
<!--- card title-->
<div class="card-title text-center my-3">
<h4>
<sup>$</sup>15
<sub>/month</sub>
</h4>
</div>
<!--- list-->
<ul class="list-group list-group-flush text-center">
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
</ul>
<div class="card-footer">
<a href="#" class="btn btn-outline-dark btn-block text-capitalize">sign up</a>
</div>
</div>
</div>
<!--- end of card-->
<!--- card -->
<div class="col-md-4 ny-4">
<div class="card">
<!--- card header-->
<div class="card-header bg-primary text-white text-uppercase text-center py-4">
<h3>high standard</h3>
</div>
<!--- card title-->
<div class="card-title text-center my-3">
<h4>
<sup>$</sup>20
<sub>/month</sub>
</h4>
</div>
<!--- list-->
<ul class="list-group list-group-flush text-center">
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
<li class="list-group-item">Lorem, ipsum dolor.</li>
</ul>
<div class="card-footer">
<a href="#" class="btn btn-outline-dark btn-block text-capitalize">sign up</a>
</div>
</div>
</div>
<!--- end of card-->
</div>
</div>
<!--- title-->
<div class="row">
<div class="col text-center">
<h1 class="display-4 text-uppercase text-white mb-0">
<strong>skill</strong>
</h1>
<div class="title-underline text-primary"></div>
<p class="mt-2 text-capitalize text-muted">Hi I am rahul kumar and ravi kumar goplita</p>
</div>
</div>
<!--- end title-->
<div class="row">
<div class="col">
<a href="#" class="btn">
<i class="fab fa-facebook fa-3x text-primary m-2"></i>
</a>
<a href="#" class="btn">
<i class="fab fa-twitter fa-3x text-primary m-2"></i>
</a>
<a href="#" class="btn">
<i class="fab fa-instagram fa-3x text-primary m-2"></i>
</a>
<a href="#" class="btn">
<i class="fab fa-google fa-3x text-primary m-2"></i>
</a>
<button type="button" class="btn btn-danger d-block mx-auto my-3" data-toggle="modal" data-target="#modal">log out</button>
</div>
</div>
</div>
so sorry to see you leave
×this is some random text in the modal body
close
<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>