ExtJS LUX components design can be found at:
https://app.zeplin.io/project/5970b366bee38cf87b2de932
ExtJS LUX live components can be found at:
🧐 Specifications
Component | Class to use | Screenshot | Usage Example |
---|---|---|---|
Search field | as-searchfield | { xtype: 'textfield', emptyText: 'Find', cls: 'as-searchfield', triggers: { searchTrigger: { cls: Ext.baseCSSPrefix + 'form-search-trigger', handler: function () { alert('Search activated'); } } } | |
Combo box | as-combo | ||
Dropdown/Menu | as-combomenu | ||
Icon buttons | as-icon-btn | ||
Toggle button | as-togglebutton | ||
Date field | as-date-field | ||
Time field | as-time-field | ||
Number field | as-number-field | ||
Split button | as-split-btn | ||
Primary button | as-btn-primary | {xtype: 'button',text : 'Submit',cls: 'as-btn-primary'} | |
Info message box | as-msgbox and as-msgbox-info | ||
Help message box | as-msgbox and as-msgbox-help | ||
Error message box | as-msgbox and as-msgbox-error | ||
Warning message box | as-msgbox and as-msgbox-warning | ||
Default message box | as-msgbox | ||
Tooltips | |||
Error tooltip | as-tooltip-error | ||
Warning tooltip | as-tooltip-warning | ||
Info tooltip | as-tooltip-info | ||
Help tooltip | as-tooltip-help | ||
📐 Additional guidance
Content | |
---|---|
Accessibility | |
Mobile | |
Best practices | |
Related |