提交 a981cb8e 编写于 作者: D Dennis Neufeld

Formatting Documentation Build files

上级 30e6e1f0
<section id='adminlte-options'>
<h2 class='page-header'><a href="#adminlte-options">AdminLTE Javascript Options</a></h2>
<section id="adminlte-options">
<h2 class="page-header"><a href="#adminlte-options">AdminLTE Javascript Options</a></h2>
<p class="lead">Modifying the options of AdminLTE's app.js can be done using one of the following ways.</p>
<h3>Editing app.js</h3>
......@@ -8,7 +8,7 @@
<h3>Defining AdminLTEOptions</h3>
<p>Alternatively, you can define a global options variable named <code>AdminLTEOptions</code> and initialize it before loading app.js.</p>
<p>Example</p>
<pre class='prettyprint'><code class='html'>&LT;script>
<pre class="prettyprint"><code class="html">&LT;script>
var AdminLTEOptions = {
//Enable sidebar expand on hover effect for sidebar mini
//This option is forced to true if both the fixed layout and sidebar mini
......@@ -20,17 +20,17 @@
enableBSToppltip: true
};
&LT;/script>
&LT;script src='dist/js/app.js' type='text/javascript'>&LT;/script></code></pre>
&LT;script src="dist/js/app.js" type="text/javascript">&LT;/script></code></pre>
<h3>Available AdminLTE Options</h3>
<pre class='prettyprint'><code class='javascript'>{
<pre class="prettyprint"><code class="javascript">{
//Add slimscroll to navbar menus
//This requires you to load the slimscroll plugin
//in every page before app.js
navbarMenuSlimscroll: true,
navbarMenuSlimscrollWidth: "3px", //The width of the scroll bar
navbarMenuHeight: "200px", //The height of the inner menu
//General animation speed for JS animated elements such as box collapse/expand and
//General animation speed for JS animated elements such as box collapse/expand and
//sidebar treeview slide up/down. This options accepts an integer as milliseconds,
//'fast', 'normal', or 'slow'
animationSpeed: 500,
......@@ -120,4 +120,4 @@
lg: 1200
}
}</code></pre>
</section>
\ No newline at end of file
</section>
<section id='advice'>
<h2 class='page-header'><a href="#advice">A Word of Advice</a></h2>
<p class='lead'>
<section id="advice">
<h2 class="page-header"><a href="#advice">A Word of Advice</a></h2>
<p class="lead">
Before you go to see your new awesome theme, here are few tips on how to familiarize yourself with it:
</p>
......@@ -14,4 +14,4 @@
<p>
<b>Note:</b> LESS files are better commented than the compiled CSS file.
</p>
</section>
\ No newline at end of file
</section>
<section id='browsers'>
<h2 class='page-header'><a href="#browsers">Browser Support</a></h2>
<section id="browsers">
<h2 class="page-header"><a href="#browsers">Browser Support</a></h2>
<p class="lead">AdminLTE supports the following browsers:</p>
<ul>
<li>IE9+</li>
<li>FireFox (latest)</li>
<li>Firefox (latest)</li>
<li>Safari (latest)</li>
<li>Chrome (latest)</li>
<li>Opera (latest)</li>
</ul>
<p><b>Note:</b> IE9 does not support transitions or animations. The template will function properly but it won't use animations/transitions on IE9.</p>
</section>
\ No newline at end of file
</section>
<section id='download'>
<h2 class='page-header'><a href="#download">Download</a></h2>
<p class='lead'>
<section id="download">
<h2 class="page-header"><a href="#download">Download</a></h2>
<p class="lead">
AdminLTE can be downloaded in two different versions, each appealing to different
skill levels and use case.
</p>
<div class='row'>
<div class='col-sm-6'>
<div class='box box-primary'>
<div class='box-header with-border'>
<h3 class='box-title'>Ready</h3>
<span class='label label-primary pull-right'><i class='fa fa-html5'></i></span>
<div class="row">
<div class="col-sm-6">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Ready</h3>
<span class="label label-primary pull-right"><i class="fa fa-html5"></i></span>
</div><!-- /.box-header -->
<div class='box-body'>
<div class="box-body">
<p>Compiled and ready to use in production. Download this version
if you don't want to customize AdminLTE's LESS files.</p>
<a href='http://almsaeedstudio.com/download/AdminLTE-dist' class='btn btn-primary'><i class='fa fa-download'></i> Download</a>
<a href="http://almsaeedstudio.com/download/AdminLTE-dist" class="btn btn-primary"><i class="fa fa-download"></i> Download</a>
</div><!-- /.box-body -->
</div><!-- /.box -->
</div><!-- /.col -->
<div class='col-sm-6'>
<div class='box box-danger'>
<div class='box-header with-border'>
<h3 class='box-title'>Source Code</h3>
<span class='label label-danger pull-right'><i class='fa fa-database'></i></span>
<div class="col-sm-6">
<div class="box box-danger">
<div class="box-header with-border">
<h3 class="box-title">Source Code</h3>
<span class="label label-danger pull-right"><i class="fa fa-database"></i></span>
</div><!-- /.box-header -->
<div class='box-body'>
<div class="box-body">
<p>All files including the compiled CSS. Download this version
if you plan on customizing the template. <b>Requires a LESS compiler.</b></p>
<a href='http://almsaeedstudio.com/download/AdminLTE' class='btn btn-danger'><i class='fa fa-download'></i> Download</a>
<a href="http://almsaeedstudio.com/download/AdminLTE" class="btn btn-danger"><i class="fa fa-download"></i> Download</a>
</div><!-- /.box-body -->
</div><!-- /.box -->
</div><!-- /.col -->
</div><!-- /.row -->
<pre class='hierarchy bring-up'><code class="language-bash" data-lang="bash">File Hierarchy of the Source Code Package
<pre class="hierarchy bring-up"><code class="language-bash" data-lang="bash">File Hierarchy of the Source Code Package
AdminLTE/
├── dist/
......@@ -48,4 +48,4 @@ AdminLTE/
│ ├── mixins.less
└── plugins/
├── All the customized plugins CSS and JS files</code></pre>
</section>
\ No newline at end of file
</section>
<section id='faq'>
<h2 class='page-header'><a href="#faq">FAQ</a></h2>
<section id="faq">
<h2 class="page-header"><a href="#faq">FAQ</a></h2>
<h3>Can AdminLTE be used with Wordpress?</h3>
<p class="lead">AdminLTE is an HTML template that can be used for any purpose. However, it is not made to be easily installed on Wordpress. It will require some effort and enough knowledge of the Wordpress script to do so.</p>
<h3>Is there an integration guide for PHP frameworks such as Yii or Symfony?</h3>
<p class='lead'>Short answer, no. However, there are forks and tutorials around the web that
<p class="lead">Short answer, no. However, there are forks and tutorials around the web that
provide info on how to integrate with many different frameworks. There are even versions of
AdminLTE that are integrated with jQuery ajax, AngularJS and/or MVC5 ASP .NET.
</p>
<h3>How do I get notified of new AdminLTE versions?</h3>
<p class='lead'>The best option is to subscribe to our mailing list using the
<p class="lead">The best option is to subscribe to our mailing list using the
<a href="http://almsaeedstudio.com/#subscribe">subscription form on Almsaeed Studio</a>.
If that's not appealing to you, you may watch the <a href="https://github.com/almasaeed2010/AdminLTE">repository on Github</a>
or visit <a href="http://almsaeedstudio.com">Almsaeed Studio</a> every now and then for updates and announcements.</p>
......
......@@ -13,4 +13,4 @@
<p><b class="text-red">Note:</b> these implementations are not supported by Almsaeed Studio. However,
they do provide a good example of how to integrate AdminLTE into different frameworks. For the latest release
of AdminLTE, please visit our <a href="https://github.com/almasaeed2010/AdminLTE">repository</a> or <a href="https://almsaeedstudio.com">website</a></p>
</section>
\ No newline at end of file
</section>
<section id='introduction'>
<h2 class='page-header'><a href="#introduction">Introduction</a></h2>
<p class='lead'>
<section id="introduction">
<h2 class="page-header"><a href="#introduction">Introduction</a></h2>
<p class="lead">
<b>AdminLTE</b> is a popular open source WebApp template for admin dashboards and control panels.
It is a responsive HTML template that is based on the CSS framework Bootstrap 3.
It utilizes all of the Bootstrap components in its design and re-styles many
......@@ -9,4 +9,4 @@
allows it to be easily customized and built upon. This documentation will guide you through
installing the template and exploring the various components that are bundled with the template.
</p>
</section><!-- /#introduction -->
\ No newline at end of file
</section><!-- /#introduction -->
<section id='layout'>
<h2 class='page-header'><a href="#layout">Layout</a></h2>
<p class='lead'>The layout consists of four major parts:</p>
<section id="layout">
<h2 class="page-header"><a href="#layout">Layout</a></h2>
<p class="lead">The layout consists of four major parts:</p>
<ul>
<li>Wrapper <code>.wrapper</code>. A div that wraps the whole site.</li>
<li>Main Header <code>.main-header</code>. Contains the logo and navbar.</li>
......@@ -89,4 +89,4 @@
</table>
</div><!-- /.box-body -->
</div><!-- /.box -->
</section>
\ No newline at end of file
</section>
......@@ -3,8 +3,8 @@
<h3>AdminLTE</h3>
<p class="lead">
AdminLTE is an open source project that is licensed under the <a href="http://opensource.org/licenses/MIT">MIT license</a>.
This allows you to do pretty much anything you want as long as you include
This allows you to do pretty much anything you want as long as you include
the copyright in "all copies or substantial portions of the Software."
Attribution is not required (though very much appreciated).
</p>
</section>
\ No newline at end of file
</section>
<section id='plugins'>
<h2 class='page-header'><a href="#plugins">Plugins</a></h2>
<section id="plugins">
<h2 class="page-header"><a href="#plugins">Plugins</a></h2>
<p class="lead">AdminLTE makes use of the following plugins. For documentation, updates or license information, please visit the provided links.</p>
<div class='row bring-up'>
<div class='col-sm-3'>
<div class="row bring-up">
<div class="col-sm-3">
<ul class="list-unstyled">
<li><h4>Charts</h4></li>
<li><a href='http://chartjs.org/' target="_blank">ChartJS</a></li>
<li><a href='http://www.flotcharts.org/' target="_blank">Flot</a></li>
<li><a href='http://morrisjs.github.io/morris.js/' target="_blank">Morris.js</a></li>
<li><a href='http://omnipotent.net/jquery.sparkline/' target="_blank">Sparkline</a></li>
<li><a href="http://www.chartjs.org/" target="_blank">ChartJS</a></li>
<li><a href="http://www.flotcharts.org/" target="_blank">Flot</a></li>
<li><a href="http://morrisjs.github.io/morris.js/" target="_blank">Morris.js</a></li>
<li><a href="http://omnipotent.net/jquery.sparkline/" target="_blank">Sparkline</a></li>
</ul>
</div><!-- /.col -->
<div class='col-sm-3'>
<div class="col-sm-3">
<ul class="list-unstyled">
<li><h4>Form Elements</h4></li>
<li><a href='https://github.com/seiyria/bootstrap-slider'>Bootstrap Slider</a></li>
<li><a href='http://ionden.com/a/plugins/ion.rangeSlider/en.html' target="_blank">Ion Slider</a></li>
<li><a href='http://bootstrap-datepicker.readthedocs.org/' target="_blank">Date Picker</a></li>
<li><a href='http://www.daterangepicker.com/' target="_blank">Date Range Picker</a></li>
<li><a href='http://mjolnic.github.io/bootstrap-colorpicker/' target="_blank">Color Picker</a></li>
<li><a href='https://github.com/jdewit/bootstrap-timepicker' target="_blank">Time Picker</a></li>
<li><a href='http://fronteed.com/iCheck/' target="_blank">iCheck</a></li>
<li><a href='http://github.com/RobinHerbots/jquery.inputmask' target="_blank">Input Mask</a></li>
<li><a href="https://github.com/seiyria/bootstrap-slider/">Bootstrap Slider</a></li>
<li><a href="http://ionden.com/a/plugins/ion.rangeSlider/en.html" target="_blank">Ion Slider</a></li>
<li><a href="http://bootstrap-datepicker.readthedocs.org/" target="_blank">Date Picker</a></li>
<li><a href="http://www.daterangepicker.com/" target="_blank">Date Range Picker</a></li>
<li><a href="http://mjolnic.com/bootstrap-colorpicker/" target="_blank">Color Picker</a></li>
<li><a href="https://github.com/jdewit/bootstrap-timepicker/" target="_blank">Time Picker</a></li>
<li><a href="http://fronteed.com/iCheck/" target="_blank">iCheck</a></li>
<li><a href="https://github.com/RobinHerbots/jquery.inputmask/" target="_blank">Input Mask</a></li>
</ul>
</div><!-- /.col -->
<div class='col-sm-3'>
<div class="col-sm-3">
<ul class="list-unstyled">
<li><h4>Editors</h4></li>
<li><a href='https://github.com/bootstrap-wysiwyg/bootstrap3-wysiwyg' target="_blank">Bootstrap WYSIHTML5</a></li>
<li><a href='http://ckeditor.com' target="_blank">CK Editor</a></li>
<li><a href="https://github.com/bootstrap-wysiwyg/bootstrap3-wysiwyg/" target="_blank">Bootstrap WYSIHTML5</a></li>
<li><a href="http://ckeditor.com/" target="_blank">CK Editor</a></li>
</ul>
</div><!-- /. col -->
<div class='col-sm-3'>
<div class="col-sm-3">
<ul class="list-unstyled">
<li><h4>Other</h4></li>
<li><a href='https://datatables.net/examples/styling/bootstrap.html' target="_blank">Data Tables</a></li>
<li><a href='http://fullcalendar.io/' target="_blank">Full Calendar</a></li>
<li><a href='http://jqueryui.com' target="_blank">jQuery UI</a></li>
<li><a href='http://anthonyterrien.com/knob/' target="_blank">jQuery Knob</a></li>
<li><a href='http://jvectormap.com/' target="_blank">jVector Map</a></li>
<li><a href='http://rocha.la/jQuery-slimScroll' target="_blank">Slim Scroll</a></li>
<li><a href='http://github.hubspot.com/pace/docs/welcome/' target="_blank">Pace</a></li>
<li><a href="https://datatables.net/examples/styling/bootstrap.html" target="_blank">DataTables</a></li>
<li><a href="http://fullcalendar.io/" target="_blank">Full Calendar</a></li>
<li><a href="http://jqueryui.com/" target="_blank">jQuery UI</a></li>
<li><a href="http://anthonyterrien.com/knob/" target="_blank">jQuery Knob</a></li>
<li><a href="http://jvectormap.com/" target="_blank">jVector Map</a></li>
<li><a href="http://rocha.la/jQuery-slimScroll/" target="_blank">Slim Scroll</a></li>
<li><a href="http://github.hubspot.com/pace/docs/welcome/" target="_blank">Pace</a></li>
</ul>
</div><!-- /.col -->
</div><!-- /.row -->
</section>
\ No newline at end of file
</section>
<section id='upgrade'>
<h2 class='page-header'><a href="#upgrade">Upgrade Guide</a></h2>
<section id="upgrade">
<h2 class="page-header"><a href="#upgrade">Upgrade Guide</a></h2>
<p class="lead">To upgrade from version 1.x to the lateset version, follow this guide.</p>
<h3>New Files</h3>
<p>Make sure you update all CSS and JS files that are related to AdminLTE. Otherwise, the layout will not
......@@ -23,4 +23,4 @@
<p>Mailbox got an upgrade to include three different views. The views are inbox, read mail, and compose new email. To use these views,
you should use the provided HTML files in the pages/mailbox folder.</p>
<p><b class="text-red">Note:</b> the old mailbox layout has been deprecated in favor of the new one and will be removed by the next release.</p>
</section>
\ No newline at end of file
</section>
......@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>AdminLTE 2 | Documentation</title>
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.4 -->
<link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<!-- Font Awesome Icons -->
......@@ -58,29 +58,29 @@
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="nav sidebar-menu">
<li class="header">TABLE OF CONTENTS</li>
<li class="active"><a href="#introduction"><i class='fa fa-circle-o'></i> Introduction</a></li>
<li><a href="#download"><i class='fa fa-circle-o'></i> Download</a></li>
<li><a href="#dependencies"><i class='fa fa-circle-o'></i> Dependencies</a></li>
<li><a href="#advice"><i class='fa fa-circle-o'></i> Advice</a></li>
<li><a href="#layout"><i class='fa fa-circle-o'></i> Layout</a></li>
<li><a href="#adminlte-options"><i class='fa fa-circle-o'></i> Javascript Options</a></li>
<li class='treeview' id='scrollspy-components'>
<a href="javascript::;"><i class='fa fa-circle-o'></i> Components</a>
<ul class='nav treeview-menu'>
<li><a href='#component-main-header'>Main Header</a></li>
<li><a href='#component-sidebar'>Sidebar</a></li>
<li><a href='#component-control-sidebar'>Control Sidebar</a></li>
<li><a href='#component-info-box'>Info Box</a></li>
<li><a href='#component-box'>Boxes</a></li>
<li><a href='#component-direct-chat'>Direct Chat</a></li>
<li class="active"><a href="#introduction"><i class="fa fa-circle-o"></i> Introduction</a></li>
<li><a href="#download"><i class="fa fa-circle-o"></i> Download</a></li>
<li><a href="#dependencies"><i class="fa fa-circle-o"></i> Dependencies</a></li>
<li><a href="#advice"><i class="fa fa-circle-o"></i> Advice</a></li>
<li><a href="#layout"><i class="fa fa-circle-o"></i> Layout</a></li>
<li><a href="#adminlte-options"><i class="fa fa-circle-o"></i> Javascript Options</a></li>
<li class="treeview" id="scrollspy-components">
<a href="javascript::;"><i class="fa fa-circle-o"></i> Components</a>
<ul class="nav treeview-menu">
<li><a href="#component-main-header">Main Header</a></li>
<li><a href="#component-sidebar">Sidebar</a></li>
<li><a href="#component-control-sidebar">Control Sidebar</a></li>
<li><a href="#component-info-box">Info Box</a></li>
<li><a href="#component-box">Boxes</a></li>
<li><a href="#component-direct-chat">Direct Chat</a></li>
</ul>
</li>
<li><a href="#plugins"><i class='fa fa-circle-o'></i> Plugins</a></li>
<li><a href="#browsers"><i class='fa fa-circle-o'></i> Browser Support</a></li>
<li><a href="#upgrade"><i class='fa fa-circle-o'></i> Upgrade Guide</a></li>
<li><a href="#implementations"><i class='fa fa-circle-o'></i> Implementations</a></li>
<li><a href="#faq"><i class='fa fa-circle-o'></i> FAQ</a></li>
<li><a href="#license"><i class='fa fa-circle-o'></i> License</a></li>
<li><a href="#plugins"><i class="fa fa-circle-o"></i> Plugins</a></li>
<li><a href="#browsers"><i class="fa fa-circle-o"></i> Browser Support</a></li>
<li><a href="#upgrade"><i class="fa fa-circle-o"></i> Upgrade Guide</a></li>
<li><a href="#implementations"><i class="fa fa-circle-o"></i> Implementations</a></li>
<li><a href="#faq"><i class="fa fa-circle-o"></i> FAQ</a></li>
<li><a href="#license"><i class="fa fa-circle-o"></i> License</a></li>
</ul>
</div>
<!-- /.sidebar -->
......@@ -172,21 +172,21 @@ include "license.html"
</aside><!-- /.control-sidebar -->
<!-- Add the sidebar's background. This div must be placed
immediately after the control sidebar -->
<div class='control-sidebar-bg'></div>
<div class="control-sidebar-bg"></div>
</div><!-- ./wrapper -->
<!-- jQuery 2.1.4 -->
<script src="../plugins/jQuery/jQuery-2.1.4.min.js"></script>
<script src="../plugins/jQuery/jQuery-2.1.4.min.js" type="text/javascript"></script>
<!-- Bootstrap 3.3.2 JS -->
<script src="../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<!-- FastClick -->
<script src='../plugins/fastclick/fastclick.min.js'></script>
<script src="../plugins/fastclick/fastclick.min.js" type="text/javascript"></script>
<!-- AdminLTE App -->
<script src="../dist/js/app.min.js" type="text/javascript"></script>
<!-- SlimScroll 1.3.0 -->
<script src="../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
<script src="docs.js"></script>
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js" type="text/javascript"></script>
<script src="docs.js" type="text/javascript"></script>
</body>
</html>
/*
/*
* Documentation JS script
*/
$(function () {
......@@ -44,7 +44,7 @@ $(function () {
});
$(".sidebar-menu li:not(.treeview) a").click(function () {
var $this = $(this);
var target = $this.attr("href");
var target = $this.attr("href");
if (typeof target === 'string') {
$("body").animate({
scrollTop: ($(target).offset().top) + "px"
......@@ -60,4 +60,4 @@ $(function () {
$('body').addClass(skinName);
current_skin = skinName;
});
});
\ No newline at end of file
});
......@@ -14,13 +14,13 @@
.nth-2-center > tbody > tr > td:last-of-type {
text-align: center!important;
}
.content {
.content {
font-size: 16px;
z-index: 500;
}
#components > h3 {
font-size: 25px;
font-size: 25px;
color: #000;
}
......@@ -37,7 +37,7 @@ ul {
position: relative;
z-index: 1;
font-size: 30px;
}
}
.page-header span,
.page-header a {
z-index: 5;
......@@ -54,11 +54,11 @@ ul {
}
.page-header:before,
#components > h3:before {
display: block;
content: " ";
margin-top: -60px;
height: 60px;
visibility: hidden;
display: block;
content: " ";
margin-top: -60px;
height: 60px;
visibility: hidden;
z-index: -10;
}
......@@ -258,4 +258,4 @@ li.L5,
li.L7,
li.L9 {
/* */
}
\ No newline at end of file
}
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册