github
/
AdminLTE
mirror of https://github.com/ColorlibHQ/AdminLTE
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #436 from freezy-sk/doc-skins 

Updated list of skins with skin switch and removed whitespace from end of lines
pull/456/head
Abdullah Almsaeed 2015-05-23 13:12:49 +03:00
parent 68ff51a0c4 1ca9859367
commit 0d5a039b5d
7 changed files with 54 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
documentation/build/include/adminlte-options.html
View File

@ -21,7 +21,7 @@
};
</script>
&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'>{
//Add slimscroll to navbar menus

6
documentation/build/include/components.html
View File

@ -465,7 +465,7 @@
these methods can be set through the <a href="#adminlte-options">Javascript options</a>.</p>
<p class="lead">The following code should be placed within the <code>.wrapper</code> div. I prefer
to place it right after the footer.</p>
<p class="lead">Dark Sidebar Markup</p>
<p class="lead">Dark Sidebar Markup</p>
<pre class="prettyprint"><code class="lang-html">&LT;!-- The Right Sidebar -->
&LT;aside class="control-sidebar control-sidebar-dark">
&LT;!-- Content of the sidebar goes here -->
@ -473,8 +473,8 @@
&LT;!-- The sidebar's background -->
&LT;!-- This div must placed right after the sidebar for it to work-->
&LT;div class="control-sidebar-bg">&LT;/div></code></pre>
<p class="lead">Light Sidebar Markup</p>
<p class="lead">Light Sidebar Markup</p>
<pre class="prettyprint"><code class="lang-html">&LT;!-- The Right Sidebar -->
&LT;aside class="control-sidebar control-sidebar-light">
&LT;!-- Content of the sidebar goes here -->

6
documentation/build/include/implementations.html
View File

@ -2,14 +2,14 @@
<h2 class="page-header"><a href="#implementations">Implementations</a></h2>
<p class="lead">Thanks to many of AdminLTE users, there are multiple implementations of the template
for easy integration with back-end frameworks. The following are some of them:</p>
<ul class="">
<li><a href="https://github.com/dmstr/yii2-adminlte-asset" target="_blank">Yii 2</a> by <a href="https://github.com/schmunk42" target="_blank">Tobias Munk</a></li>
<li><a href="https://github.com/yajra/laravel-admin-template" target="_blank">Laravel</a> by <a href="https://github.com/yajra" target="_blank">Arjay Angeles</a></li>
<li><a href="https://github.com/avanzu/AdminThemeBundle" target="_blank">Symfony</a> by <a href="https://github.com/avanzu" target="_blank">Marc Bach</a></li>
<li><a href="https://github.com/avanzu/AdminThemeBundle" target="_blank">Symfony</a> by <a href="https://github.com/avanzu" target="_blank">Marc Bach</a></li>
<li><a href="https://github.com/nicolas-besnard/adminlte2-rails" target="_blank">Rails Gem</a> by <a href="https://github.com/nicolas-besnard" target="_blank">Nicolas Besnard</a></li>
</ul>
<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>

22
documentation/build/include/layout.html
View File

@ -10,7 +10,7 @@
<div class="callout callout-danger lead">
<h4>Tip!</h4>
<p>The <a href="../starter.html">starter page</a> is a good place to start building your app if you'd like to start from scratch.</p>
</div>
</div>
<h3>Layout Options</h3>
<p class="lead">AdminLTE 2.0 provides a set of options to apply to your main layout. Each on of these classes can be added
@ -27,12 +27,18 @@
<p class="lead">Skins can be found in the dist/css/skins folder.
Choose and the skin file that you want then add the appropriate
class to the body tag to change the template's appearance. Here is the list of available skins:</p>
<ul class="bring-up">
<li><code>skin-blue</code></li>
<li><code>skin-yellow</code></li>
<li><code>skin-purple</code></li>
<li><code>skin-green</code></li>
<li><code>skin-red</code></li>
<li><code>skin-black</code></li>
<ul id="layout-skins-list" class="bring-up">
<li><code>skin-blue</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-blue-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-yellow</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-yellow-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-purple</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-purple-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-green</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-green-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-red</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-red-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-black</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-black-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
</ul>
</section>

6
documentation/build/index.html
View File

@ -13,7 +13,7 @@
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
<!-- Theme style -->
<link href="../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
<link href="../dist/css/skins/skin-blue.min.css" rel="stylesheet" type="text/css" />
<link href="../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
@ -70,7 +70,7 @@
<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-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>
@ -181,7 +181,7 @@ include "license.html"
<!-- 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'></script>
<!-- AdminLTE App -->
<script src="../dist/js/app.min.js" type="text/javascript"></script>
<!-- SlimScroll 1.3.0 -->

