Extension Content

anatomy default 1 section header arrow icon chevron size 16x16 state show title font size 13 text color #000000 text style heading 5 function buttons (optional) maximum of 3 buttons size 16x16 icon color icon/stroke light (#545454) 2 subsection (optional) font size 12 text color #000000 text style normal 3 label (optional) font size 11 text color input/label (#4d4d4d) text style label 4 preview width 312 height 24 state close border color border/border 1 (#b3b3b3) background color #ffffff layout general grid & columns as described in spacing & layout docid\ oalphiouiw igsdvtqjmp , the extension's component tab space is divided into columns according to a grid system, which can be used to size and place elements by default, the system will auto size your buttons such that the images will show at their native resolution odds are, your images are not sized exactly to result in a button size that fits the column grid, so explicit hints should be given to the system to override this behaviour uihint can be used for this purpose // columns can be used for easy sizing of square buttons // the following hint results in buttons getting a size of (40, 40) // due to 2 16px columns + 1 8px gutter in between (2 16 + 1 8) = 40 uihint squarehint(columns=2); // if the button shouldn't be square, then prefersize can be set instead // getdimfromcolumns is a helper function used to calculate the pixel // width of columns using the above formula uihint widehint(prefersize=(getdimfromcolumns(6), 28)); // 6 columns wide section sections are containers used to organize the content of a library nested sections are not allowed, please consider the use of subsections instead header title without top line section headers without a top line are only used when it is the first section within a toolbox title with top line section headers with a top line are always used for every section that is not the first within a toolbox component tab function buttons each section can optionally have up to 3 function buttons, and each button must be 24x24 pixels in size these are recommended for placing help buttons and section specific settings code example to use this feature, first create a section button cm sectionbutton b(icon=icon("facelift2023/options"), tooltip=$ceilingsettings, callback=f(control ) { if (!autocrashing) showceilingprops(anyframewindow, getspacefloor(activespace())); }); then add it to the section's limb cm librarylimb ceilings( , buttons=\[b]); cm container librarylimb ceilings( , buttons=\[b]) { // snapper limbs go here } content with product and tool buttons this applies to other components under section header titles as well such as toggles, dropdowns, checkboxes, etc bottom note the 16px space includes the top line of the next section subsection subsections are introduced to provide an additional level of nesting to help organize the contents within a section in a more logical manner nested sections are not allowed code to use these, just add a subsectionlimb as a parent to your existing snapperlimbs header title content with product and tool buttons multiple subsections within 1 section subsection label subsection labels are an additional level below subsections for further organizing the contents title content with product and tool buttons with input fields