diff --git a/packages/bbui/src/Drawer/Drawer.svelte b/packages/bbui/src/Drawer/Drawer.svelte
index 43729cd794..932236bc0c 100644
--- a/packages/bbui/src/Drawer/Drawer.svelte
+++ b/packages/bbui/src/Drawer/Drawer.svelte
@@ -7,7 +7,7 @@
   export let title
   export let fillWidth
   export let left = "314px"
-  export let width = "calc(100% - 576px)"
+  export let width = "calc(100% - 626px)"
 
   let visible = false
 
diff --git a/packages/builder/src/components/design/Panel.svelte b/packages/builder/src/components/design/Panel.svelte
index 6c8753a99e..dbf42c51a5 100644
--- a/packages/builder/src/components/design/Panel.svelte
+++ b/packages/builder/src/components/design/Panel.svelte
@@ -3,7 +3,6 @@
 
   export let title
   export let icon
-  export let expandable = false
   export let showAddButton = false
   export let showBackButton = false
   export let showCloseButton = false
@@ -12,8 +11,8 @@
   export let onClickCloseButton
   export let borderLeft = false
   export let borderRight = false
+  export let wide = false
 
-  let wide = false
   $: customHeaderContent = $$slots["panel-header-content"]
 </script>
 
@@ -28,13 +27,6 @@
     <div class="title">
       <Heading size="XXS">{title || ""}</Heading>
     </div>
-    {#if expandable}
-      <Icon
-        name={wide ? "Minimize" : "Maximize"}
-        hoverable
-        on:click={() => (wide = !wide)}
-      />
-    {/if}
     {#if showAddButton}
       <div class="add-button" on:click={onClickAddButton}>
         <Icon name="Add" />
@@ -74,8 +66,8 @@
     border-right: var(--border-light);
   }
   .panel.wide {
-    width: 420px;
-    flex: 0 0 420px;
+    width: 310px;
+    flex: 0 0 310px;
   }
   .header {
     flex: 0 0 48px;
diff --git a/packages/builder/src/components/design/settings/controls/PropertyControl.svelte b/packages/builder/src/components/design/settings/controls/PropertyControl.svelte
index ab448b850c..35e77215ee 100644
--- a/packages/builder/src/components/design/settings/controls/PropertyControl.svelte
+++ b/packages/builder/src/components/design/settings/controls/PropertyControl.svelte
@@ -74,11 +74,13 @@
   })
 </script>
 
