@instructure/ui-themes 11.7.1 → 11.7.2-snapshot-1

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [11.7.2-snapshot-1](https://github.com/instructure/instructure-ui/compare/v11.7.1...v11.7.2-snapshot-1) (2026-03-20)
+
+**Note:** Version bump only for package @instructure/ui-themes
+
+
+
+
+
 ## [11.7.1](https://github.com/instructure/instructure-ui/compare/v11.7.0...v11.7.1) (2026-03-20)
 
 **Note:** Version bump only for package @instructure/ui-themes

package/es/themes/newThemes/dark/components/topNavBarActionItems.js

@@ -27,7 +27,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg
 };
 export default topNavBarActionItems;

package/es/themes/newThemes/dark/components/topNavBarItem.js

@@ -34,7 +34,6 @@ const topNavBarItem = {
   activeItemFontWeight: semantics.fontWeight.body.strong,
   activeItemIndicatorSpacing: semantics.spacing.spaceXs,
   activeIndicatorColor: semantics.color.text.inverse,
-  activeIndicatorColorInverse: semantics.color.text.base,
-  smallViewportFontSize: semantics.fontSize.textBase
+  activeIndicatorColorInverse: semantics.color.text.base
 };
 export default topNavBarItem;

package/es/themes/newThemes/dark/components/topNavBarLayout.js

@@ -55,6 +55,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 export default topNavBarLayout;

package/es/themes/newThemes/dark/components/topNavBarMenuItems.js

@@ -24,7 +24,6 @@
 import semantics from "../semantics.js";
 const topNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,

package/es/themes/newThemes/legacyCanvas/components/topNavBarActionItems.js

@@ -27,7 +27,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg
 };
 export default topNavBarActionItems;

package/es/themes/newThemes/legacyCanvas/components/topNavBarItem.js

@@ -24,7 +24,6 @@
 import semantics from "../semantics.js";
 const topNavBarItem = {
   fontSize: semantics.fontSize.textBase,
-  smallViewportFontSize: semantics.fontSize.textBase,
   fontFamily: semantics.fontFamily.base,
   fontWeight: semantics.fontWeight.body.base,
   color: semantics.color.text.inverse,

package/es/themes/newThemes/legacyCanvas/components/topNavBarLayout.js

@@ -55,6 +55,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 export default topNavBarLayout;

package/es/themes/newThemes/legacyCanvas/components/topNavBarMenuItems.js

@@ -27,7 +27,6 @@ const topNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionIndicatorColor: "currentColor"
 };
 export default topNavBarMenuItems;

package/es/themes/newThemes/legacyCanvasHighContrast/components/topNavBarActionItems.js

@@ -27,7 +27,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg
 };
 export default topNavBarActionItems;

package/es/themes/newThemes/legacyCanvasHighContrast/components/topNavBarItem.js

@@ -24,7 +24,6 @@
 import semantics from "../semantics.js";
 const topNavBarItem = {
   fontSize: semantics.fontSize.textBase,
-  smallViewportFontSize: semantics.fontSize.textBase,
   fontFamily: semantics.fontFamily.base,
   fontWeight: semantics.fontWeight.body.base,
   color: semantics.color.text.inverse,

package/es/themes/newThemes/legacyCanvasHighContrast/components/topNavBarLayout.js

@@ -55,6 +55,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 export default topNavBarLayout;

package/es/themes/newThemes/legacyCanvasHighContrast/components/topNavBarMenuItems.js

@@ -27,7 +27,6 @@ const topNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionIndicatorColor: "currentColor"
 };
 export default topNavBarMenuItems;

package/es/themes/newThemes/light/components/topNavBarActionItems.js

@@ -27,7 +27,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg
 };
 export default topNavBarActionItems;

package/es/themes/newThemes/light/components/topNavBarItem.js

@@ -34,7 +34,6 @@ const topNavBarItem = {
   activeItemFontWeight: semantics.fontWeight.body.strong,
   activeItemIndicatorSpacing: semantics.spacing.spaceXs,
   activeIndicatorColor: semantics.color.text.inverse,
-  activeIndicatorColorInverse: semantics.color.text.base,
-  smallViewportFontSize: semantics.fontSize.textBase
+  activeIndicatorColorInverse: semantics.color.text.base
 };
 export default topNavBarItem;

package/es/themes/newThemes/light/components/topNavBarLayout.js

@@ -55,6 +55,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 export default topNavBarLayout;

package/es/themes/newThemes/light/components/topNavBarMenuItems.js