6
documentation/docs.js
View File

@ -51,4 +51,10 @@ $(function () {
}, 500);
}
});
//Skin switcher
$('#layout-skins-list a').click(function(e) {
e.preventDefault();
var skinName = $(this).siblings('code').text();
$('body').attr('class', skinName + ' fixed');
});
});

42
documentation/index.html
View File

@ -13,7 +13,7 @@
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
<!-- Theme style -->
<link href="../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
<link href="../dist/css/skins/skin-blue.min.css" rel="stylesheet" type="text/css" />
<link href="../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
@ -70,7 +70,7 @@
<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-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>
@ -217,7 +217,7 @@ AdminLTE/
<div class="callout callout-danger lead">
<h4>Tip!</h4>
<p>The <a href="../starter.html">starter page</a> is a good place to start building your app if you'd like to start from scratch.</p>
</div>
</div>
<h3>Layout Options</h3>
<p class="lead">AdminLTE 2.0 provides a set of options to apply to your main layout. Each on of these classes can be added
@ -234,13 +234,19 @@ AdminLTE/
<p class="lead">Skins can be found in the dist/css/skins folder.
Choose and the skin file that you want then add the appropriate
class to the body tag to change the template's appearance. Here is the list of available skins:</p>
<ul class="bring-up">
<li><code>skin-blue</code></li>
<li><code>skin-yellow</code></li>
<li><code>skin-purple</code></li>
<li><code>skin-green</code></li>
<li><code>skin-red</code></li>
<li><code>skin-black</code></li>
<ul id="layout-skins-list" class="bring-up">
<li><code>skin-blue</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-blue-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-yellow</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-yellow-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-purple</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-purple-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-green</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-green-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-red</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-red-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-black</code> <a href="#"><i class="fa fa-eye"></i></a></li>
<li><code>skin-black-light</code> <a href="#"><i class="fa fa-eye"></i></a></li>
</ul>
</section>
@ -269,7 +275,7 @@ AdminLTE/
};
&LT;/script>
&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'>{
//Add slimscroll to navbar menus
@ -835,7 +841,7 @@ AdminLTE/
these methods can be set through the <a href="#adminlte-options">Javascript options</a>.</p>
<p class="lead">The following code should be placed within the <code>.wrapper</code> div. I prefer
to place it right after the footer.</p>
<p class="lead">Dark Sidebar Markup</p>
<p class="lead">Dark Sidebar Markup</p>
<pre class="prettyprint"><code class="lang-html">&LT;!-- The Right Sidebar -->
&LT;aside class="control-sidebar control-sidebar-dark">
&LT;!-- Content of the sidebar goes here -->
@ -843,8 +849,8 @@ AdminLTE/
&LT;!-- The sidebar's background -->
&LT;!-- This div must placed right after the sidebar for it to work-->
&LT;div class="control-sidebar-bg">&LT;/div></code></pre>
<p class="lead">Light Sidebar Markup</p>
<p class="lead">Light Sidebar Markup</p>
<pre class="prettyprint"><code class="lang-html">&LT;!-- The Right Sidebar -->
&LT;aside class="control-sidebar control-sidebar-light">
&LT;!-- Content of the sidebar goes here -->
@ -2014,14 +2020,14 @@ AdminLTE/
<h2 class="page-header"><a href="#implementations">Implementations</a></h2>
<p class="lead">Thanks to many of AdminLTE users, there are multiple implementations of the template
for easy integration with back-end frameworks. The following are some of them:</p>
<ul class="">
<li><a href="https://github.com/dmstr/yii2-adminlte-asset" target="_blank">Yii 2</a> by <a href="https://github.com/schmunk42" target="_blank">Tobias Munk</a></li>
<li><a href="https://github.com/yajra/laravel-admin-template" target="_blank">Laravel</a> by <a href="https://github.com/yajra" target="_blank">Arjay Angeles</a></li>
<li><a href="https://github.com/avanzu/AdminThemeBundle" target="_blank">Symfony</a> by <a href="https://github.com/avanzu" target="_blank">Marc Bach</a></li>
<li><a href="https://github.com/avanzu/AdminThemeBundle" target="_blank">Symfony</a> by <a href="https://github.com/avanzu" target="_blank">Marc Bach</a></li>
<li><a href="https://github.com/nicolas-besnard/adminlte2-rails" target="_blank">Rails Gem</a> by <a href="https://github.com/nicolas-besnard" target="_blank">Nicolas Besnard</a></li>
</ul>
<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>
@ -2121,7 +2127,7 @@ AdminLTE/
<!-- 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'></script>
<!-- AdminLTE App -->
<script src="../dist/js/app.min.js" type="text/javascript"></script>
<!-- SlimScroll 1.3.0 -->