-<div class="property-control" class:highlighted={highlighted && nullishValue}>
-  {#if type !== "boolean" && label}
-    <div class="label">
-      <Label>{label}</Label>
-    </div>
+<div
+  class="property-control"
+  class:wide={!label}
+  class:highlighted={highlighted && nullishValue}
+>
+  {#if label}
+    <Label size="M">{label}</Label>
   {/if}
   <div id={`${key}-prop-control`} class="control">
     <svelte:component
@@ -90,7 +92,6 @@
       onChange={handleChange}
       bindings={allBindings}
       name={key}
-      text={label}
       {nested}
       {key}
       {type}
@@ -105,28 +106,34 @@
 <style>
   .property-control {
     position: relative;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: stretch;
+    display: grid;
+    grid-template-columns: 90px 1fr;
+    align-items: center;
     transition: background 130ms ease-out, border-color 130ms ease-out;
     border-left: 4px solid transparent;
-    margin: -6px calc(-1 * var(--spacing-xl));
-    padding: 6px var(--spacing-xl) 6px calc(var(--spacing-xl) - 4px);
+    margin: 0 calc(-1 * var(--spacing-xl));
+    padding: 0 var(--spacing-xl) 0 calc(var(--spacing-xl) - 4px);
+    gap: 8px;
+  }
+  .property-control :global(.spectrum-FieldLabel) {
+    white-space: normal;
   }
   .property-control.highlighted {
     background: var(--spectrum-global-color-gray-300);
     border-color: var(--spectrum-global-color-blue-400);
   }
-  .label {
-    padding-bottom: var(--spectrum-global-dimension-size-65);
-  }
   .control {
     position: relative;
   }
+  .property-control.wide .control {
+    grid-column: 1 / -1;
+  }
   .text {
-    margin-top: var(--spectrum-global-dimension-size-65);
     font-size: var(--spectrum-global-dimension-font-size-75);
     color: var(--grey-6);
+    grid-column: 2 / 2;
+  }
+  .property-control.wide .text {
+    grid-column: 1 / -1;
   }
 </style>
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsPanel.svelte
index 1e889ffe93..2ff605cc77 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsPanel.svelte
@@ -37,7 +37,7 @@
 
 {#if $selectedComponent}
   {#key $selectedComponent._id}
-    <Panel {title} icon={componentDefinition?.icon} borderLeft>
+    <Panel {title} icon={componentDefinition?.icon} borderLeft wide>
       <span slot="panel-header-content">
         <div class="settings-tabs">
           {#each tabs as tab}
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsSection.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsSection.svelte
index 21bed847f5..c21094c7f2 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsSection.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/ComponentSettingsSection.svelte
@@ -117,49 +117,51 @@
 {#each sections as section, idx (section.name)}
   {#if section.visible}
     <DetailSummary name={section.name} collapsible={false}>
-      {#if idx === 0 && !componentInstance._component.endsWith("/layout") && !isScreen}
-        <PropertyControl
-          control={Input}
-          label="Name"
-          key="_instanceName"
-          value={componentInstance._instanceName}
-          onChange={val => updateSetting({ key: "_instanceName" }, val)}
-        />
-      {/if}
-      {#each section.settings as setting (setting.key)}
-        {#if setting.visible}
+      <div class="settings">
+        {#if idx === 0 && !componentInstance._component.endsWith("/layout") && !isScreen}
           <PropertyControl
-            type={setting.type}
-            control={getComponentForSetting(setting)}
-            label={setting.label}
-            key={setting.key}
-            value={componentInstance[setting.key]}
-            defaultValue={setting.defaultValue}
-            nested={setting.nested}
-            onChange={val => updateSetting(setting, val)}
-            highlighted={$store.highlightedSettingKey === setting.key}
-            info={setting.info}
-            props={{
-              // Generic settings
-              placeholder: setting.placeholder || null,
-
-              // Select settings
-              options: setting.options || [],
-
-              // Number fields
-              min: setting.min ?? null,
-              max: setting.max ?? null,
-            }}
-            {bindings}
-            {componentBindings}
-            {componentInstance}
-            {componentDefinition}
+            control={Input}
+            label="Name"
+            key="_instanceName"
+            value={componentInstance._instanceName}
+            onChange={val => updateSetting({ key: "_instanceName" }, val)}
           />
         {/if}
-      {/each}
-      {#if idx === 0 && componentDefinition?.component?.endsWith("/fieldgroup")}
-        <ResetFieldsButton {componentInstance} />
-      {/if}
+        {#each section.settings as setting (setting.key)}
+          {#if setting.visible}
+            <PropertyControl
+              type={setting.type}
+              control={getComponentForSetting(setting)}
+              label={setting.label}
+              key={setting.key}
+              value={componentInstance[setting.key]}
+              defaultValue={setting.defaultValue}
+              nested={setting.nested}
+              onChange={val => updateSetting(setting, val)}
+              highlighted={$store.highlightedSettingKey === setting.key}
+              info={setting.info}
+              props={{
+                // Generic settings
+                placeholder: setting.placeholder || null,
+
+                // Select settings
+                options: setting.options || [],
+
+                // Number fields
+                min: setting.min ?? null,
+                max: setting.max ?? null,
+              }}
+              {bindings}
+              {componentBindings}
+              {componentInstance}
+              {componentDefinition}
+            />
+          {/if}
+        {/each}
+        {#if idx === 0 && componentDefinition?.component?.endsWith("/fieldgroup")}
+          <ResetFieldsButton {componentInstance} />
+        {/if}
+      </div>
     </DetailSummary>
   {/if}
 {/each}
@@ -168,3 +170,13 @@
     <EjectBlockButton />
   </DetailSummary>
 {/if}
+
+<style>
+  .settings {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: stretch;
+    gap: 8px;
+  }
+</style>
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/DesignSection.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/DesignSection.svelte
index fa1a357f38..444ded7e1f 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/DesignSection.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/DesignSection.svelte
@@ -27,7 +27,6 @@
     <StyleSection
       {style}
       name={style.label}
-      columns={style.columns}
       properties={style.settings}
       {componentInstance}
       {bindings}
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/StyleSection.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/StyleSection.svelte
index e34ea1019a..4bd9ba539b 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/StyleSection.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/StyleSection.svelte
@@ -4,7 +4,6 @@
   import { store } from "builderStore"
 
   export let name
-  export let columns
   export let properties
   export let componentInstance
   export let bindings = []
@@ -34,27 +33,27 @@
 </script>
 
 <DetailSummary collapsible={false} name={`${name}${changed ? " *" : ""}`}>
-  <div class="group-content" style="grid-template-columns: {columns || '1fr'}">
+  <div class="styles">
     {#each properties as prop (`${componentInstance._id}-${prop.key}-${prop.label}`)}
-      <div style="grid-column: {prop.column || 'auto'}">
-        <PropertyControl
-          label={`${prop.label}${hasPropChanged(style, prop) ? " *" : ""}`}
-          control={prop.control}
-          key={prop.key}
-          value={style[prop.key]}
-          onChange={val => updateStyle(prop.key, val)}
-          props={getControlProps(prop)}
-          {bindings}
-        />
-      </div>
+      <PropertyControl
+        label={`${prop.label}${hasPropChanged(style, prop) ? " *" : ""}`}
+        control={prop.control}
+        key={prop.key}
+        value={style[prop.key]}
+        onChange={val => updateStyle(prop.key, val)}
+        props={getControlProps(prop)}
+        {bindings}
+      />
     {/each}
   </div>
 </DetailSummary>
 
 <style>
-  .group-content {
-    display: grid;
+  .styles {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
     align-items: stretch;
-    gap: var(--spacing-l);
+    gap: 8px;
   }
 </style>
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/componentStyles.js b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/componentStyles.js
index d4912241b3..7c65b6e6ec 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/componentStyles.js
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/settings/componentStyles.js
@@ -3,7 +3,6 @@ import ColorPicker from "components/design/settings/controls/ColorPicker.svelte"
 
 export const margin = {
   label: "Margin",
-  columns: "1fr 1fr",
   settings: [
     {
       label: "Top",
@@ -90,7 +89,6 @@ export const margin = {
 
 export const padding = {
   label: "Padding",
-  columns: "1fr 1fr",
   settings: [
     {
       label: "Top",
@@ -177,7 +175,6 @@ export const padding = {
 
 export const size = {
   label: "Size",
-  columns: "1fr 1fr",
   settings: [
     {
       label: "Width",
@@ -196,7 +193,6 @@ export const size = {
 
 export const background = {
   label: "Background",
-  columns: "auto 1fr",
   settings: [
     {
       label: "Color",
@@ -285,7 +281,6 @@ export const background = {
 
 export const border = {
   label: "Border",
-  columns: "1fr 1fr",
   settings: [
     {
       label: "Color",
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte
index 092e429515..6372ceeed0 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/new/_components/NewComponentPanel.svelte
@@ -1,22 +1,13 @@
 <script>
   import Panel from "components/design/Panel.svelte"
   import { goto } from "@roxi/routify"
-  import {
-    Layout,
-    ActionGroup,
-    ActionButton,
-    Search,
-    Icon,
-    Body,
-    notifications,
-  } from "@budibase/bbui"
+  import { Layout, Search, Icon, Body, notifications } from "@budibase/bbui"
   import structure from "./componentStructure.json"
   import { store, selectedComponent, selectedScreen } from "builderStore"
   import { onMount } from "svelte"
   import { fly } from "svelte/transition"
   import { findComponentPath } from "builderStore/componentUtils"
 
-  let section = "components"
   let searchString
   let searchRef
   let selectedIndex
@@ -37,7 +28,6 @@
     allowedComponents,
     searchString
   )
-  $: blocks = enrichedStructure.find(x => x.name === "Blocks").children
   $: orderMap = createComponentOrderMap(componentList)
 
   const getAllowedComponents = (allComponents, screen, component) => {
@@ -127,6 +117,11 @@
       }
     })
 
+    // Swap blocks and plugins
+    let tmp = enrichedStructure[1]
+    enrichedStructure[1] = enrichedStructure[0]
+    enrichedStructure[0] = tmp
+
     return enrichedStructure
   }
 
@@ -137,11 +132,6 @@
       return []
     }
 
-    // Remove blocks if there is no search string
-    if (!search) {
-      structure = structure.filter(category => category.name !== "Blocks")
-    }
-
     // Return only items which match the search string
     let filteredStructure = []
     structure.forEach(category => {
@@ -225,6 +215,7 @@
     showCloseButton
     onClickCloseButton={() => $goto("../")}
     borderLeft
+    wide
   >
     <Layout paddingX="L" paddingY="XL" gap="S">
       <Search
@@ -233,64 +224,31 @@
         on:change={e => (searchString = e.detail)}
         bind:inputRef={searchRef}
       />
-      {#if !searchString}
-        <ActionGroup compact justified>
-          <ActionButton
-            fullWidth
-            selected={section === "components"}
-            on:click={() => (section = "components")}>Components</ActionButton
-          >
-          <ActionButton
-            fullWidth
-            selected={section === "blocks"}
-            on:click={() => (section = "blocks")}>Blocks</ActionButton
-          >
-        </ActionGroup>
-      {/if}
-      {#if searchString || section === "components"}
-        {#if filteredStructure.length}
-          {#each filteredStructure as category}
-            <Layout noPadding gap="XS">
-              <div class="category-label">{category.name}</div>
-              {#each category.children as component}
-                <div
-                  draggable="true"
-                  on:dragstart={() => onDragStart(component.component)}
-                  on:dragend={onDragEnd}
-                  class="component"
-                  class:selected={selectedIndex ===
-                    orderMap[component.component]}
-                  on:click={() => addComponent(component.component)}
-                  on:mouseover={() => (selectedIndex = null)}
-                  on:focus
-                >
-                  <Icon name={component.icon} />
-                  <Body size="XS">{component.name}</Body>
-                </div>
-              {/each}
-            </Layout>
-          {/each}
-        {:else}
-          <Body size="S">
-            There aren't any components matching the current filter
-          </Body>
-        {/if}
+      {#if filteredStructure.length}
+        {#each filteredStructure as category}
+          <Layout noPadding gap="XS">
+            <div class="category-label">{category.name}</div>
+            {#each category.children as component}
+              <div
+                draggable="true"
+                on:dragstart={() => onDragStart(component.component)}
+                on:dragend={onDragEnd}
+                class="component"
+                class:selected={selectedIndex === orderMap[component.component]}
+                on:click={() => addComponent(component.component)}
+                on:mouseover={() => (selectedIndex = null)}
+                on:focus
+              >
+                <Icon name={component.icon} />
+                <Body size="XS">{component.name}</Body>
+              </div>
+            {/each}
+          </Layout>
+        {/each}
       {:else}
-        <Body size="S">Blocks are collections of pre-built components</Body>
-        <Layout noPadding gap="XS">
-          {#each blocks as block}
-            <div
-              draggable="true"
-              class="component"
-              on:click={() => addComponent(block.component)}
-              on:dragstart={() => onDragStart(block.component)}
-              on:dragend={onDragEnd}
-            >
-              <Icon name={block.icon} />
-              <Body size="XS">{block.name}</Body>
-            </div>
-          {/each}
-        </Layout>
+        <Body size="S">
+          There aren't any components matching the current filter
+        </Body>
       {/if}
     </Layout>
   </Panel>
diff --git a/packages/client/manifest.json b/packages/client/manifest.json
index 0ac7f6808f..f3c9964755 100644
--- a/packages/client/manifest.json
+++ b/packages/client/manifest.json
@@ -103,7 +103,7 @@
       },
       {
         "type": "select",
-        "label": "Horiz. Align",
+        "label": "Horiz. align",
         "key": "hAlign",
         "showInBar": true,
         "barStyle": "buttons",
@@ -137,7 +137,7 @@
       },
       {
         "type": "select",
-        "label": "Vert. Align",
+        "label": "Vert. align",
         "key": "vAlign",
         "showInBar": true,
         "barStyle": "buttons",
@@ -227,7 +227,7 @@
       },
       {
         "type": "event",
-        "label": "On Click",
+        "label": "On click",
         "key": "onClick"
       }
     ]
@@ -297,7 +297,7 @@
             "value": "warning"
           },
           {
-            "label": "Over Background",
+            "label": "Over background",
             "value": "overBackground"
           }
         ],
@@ -347,7 +347,7 @@
       },
       {
         "type": "event",
-        "label": "On Click",
+        "label": "On click",
         "key": "onClick"
       }
     ]
@@ -408,7 +408,7 @@
       },
       {
         "type": "text",
-        "label": "Empty Text",
+        "label": "Empty text",
         "key": "noRowsMessage",
         "defaultValue": "No rows found"
       },
@@ -436,7 +436,7 @@
       },
       {
         "type": "select",
-        "label": "Horiz. Align",
+        "label": "Horiz. align",
         "key": "hAlign",
         "showInBar": true,
         "barStyle": "buttons",
@@ -470,7 +470,7 @@
       },
       {
         "type": "select",
-        "label": "Vert. Align",
+        "label": "Vert. align",
         "key": "vAlign",
         "showInBar": true,
         "barStyle": "buttons",
@@ -537,7 +537,7 @@
         "type": "static",
         "values": [
           {
-            "label": "Row Index",
+            "label": "Row index",
             "key": "index",
             "type": "number"
           }
@@ -599,7 +599,7 @@
       },
       {
         "type": "text",
-        "label": "Link Text",
+        "label": "Link text",
         "key": "linkText"
       },
       {
@@ -610,26 +610,26 @@
       },
       {
         "type": "color",
-        "label": "Link Color",
+        "label": "Link color",
         "key": "linkColor",
         "defaultValue": "#000"
       },
       {
         "type": "color",
-        "label": "Hover Color",
+        "label": "Hover color",
         "key": "linkHoverColor",
         "defaultValue": "#222"
       },
       {
         "type": "select",
-        "label": "Image Height",
+        "label": "Image height",
         "key": "imageHeight",
         "options": ["auto", "12rem", "16rem", "20rem", "24rem"],
         "defaultValue": "auto"
       },
       {
         "type": "select",
-        "label": "Card Width",
+        "label": "Card width",
         "key": "cardWidth",
         "options": ["16rem", "20rem", "24rem"],
         "defaultValue": "20rem"
@@ -661,7 +661,7 @@
         "barStyle": "picker",
         "options": [
           {
-            "label": "Extra Small",
+            "label": "Extra small",
             "value": "XS"
           },
           {
@@ -677,7 +677,7 @@
             "value": "L"
           },
           {
-            "label": "Extra Large",
+            "label": "Extra large",
             "value": "XL"
           },
           {
@@ -784,7 +784,7 @@
         "barStyle": "picker",
         "options": [
           {
-            "label": "Extra Small",
+            "label": "Extra amall",
             "value": "XS"
           },
           {
@@ -800,7 +800,7 @@
             "value": "L"
           },
           {
-            "label": "Extra Large",
+            "label": "Extra large",
             "value": "XL"
           },
           {
@@ -925,12 +925,12 @@
       },
       {
         "type": "boolean",
-        "label": "Show delete icon",
+        "label": "Allow delete",
         "key": "closable"
       },
       {
         "type": "event",
-        "label": "On click delete icon",
+        "label": "On click delete",
         "key": "onClick",
         "dependsOn": "closable"
       }
@@ -978,7 +978,7 @@
         "defaultValue": "center center",
         "options": [
           {
-            "label": "Center Top",
+            "label": "Center top",
             "value": "center top"
           },
           {
@@ -986,31 +986,31 @@
             "value": "center center"
           },
           {
-            "label": "Center Bottom",
+            "label": "Center bottom",
             "value": "center bottom"
           },
           {
-            "label": "Left Top",
+            "label": "Left top",
             "value": "left top"
           },
           {
-            "label": "Left Center",
+            "label": "Left center",
             "value": "left center"
           },
           {
-            "label": "Left Bottom",
+            "label": "Left bottom",
             "value": "left bottom"
           },
           {
-            "label": "Right Top",
+            "label": "Right top",
             "value": "right top"
           },
           {
-            "label": "Right Center",
+            "label": "Right center",
             "value": "right center"
           },
           {
-            "label": "Right Bottom",
+            "label": "Right bottom",
             "value": "right bottom"
           }
         ]
@@ -1107,7 +1107,7 @@
       },
       {
         "type": "event",
-        "label": "On Click",
+        "label": "On click",
         "key": "onClick"
       }
     ]
@@ -1156,7 +1156,7 @@
       },
       {
         "type": "boolean",
-        "label": "New Tab",
+        "label": "New tab",
         "key": "openInNewTab"
       },
       {
@@ -1278,7 +1278,7 @@
       },
       {
         "type": "text",
-        "label": "Link Text",
+        "label": "Link text",
         "key": "linkText"
       },
       {
@@ -1289,19 +1289,19 @@
       },
       {
         "type": "color",
-        "label": "Link Color",
+        "label": "Link color",
         "key": "linkColor",
         "defaultValue": "#000"
       },
       {
         "type": "color",
-        "label": "Hover Color",
+        "label": "Hover color",
         "key": "linkHoverColor",
         "defaultValue": "#222"
       },
       {
         "type": "select",
-        "label": "Card Width",
+        "label": "Card width",
         "key": "cardWidth",
         "options": [
           "24rem",
@@ -1316,14 +1316,14 @@
       },
       {
         "type": "select",
-        "label": "Image Width",
+        "label": "Image width",
         "key": "imageWidth",
         "options": ["auto", "8rem", "12rem", "16rem"],
         "defaultValue": "8rem"
       },
       {
         "type": "select",
-        "label": "Image Height",
+        "label": "Image height",
         "key": "imageHeight",
         "options": ["auto", "8rem", "12rem", "16rem", "auto"],
         "defaultValue": "auto"
@@ -1402,14 +1402,14 @@
       },
       {
         "type": "field",
-        "label": "Label Col.",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "multifield",
-        "label": "Data Cols.",
+        "label": "Data columns",
         "key": "valueColumns",
         "dependsOn": "dataProvider",
         "required": true
@@ -1423,12 +1423,12 @@
       },
       {
         "type": "text",
-        "label": "Y Axis Label",
+        "label": "Y axis label",
         "key": "yAxisLabel"
       },
       {
         "type": "text",
-        "label": "X Axis Label",
+        "label": "X axis label",
         "key": "xAxisLabel"
       },
       {
@@ -1520,7 +1520,7 @@
       },
       {
         "type": "boolean",
-        "label": "Data Labels",
+        "label": "Data labels",
         "key": "dataLabels",
         "defaultValue": false
       },
@@ -1560,14 +1560,14 @@
       },
       {
         "type": "field",
-        "label": "Label Col.",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "multifield",
-        "label": "Data Cols.",
+        "label": "Data columns",
         "key": "valueColumns",
         "dependsOn": "dataProvider",
         "required": true
@@ -1581,12 +1581,12 @@
       },
       {
         "type": "text",
-        "label": "Y Axis Label",
+        "label": "Y axis label",
         "key": "yAxisLabel"
       },
       {
         "type": "text",
-        "label": "X Axis Label",
+        "label": "X axis label",
         "key": "xAxisLabel"
       },
       {
@@ -1673,7 +1673,7 @@
       },
       {
         "type": "boolean",
-        "label": "Data Labels",
+        "label": "Data labels",
         "key": "dataLabels",
         "defaultValue": false
       },
@@ -1713,14 +1713,14 @@
       },
       {
         "type": "field",
-        "label": "Label Col.",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "multifield",
-        "label": "Data Cols.",
+        "label": "Data columns",
         "key": "valueColumns",
         "dependsOn": "dataProvider",
         "required": true
@@ -1734,12 +1734,12 @@
       },
       {
         "type": "text",
-        "label": "Y Axis Label",
+        "label": "Y axis label",
         "key": "yAxisLabel"
       },
       {
         "type": "text",
-        "label": "X Axis Label",
+        "label": "X axis label",
         "key": "xAxisLabel"
       },
       {
@@ -1826,7 +1826,7 @@
       },
       {
         "type": "boolean",
-        "label": "Data Labels",
+        "label": "Data labels",
         "key": "dataLabels",
         "defaultValue": false
       },
@@ -1878,14 +1878,14 @@
       },
       {
         "type": "field",
-        "label": "Label Col.",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "field",
-        "label": "Data Col.",
+        "label": "Data columns",
         "key": "valueColumn",
         "dependsOn": "dataProvider",
         "required": true
@@ -1967,7 +1967,7 @@
       },
       {
         "type": "boolean",
-        "label": "Data Labels",
+        "label": "Data labels",
         "key": "dataLabels",
         "defaultValue": false
       },
@@ -2007,14 +2007,14 @@
       },
       {
         "type": "field",
-        "label": "Label Col.",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "field",
-        "label": "Data Col.",
+        "label": "Data columns",
         "key": "valueColumn",
         "dependsOn": "dataProvider",
         "required": true
@@ -2096,7 +2096,7 @@
       },
       {
         "type": "boolean",
-        "label": "Data Labels",
+        "label": "Data labels",
         "key": "dataLabels",
         "defaultValue": false
       },
@@ -2136,35 +2136,35 @@
       },
       {
         "type": "field",
-        "label": "Date Col.",
+        "label": "Date column",
         "key": "dateColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "field",
-        "label": "Open Col.",
+        "label": "Open column",
         "key": "openColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "field",
-        "label": "Close Col.",
+        "label": "Close column",
         "key": "closeColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "field",
-        "label": "High Col.",
+        "label": "High column",
         "key": "highColumn",
         "dependsOn": "dataProvider",
         "required": true
       },
       {
         "type": "field",
-        "label": "Low Col.",
+        "label": "Low column",
         "key": "lowColumn",
         "dependsOn": "dataProvider",
         "required": true
@@ -2178,12 +2178,12 @@
       },
       {
         "type": "text",
-        "label": "Y Axis Label",
+        "label": "Y axis label",
         "key": "yAxisLabel"
       },
       {
         "type": "text",
-        "label": "X Axis Label",
+        "label": "X axis label",
         "key": "xAxisLabel"
       },
       {
@@ -2378,7 +2378,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -2467,7 +2467,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -2522,7 +2522,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -2573,7 +2573,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -2636,7 +2636,7 @@
       },
       {
         "type": "boolean",
-        "label": "Sort in alphabetical order",
+        "label": "Alphabetical",
         "key": "sort",
         "defaultValue": true
       },
@@ -2669,7 +2669,7 @@
       },
       {
         "type": "dataProvider",
-        "label": "Options Provider",
+        "label": "Options provider",
         "key": "dataProvider",
         "required": true,
         "dependsOn": {
@@ -2679,7 +2679,7 @@
       },
       {
         "type": "field",
-        "label": "Label Column",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": {
           "setting": "optionsSource",
@@ -2688,7 +2688,7 @@
       },
       {
         "type": "field",
-        "label": "Value Column",
+        "label": "Value column",
         "key": "valueColumn",
         "dependsOn": {
           "setting": "optionsSource",
@@ -2744,7 +2744,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -2829,7 +2829,7 @@
       },
       {
         "type": "dataProvider",
-        "label": "Options Provider",
+        "label": "Options provider",
         "key": "dataProvider",
         "required": true,
         "dependsOn": {
@@ -2839,7 +2839,7 @@
       },
       {
         "type": "field",
-        "label": "Label Column",
+        "label": "Label column",
         "key": "labelColumn",
         "dependsOn": {
           "setting": "optionsSource",
@@ -2848,7 +2848,7 @@
       },
       {
         "type": "field",
-        "label": "Value Column",
+        "label": "Value column",
         "key": "valueColumn",
         "dependsOn": {
           "setting": "optionsSource",
@@ -2926,7 +2926,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -2982,7 +2982,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -3065,7 +3065,7 @@
       },
       {
         "type": "boolean",
-        "label": "24-Hour time",
+        "label": "24-hour time",
         "key": "time24hr",
         "defaultValue": false
       },
@@ -3082,7 +3082,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -3142,7 +3142,7 @@
       },
       {
         "type": "boolean",
-        "label": "Allow manual entry",
+        "label": "Manual entry",
         "key": "allowManualEntry",
         "defaultValue": false
       },
@@ -3170,25 +3170,25 @@
       },
       {
         "type": "field",
-        "label": "Latitude Key",
+        "label": "Latitude key",
         "key": "latitudeKey",
         "dependsOn": "dataProvider"
       },
       {
         "type": "field",
-        "label": "Longitude Key",
+        "label": "Longitude key",
         "key": "longitudeKey",
         "dependsOn": "dataProvider"
       },
       {
         "type": "field",
-        "label": "Title Key",
+        "label": "Title key",
         "key": "titleKey",
         "dependsOn": "dataProvider"
       },
       {
         "type": "event",
-        "label": "On Click Marker",
+        "label": "On click marker",
         "key": "onClickMarker",
         "context": [
           {
@@ -3199,13 +3199,13 @@
       },
       {
         "type": "boolean",
-        "label": "Enable creating markers",
+        "label": "Enable adding",
         "key": "creationEnabled",
         "defaultValue": false
       },
       {
         "type": "event",
-        "label": "On Create Marker",
+        "label": "On create marker",
         "key": "onCreateMarker",
         "dependsOn": "creationEnabled",
         "context": [
@@ -3245,13 +3245,13 @@
       },
       {
         "type": "text",
-        "label": "Default Location (when empty)",
+        "label": "Default location",
         "key": "defaultLocation",
         "placeholder": "51.5072,-0.1276"
       },
       {
         "type": "number",
-        "label": "Default Location Zoom Level (0-100)",
+        "label": "Default zoom (0-100)",
         "key": "zoomLevel",
         "placeholder": 50,
         "max": 100,
@@ -3259,7 +3259,7 @@
       },
       {
         "type": "text",
-        "label": "Map Attribution",
+        "label": "Map attribution",
         "key": "mapAttribution",
         "defaultValue": "OpenStreetMap contributors"
       }
@@ -3293,13 +3293,13 @@
       },
       {
         "type": "number",
-        "label": "No. of attachment",
+        "label": "Max attachments",
         "key": "maximum",
         "min": 1
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -3360,7 +3360,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -3421,7 +3421,7 @@
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -3461,7 +3461,7 @@
       },
       {
         "type": "dataSource/s3",
-        "label": "S3 Datasource",
+        "label": "S3 datasource",
         "key": "datasourceId",
         "info": "This component can't be used with S3 datasources that use custom endpoints"
       },
@@ -3472,12 +3472,12 @@
       },
       {
         "type": "text",
-        "label": "File Name",
+        "label": "File name",
         "key": "key"
       },
       {
         "type": "event",
-        "label": "On Change",
+        "label": "On change",
         "key": "onChange",
         "context": [
           {
@@ -3523,12 +3523,12 @@
       },
       {
         "type": "field/sortable",
-        "label": "Sort Column",
+        "label": "Sort column",
         "key": "sortColumn"
       },
       {
         "type": "select",
-        "label": "Sort Order",
+        "label": "Sort order",
         "key": "sortOrder",
         "options": ["Ascending", "Descending"],
         "defaultValue": "Ascending"
@@ -3636,7 +3636,7 @@
       },
       {
         "type": "boolean",
-        "label": "Allow row selection",
+        "label": "Row selection",
         "key": "allowSelectRows",
         "defaultValue": false,
         "info": "Row selection is only compatible with internal or SQL tables"
@@ -3741,7 +3741,7 @@
       {
         "type": "boolean",
         "key": "linkPeek",
-        "label": "Open link in modal"
+        "label": "Open in modal"
       },
       {
         "type": "boolean",
@@ -3750,7 +3750,7 @@
       },
       {
         "type": "boolean",
-        "label": "Use button for click action",
+        "label": "Show button",
         "key": "showButton"
       },
       {
@@ -3821,7 +3821,7 @@
     "settings": [
       {
         "type": "select",
-        "label": "Chart Type",
+        "label": "Chart type",
         "key": "chartType",
         "required": true,
         "options": [
@@ -3870,12 +3870,12 @@
       },
       {
         "type": "field",
-        "label": "Sort Column",
+        "label": "Sort column",
         "key": "sortColumn"
       },
       {
         "type": "select",
-        "label": "Sort Order",
+        "label": "Sort order",
         "key": "sortOrder",
         "options": ["Ascending", "Descending"],
         "defaultValue": "Ascending"
@@ -3963,7 +3963,7 @@
       },
       {
         "type": "boolean",
-        "label": "Data Labels",
+        "label": "Data labels",
         "key": "dataLabels",
         "defaultValue": false
       },
@@ -3990,14 +3990,14 @@
         "settings": [
           {
             "type": "field",
-            "label": "Label Col.",
+            "label": "Label column",
             "key": "labelColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "field",
-            "label": "Data Col.",
+            "label": "Data column",
             "key": "valueColumn",
             "dependsOn": "dataSource",
             "required": true
@@ -4015,14 +4015,14 @@
         "settings": [
           {
             "type": "field",
-            "label": "Label Col.",
+            "label": "Label column",
             "key": "labelColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "field",
-            "label": "Data Col.",
+            "label": "Data column",
             "key": "valueColumn",
             "dependsOn": "dataSource",
             "required": true
@@ -4040,14 +4040,14 @@
         "settings": [
           {
             "type": "field",
-            "label": "Label Col.",
+            "label": "Label column",
             "key": "labelColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "multifield",
-            "label": "Data Cols.",
+            "label": "Data columns",
             "key": "valueColumns",
             "dependsOn": "dataSource",
             "required": true
@@ -4061,12 +4061,12 @@
           },
           {
             "type": "text",
-            "label": "Y Axis Label",
+            "label": "Y axis label",
             "key": "yAxisLabel"
           },
           {
             "type": "text",
-            "label": "X Axis Label",
+            "label": "X axis label",
             "key": "xAxisLabel"
           },
           {
@@ -4094,14 +4094,14 @@
         "settings": [
           {
             "type": "field",
-            "label": "Label Col.",
+            "label": "Label column",
             "key": "labelColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "multifield",
-            "label": "Data Cols.",
+            "label": "Data columns",
             "key": "valueColumns",
             "dependsOn": "dataSource",
             "required": true
@@ -4115,12 +4115,12 @@
           },
           {
             "type": "text",
-            "label": "Y Axis Label",
+            "label": "Y axis label",
             "key": "yAxisLabel"
           },
           {
             "type": "text",
-            "label": "X Axis Label",
+            "label": "X axis label",
             "key": "xAxisLabel"
           },
           {
@@ -4143,14 +4143,14 @@
         "settings": [
           {
             "type": "field",
-            "label": "Label Col.",
+            "label": "Label columns",
             "key": "labelColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "multifield",
-            "label": "Data Cols.",
+            "label": "Data columns",
             "key": "valueColumns",
             "dependsOn": "dataSource",
             "required": true
@@ -4164,12 +4164,12 @@
           },
           {
             "type": "text",
-            "label": "Y Axis Label",
+            "label": "Y axis label",
             "key": "yAxisLabel"
           },
           {
             "type": "text",
-            "label": "X Axis Label",
+            "label": "X axis label",
             "key": "xAxisLabel"
           },
           {
@@ -4204,35 +4204,35 @@
         "settings": [
           {
             "type": "field",
-            "label": "Date Col.",
+            "label": "Date column",
             "key": "dateColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "field",
-            "label": "Open Col.",
+            "label": "Open column",
             "key": "openColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "field",
-            "label": "Close Col.",
+            "label": "Close column",
             "key": "closeColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "field",
-            "label": "High Col.",
+            "label": "High column",
             "key": "highColumn",
             "dependsOn": "dataSource",
             "required": true
           },
           {
             "type": "field",
-            "label": "Low Col.",
+            "label": "Low column",
             "key": "lowColumn",
             "dependsOn": "dataSource",
             "required": true
@@ -4246,12 +4246,12 @@
           },
           {
             "type": "text",
-            "label": "Y Axis Label",
+            "label": "Y axis label",
             "key": "yAxisLabel"
           },
           {
             "type": "text",
-            "label": "X Axis Label",
+            "label": "X axis label",
             "key": "xAxisLabel"
           }
         ]
@@ -4285,7 +4285,7 @@
           },
           {
             "type": "columns",
-            "label": "Table Columns",
+            "label": "Columns",
             "key": "tableColumns",
             "dependsOn": "dataSource",
             "placeholder": "All columns",
@@ -4293,12 +4293,12 @@
           },
           {
             "type": "field/sortable",
-            "label": "Sort By",
+            "label": "Sort by",
             "key": "sortColumn"
           },
           {
             "type": "select",
-            "label": "Sort Order",
+            "label": "Sort order",
             "key": "sortOrder",
             "options": ["Ascending", "Descending"],
             "defaultValue": "Ascending"
@@ -4321,7 +4321,7 @@
           },
           {
             "type": "number",
-            "label": "Scroll Limit",
+            "label": "Scroll limit",
             "key": "rowCount",
             "defaultValue": 8
           },
@@ -4343,7 +4343,7 @@
           },
           {
             "type": "boolean",
-            "label": "Allow row selection",
+            "label": "Row selection",
             "key": "allowSelectRows",
             "info": "Row selection is only compatible with internal or SQL tables"
           },
@@ -4355,10 +4355,10 @@
           },
           {
             "type": "searchfield",
-            "label": "Search Fields",
+            "label": "Search fields",
             "key": "searchColumns",
             "placeholder": "Choose search fields",
-            "info": "Only the first 5 search fields will be used"
+            "info": "Only the first 5 fields will be used"
           }
         ]
       },
@@ -4407,7 +4407,7 @@
           {
             "type": "boolean",
             "key": "showTitleButton",
-            "label": "Show button above table",
+            "label": "Show button",
             "defaultValue": false
           },
           {
@@ -4420,7 +4420,7 @@
           {
             "type": "radio",
             "key": "titleButtonClickBehaviour",
-            "label": "On Click",
+            "label": "Click behaviour",
             "dependsOn": "showTitleButton",
             "defaultValue": "actions",
             "info": "New row side panel is only compatible with internal or SQL tables",
@@ -4436,6 +4436,7 @@
             ]
           },
           {
+            "label": "On click",
             "type": "event",
             "key": "onClickTitleButton",
             "nested": true,
@@ -4471,10 +4472,10 @@
       },
       {
         "type": "searchfield",
-        "label": "Search Columns",
+        "label": "Search columns",
         "key": "searchColumns",
         "placeholder": "Choose search columns",
-        "info": "Only the first 5 search columns will be used"
+        "info": "Max 5 columns will be used"
       },
       {
         "type": "filter",
@@ -4484,12 +4485,12 @@
       },
       {
         "type": "field/sortable",
-        "label": "Sort Column",
+        "label": "Sort column",
         "key": "sortColumn"
       },
       {
         "type": "select",
-        "label": "Sort Order",
+        "label": "Sort order",
         "key": "sortOrder",
         "options": ["Ascending", "Descending"],
         "defaultValue": "Descending"
@@ -4544,7 +4545,7 @@
           {
             "type": "boolean",
             "key": "cardPeek",
-            "label": "Open link in modal"
+            "label": "Open in modal"
           },
           {
             "type": "url",
@@ -4559,7 +4560,7 @@
           },
           {
             "type": "boolean",
-            "label": "Use button for click action",
+            "label": "Add button",
             "key": "showCardButton"
           },
           {
@@ -4584,11 +4585,11 @@
           {
             "type": "boolean",
             "key": "showTitleButton",
-            "label": "Show link button"
+            "label": "Show button"
           },
           {
             "type": "boolean",
-            "label": "Open link in modal",
+            "label": "Open in modal",
             "key": "titleButtonPeek"
           },
           {
@@ -4609,7 +4610,7 @@
         "settings": [
           {
             "type": "field",
-            "label": "ID column for linking (appended to URL)",
+            "label": "ID column",
             "key": "linkColumn",
             "placeholder": "Default"
           }
@@ -4646,12 +4647,12 @@
       },
       {
         "type": "field/sortable",
-        "label": "Sort Column",
+        "label": "Sort column",
         "key": "sortColumn"
       },
       {
         "type": "select",
-        "label": "Sort Order",
+        "label": "Sort order",
         "key": "sortOrder",
         "options": ["Ascending", "Descending"],
         "defaultValue": "Descending"
@@ -4673,7 +4674,7 @@
         "settings": [
           {
             "type": "text",
-            "label": "Empty Text",
+            "label": "Empty text",
             "key": "noRowsMessage",
             "defaultValue": "No rows found"
           },
@@ -4701,7 +4702,7 @@
           },
           {
             "type": "select",
-            "label": "Horiz. Align",
+            "label": "Horiz. align",
             "key": "hAlign",
             "showInBar": true,
             "barStyle": "buttons",
@@ -4735,7 +4736,7 @@
           },
           {
             "type": "select",
-            "label": "Vert. Align",
+            "label": "Vert. align",
             "key": "vAlign",
             "showInBar": true,
             "barStyle": "buttons",
@@ -4974,7 +4975,7 @@
           },
           {
             "type": "boolean",
-            "label": "Show delete button",
+            "label": "Allow delete",
             "key": "showDeleteButton",
             "defaultValue": false,
             "dependsOn": {
@@ -5043,7 +5044,7 @@
         "settings": [
           {
             "type": "field",
-            "label": "Search Field",
+            "label": "Search field",
             "key": "cardSearchField",
             "nested": true
           },
diff --git a/packages/client/src/components/context/DeviceBindingsProvider.svelte b/packages/client/src/components/context/DeviceBindingsProvider.svelte
index ba2d9c2dc9..bc0e2db093 100644
--- a/packages/client/src/components/context/DeviceBindingsProvider.svelte
+++ b/packages/client/src/components/context/DeviceBindingsProvider.svelte
@@ -4,7 +4,7 @@
 
   let width = window.innerWidth
   let height = window.innerHeight
-  const tabletBreakpoint = 768
+  const tabletBreakpoint = 720
   const desktopBreakpoint = 1280
   const resizeObserver = new ResizeObserver(entries => {
     if (entries?.[0]) {