@@ -24,7 +24,6 @@
 import semantics from "../semantics.js";
 const topNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,

package/lib/themes/newThemes/dark/components/topNavBarActionItems.js

@@ -35,7 +35,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg,
-  activeIndicatorWidth: _semantics.default.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg
 };
 var _default = exports.default = topNavBarActionItems;

package/lib/themes/newThemes/dark/components/topNavBarItem.js

@@ -42,7 +42,6 @@ const topNavBarItem = {
   activeItemFontWeight: _semantics.default.fontWeight.body.strong,
   activeItemIndicatorSpacing: _semantics.default.spacing.spaceXs,
   activeIndicatorColor: _semantics.default.color.text.inverse,
-  activeIndicatorColorInverse: _semantics.default.color.text.base,
-  smallViewportFontSize: _semantics.default.fontSize.textBase
+  activeIndicatorColorInverse: _semantics.default.color.text.base
 };
 var _default = exports.default = topNavBarItem;

package/lib/themes/newThemes/dark/components/topNavBarLayout.js

@@ -63,6 +63,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: _semantics.default.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: _semantics.default.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: _semantics.default.spacing.spaceXs,
+  smallViewportFontSize: _semantics.default.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 var _default = exports.default = topNavBarLayout;

package/lib/themes/newThemes/dark/components/topNavBarMenuItems.js

@@ -32,7 +32,6 @@ var _semantics = _interopRequireDefault(require("../semantics"));
 
 const topNavBarMenuItems = {
   desktopItemSpacing: _semantics.default.spacing.spaceLg,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
   desktopSubmenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,

package/lib/themes/newThemes/legacyCanvas/components/topNavBarActionItems.js

@@ -35,7 +35,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg,
-  activeIndicatorWidth: _semantics.default.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg
 };
 var _default = exports.default = topNavBarActionItems;

package/lib/themes/newThemes/legacyCanvas/components/topNavBarItem.js

@@ -32,7 +32,6 @@ var _semantics = _interopRequireDefault(require("../semantics"));
 
 const topNavBarItem = {
   fontSize: _semantics.default.fontSize.textBase,
-  smallViewportFontSize: _semantics.default.fontSize.textBase,
   fontFamily: _semantics.default.fontFamily.base,
   fontWeight: _semantics.default.fontWeight.body.base,
   color: _semantics.default.color.text.inverse,

package/lib/themes/newThemes/legacyCanvas/components/topNavBarLayout.js

@@ -63,6 +63,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: _semantics.default.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: _semantics.default.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: _semantics.default.spacing.spaceXs,
+  smallViewportFontSize: _semantics.default.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 var _default = exports.default = topNavBarLayout;

package/lib/themes/newThemes/legacyCanvas/components/topNavBarMenuItems.js

@@ -35,7 +35,6 @@ const topNavBarMenuItems = {
   desktopItemSpacing: _semantics.default.spacing.spaceLg,
   desktopSubmenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,
   desktopSubmenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionIndicatorColor: "currentColor"
 };
 var _default = exports.default = topNavBarMenuItems;

package/lib/themes/newThemes/legacyCanvasHighContrast/components/topNavBarActionItems.js

@@ -35,7 +35,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg,
-  activeIndicatorWidth: _semantics.default.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg
 };
 var _default = exports.default = topNavBarActionItems;

package/lib/themes/newThemes/legacyCanvasHighContrast/components/topNavBarItem.js

