Skip to content

S
sidekick
Commit 50cf2d29 authored by Kevin Yumang's avatar Kevin Yumang
Browse files
Options

SERV-2286 - Navigation documentation

parent 735f67a4
Hide whitespace changes
Inline Side-by-side
Showing with 104 additions and 23 deletions
src/Views/Limitless/Navigation/Documentation/Index.blade.php
View file @ 50cf2d29
......@@ -3,9 +3,6 @@
@section('Limitless::Content')
@php
$example = base64_decode("QExpbWl0bGVzczo6TmF2aWdhdGlvblN0YXJ0CiAgICBATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudVNlY3Rpb25UaXRsZShbJ3RpdGxlJyA9PiAnTWVudSBzZWN0aW9uIHRpdGxlIDEnXSkKICAgIEBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51SXRlbShbJ3VybCcgPT4gJz9wYWdlPWNhcmQnLCAndGFyZ2V0JyA9PiAnX3NlbGYnLCAnaWNvbicgPT4gJ2ljb24tc3F1YXJlJywgJ3RpdGxlJyA9PiAnQ2FyZCddKQogICAgQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVJdGVtKFsndXJsJyA9PiAnP3BhZ2U9dGFibGUnLCAndGFyZ2V0JyA9PiAnX2JsYW5rJywgJ2ljb24nID0+ICdpY29uLXRhYmxlMicsICd0aXRsZScgPT4gJ1RhYmxlJ10pCiAgICBATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudUl0ZW0oWyd1cmwnID0+ICc/cGFnZT1uYXZpZ2F0aW9uJywgJ3RhcmdldCcgPT4gJ19zZWxmJywgJ2ljb24nID0+ICdpY29uLW1lbnU4JywgJ3RpdGxlJyA9PiAnTmF2aWdhdGlvbiddKQogICAgQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVTdGFydChbJ3RpdGxlJyA9PiAnTGV2ZWwgMSBTdWJtZW51IGV4YW1wbGUnLCAnaWNvbicgPT4gJ2ljb24tdGhyZWUtYmFycyddKQogICAgICAgIEBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51U2VjdGlvblRpdGxlKFsndGl0bGUnID0+ICdNZW51IHNlY3Rpb24gdGl0bGUgMiddKQogICAgICAgIEBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51SXRlbShbJ3VybCcgPT4gJz9wYWdlPWNhcmQnLCAndGFyZ2V0JyA9PiAnX2JsYW5rJywgJ2ljb24nID0+ICdpY29uLXNxdWFyZScsICd0aXRsZScgPT4gJ0NhcmQnXSkKICAgICAgICBATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudUl0ZW0oWyd1cmwnID0+ICc/cGFnZT10YWJsZScsICd0YXJnZXQnID0+ICdfYmxhbmsnLCAnaWNvbicgPT4gJ2ljb24tdGFibGUyJywgJ3RpdGxlJyA9PiAnVGFibGUnXSkKICAgICAgICBATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudVN0YXJ0KFsndGl0bGUnID0+ICdMZXZlbCAyIFN1Ym1lbnUgZXhhbXBsZScsICdpY29uJyA9PiAnaWNvbi10aHJlZS1iYXJzJ10pCiAgICAgICAgICAgIEBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51U2VjdGlvblRpdGxlKFsndGl0bGUnID0+ICdNZW51IHNlY3Rpb24gdGl0bGUgMiddKQogICAgICAgICAgICBATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudUl0ZW0oWyd1cmwnID0+ICc/cGFnZT1jYXJkJywgJ3RhcmdldCcgPT4gJ19ibGFuaycsICdpY29uJyA9PiAnaWNvbi1zcXVhcmUnLCAndGl0bGUnID0+ICdDYXJkJ10pCiAgICAgICAgICAgIEBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51SXRlbShbJ3VybCcgPT4gJz9wYWdlPXRhYmxlJywgJ3RhcmdldCcgPT4gJ19ibGFuaycsICdpY29uJyA9PiAnaWNvbi10YWJsZTInLCAndGl0bGUnID0+ICdUYWJsZSddKQogICAgICAgIEBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51U3RvcAogICAgQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVTdG9wCkBMaW1pdGxlc3M6Ok5hdmlnYXRpb25TdG9w");
@endphp
{{-- Description --}}
@Limitless::ElementCardStart(['title' => "Navigation", 'icon' => 'icon-menu8'])
......@@ -45,63 +42,147 @@
@Limitless::ElementCardStart(['title' => "NavigationStop"])
- element details
- element parameters (this should be on a table element)
<p>The main closing element for the navigation.</p>
@Limitless::Divider
</br>
<h6>Parameters : NONE</h6>
@Limitless::ElementCardStop
@Limitless::ElementCardStart(['title' => "NavigationMenuSectionTitle"])
- element details
- element parameters (this should be on a table element)
<p>Navigation section/group title.</p>
@Limitless::Divider
</br>
<h6>Parameters</h6>
@Limitless::TableStart([ 'extra' => ['class' => 'table table-xs table-striped'] ])
@Limitless::TableAutofillHeader([
['name' => 'Key'],
['name' => 'Description'],
['name' => 'Example'],
])
@Limitless::TableAutofillBody([
[
['value' => 'title'],
['value' => 'The title of the section to display.'],
['value' => "<code>['title' => 'Navigation']</code>", 'secure' => false],
]
])
@Limitless::TableStop
@Limitless::ElementCardStop
@Limitless::ElementCardStart(['title' => "NavigationMenuItem"])
- element details
- element parameters (this should be on a table element)
<p>The items that will be displayed for navigation.</p>
@Limitless::Divider
</br>
<h6>Parameters</h6>
@Limitless::TableStart([ 'extra' => ['class' => 'table table-xs table-striped'] ])
@Limitless::TableAutofillHeader([
['name' => 'Key'],
['name' => 'Description'],
['name' => 'Example'],
])
@Limitless::TableAutofillBody([
[
['value' => 'url'],
['value' => 'The link of the navigation item.'],
['value' => "<code>['url' => '?page=navigation']</code>", 'secure' => false],
],
[
['value' => 'target'],
['value' => "Specifies the window where the linked page will be loaded.", 'secure' => false],
['value' => "<code>['target' => '_blank'] ( _blank | _self | _parent | _top | framename )</code>", 'secure' => false],
],
[
['value' => 'icon'],
['value' => 'The icon of the navigation item.'],
['value' => "<code>['icon' => 'icon-menu8']</code>", 'secure' => false],
],
[
['value' => 'title'],
['value' => 'The title of the navigation item to display.'],
['value' => "<code>['title' => 'Card']</code>", 'secure' => false],
]
])
@Limitless::TableStop
@Limitless::ElementCardStop
@Limitless::ElementCardStart(['title' => "NavigationMenuStart"])
- element details
- element parameters (this should be on a table element)
<p>The opening and the parent element for the nested navigation items.</p>
@Limitless::Divider
</br>
<h6>Parameters</h6>
@Limitless::TableStart([ 'extra' => ['class' => 'table table-xs table-striped'] ])
@Limitless::TableAutofillHeader([
['name' => 'Key'],
['name' => 'Description'],
['name' => 'Example'],
])
@Limitless::TableAutofillBody([
[
['value' => 'title'],
['value' => 'The title of the nested navigation item.'],
['value' => "<code>['title' => 'More Navigation']</code>", 'secure' => false],
],
[
['value' => 'icon'],
['value' => 'The icon of the nested navigation item.'],
['value' => "<code>['icon' => 'icon-three-bars']</code>", 'secure' => false],
]
])
@Limitless::TableStop
@Limitless::ElementCardStop
@Limitless::ElementCardStart(['title' => "NavigationMenuStop"])
- element details
- element parameters (this should be on a table element)
<p>The closing element for the nested navigation items.</p>
@Limitless::Divider
</br>
<h6>Parameters : NONE</h6>
@Limitless::ElementCardStop
@Limitless::ElementCardStop
{{-- Sample Output --}}
@Limitless::ElementCardStart(['title' => "Sample Output", 'icon' => 'icon-display4' ] )
@Limitless::NavigationStart
@Limitless::NavigationMenuSectionTitle(['title' => 'Menu section title 1'])
@Limitless::NavigationMenuItem(['url' => '?page=card', 'target' => '_self', 'icon' => 'icon-square', 'title' => 'Card'])
@Limitless::NavigationMenuItem(['url' => '?page=table', 'target' => '_blank', 'icon' => 'icon-table2', 'title' => 'Table'])
@Limitless::NavigationMenuItem(['url' => '?page=navigation', 'target' => '_self', 'icon' => 'icon-menu8', 'title' => 'Navigation'])
@Limitless::NavigationMenuStart(['title' => 'Level 1 Submenu example', 'icon' => 'icon-three-bars'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Menu Item 1'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Menu Item 2'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Menu Item 3'])
@Limitless::NavigationMenuStart(['title' => 'Level 1 Submenu Item Parent', 'icon' => 'icon-three-bars'])
@Limitless::NavigationMenuSectionTitle(['title' => 'Menu section title 2'])
@Limitless::NavigationMenuItem(['url' => '?page=card', 'target' => '_blank', 'icon' => 'icon-square', 'title' => 'Card'])
@Limitless::NavigationMenuItem(['url' => '?page=table', 'target' => '_blank', 'icon' => 'icon-table2', 'title' => 'Table'])
@Limitless::NavigationMenuStart(['title' => 'Level 2 Submenu example', 'icon' => 'icon-three-bars'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Level 1 Submenu Item Child 1'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Level 1 Submenu Item Child 2'])
@Limitless::NavigationMenuStart(['title' => 'Level 2 Submenu Item Parent', 'icon' => 'icon-three-bars'])
@Limitless::NavigationMenuSectionTitle(['title' => 'Menu section title 3'])
@Limitless::NavigationMenuItem(['url' => '?page=card', 'target' => '_blank', 'icon' => 'icon-square', 'title' => 'Card'])
@Limitless::NavigationMenuItem(['url' => '?page=table', 'target' => '_blank', 'icon' => 'icon-table2', 'title' => 'Table'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Level 2 Submenu Item Child 1'])
@Limitless::NavigationMenuItem(['url' => '#', 'target' => '_self', 'icon' => 'icon-three-bars', 'title' => 'Level 2 Submenu Item Child 2'])
@Limitless::NavigationMenuStop
@Limitless::NavigationMenuStop
@Limitless::NavigationStop
@Limitless::ElementCardStop
@php
$example = base64_decode("QExpbWl0bGVzczo6RWxlbWVudENhcmRTdGFydChbJ3RpdGxlJyA9PiAiU2FtcGxlIE91dHB1dCIsICdpY29uJyA9PiAnaWNvbi1kaXNwbGF5NCcgXSApCglATGltaXRsZXNzOjpOYXZpZ2F0aW9uU3RhcnQKCQlATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudVNlY3Rpb25UaXRsZShbJ3RpdGxlJyA9PiAnTWVudSBzZWN0aW9uIHRpdGxlIDEnXSkKCQlATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudUl0ZW0oWyd1cmwnID0+ICcjJywgJ3RhcmdldCcgPT4gJ19zZWxmJywgJ2ljb24nID0+ICdpY29uLXRocmVlLWJhcnMnLCAndGl0bGUnID0+ICdNZW51IEl0ZW0gMSddKQoJCUBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51SXRlbShbJ3VybCcgPT4gJyMnLCAndGFyZ2V0JyA9PiAnX3NlbGYnLCAnaWNvbicgPT4gJ2ljb24tdGhyZWUtYmFycycsICd0aXRsZScgPT4gJ01lbnUgSXRlbSAyJ10pCgkJQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVJdGVtKFsndXJsJyA9PiAnIycsICd0YXJnZXQnID0+ICdfc2VsZicsICdpY29uJyA9PiAnaWNvbi10aHJlZS1iYXJzJywgJ3RpdGxlJyA9PiAnTWVudSBJdGVtIDMnXSkKCQlATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudVN0YXJ0KFsndGl0bGUnID0+ICdMZXZlbCAxIFN1Ym1lbnUgSXRlbSBQYXJlbnQnLCAnaWNvbicgPT4gJ2ljb24tdGhyZWUtYmFycyddKQoJCQlATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudVNlY3Rpb25UaXRsZShbJ3RpdGxlJyA9PiAnTWVudSBzZWN0aW9uIHRpdGxlIDInXSkKCQkJQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVJdGVtKFsndXJsJyA9PiAnIycsICd0YXJnZXQnID0+ICdfc2VsZicsICdpY29uJyA9PiAnaWNvbi10aHJlZS1iYXJzJywgJ3RpdGxlJyA9PiAnTGV2ZWwgMSBTdWJtZW51IEl0ZW0gQ2hpbGQgMSddKQoJCQlATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudUl0ZW0oWyd1cmwnID0+ICcjJywgJ3RhcmdldCcgPT4gJ19zZWxmJywgJ2ljb24nID0+ICdpY29uLXRocmVlLWJhcnMnLCAndGl0bGUnID0+ICdMZXZlbCAxIFN1Ym1lbnUgSXRlbSBDaGlsZCAyJ10pCgkJCUBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51U3RhcnQoWyd0aXRsZScgPT4gJ0xldmVsIDIgU3VibWVudSBJdGVtIFBhcmVudCcsICdpY29uJyA9PiAnaWNvbi10aHJlZS1iYXJzJ10pCgkJCQlATGltaXRsZXNzOjpOYXZpZ2F0aW9uTWVudVNlY3Rpb25UaXRsZShbJ3RpdGxlJyA9PiAnTWVudSBzZWN0aW9uIHRpdGxlIDMnXSkKCQkJCUBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51SXRlbShbJ3VybCcgPT4gJyMnLCAndGFyZ2V0JyA9PiAnX3NlbGYnLCAnaWNvbicgPT4gJ2ljb24tdGhyZWUtYmFycycsICd0aXRsZScgPT4gJ0xldmVsIDIgU3VibWVudSBJdGVtIENoaWxkIDEnXSkKCQkJCUBMaW1pdGxlc3M6Ok5hdmlnYXRpb25NZW51SXRlbShbJ3VybCcgPT4gJyMnLCAndGFyZ2V0JyA9PiAnX3NlbGYnLCAnaWNvbicgPT4gJ2ljb24tdGhyZWUtYmFycycsICd0aXRsZScgPT4gJ0xldmVsIDIgU3VibWVudSBJdGVtIENoaWxkIDInXSkKCQkJQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVTdG9wCgkJQExpbWl0bGVzczo6TmF2aWdhdGlvbk1lbnVTdG9wCglATGltaXRsZXNzOjpOYXZpZ2F0aW9uU3RvcApATGltaXRsZXNzOjpFbGVtZW50Q2FyZFN0b3A=");
@endphp
{{-- Sample Code --}}
@Limitless::ElementCardStart(['title' => "Sample Code", 'icon' => 'icon-circle-code' ] )
@Limitless::Codemirror([ 'language' => 'javascript', 'theme' => 'zenburn', 'value' => $example ])
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment