Widget Environment

This page describes the environment your embedded application runs in and how to build it to display well in any slot.

Property	Current behaviour
Supported profiles	Deal, Company, Person, Space
Position	Configurable — placed between profile sections by the administrator
Size	Configurable — Small (240 px), Medium (380 px), or Large (520 px) height
Scroll	Determined by the embedded application's own layout
Multiple widgets	Supported — multiple plugins can be active simultaneously, each in its own slot

Responsive design recommendation

The plugin slot has a configurable height but its width adapts to the available space in the profile layout (for example, it narrows when a side panel opens). We strongly recommend building your embedded application with a fluid, responsive layout.

Support at minimum three width breakpoints:

Breakpoint	Width range	Notes
micro	< 260 px	tight spacing, small type
default	260–399 px	primary design target
wide	≥ 400 px	more breathing room

A simple starting point:

/* In your embedded app's root stylesheet */
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  box-sizing: border-box;
}

• Use width: 100% on your root container instead of a fixed pixel value.
• Avoid hardcoded breakpoints that assume a minimum width — the slot can be narrower than a typical desktop viewport.
• Use relative units (%, rem, vw where appropriate) for padding and font sizes.
• Test at widths starting from 260 px (micro breakpoint) to cover the most constrained scenarios.

This ensures the widget fills the available slot width cleanly regardless of how the profile is displayed.