@flytedan/flytebot-design-system 0.2.0 → 0.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flytedan/flytebot-design-system",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "flytedesk Design System — shared component library, tokens, and business-logic kits for flytedesk apps.",
   "type": "module",
   "license": "UNLICENSED",

package/styles/components.css

@@ -197,6 +197,12 @@
 /* ============ Segmented control ============ */
 .fd-seg {
   display: inline-flex;
+  /* .fd-seg is already inline-flex to hug its own content, but any flex-column
+     parent with the default align-items:stretch (e.g. .fd-pop) overrides that by
+     stretching this as a flex ITEM — align-self pins it back to content width
+     regardless of the ambient container, so it never silently goes full-width
+     just because it's dropped inside a popover/panel. */
+  align-self: flex-start;
   background: var(--surface-2);
   border: 1px solid var(--border);
   border-radius: var(--r-md);
@@ -2020,9 +2026,9 @@
 }
 .fd-brand {
   display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 5px;
+  flex-direction: row;
+  align-items: center;
+  gap: 10px;
 }
 .fd-brand-mark {
   display: inline-flex;
@@ -2030,20 +2036,21 @@
   line-height: 0;
   background: #fff;
   border-radius: var(--r-sm);
-  padding: 3px 7px;
+  padding: 4px 8px;
+  flex: none;
 }
 .fd-brand-mark img {
   display: block;
-  height: 20px;
+  height: 26px;
   width: auto;
 }
 .fd-brand-sm .fd-brand-mark img,
 .fd-brand-mark-sm img {
-  height: 15px;
+  height: 19px;
 }
 .fd-brand-lg .fd-brand-mark img,
 .fd-brand-mark-lg img {
-  height: 26px;
+  height: 32px;
 }
 .fd-topbar {
   height: var(--topbar-h);
@@ -4059,7 +4066,7 @@
 
 /* --- menus (extends .fd-pop / .fd-opt) ----------------------------------- */
 .fd-pop-padded {
-  padding: 12px;
+  padding: var(--s-16);
 }
 .fd-menu {
   outline: none;