diff --git a/docs/30_Page_layout.md b/docs/30_Page_layout.md
index 15e969d8c541527ca34e53062f1496ad2e705a98..520c88ef56646119e715620cbfa3ae2a2400037f 100644
--- a/docs/30_Page_layout.md
+++ b/docs/30_Page_layout.md
@@ -4,9 +4,10 @@ See file public_html/config/**00_page.tpl.php** - this is a basic page created f
### Helper variables
-Variable | Description | Example
---- |--- |---
-{{DIR_ADMINLTE}} | base path to find AdminLTE resources | `/vendor/admin-lte/AdminLTE-3.2.0`
+Variable | Description | Example
+--- |--- |---
+{{DIR_ADMINLTE}} | base path to find AdminLTE resources | `/vendor/admin-lte/3.2.0`
+{{DIR_ADMINLTEPLUGINS}} | base path for bootstrp, jquery, fontawesome | `/vendor/admin-lte-plugins`
### Layout
@@ -19,7 +20,7 @@ See also <https://adminlte.io/docs/3.2/layout.html>
### Visual parts
-
+
Variable | Description
--- |---
@@ -41,7 +42,7 @@ require_once('classes/render-adminlte.class.php');
$renderAdminLTE=new renderadminlte();
```
-The we can use `$renderAdminLTE` to render elements with its public functions.
+Then we can use `$renderAdminLTE` to render elements with its public functions.
### Define replacements
diff --git a/docs/50_Components/10_Grid.md b/docs/50_Components/10_Grid.md
index 57ffc40904e26e5728ad4b9c47e435fb521fa2c5..04e6da5e55af1eb1f016ec24793a1487fbace7ae 100644
--- a/docs/50_Components/10_Grid.md
+++ b/docs/50_Components/10_Grid.md
@@ -31,10 +31,21 @@ $renderAdminLTE->addCol([HTML code], [Width]);
You can define a width of 1..12 to define a screen width of your cell.
-To divide it in 3 parts:
+Here is an example with 3 rows ... first with fill width; then on row with 3 columns and a third row with 2 columns:
```php
-echo $renderAdminLTE->addCol("column 1/ 3", 4 );
-echo $renderAdminLTE->addCol("column 2/ 3", 4 );
-echo $renderAdminLTE->addCol("column 3/ 3", 4 );
-```
\ No newline at end of file
+echo ''
+ .$renderAdminLTE->addRow(
+ $renderAdminLTE->addCol("full width column", 12 )
+ )
+ . $renderAdminLTE->addRow(
+ $renderAdminLTE->addCol("column 1/ 3", 4 )
+ . $renderAdminLTE->addCol("column 2/ 3", 4 )
+ . $renderAdminLTE->addCol("column 3/ 3", 4 )
+ )
+ .$renderAdminLTE->addRow(
+ $renderAdminLTE->addCol("column 1/ 2", 6 )
+ . $renderAdminLTE->addCol("column 1/ 2", 6 )
+)
+;
+```
diff --git a/docs/50_Components/Alert.md b/docs/50_Components/Alert.md
index 80c9f4f122ab1651871ebb9b5bc28c18c179d8b4..d4c1315d2d3a033989e812377e8e7c24c0a7bda3 100644
--- a/docs/50_Components/Alert.md
+++ b/docs/50_Components/Alert.md
@@ -1,32 +1,43 @@
-## Badge
+## Alert
-A badge is a small counter or info next to a text info,
+An alert is a colored box with title and text.
### Syntax
```php
-$renderAdminLTE->getBadge($aOptions);
+$renderAdminLTE->getAlert($aOptions);
```
### Parameters
* $aOptions - {array} options to describe the element
-Key | Description
---- | ---
-bgcolor | optional: background color (without prefix "bg"); hint: you should prefer a "type".
-class | optional: additional css class
-id | optional: additional id attribute
-text | visible text
-title | title
-type | one of `[none]|danger|dark|info|primary|secondary|success|warning`
+Styling:
+
+Key | Description
+--- | ---
+type | one of [none]\|danger\|dark\|info\|primary\|secondary\|success\|warning
+
+Content:
+
+Key | Description
+--- | ---
+text | visible text
+title | title
+
+Other:
+
+Key | Description
+--- | ---
+dismissable | optional: background color (without prefix "bg"); hint: you should prefer a "type".
### Example
```php
-$renderAdminLTE->getBadge([
- 'type'=>'danger',
- 'title'=>'Errors: 5',
- 'text'=>'5',
-])
+$renderAdminLTE->getAlert(array (
+ 'type' => 'warning',
+ 'title' => 'I need your attention',
+ 'dismissible' => 1,
+ 'text' => 'Please check it. Maybe there is something wrong here.',
+))
```
diff --git a/docs/50_Components/Badge.md b/docs/50_Components/Badge.md
index 80c9f4f122ab1651871ebb9b5bc28c18c179d8b4..2c91d00be0ef36c85f48e9d707f671dd801ae87f 100644
--- a/docs/50_Components/Badge.md
+++ b/docs/50_Components/Badge.md
@@ -12,14 +12,26 @@ $renderAdminLTE->getBadge($aOptions);
* $aOptions - {array} options to describe the element
+Styling:
+
Key | Description
--- | ---
bgcolor | optional: background color (without prefix "bg"); hint: you should prefer a "type".
-class | optional: additional css class
-id | optional: additional id attribute
+class | optional: additional css classes
+type | one of [none]\|danger\|dark\|info\|primary\|secondary\|success\|warning
+
+Content:
+
+Key | Description
+--- | ---
text | visible text
title | title
-type | one of `[none]|danger|dark|info|primary|secondary|success|warning`
+
+Other:
+
+Key | Description
+--- | ---
+id | optional: additional id attribute
### Example
diff --git a/docs/50_Components/Button.md b/docs/50_Components/Button.md
new file mode 100644
index 0000000000000000000000000000000000000000..ddd0afb392b3fb7168f5ab25ec97882b9e37b8bf
--- /dev/null
+++ b/docs/50_Components/Button.md
@@ -0,0 +1,40 @@
+## Button
+
+An html button tag with formatting.
+
+You can use any other key that are not named here. Those keys will be rendered as additional html attributes without modification.
+
+
+### Syntax
+
+```php
+$renderAdminLTE->getButton($aOptions);
+```
+
+### Parameters
+
+* $aOptions - {array} options to describe the element
+
+Styling:
+
+Key | Description
+--- | ---
+class | optional: additional css classes
+size | set size of the button; one of [none]|lg|sm|xs|flat
+type | one of [none]\|danger\|dark\|info\|primary\|secondary\|success\|warning
+
+Content:
+
+Key | Description
+--- | ---
+text | visible text
+
+### Example
+
+```php
+$renderAdminLTE->getButton([
+ 'class'=>'primary',
+ 'text'=>'Click me',
+ 'onclick'=>'alert(\'Hello!\');'
+ ])
+```
diff --git a/docs/50_Components/Callout.md b/docs/50_Components/Callout.md
new file mode 100644
index 0000000000000000000000000000000000000000..f12fac6950e239199c119d571b6bc73e192810e7
--- /dev/null
+++ b/docs/50_Components/Callout.md
@@ -0,0 +1,37 @@
+## Callout
+
+A box with colored left border. It has type, title + text.
+
+### Syntax
+
+```php
+$renderAdminLTE->getCallout($aOptions);
+```
+
+### Parameters
+
+* $aOptions - {array} options to describe the element
+
+Styling:
+
+Key | Description
+--- | ---
+class | optional: additional css classes
+type | one of [none]\|danger\|dark\|info\|primary\|secondary\|success\|warning
+
+Content:
+
+Key | Description
+--- | ---
+text | visible text
+title | title of the callout
+
+### Example
+
+```php
+$renderAdminLTE->getCallout(array (
+ 'type' => 'success',
+ 'title' => 'I am a success callout',
+ 'text' => 'This is a gren callout.',
+))
+```
diff --git a/docs/50_Components/Card.md b/docs/50_Components/Card.md
new file mode 100644
index 0000000000000000000000000000000000000000..4c12fa962c119f91350de615f0e8e5dd0e5c35a3
--- /dev/null
+++ b/docs/50_Components/Card.md
@@ -0,0 +1,45 @@
+## Callout
+
+A div to display boxed content.
+
+It has header, main text and a footer.
+
+### Syntax
+
+```php
+$renderAdminLTE->getCard($aOptions);
+```
+
+### Parameters
+
+* $aOptions - {array} options to describe the element
+
+Styling:
+
+Key | Description
+--- | ---
+class | optional: additional css classes
+type | one of [none]\|danger\|dark\|info\|primary\|secondary\|success\|warning
+variant | kind of coloring: one of<br>- "default" - titlebar is colored<br>- "outline" - a small stripe on top border is colored<br>- "solid" - whole card is colored<br>- "gradient" - whole card is colored with a gradient
+
+Content:
+
+Key | Description
+--- | ---
+footer | footer of the card
+text | visible text
+title | title of the card
+tools | html code for upper right corner
+
+### Example
+
+```php
+$renderAdminLTE->getCard(array (
+ 'type' => 'primary',
+ 'variant' => 'solid',
+ 'title' => 'I am a card',
+ 'tools' => '123',
+ 'text' => 'Hello everybody out there!',
+ 'footer' => '© Axel',
+))
+```
diff --git a/docs/config.json b/docs/config.json
index d29d53bc42c5e04376655e02bd7b1cbf77371d07..d06d672c0ca49c7b75477a7fec1986e24f29861f 100644
--- a/docs/config.json
+++ b/docs/config.json
@@ -1,7 +1,7 @@
{
- "title": "Docker starter kit",
+ "title": "AdminLTE renderer",
"author": "Axel Hahn",
- "tagline": "Bring up a docker container with a PHP 8.x dev environment",
+ "tagline": "PHP class to render elements of AdminLTE template",
"ignore": {
"files": ["_skeleton.md"],
"folders": ["99_Not_Ready"]
@@ -14,10 +14,10 @@
"edit_on_github_": "iml-it/__PROJECT__/tree/master/docs",
"edit_on": {
"name": "Gitlab",
- "basepath": "https://git-repo.iml.unibe.ch/iml-open-source/docker-php-starterkit/tree/master/docs"
+ "basepath": "https://git-repo.iml.unibe.ch/iml-open-source/adminlte-renderer/tree/master/docs"
},
"links": {
- "Git Repo": "https://git-repo.iml.unibe.ch/iml-open-source/docker-php-starterkit",
+ "Git Repo": "https://git-repo.iml.unibe.ch/iml-open-source/adminlte-renderer",
"IML Opensource": "https://os-docs.iml.unibe.ch/"
},
"theme": "daux-blue",