Pi-Hole/web
1
0
Fork 0
mirror of https://github.com/pi-hole/web.git synced 2026-05-01 22:24:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

Added support for Select2

Browse Source
This commit is contained in:
Abdullah Almsaeed
2015-06-13 02:36:04 +03:00
parent 13f00afa61
commit ad68d5e466
52 changed files with 12376 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

126
pages/forms/advanced.html
View File

@@ -19,9 +19,11 @@
<link href="../../plugins/colorpicker/bootstrap-colorpicker.min.css" rel="stylesheet"/>
<!-- Bootstrap time Picker -->
<link href="../../plugins/timepicker/bootstrap-timepicker.min.css" rel="stylesheet"/>
<!-- Select2 -->
<link href="../../plugins/select2/select2.min.css" rel="stylesheet" type="text/css" />
<!-- Theme style -->
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
<!-- AdminLTE Skins. Choose a skin from the css/skins
<!-- AdminLTE Skins. Choose a skin from the css/skins
folder instead of downloading all of them to reduce the load. -->
<link href="../../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
<!-- Theme style -->
@@ -36,7 +38,7 @@
</head>
<body class="skin-blue sidebar-mini">
<div class="wrapper">
<header class="main-header">
<!-- Logo -->
<a href="../../index2.html" class="logo">
@@ -471,6 +473,77 @@
<!-- Main content -->
<section class="content">
<!-- SELECT2 EXAMPLE -->
<div class="box box-default">
<div class="box-header with-border">
<h3 class="box-title">Select2</h3>
<div class="box-tools pull-right">
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-remove"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label>Minimal</label>
<select class="form-control select2">
<option selected="selected">Alabama</option>
<option>Alaska</option>
<option>California</option>
<option>Delaware</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Washington</option>
</select>
</div><!-- /.form-group -->
<div class="form-group">
<label>Disabled</label>
<select class="form-control select2" disabled="disabled">
<option selected="selected">Alabama</option>
<option>Alaska</option>
<option>California</option>
<option>Delaware</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Washington</option>
</select>
</div><!-- /.form-group -->
</div><!-- /.col -->
<div class="col-md-6">
<div class="form-group">
<label>Multiple</label>
<select class="form-control select2" multiple="multiple" data-placeholder="Select a State">
<option>Alabama</option>
<option>Alaska</option>
<option>California</option>
<option>Delaware</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Washington</option>
</select>
</div><!-- /.form-group -->
<div class="form-group">
<label>Disabled Result</label>
<select class="form-control select2">
<option selected="selected">Alabama</option>
<option>Alaska</option>
<option disabled="disabled">California (disabled)</option>
<option>Delaware</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Washington</option>
</select>
</div><!-- /.form-group -->
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.box-body -->
<div class="box-footer">
Visit <a href="https://select2.github.io/">Select2 documentation</a> for more examples and information about the plugin.
</div>
</div><!-- /.box -->
<div class="row">
<div class="col-md-6">
@@ -727,13 +800,13 @@
</div>
<strong>Copyright &copy; 2014-2015 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
</footer>
<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
<!-- Create the tabs -->
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
<li><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
</ul>
<!-- Tab panes -->
@@ -780,59 +853,59 @@
</li>
</ul><!-- /.control-sidebar-menu -->
<h3 class="control-sidebar-heading">Tasks Progress</h3>
<h3 class="control-sidebar-heading">Tasks Progress</h3>
<ul class='control-sidebar-menu'>
<li>
<a href='javascript::;'>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Custom Template Design
<span class="label label-danger pull-right">70%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-danger" style="width: 70%"></div>
</div>
</div>
</a>
</li>
</li>
<li>
<a href='javascript::;'>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Update Resume
<span class="label label-success pull-right">95%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-success" style="width: 95%"></div>
</div>
</div>
</a>
</li>
</li>
<li>
<a href='javascript::;'>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Laravel Integration
<span class="label label-warning pull-right">50%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-warning" style="width: 50%"></div>
</div>
</div>
</a>
</li>
</li>
<li>
<a href='javascript::;'>
<a href='javascript::;'>
<h4 class="control-sidebar-subheading">
Back End Framework
<span class="label label-primary pull-right">68%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-primary" style="width: 68%"></div>
</div>
</div>
</a>
</li>
</ul><!-- /.control-sidebar-menu -->
</li>
</ul><!-- /.control-sidebar-menu -->
</div><!-- /.tab-pane -->
<!-- Stats tab content -->
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div><!-- /.tab-pane -->
<!-- Settings tab content -->
<div class="tab-pane" id="control-sidebar-settings-tab">
<div class="tab-pane" id="control-sidebar-settings-tab">
<form method="post">
<h3 class="control-sidebar-heading">General Settings</h3>
<div class="form-group">
@@ -871,21 +944,21 @@
<label class="control-sidebar-subheading">
Show me as online
<input type="checkbox" class="pull-right" checked />
</label>
</label>
</div><!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Turn off notifications
<input type="checkbox" class="pull-right" />
</label>
</label>
</div><!-- /.form-group -->
<div class="form-group">
<label class="control-sidebar-subheading">
Delete chat history
<a href="javascript::;" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
</label>
</label>
</div><!-- /.form-group -->
</form>
</div><!-- /.tab-pane -->
@@ -901,6 +974,8 @@
<script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- Bootstrap 3.3.2 JS -->
<script src="../../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<!-- Select2 -->
<script src="../../plugins/select2/select2.full.min.js" type="text/javascript"></script>
<!-- InputMask -->
<script src="../../plugins/input-mask/jquery.inputmask.js" type="text/javascript"></script>
<script src="../../plugins/input-mask/jquery.inputmask.date.extensions.js" type="text/javascript"></script>
@@ -925,6 +1000,9 @@
<!-- Page script -->
<script type="text/javascript">
$(function () {
//Initialize Select2 Elements
$(".select2").select2();
//Datemask dd/mm/yyyy
$("#datemask").inputmask("dd/mm/yyyy", {"placeholder": "dd/mm/yyyy"});
//Datemask2 mm/dd/yyyy