added dialogs to demo

This commit is contained in:
FezVrasta 2014-12-03 10:31:59 +01:00
parent 1664c960d0
commit 669751e7c7

View File

@ -1,15 +1,15 @@
<!DOCTYPE html>
<html>
<!--
Automatically sync gh-pages with master
Automatically sync gh-pages with master
Edit .git/config
Find [remote "origin"]
Append:
Edit .git/config
Find [remote "origin"]
Append:
push = +refs/heads/master:refs/heads/gh-pages
push = +refs/heads/master:refs/heads/master
-->
push = +refs/heads/master:refs/heads/gh-pages
push = +refs/heads/master:refs/heads/master
-->
<head>
@ -176,6 +176,7 @@
<li class="withripple" data-target="#floating-action-button">Floating Action Button</li>
<li class="withripple" data-target="#dropdown">Dropdown (Work in progress)</li>
<li class="withripple" data-target="#dropdown-menu">Dropdown Menu</li>
<li class="withripple" data-target="#dialog">Dialog</li>
</ul>
</nav>
<div class="pages col-xs-9">
@ -790,6 +791,70 @@
</div>
</div>
<div class="well page" id="dialog">
<h1 class="header">Dialog</h1>
<h2>Simple Dialog</h2>
<button class="btn btn-primary" data-toggle="modal" data-target="#simple-dialog">Open dialog</button>
<h2>Dialog with header and footer</h2>
<button class="btn btn-primary" data-toggle="modal" data-target="#complete-dialog">Open dialog</button>
<script>
$(".modal").modal({
"backdrop": true
});
</script>
<div id="simple-dialog" class="modal fade" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<p>E dolore commodo, id anim aute sint cupidatat eu est anim tamen ad possumus,
legam officia firmissimum. Eram deserunt domesticarum, iis ita praetermissum,
nam aliquip quo probant, incididunt et occaecat an nam enim exquisitaque a
nescius velit admodum, non ad cohaerescant, probant o nulla tempor. Aute aut te
quis arbitror ubi ne aliqua consequat aliquip. Ad sunt laborum senserit, de do
quem possumus. Sint tractavissent cupidatat aute possumus ita elit ad cupidatat.
Arbitror ab fabulas o eu e veniam pariatur. Non voluptate comprehenderit ad nisi
id voluptate. Quis distinguantur quibusdam quae mentitum o si minim illum nisi
mandaremus.</p>
</div>
</div>
</div>
</div>
<div id="complete-dialog" class="modal fade" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Dialog</h4>
</div>
<div class="modal-body">
<p>Fore aut non quem incididunt, varias reprehenderit deserunt quem offendit,
cillum proident ne reprehenderit, quem ad laborum, quo possumus praetermissum,
si ne illustriora, hic appellat coniunctione, do labore aliqua quo probant. In
probant voluptatibus quo mentitum est laboris. Quorum mandaremus graviterque.
Mentitum id velit, dolor aut litteris, ea varias illustriora, ita commodo ita
ingeniis, iis nulla appellat incurreret, aut irure amet summis pariatur ita ubi
quis dolore veniam proident, consequat sed ingeniis.</p>
</div>
<div class="modal-footer">
<button class="btn btn-primary" data-dismiss="modal">Dismiss</button>
</div>
</div>
</div>
</div>
<style>
#dropdown-menu h2 {
padding: 14px;
margin: 0;
font-size: 16px;
font-weight: 400;
}
</style>
</div>
</div>
<div class="col-xs-2">
<button class="btn btn-fab btn-material-lightgrey" id="opensource"><i class="mdi-action-open-in-new"></i></button></div>