Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

http://10.156.44.66/wfo/ui-debug/index.html?modules=AppShellTest,Foundation,FoundationTest&#wsm[ws]=extJSKitchenSinkLux

🧐 Specifications

Component

Class to use

Screenshot

Usage Example

Search field

as-searchfield

Image Modified

Code Block
{ 
xtype: 'textfield',
emptyText: 'Find',
cls: 'as-searchfield',
triggers: {
	searchTrigger: {
        	cls: Ext.baseCSSPrefix + 'form-search-trigger',
                handler: function () {
                	alert('Search activated');
                }
        }
}

Combo box

as-combo

Image Modified

Dropdown/Menu

as-combomenu

Image Modified

Icon buttons

as-icon-btn

Image Modified

Toggle button

as-togglebutton

Image Modified

Date field

as-date-field

Image Modified

Time field

as-time-field

Image Modified

Number field

as-number-field

Image Modified

Split button

as-split-btn

Image Modified

Primary button

as-btn-primary

Image Modified

Code Block
{
  xtype: 'button',
  text : 'Submit',
  cls: 'as-btn-primary'
}

Info message box

as-msgbox and as-msgbox-info

Image Modified

Help message box

as-msgbox and as-msgbox-help

Error message box

as-msgbox and as-msgbox-error

Image Modified

Warning message box

as-msgbox and as-msgbox-warning

Image Modified

Default message box

as-msgbox

Image Modified

Tooltips

Image Removed

Image Added

Image Modified

Error tooltip

as-tooltip-error

Image Modified

Warning tooltip

as-tooltip-warning

Image Modified

Info tooltip

as-tooltip-info

Image Modified

Help tooltip

as-tooltip-help

Image Modified

📐 Additional guidance

Content

Accessibility

Mobile

Best practices

Related