@webority/theme 0.90.0 → 0.92.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/theme",
-  "version": "0.90.0",
+  "version": "0.92.0",
   "description": "Webority shared design system — Bootstrap 5.3 SCSS overrides, --wui-* tokens, and shared component CSS. The single source of brand chrome for React portals and Razor sites.",
   "license": "SEE LICENSE IN LICENSE",
   "publishConfig": {

package/scss/_tokens.scss

@@ -357,8 +357,12 @@
     --wui-fw-semibold: 600;
     /// meaning: Bold text weight.
     --wui-fw-bold: 700;
-    /// meaning: Tight line height, for headings and single-line labels.
-    --wui-lh-tight: 1.2;
+    /// meaning: Line height of headings.
+    --wui-lh-heading: #{$headings-line-height};
+    /// meaning: Line height of running text and of any text that is not a heading or display text.
+    --wui-lh-body: #{$line-height-base};
+    /// meaning: Line height of display-size text such as hero titles.
+    --wui-lh-display: #{$display-line-height};
 
     // Field (input/select/datepicker/…) radius — a flat 8px corner across every
     // size, for a crisp plain-rounded field (no squircle). Change here to restyle

package/scss/_variables.scss

@@ -213,14 +213,15 @@ $font-family-sans-serif: 'Webority Sans', 'Inter', -apple-system, BlinkMacSystem
 $font-family-display: 'Webority Serif', Cambria, Georgia, 'Times New Roman', 'Noto Serif', serif;
 $font-family-monospace: 'JetBrains Mono', SFMono-Regular, Menlo, Monaco, Consolas, monospace;
 
-$line-height-base: 1.55; // BS 1.5
+$line-height-base: 1.55; // leading.body (BS 1.5)
+$headings-line-height: 1.2; // leading.heading (BS 1.2)
 
 $headings-font-weight: 600; // BS 500
 $headings-letter-spacing: -0.02em;
 $headings-color: #071437;
 
 $display-font-weight: 500;
-$display-line-height: 1.05;
+$display-line-height: 1.05; // leading.display
 
 $h3-font-size: 1.5rem; // 24px (BS 1.75rem)
 $h4-font-size: 1.25rem; // 20px (BS 1.5rem)

package/scss/wui/_display.scss

@@ -400,13 +400,9 @@ a.info-row:hover .info-value {
     font-size: 12px;
     padding: 4px 12px 8px;
 }
-// Bordered variant draws dividers between neighbouring items instead of under each row.
+// Bordered variant draws a rule above every row after the first, across every column.
 .descs-bordered .descs-item {
-    border-bottom: none;
-    border-right: 1px solid var(--color-border);
-}
-.descs-bordered .descs-item:last-child {
-    border-right: none;
+    border-top: 1px solid var(--color-border);
 }
 // Column variants — set the grid-template-columns.
 .descs-col-1 .descs-list {
@@ -418,12 +414,26 @@ a.info-row:hover .info-value {
 .descs-col-3 .descs-list {
     --descs-cols: 3;
 }
+.descs-col-1.descs-bordered .descs-item:first-child {
+    border-top: none;
+}
+.descs-col-2.descs-bordered .descs-item:nth-child(-n + 2) {
+    border-top: none;
+}
+.descs-col-3.descs-bordered .descs-item:nth-child(-n + 3) {
+    border-top: none;
+}
 // Media-breakpoint collapse to single column under md.
 @include media-breakpoint-down(sm) {
     .descs-col-2 .descs-list,
     .descs-col-3 .descs-list {
         --descs-cols: 1;
     }
+    // One column here, so only the first item sits on the first row.
+    .descs-col-2.descs-bordered .descs-item:nth-child(n + 2),
+    .descs-col-3.descs-bordered .descs-item:nth-child(n + 2) {
+        border-top: 1px solid var(--color-border);
+    }
 }
 // Summary layout (React `layout="summary"`): one row per item, its label left and its value right.
 // Declared after the column variants so the single column wins on equal specificity.

package/token-meanings.json

@@ -208,7 +208,9 @@
     "--wui-info-active": "Info ink for icons and active states on light surfaces.",
     "--wui-info-text": "Info colour as text on light surfaces.",
     "--wui-ink": "Pure black ink, the highest-contrast text colour.",
-    "--wui-lh-tight": "Tight line height, for headings and single-line labels.",
+    "--wui-lh-body": "Line height of running text and of any text that is not a heading or display text.",
+    "--wui-lh-display": "Line height of display-size text such as hero titles.",
+    "--wui-lh-heading": "Line height of headings.",
     "--wui-neutral-bg-dark": "Muted background of table emphasis rows and mega-menu hover.",
     "--wui-neutral-bg-light": "Faint background for table emphasis and mega-menu hover.",
     "--wui-neutral-border-dark": "Border tone of table emphasis rows and dividers.",