Skip to content

Commit 34c658f

Browse files
schmunk42schmunk42
authored
Merge pull request #193 from Tarinu/master
AdminLTE 3 implementation (without gii)
2 parents 16fef79 + d3f25da commit 34c658f

File tree

25 files changed

+1163
-1284
lines changed

25 files changed

+1163
-1284
lines changed

‎CHANGELOG.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
CHANGELOG
22
---------
33

4+
## Unreleased (3.0)
5+
* updated example views, widgets and assets to AdminLTE 3
6+
* changed namespace to `dmstr/adminlte`
7+
* added `iconClassType` to `Menu` widget to support different types of FontAwesome 5 icons
8+
49
## 2.6.0
510
* added default options for menu (CSS classes)
611
* updated test environment

‎README.md‎

Lines changed: 23 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ For details see [#140](https://github.com/dmstr/yii2-adminlte-asset/issues/140).
4848

4949
### Upgrading
5050

51-
When upgrading please see the [AdminLTE upgrade guide](https://adminlte.io/docs/2.4/upgrade-guide) for adjustments you need to make in your views.
51+
When upgrading please see the [AdminLTE upgrade guide](https://adminlte.io/docs/3.0/upgrade-guide.html) for adjustments you need to make in your views.
5252

5353
### Composer installation
5454

@@ -113,7 +113,7 @@ Customization
113113

114114
### AdminLTE Plugins
115115

116-
Assets for [AdminLTE plugins](https://almsaeedstudio.com/themes/AdminLTE/documentation/index.html#plugins) are not included
116+
Assets for [AdminLTE plugins](https://adminlte.io/docs/3.0/dependencies.html#plugins) are not included
117117
in our `AdminLteAsset` but you can find these files in your vendor directory under `vendor/almasaeed2010/adminlte/plugins`.
118118
So if you want to use any of them we recommend to create a custom bundle where you list the plugin files you need:
119119

@@ -123,16 +123,16 @@ use yii\web\AssetBundle;
123123
class AdminLtePluginAsset extends AssetBundle
124124
{
125125
public $sourcePath = '@vendor/almasaeed2010/adminlte/plugins';
126-
public $js = [
127-
'datatables/dataTables.bootstrap.min.js',
128-
// more plugin Js here
129-
];
130126
public $css = [
131-
'datatables/dataTables.bootstrap.css',
127+
'chart.js/Chart.min.css',
132128
// more plugin CSS here
133129
];
130+
public $js = [
131+
'chart.js/Chart.bundle.min.js'
132+
// more plugin Js here
133+
];
134134
public $depends = [
135-
'dmstr\web\AdminLteAsset',
135+
'dmstr\adminlte\web\AdminLteAsset',
136136
];
137137
}
138138
```
@@ -141,54 +141,7 @@ As this asset depends on our `AdminLteAsset` it's the only asset you have to reg
141141
your `main.php` layout file.
142142

143143

144-
### Skins
145-
146-
By default the extension uses blue skin for AdminLTE. You can change it in config file.
147-
148-
```php
149-
'components' => [
150-
'assetManager' => [
151-
'bundles' => [
152-
'dmstr\web\AdminLteAsset' => [
153-
'skin' => 'skin-black',
154-
],
155-
],
156-
],
157-
],
158-
```
159-
160-
And then just replace class of body `skin-blue`. You can use `AdminLteHelper::skinClass()` if you don't want to alter every view file when you change skin color.
161-
```html
162-
<body class="<?= \dmstr\helpers\AdminLteHelper::skinClass() ?>">
163-
```
164-
165-
**Note:** Use `AdminLteHelper::skinClass()` only if you override the skin through configuration. Otherwise you will not get the correct css class of body.
166-
167-
Here is the list of available skins:
168-
169-
```
170-
"skin-blue",
171-
"skin-black",
172-
"skin-red",
173-
"skin-yellow",
174-
"skin-purple",
175-
"skin-green",
176-
"skin-blue-light",
177-
"skin-black-light",
178-
"skin-red-light",
179-
"skin-yellow-light",
180-
"skin-purple-light",
181-
"skin-green-light"
182-
```
183-
184-
#### Disabling skin file loading, when using bundled assets
185-
186-
Yii::$container->set(
187-
AdminLteAsset::className(),
188-
[
189-
'skin' => false,
190-
]
191-
);
144+
### Custom content header
192145

193146
If you want to use native DOM of headers AdminLTE
194147

@@ -201,7 +154,7 @@ If you want to use native DOM of headers AdminLTE
201154
then you can follow the code:
202155

203156
```php
204-
/* @var $this yii\web\View */
157+
/* @var yii\web\View $this */
205158

206159
$this->params['breadcrumbs'][] = 'About';
207160

@@ -217,40 +170,41 @@ About <small>static page</small>
217170

218171
### Left sidebar menu - Widget Menu
219172

220-
If you need to separate sections of the menu then just add the `li.header` item to `items`
173+
If you need to separate sections of the menu then just add the `header` option to item in `items`
221174
```php
222175
'items' => [
223-
['label' => 'Gii', 'icon' => 'file-code-o', 'url' => ['/gii']],
224-
['label' => 'Debug', 'icon' => 'dashboard', 'url' => ['/debug']],
225-
['label' => 'MAIN NAVIGATION', 'options' => ['class' => 'header']], // here
176+
['label' => 'Gii', 'iconType' => 'far' 'icon' => 'file-code', 'url' => ['/gii']],
177+
['label' => 'Debug', 'icon' => 'dashboard-alt', 'url' => ['/debug']],
178+
['label' => 'MAIN NAVIGATION', 'header' => true], // here
226179
// ... a group items
227-
['label' => '', 'options' => ['class' => 'header']],
180+
['label' => '', 'header' => true],
228181
// ... a group items
229-
['label' => '', 'options' => ['class' => 'header']],
182+
['label' => '', 'header' => true],
230183
// ... a group items
231184
```
232185

233-
To add a label for a item:
186+
To add a badge for a item:
234187

235188
```php
236189
'items' => [
237190
[
238191
'label' => 'Mailbox',
239-
'icon' => 'envelope-o',
192+
'iconType' => 'far',
193+
'icon' => 'envelope',
240194
'url' => ['/mailbox'],
241-
'template'=>'<a href="{url}">{icon} {label}<span class="pull-right-container"><small class="label pull-right bg-yellow">123</small></span></a>'
195+
'badge' => '<span class="badge badge-info right">123</span>'
242196
],
243197
]
244198
```
245199

246-
By default to icons will be added prefix of [Font Awesome](http://fontawesome.io/)
200+
By default to icons will be added prefix of [Font Awesome](https://fontawesome.com/)
247201

248202
### Template for Gii CRUD generator
249203

250204
Tell Gii about our template. The setting is made in the config file:
251205

252206
```php
253-
if (YII_ENV_DEV) {
207+
if (YII_ENV_DEV) {
254208
$config['modules']['gii'] = [
255209
'class' => 'yii\gii\Module',
256210
'generators' => [ // HERE
@@ -288,5 +242,5 @@ Further Information
288242

289243
For AdminLTE documentation, please read https://almsaeedstudio.com/themes/AdminLTE/documentation/index.html
290244

291-
> Namespacing rules follow the Yii 2.0 framework structure, eg. `dmstr\web` for the Asset Bundle.
245+
> Namespacing rules follow the Yii 2.0 framework structure, eg. `dmstr\adminlte\web` for the Asset Bundle.
292246

‎composer.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
},
2626
"autoload": {
2727
"psr-4": {
28-
"dmstr\\": ""
28+
"dmstr\\adminlte\\": ""
2929
}
3030
},
3131
"repositories": [

‎example-views/testing/app/default/_expand-collapse.php‎

Lines changed: 37 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,79 +1,77 @@
11
<div class="row">
22
<div class="col-md-3">
3-
<div class="box box-default collapsed-box">
4-
<div class="box-header with-border">
5-
<h3 class="box-title">Expandable</h3>
3+
<div class="card card-outline card-default collapsed-card">
4+
<div class="card-header">
5+
<h3 class="card-title">Expandable</h3>
66
7-
<div class="box-tools pull-right">
8-
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i>
9-
</button>
7+
<div class="card-tools">
8+
<button type="button" class="btn btn-tool" data-card-widget="collapse" type="button"><i class="fa fa-plus"></i></button>
109
</div>
11-
<!-- /.box-tools -->
10+
<!-- /.card-tools -->
1211
</div>
13-
<!-- /.box-header -->
14-
<div class="box-body" style="display: none;">
12+
<!-- /.card-header -->
13+
<div class="card-body">
1514
The body of the box
1615
</div>
17-
<!-- /.box-body -->
16+
<!-- /.card-body -->
1817
</div>
19-
<!-- /.box -->
18+
<!-- /.card -->
2019
</div>
2120
<!-- /.col -->
2221
<div class="col-md-3">
23-
<div class="box box-success">
24-
<div class="box-header with-border">
25-
<h3 class="box-title">Removable</h3>
22+
<div class="card card-success card-outline">
23+
<div class="card-header">
24+
<h3 class="card-title">Removable</h3>
2625
27-
<div class="box-tools pull-right">
28-
<button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
26+
<div class="card-tools">
27+
<button type="button" class="btn btn-tool" data-card-widget="remove" type="button"><i class="fa fa-times"></i></button>
2928
</div>
30-
<!-- /.box-tools -->
29+
<!-- /.card-tools -->
3130
</div>
32-
<!-- /.box-header -->
33-
<div class="box-body">
31+
<!-- /.card-header -->
32+
<div class="card-body">
3433
The body of the box
3534
</div>
36-
<!-- /.box-body -->
35+
<!-- /.card-body -->
3736
</div>
38-
<!-- /.box -->
37+
<!-- /.card -->
3938
</div>
4039
<!-- /.col -->
4140
<div class="col-md-3">
42-
<div class="box box-warning">
43-
<div class="box-header with-border">
44-
<h3 class="box-title">Collapsable</h3>
41+
<div class="card card-warning card-outline">
42+
<div class="card-header">
43+
<h3 class="card-title">Collapsable</h3>
4544
46-
<div class="box-tools pull-right">
47-
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
48-
</button>
45+
<div class="card-tools">
46+
<button type="button" class="btn btn-tool" data-card-widget="collapse" type="button"><i class="fa fa-minus"></i></button>
4947
</div>
50-
<!-- /.box-tools -->
48+
<!-- /.card-tools -->
5149
</div>
52-
<!-- /.box-header -->
53-
<div class="box-body">
50+
<!-- /.card-header -->
51+
<div class="card-body">
5452
The body of the box
5553
</div>
56-
<!-- /.box-body -->
54+
<!-- /.card-body -->
5755
</div>
58-
<!-- /.box -->
56+
<!-- /.card -->
5957
</div>
6058
<!-- /.col -->
6159
<div class="col-md-3">
62-
<div class="box box-danger">
63-
<div class="box-header">
64-
<h3 class="box-title">Loading state</h3>
60+
<div class="card card-danger card-outline">
61+
<div class="card-header">
62+
<h3 class="card-title">Loading state</h3>
6563
</div>
66-
<div class="box-body">
64+
<div class="card-body">
6765
The body of the box
6866
</div>
69-
<!-- /.box-body -->
67+
<!-- /.card-body -->
7068
<!-- Loading (remove the following to stop the loading)-->
7169
<div class="overlay">
72-
<i class="fa fa-refresh fa-spin"></i>
70+
<i class="fas fa-2x fa-sync-alt fa-spin"></i>
7371
</div>
7472
<!-- end loading -->
7573
</div>
76-
<!-- /.box -->
74+
<!-- /.card -->
7775
</div>
7876
<!-- /.col -->
7977
</div>

0 commit comments

Comments
 (0)