You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

289 lines
13 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
<title>Crypto Mobile Template</title>
<!-- Google font file. If you want you can change. -->
<link href="https://fonts.googleapis.com/css?family=Nunito:400,600,700,900" rel="stylesheet">
<!-- Fontawesome font file css -->
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<!-- Template global css file. Requared all pages -->
<link rel="stylesheet" type="text/css" href="css/global.style.css">
</head>
<body>
<div class="wrapper">
<div class="nav-menu">
<nav class="menu">
<!-- Menu navigation start -->
<div class="nav-container">
<ul class="main-menu">
<li class="">
<a href="index.html"><img src="img/content/icons/1.png" alt=""><strong>Dashboard</strong> </a>
</li>
<li class="">
<a href="wallet.html"><img src="img/content/icons/2.png" alt=""><strong>My Walet</strong> </a>
</li>
<li class="">
<a href="trading.html"><img src="img/content/icons/3.png" alt=""><strong>Crypto Trade</strong> </a>
</li>
<li class="">
<a href="buy-sell.html"><img src="img/content/icons/6.png" alt=""><strong>Buy & sell</strong> </a>
</li>
<li class="">
<a href="profile.html"><img src="img/content/icons/5.png" alt=""><strong>Trader Profile</strong> </a>
</li>
<li class="">
<a href="affiliate.html"><img src="img/content/icons/4.png" alt=""><strong>Affiliate System</strong> </a>
</li>
<li class="">
<a href="setting.html"><img src="img/content/icons/11.png" alt=""><strong>Settings</strong> </a>
</li>
<li>
<a href="javascript:void(0);"><img src="img/content/icons/9.png" alt=""><strong>Login/Register</strong> <span class="fa fa-angle-down"></span></a>
<ul>
<li><a href="login.html" data-loader="show">Login</a></li>
<li><a href="signup.html" data-loader="show">Register</a></li>
<li><a href="forgot-password.html" data-loader="show">Forgot Password</a></li>
</ul>
</li>
<li>
<a href="javascript:void(0);"><img src="img/content/icons/8.png" alt=""> <strong>Wizards</strong> <span class="fa fa-angle-down"></span></a>
<ul>
<li><a href="wizard-default.html" data-loader="show">Wizard Default</a></li>
<li><a href="wizard-fullscreen.html" data-loader="show">Wizard Fullscreen</a></li>
</ul>
</li>
<li class="">
<a href="charts.html"><img src="img/content/icons/14.png" alt=""><strong>Charts</strong> </a>
</li>
<li>
<a href="forms.html" data-loader="show"><img src="img/content/icons/7.png" alt=""><strong>Form Elements</strong></a>
</li>
<li class="active">
<a href="#"><img src="img/content/icons/10.png" alt=""><strong> Components</strong> <span class="fa fa-angle-down"></span></a>
<ul>
<li><a href="tab-bottom.html" data-loader="show">Tab (Bottom)</a></li>
<li><a href="tab-top.html" data-loader="show">Tab (Top)</a></li>
<li><a href="accordion.html" data-loader="show">Accordion</a></li>
<li class="active"><a href="popup.html" data-loader="show">Popup Modal</a></li>
<li><a href="checkbox-list.html" data-loader="show">Check List</a></li>
<li><a href="link-list.html" data-loader="show">Link List</a></li>
<li><a href="link-list-two-column.html" data-loader="show">Two Column Links</a></li>
</ul>
</li>
<li>
<a href="#"><img src="img/content/icons/15.png" alt=""><strong> Pages</strong> <span class="fa fa-angle-down"></span></a>
<ul>
<li><a href="profile.html" data-loader="show">User Profile</a></li>
<li><a href="search-result.html" data-loader="show">Search Results</a></li>
<li><a href="contact.html" data-loader="show">Contact</a></li>
<li><a href="blank.html" data-loader="show">Blank Page</a></li>
</ul>
</li>
</ul>
</div>
<!-- Menu navigation end -->
</nav>
</div>
<div class="wrapper-inline">
<!-- Header area start -->
<header> <!-- extra class no-background -->
<a class="go-back-link" href="javascript:history.back();"><i class="fa fa-arrow-left"></i></a>
<h1 class="page-title">POPUPS</h1>
<div class="navi-menu-button">
<em></em>
<em></em>
<em></em>
</div>
</header>
<!-- Header area end -->
<!-- Page content start -->
<main>
<div class="container">
<div class="form-divider"></div>
<button class="button circle green block" data-popup="standartPopup">Standart Popup</button>
<div class="form-mini-divider"></div>
<button class="button circle darkblue block" data-popup="largePopup">Large Popup</button>
<div class="form-mini-divider"></div>
<button class="button circle yellow block" data-popup="noHeaderPopup">Simple Popup (No Header)</button>
<div class="form-mini-divider"></div>
<button class="button circle blue block" data-popup="noFooterPopup">Simple Popup (No Footer)</button>
<div class="form-mini-divider"></div>
<button class="button circle block" data-popup="basicPopup">Basic Popup</button>
<div class="form-mini-divider"></div>
<button class="button circle red block" data-popup="formPopup">Form Popup</button>
<div class="form-divider"></div>
</div>
</main>
<!-- Page content end -->
</div>
</div>
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="noHeaderPopup"> <!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-content">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div class="popup-footer">
<button class="button orange">Save</button>
<button class="button" data-dismiss="true">Cancel</button>
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="noFooterPopup"> <!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-header">
<h3 class="popup-title">No Footer Popup</h3>
<span class="popup-close" data-dismiss="true"><i class="fa fa-times"></i></span>
</div>
<div class="popup-content">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="basicPopup"> <!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-content">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="largePopup"> <!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-header">
<h3 class="popup-title">Large Popup</h3>
<span class="popup-close" data-dismiss="true"><i class="fa fa-times"></i></span>
</div>
<div class="popup-content">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br><br>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br><br>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div class="popup-footer">
<button class="button orange">Save</button>
<button class="button" data-dismiss="true">Cancel</button>
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="standartPopup"> <!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-header">
<h3 class="popup-title">Standart Popup</h3>
<span class="popup-close" data-dismiss="true"><i class="fa fa-times"></i></span>
</div>
<div class="popup-content">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div class="popup-footer">
<button class="button orange">Save</button>
<button class="button" data-dismiss="true">Cancel</button>
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="formPopup"> <!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-header">
<h3 class="popup-title">Form Popup</h3>
<span class="popup-close" data-dismiss="true"><i class="fa fa-times"></i></span>
</div>
<div class="popup-content">
<div class="form-row-group with-icons">
<div class="form-row no-padding">
<i class="fa fa-envelope"></i>
<input type="text" name="aaa" class="form-element" placeholder="Input element">
</div>
</div>
<div class="form-mini-divider"></div>
<div class="form-row-group with-icons">
<div class="form-row no-padding">
<i class="fa fa-address-book-o"></i>
<textarea class="form-element" placeholder="Textarea" rows="6"></textarea>
</div>
</div>
<div class="form-mini-divider"></div>
<div class="form-row-group with-icons">
<div class="form-row no-padding">
<i class="fa fa-language"></i>
<select class="form-element">
<option value="" selected>Select</option>
<option value="1">English</option>
<option value="1">Spanish</option>
<option value="1">Turkish</option>
</select>
</div>
</div>
</div>
<div class="popup-footer">
<button class="button orange">Save</button>
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<!--Page loader DOM Elements. Requared all pages-->
<div class="sweet-loader">
<div class="box">
<div class="circle1"></div>
<div class="circle2"></div>
<div class="circle3"></div>
</div>
</div>
<!-- JQuery library file. requared all pages -->
<script src="js/jquery-3.2.1.min.js"></script>
<!-- Template global script file. requared all pages -->
<script src="js/global.script.js"></script>
</body>
</html>