@@ -32,7 +32,6 @@ var _semantics = _interopRequireDefault(require("../semantics"));
 
 const topNavBarItem = {
   fontSize: _semantics.default.fontSize.textBase,
-  smallViewportFontSize: _semantics.default.fontSize.textBase,
   fontFamily: _semantics.default.fontFamily.base,
   fontWeight: _semantics.default.fontWeight.body.base,
   color: _semantics.default.color.text.inverse,

package/lib/themes/newThemes/legacyCanvasHighContrast/components/topNavBarLayout.js

@@ -63,6 +63,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: _semantics.default.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: _semantics.default.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: _semantics.default.spacing.spaceXs,
+  smallViewportFontSize: _semantics.default.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 var _default = exports.default = topNavBarLayout;

package/lib/themes/newThemes/legacyCanvasHighContrast/components/topNavBarMenuItems.js

@@ -35,7 +35,6 @@ const topNavBarMenuItems = {
   desktopItemSpacing: _semantics.default.spacing.spaceLg,
   desktopSubmenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,
   desktopSubmenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionIndicatorColor: "currentColor"
 };
 var _default = exports.default = topNavBarMenuItems;

package/lib/themes/newThemes/light/components/topNavBarActionItems.js

@@ -35,7 +35,6 @@ const topNavBarActionItems = {
   smallViewportActionItemContainerMaxWidth: "50%",
   smallViewportDropdownMenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,
-  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg,
-  activeIndicatorWidth: _semantics.default.borderWidth.md
+  smallViewportDropdownMenuActiveOptionIndicatorWidth: _semantics.default.borderWidth.lg
 };
 var _default = exports.default = topNavBarActionItems;

package/lib/themes/newThemes/light/components/topNavBarItem.js

@@ -42,7 +42,6 @@ const topNavBarItem = {
   activeItemFontWeight: _semantics.default.fontWeight.body.strong,
   activeItemIndicatorSpacing: _semantics.default.spacing.spaceXs,
   activeIndicatorColor: _semantics.default.color.text.inverse,
-  activeIndicatorColorInverse: _semantics.default.color.text.base,
-  smallViewportFontSize: _semantics.default.fontSize.textBase
+  activeIndicatorColorInverse: _semantics.default.color.text.base
 };
 var _default = exports.default = topNavBarItem;

package/lib/themes/newThemes/light/components/topNavBarLayout.js

@@ -63,6 +63,11 @@ const topNavBarLayout = {
   smallViewportInlinePadding: "0.25rem",
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
-  smallViewportZIndex: 10000
+  smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: _semantics.default.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: _semantics.default.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: _semantics.default.spacing.spaceXs,
+  smallViewportFontSize: _semantics.default.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined"
 };
 var _default = exports.default = topNavBarLayout;

package/lib/themes/newThemes/light/components/topNavBarMenuItems.js

@@ -32,7 +32,6 @@ var _semantics = _interopRequireDefault(require("../semantics"));
 
 const topNavBarMenuItems = {
   desktopItemSpacing: _semantics.default.spacing.spaceLg,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionFontWeight: _semantics.default.fontWeight.body.strong,
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
   desktopSubmenuActiveOptionIndicatorSpacing: _semantics.default.spacing.spaceXs,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-themes",
-  "version": "11.7.1",
+  "version": "11.7.2-snapshot-1",
   "description": "A library of instructure themes",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -17,11 +17,11 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "15.0.7",
     "vitest": "^3.2.2",
-    "@instructure/ui-babel-preset": "11.7.1"
+    "@instructure/ui-babel-preset": "11.7.2-snapshot-1"
   },
   "dependencies": {
     "@tokens-studio/types": "^0.5.2",
-    "@instructure/shared-types": "11.7.1"
+    "@instructure/shared-types": "11.7.2-snapshot-1"
   },
   "publishConfig": {
     "access": "public"

package/src/themes/newThemes/componentTypes/topNavBarActionItems.ts

@@ -28,7 +28,6 @@ export type TopNavBarActionItems = {
   smallViewportDropdownMenuActiveOptionFontWeight: string | number
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: string
   smallViewportDropdownMenuActiveOptionIndicatorWidth: string
-  activeIndicatorWidth: string
 }
 
 export default TopNavBarActionItems

package/src/themes/newThemes/componentTypes/topNavBarItem.ts

@@ -35,7 +35,6 @@ export type TopNavBarItem = {
   activeItemIndicatorSpacing: string
   activeIndicatorColor: string
   activeIndicatorColorInverse: string
-  smallViewportFontSize: string
 }
 
 export default TopNavBarItem

package/src/themes/newThemes/componentTypes/topNavBarLayout.ts

@@ -56,6 +56,11 @@ export type TopNavBarLayout = {
   smallViewportTrayPosition: string | number
   smallViewportTrayZIndex: string | number
   smallViewportZIndex: string | number
+  desktopBottomBorderInverse: string
+  desktopBrandContainerInlineMargin: string
+  desktopActionItemsContainerInlineMargin: string
+  smallViewportFontSize: string
+  smallViewportTrayFixTopPosition: string | number
 }
 
 export default TopNavBarLayout

package/src/themes/newThemes/componentTypes/topNavBarMenuItems.ts

@@ -24,7 +24,6 @@
 
 export type TopNavBarMenuItems = {
   desktopItemSpacing: string
-  desktopMaxWidth: string | number
   desktopSubmenuActiveOptionFontWeight: string | number
   desktopSubmenuActiveOptionIndicatorColor: string | number
   desktopSubmenuActiveOptionIndicatorSpacing: string

package/src/themes/newThemes/dark/components/topNavBarActionItems.ts

@@ -31,6 +31,5 @@ const topNavBarActionItems: TopNavBarActionItems = {
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md,
 }
 export default topNavBarActionItems

package/src/themes/newThemes/dark/components/topNavBarItem.ts

@@ -38,6 +38,5 @@ const topNavBarItem: TopNavBarItem = {
   activeItemIndicatorSpacing: semantics.spacing.spaceXs,
   activeIndicatorColor: semantics.color.text.inverse,
   activeIndicatorColorInverse: semantics.color.text.base,
-  smallViewportFontSize: semantics.fontSize.textBase,
 }
 export default topNavBarItem

package/src/themes/newThemes/dark/components/topNavBarLayout.ts

@@ -59,5 +59,10 @@ const topNavBarLayout: TopNavBarLayout = {
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
   smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined",
 }
 export default topNavBarLayout

package/src/themes/newThemes/dark/components/topNavBarMenuItems.ts

@@ -27,7 +27,6 @@ import semantics from "../semantics"
 
 const topNavBarMenuItems: TopNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,

package/src/themes/newThemes/legacyCanvas/components/topNavBarActionItems.ts

@@ -31,6 +31,5 @@ const topNavBarActionItems: TopNavBarActionItems = {
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md,
 }
 export default topNavBarActionItems

package/src/themes/newThemes/legacyCanvas/components/topNavBarItem.ts

@@ -27,7 +27,6 @@ import semantics from "../semantics"
 
 const topNavBarItem: TopNavBarItem = {
   fontSize: semantics.fontSize.textBase,
-  smallViewportFontSize: semantics.fontSize.textBase,
   fontFamily: semantics.fontFamily.base,
   fontWeight: semantics.fontWeight.body.base,
   color: semantics.color.text.inverse,

package/src/themes/newThemes/legacyCanvas/components/topNavBarLayout.ts

@@ -59,5 +59,10 @@ const topNavBarLayout: TopNavBarLayout = {
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
   smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined",
 }
 export default topNavBarLayout

package/src/themes/newThemes/legacyCanvas/components/topNavBarMenuItems.ts

@@ -30,7 +30,6 @@ const topNavBarMenuItems: TopNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
 }
 export default topNavBarMenuItems

package/src/themes/newThemes/legacyCanvasHighContrast/components/topNavBarActionItems.ts

@@ -31,6 +31,5 @@ const topNavBarActionItems: TopNavBarActionItems = {
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md,
 }
 export default topNavBarActionItems

package/src/themes/newThemes/legacyCanvasHighContrast/components/topNavBarItem.ts

@@ -27,7 +27,6 @@ import semantics from "../semantics"
 
 const topNavBarItem: TopNavBarItem = {
   fontSize: semantics.fontSize.textBase,
-  smallViewportFontSize: semantics.fontSize.textBase,
   fontFamily: semantics.fontFamily.base,
   fontWeight: semantics.fontWeight.body.base,
   color: semantics.color.text.inverse,

package/src/themes/newThemes/legacyCanvasHighContrast/components/topNavBarLayout.ts

@@ -59,5 +59,10 @@ const topNavBarLayout: TopNavBarLayout = {
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
   smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined",
 }
 export default topNavBarLayout

package/src/themes/newThemes/legacyCanvasHighContrast/components/topNavBarMenuItems.ts

@@ -30,7 +30,6 @@ const topNavBarMenuItems: TopNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
 }
 export default topNavBarMenuItems

package/src/themes/newThemes/light/components/topNavBarActionItems.ts

@@ -31,6 +31,5 @@ const topNavBarActionItems: TopNavBarActionItems = {
   smallViewportDropdownMenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   smallViewportDropdownMenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,
   smallViewportDropdownMenuActiveOptionIndicatorWidth: semantics.borderWidth.lg,
-  activeIndicatorWidth: semantics.borderWidth.md,
 }
 export default topNavBarActionItems

package/src/themes/newThemes/light/components/topNavBarItem.ts

@@ -38,6 +38,5 @@ const topNavBarItem: TopNavBarItem = {
   activeItemIndicatorSpacing: semantics.spacing.spaceXs,
   activeIndicatorColor: semantics.color.text.inverse,
   activeIndicatorColorInverse: semantics.color.text.base,
-  smallViewportFontSize: semantics.fontSize.textBase,
 }
 export default topNavBarItem

package/src/themes/newThemes/light/components/topNavBarLayout.ts

@@ -59,5 +59,10 @@ const topNavBarLayout: TopNavBarLayout = {
   smallViewportTrayPosition: "fixed",
   smallViewportTrayZIndex: 9998,
   smallViewportZIndex: 10000,
+  desktopBottomBorderInverse: semantics.color.stroke.inverse,
+  desktopBrandContainerInlineMargin: semantics.spacing.spaceMd,
+  desktopActionItemsContainerInlineMargin: semantics.spacing.spaceXs,
+  smallViewportFontSize: semantics.fontSize.textSm,
+  smallViewportTrayFixTopPosition: "undefined",
 }
 export default topNavBarLayout

package/src/themes/newThemes/light/components/topNavBarMenuItems.ts

@@ -27,7 +27,6 @@ import semantics from "../semantics"
 
 const topNavBarMenuItems: TopNavBarMenuItems = {
   desktopItemSpacing: semantics.spacing.spaceLg,
-  desktopMaxWidth: "100%",
   desktopSubmenuActiveOptionFontWeight: semantics.fontWeight.body.strong,
   desktopSubmenuActiveOptionIndicatorColor: "currentColor",
   desktopSubmenuActiveOptionIndicatorSpacing: semantics.spacing.spaceXs,

package/tokens/canvas/scss/_variables.scss

@@ -2354,7 +2354,6 @@ $instui-canvas-new-theme-components-top-nav-bar-action-items-small-viewport-acti
 $instui-canvas-new-theme-components-top-nav-bar-action-items-small-viewport-dropdown-menu-active-option-font-weight: 700;
 $instui-canvas-new-theme-components-top-nav-bar-action-items-small-viewport-dropdown-menu-active-option-indicator-spacing: 0.25rem;
 $instui-canvas-new-theme-components-top-nav-bar-action-items-small-viewport-dropdown-menu-active-option-indicator-width: 0.25rem;
-$instui-canvas-new-theme-components-top-nav-bar-action-items-active-indicator-width: 0.125rem;
 $instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-dropdown-menu-active-option-indicator-spacing: 0.25rem;
 $instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-dropdown-menu-active-option-indicator-width: 0.25rem;
 $instui-canvas-new-theme-components-top-nav-bar-layout-desktop-height: 4rem;
@@ -2388,11 +2387,15 @@ $instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-inline-pad
 $instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-tray-position: fixed;
 $instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-tray-z-index: 9998;
 $instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-z-index: 10000;
+$instui-canvas-new-theme-components-top-nav-bar-layout-desktop-bottom-border-inverse: #ffffff;
+$instui-canvas-new-theme-components-top-nav-bar-layout-desktop-brand-container-inline-margin: 0.75rem;
+$instui-canvas-new-theme-components-top-nav-bar-layout-desktop-action-items-container-inline-margin: 0.25rem;
+$instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-font-size: 0.875rem;
+$instui-canvas-new-theme-components-top-nav-bar-layout-small-viewport-tray-fix-top-position: undefined;
 $instui-canvas-new-theme-components-top-nav-bar-brand-logo-height: 2.25rem;
 $instui-canvas-new-theme-components-top-nav-bar-brand-focus-outline-inset: -0.25rem;
 $instui-canvas-new-theme-components-top-nav-bar-brand-icon-padding: 0.75rem;
 $instui-canvas-new-theme-components-top-nav-bar-item-font-size: 1rem;
-$instui-canvas-new-theme-components-top-nav-bar-item-small-viewport-font-size: 1rem;
 $instui-canvas-new-theme-components-top-nav-bar-item-font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
 $instui-canvas-new-theme-components-top-nav-bar-item-font-weight: 400;
 $instui-canvas-new-theme-components-top-nav-bar-item-color: #ffffff;
@@ -2408,7 +2411,6 @@ $instui-canvas-new-theme-components-top-nav-bar-menu-items-desktop-submenu-activ
 $instui-canvas-new-theme-components-top-nav-bar-menu-items-desktop-item-spacing: 1rem;
 $instui-canvas-new-theme-components-top-nav-bar-menu-items-desktop-submenu-active-option-indicator-spacing: 0.25rem;
 $instui-canvas-new-theme-components-top-nav-bar-menu-items-desktop-submenu-active-option-font-weight: 700;
-$instui-canvas-new-theme-components-top-nav-bar-menu-items-desktop-max-width: 100%;
 $instui-canvas-new-theme-components-top-nav-bar-menu-items-desktop-submenu-active-option-indicator-color: currentColor;
 $instui-canvas-new-theme-components-select-popover-border-width: 0.0625rem;
 $instui-canvas-new-theme-components-pagination-page-indicator-gap: 0.5rem;