Lead:  Shani Laendler (Unlicensed) -  

Description

<< Short description of the component and when it is used >>

...

Usage & Behavior

General guidelines

...

• Drag
  some widgets, especially on dashboard or dashboard-like pages, can be dragged to change their location.

  • In hover over the header area the mouse cursor will change to dragging state:

    Image RemovedImage Added

  • A drag handle may also be presented (always or in hover only), and will be placed left to the header:

    

...

• Resize: Some widgets can be resized.
  In hover over the resizable boundary line:

  • The mouse cursor will change to drag horizontally/vertically/diagonally

  • The boundary line will be visually presented as resizable

  • The hover and resize area should be at list 6 pixels wide.

...

States

State	Image
Regular
Hover
Active	-
Disabled	TBD - graphic design
Error	-
Focused	-
Focused Hover	-
Focused Active	-
Focused Disabled	-

...

Expand collapse will be in animation. TBD - Graphics

Best practices

<<e.g. Slider should display a label its on>>

...

<<In general each component should be A11y complied,  please follow the 3 guidelines linked below. At the very least we should document that each component is in compliance with each of the 3>>

Focus management

<<Does this component/Pattern requires specific handling?>>

See general guidelines described in /wiki/spaces/UX/pages/308969693

Screen reader support 

<<Does this component/Pattern requires specific handling?>>

See general guidelines described in /wiki/spaces/UX/pages/308248620

Contrast & size compliance

<<Does this component/Pattern requires specific handling?>>

Are taken into consideration. For more information see general guidelines described in Contrast + Font Size Guidelines

...