1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-08-02 20:15:26 +02:00

Introduce modular UI framework

1. Modals wrapped
2. Toolbar icon actions: click and link-to navigation
3. Moved components into sub-folders
4. Replaced Bootstrap Tooltip and Dropdown libs with Ember specific add-ons

And more.

Co-Authored-By: Saul S <sauls8t@users.noreply.github.com>
Co-Authored-By: McMatts <matt@documize.com>
This commit is contained in:
Harvey Kandola 2018-12-11 18:00:08 +00:00
parent f140e7ef77
commit 6eb68f84e0
48 changed files with 330 additions and 240 deletions

View file

@ -6,93 +6,105 @@
<p>Bring to the table win-win survival strategies to ensure proactive domination. At the end of the day, going forward, a new normal that has evolved from generation X is on the runway heading towards a streamlined cloud solution. User generated content in real-time will have multiple touchpoints for offshoring.</p>
{{/layout/master-sidebar}}
{{#layout/master-content}}
{{ui/ui-button themed=true label="save" onClick=(action "onButtonClick" 1)}}
{{ui/ui-button themed=true label=constants.Label.Save onClick=(action "onButtonClick" 1)}}
{{ui/ui-button-gap}}
{{ui/ui-button themed=true light=true label="update" onClick=(action "onButtonClick" 2)}}
{{ui/ui-button themed=true light=true label=constants.Label.Update onClick=(action "onButtonClick" 2)}}
{{ui/ui-button-gap}}
<br>
<br>
{{ui/ui-button color="green" label="save" onClick=(action "onSuccess")}}
{{ui/ui-button color=constants.Color.Green label=constants.Label.Save onClick=(action "onSuccess")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="yellow" label="update" onClick=(action "onInfo")}}
{{ui/ui-button color=constants.Color.Yellow label=constants.Label.Update onClick=(action "onInfo")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="gray" label="Cancel" onClick=(action "onWarn")}}
{{ui/ui-button color=constants.Color.Gray label=constants.Label.Cancel onClick=(action "onWarn")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="red" label="deletE" onClick=(action "onError")}}
{{ui/ui-button color=constants.Color.Red label=constants.Label.Delete onClick=(action "onError")}}
{{ui/ui-button-gap}}
<br>
<br>
{{ui/ui-button color="green" light=true label="save" onClick=(action "onSuccess")}}
{{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Save onClick=(action "onSuccess")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="yellow" light=true label="update" onClick=(action "onInfo")}}
{{ui/ui-button color=constants.Color.Yellow light=true label=constants.Label.Update onClick=(action "onInfo")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="gray" light=true label="Cancel" onClick=(action "onWarn")}}
{{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel onClick=(action "onWarn")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="red" light=true label="deletE" onClick=(action "onError")}}
{{ui/ui-button color=constants.Color.Red light=true label=constants.Label.Delete onClick=(action "onError")}}
{{ui/ui-button-gap}}
<br>
<br>
{{ui/ui-button color="green" light=true icon="plus" label="save" onClick=(action "onSuccess")}}
{{ui/ui-button color=constants.Color.Green light=true icon=constants.Icon.Plus label=constants.Label.Save onClick=(action "onSuccess")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="yellow" light=true icon="settings" label="update" onClick=(action "onInfo")}}
{{ui/ui-button color=constants.Color.Yellow light=true icon=constants.Icon.Settings label=constants.Label.Update onClick=(action "onInfo")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="gray" light=true icon="print" label="Cancel" onClick=(action "onWarn")}}
{{ui/ui-button color=constants.Color.Gray light=true icon=constants.Icon.Print label=constants.Label.Cancel onClick=(action "onWarn")}}
{{ui/ui-button-gap}}
{{ui/ui-button color="red" light=true icon="delete" label="deletE" onClick=(action "onError")}}
{{ui/ui-button color=constants.Color.Red light=true icon=constants.Icon.Delete label=constants.Label.Delete onClick=(action "onError")}}
{{ui/ui-button-gap}}
<br>
<br>
{{#ui/ui-toolbar dark=false light=false raised=false large=false bordered=false}}
{{ui/ui-toolbar-icon icon="delete" color="red" onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon="print" color="yellow" onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon="settings" onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon="print" color="green" onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon="person" color="" onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Yellow onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Green onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Person onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green onClick=(action "onToolbarClick" 5)}}
{{/ui/ui-toolbar}}
<br>
<br>
{{#ui/ui-toolbar dark=false light=true raised=true large=false bordered=true}}
{{ui/ui-toolbar-icon icon="delete" color="red" onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon="print" color="yellow" onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon="settings" onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon="print" color="green" onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon="person" color="" onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Yellow onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Green onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Person onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green onClick=(action "onToolbarClick" 5)}}
{{/ui/ui-toolbar}}
<br>
<br>
{{#ui/ui-toolbar dark=true light=false raised=true large=false bordered=true}}
{{ui/ui-toolbar-icon icon="delete" color="red" onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon="print" color="yellow" onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon="settings" onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon="print" color="green" onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon="person" color="" onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Yellow onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Green onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Person onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green onClick=(action "onToolbarClick" 5)}}
{{/ui/ui-toolbar}}
<br>
<br>
{{#ui/ui-toolbar dark=false light=false raised=false large=true bordered=false}}
{{ui/ui-toolbar-icon icon="delete" color="red" onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon="print" color="yellow" onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon="settings" onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon="print" color="green" onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon="person" color="" onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Yellow onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Green onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Person onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green onClick=(action "onToolbarClick" 5)}}
{{/ui/ui-toolbar}}
<br>
<br>
{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}}
{{ui/ui-toolbar-icon icon="delete" color="red" onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon="print" color="yellow" onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon="settings" onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon="print" color="green" onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon="person" color="" onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Yellow onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Green onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Person onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green onClick=(action "onToolbarClick" 5)}}
{{/ui/ui-toolbar}}
<br>
<br>
{{#ui/ui-toolbar dark=true light=false raised=true large=true bordered=true}}
{{ui/ui-toolbar-icon icon="delete" color="red" onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon="print" color="yellow" onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon="settings" onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon="print" color="green" onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon="person" color="" onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red onClick=(action "onToolbarClick" 1)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Yellow onClick=(action "onToolbarClick" 2)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Green onClick=(action "onToolbarClick" 4)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Person onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green tooltip="New space" onClick=(action "onToolbarClick" 5)}}
{{/ui/ui-toolbar}}
<br>
<br>
{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green onClick=(action "onToolbarClick" 5)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings onClick=(action "onToolbarClick" 3)}}
{{/ui/ui-toolbar}}
<br>
<br>