@ibsheet/loader
Version:
Dynamically load support module for IBSheet
119 lines (108 loc) • 4.09 kB
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">
<meta name="description" content="IBSheetLoader Sample">
<title>
IBSheetLoader Sample
</title>
<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 href="assets/sample.db8d3bceeee4ada9e8d0.css" rel="stylesheet"></head>
<body>
<div class="container">
<div id="ibsheet" class="test-box">
<h3 class="title">IBSheet</h3>
<pre>https://docs.ibleaders.com/ibsheet/v8/manual/#docs/start/quick-start</pre>
<div class="test-body">
<!-- IBSheet Samples -->
</div>
</div>
<div id="fa" class="test-box">
<h3 class="title">FontAwesome</h3>
<pre>https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use</pre>
<div class="test-body">
<div class="camera-sample">
<span style="font-size: 3em; color: Tomato;">
<i class="fas fa-camera"></i>
</span>
<span style="font-size: 48px; color: Dodgerblue;">
<i class="fas fa-camera"></i>
</span>
<span style="font-size: 3rem;">
<span style="color: Mediumslateblue;">
<i class="fas fa-camera"></i>
</span>
</span>
</div>
</div>
</div>
<div id="swal" class="test-box">
<h3 class="title">SweetAlert2</h3>
<pre>https://sweetalert2.github.io/#usage</pre>
<div class="test-body">
<button type="button" class="btn btn-primary"
onClick="Swal.fire('Any fool can use a computer')">
Try me!
</button>
</div>
</div>
<div id="pcheckbox" class="test-box">
<h3 class="title">pretty checkbox</h3>
<pre>https://lokesh-coder.github.io/pretty-checkbox/</pre>
<div class="test-body">
<!-- primary -->
<div class="pretty p-default p-round p-thick">
<input type="checkbox" />
<div class="state p-primary-o">
<label>Primary</label>
</div>
</div>
<!-- success -->
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Success</label>
</div>
</div>
<!-- info -->
<div class="pretty p-default p-fill">
<input type="checkbox" />
<div class="state p-info">
<label>Info</label>
</div>
</div>
<!-- warning -->
<div class="pretty p-default p-curve p-thick">
<input type="checkbox" />
<div class="state p-warning">
<label>Warning</label>
</div>
</div>
<!-- danger -->
<div class="pretty p-default p-curve p-thick">
<input type="checkbox" />
<div class="state p-danger-o">
<label>Danger</label>
</div>
</div>
</div>
</div>
</div>
<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 type="text/javascript" src="index.js"></script><script type="text/javascript" src="sample.js"></script></body>
</html>