8,288
edits
Changes
Jump to navigation
Jump to search
Line 1:
Line 1: − + Line 31:
Line 31: − +
Human Interface Guidelines/The Sugar Interface/Controls/Custom Controls (view source)
Revision as of 16:43, 22 October 2009
, 16:43, 22 October 2009no edit summary
<noinclude>{{Translations}}</noinclude>
<noinclude>{{Translations}}{{GoogleTrans-en}}</noinclude>
<noinclude>{{hig-subnav|p_link=The Sugar Interface/Controls/Grouping Controls|p_label=Grouping Controls|c_link=The Sugar Interface/Controls/Custom Controls|c_label=Custom Controls|n_link=The Sugar Interface/Controls|n_label=Controls}}</noinclude>
<noinclude>{{hig-subnav|p_link=The Sugar Interface/Controls/Grouping Controls|p_label=Grouping Controls|c_link=The Sugar Interface/Controls/Custom Controls|c_label=Custom Controls|n_link=The Sugar Interface/Controls|n_label=Controls}}</noinclude>
=====Control Sizing=====
=====Control Sizing=====
In accordance with [[Design Team/Human_Interface_Guidelines/The_Sugar_Interface/Layout_Guidelines| the grid system]], we have defined two standard sizes for controls: 75px and 45px. These sizes determine the bounding box for a given control, with 45px being the smallest recommended active (clickable) area for any control component. Note that the control itself may actually be smaller than this canvas, depending on the desired context. For instance, the icons for buttons fill up to 60% of the canvas area, with the actual icons having sizes of 55px and 27px.
In accordance with [[Human_Interface_Guidelines/The_Sugar_Interface/Layout_Guidelines| the grid system]], we have defined two standard sizes for controls: 75px and 45px. These sizes determine the bounding box for a given control, with 45px being the smallest recommended active (clickable) area for any control component. Note that the control itself may actually be smaller than this canvas, depending on the desired context. For instance, the icons for buttons fill up to 60% of the canvas area, with the actual icons having sizes of 55px and 27px.
<noinclude>{{hig-subnav|p_link=The Sugar Interface/Controls/Grouping Controls|p_label=Grouping Controls|c_link=The Sugar Interface/Controls/Custom Controls|c_label=Custom Controls|n_link=The Sugar Interface/Controls|n_label=Controls}}</noinclude>
<noinclude>{{hig-subnav|p_link=The Sugar Interface/Controls/Grouping Controls|p_label=Grouping Controls|c_link=The Sugar Interface/Controls/Custom Controls|c_label=Custom Controls|n_link=The Sugar Interface/Controls|n_label=Controls}}</noinclude>