153 lines
9.2 KiB
HTML
153 lines
9.2 KiB
HTML
<div class="card">
|
|
<div class="card-body">
|
|
<div class="places-buttons">
|
|
<div class="row">
|
|
<div class="col-md-6 ml-auto mr-auto text-center">
|
|
<h4 class="card-title">
|
|
Notifications Places
|
|
<p class="category">Click to view notifications</p>
|
|
</h4>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-8 ml-auto mr-auto">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary btn-block" onclick="demo.showNotification('top','left')">Top Left</button>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary btn-block" onclick="demo.showNotification('top','center')">Top Center</button>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary btn-block" onclick="demo.showNotification('top','right')">Top Right</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-8 ml-auto mr-auto">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary btn-block" onclick="demo.showNotification('bottom','left')">Bottom Left</button>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary btn-block" onclick="demo.showNotification('bottom','center')">Bottom Center</button>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<button class="btn btn-primary btn-block" onclick="demo.showNotification('bottom','right')">Bottom Right</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-12 text-center">
|
|
<div class="card-header">
|
|
<h4 class="card-title">Modal</h4>
|
|
</div>
|
|
|
|
<button class="btn btn-primary" data-toggle="modal" data-target="#myModal">
|
|
Classic modal
|
|
</button>
|
|
<button class="btn btn-info" data-toggle="modal" data-target="#noticeModal">
|
|
Notice modal
|
|
</button>
|
|
<button class="btn" data-toggle="modal" data-target="#myModal10">
|
|
Small alert modal
|
|
</button>
|
|
|
|
<!-- Classic Modal -->
|
|
<div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="myModalLabel" style="display: none;" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header justify-content-center">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
|
|
<i class="now-ui-icons ui-1_simple-remove"></i>
|
|
</button>
|
|
<h4 class="title title-up">Modal title</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.
|
|
</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default">Nice Button</button>
|
|
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Modal -->
|
|
|
|
<!-- notice modal -->
|
|
<div class="modal fade" id="noticeModal" tabindex="-1" aria-labelledby="myModalLabel" style="display: none;" aria-hidden="true">
|
|
<div class="modal-dialog modal-notice">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
|
|
<i class="now-ui-icons ui-1_simple-remove"></i>
|
|
</button>
|
|
<h5 class="modal-title" id="myModalLabel">How Do You Become an Affiliate?</h5>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="instruction">
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<strong>1. Register</strong>
|
|
<p class="description">The first step is to create an account at <a href="http://www.creative-tim.com/">Creative Tim</a>. You can choose a social network or go for the classic version, whatever works best for you.</p>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="picture">
|
|
<img src="../../assets/img/bg1.jpg" alt="Thumbnail Image" class="rounded img-raised">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="instruction">
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<strong>2. Apply</strong>
|
|
<p class="description">The first step is to create an account at <a href="http://www.creative-tim.com/">Creative Tim</a>. You can choose a social network or go for the classic version, whatever works best for you.</p>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="picture">
|
|
<img src="../../assets/img/bg3.jpg" alt="Thumbnail Image" class="rounded img-raised">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p>If you have more questions, don't hesitate to contact us or send us a tweet @creativetim. We're here to help!</p>
|
|
</div>
|
|
<div class="modal-footer justify-content-center">
|
|
<button type="button" class="btn btn-info btn-round" data-dismiss="modal">Sounds good!</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end notice modal -->
|
|
|
|
<!-- small modal -->
|
|
<div class="modal fade modal-mini modal-primary show" id="myModal10" tabindex="-1" aria-labelledby="myModalLabel" style="display: block;" aria-modal="true" role="dialog">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header justify-content-center">
|
|
<div class="modal-profile">
|
|
<i class="now-ui-icons users_circle-08"></i>
|
|
</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Always have an access to your profile</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-link btn-neutral">Back</button>
|
|
<button type="button" class="btn btn-link btn-neutral" data-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end small modal -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |