@instructure/ui-themes 11.7.2-snapshot-12 → 11.7.2-snapshot-17

package/CHANGELOG.md

@@ -3,7 +3,7 @@
 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-12](https://github.com/instructure/instructure-ui/compare/v11.7.1...v11.7.2-snapshot-12) (2026-03-31)
+## [11.7.2-snapshot-17](https://github.com/instructure/instructure-ui/compare/v11.7.1...v11.7.2-snapshot-17) (2026-04-01)
 
 **Note:** Version bump only for package @instructure/ui-themes
 

package/es/themes/newThemes/componentTypes/img.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,29 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+export default img;

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

@@ -26,7 +26,7 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: semantics.borderRadius.lg,
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: semantics.spacing.spaceSm,
   fontColor: semantics.color.text.base,
   fontFamily: semantics.fontFamily.base,
   fontSize: semantics.fontSize.textSm,
@@ -39,6 +39,7 @@ const sideNavBarItemNew = {
   innerFocusOutlineColor: semantics.color.stroke.interactive.focusRing.base,
   selectedInnerFocusOutlineColor: semantics.color.icon.inverse,
   outerFocusOutlineColor: semantics.color.transparentColor,
-  selectedOuterFocusOutlineColor: semantics.color.transparentColor
+  selectedOuterFocusOutlineColor: semantics.color.transparentColor,
+  verticalPadding: "0.25rem"
 };
 export default sideNavBarItemNew;

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

@@ -27,13 +27,16 @@ const sideNavBarNew = {
   fill: semantics.color.icon.interactive.action.primaryOnColor.base,
   borderColor: semantics.color.stroke.muted,
   fontColor: semantics.color.text.base,
-  minimizedWidth: "3.75rem",
+  minimizedminWidth: "6.75rem",
   toggleTransition: "300ms",
-  width: "5.875rem",
+  minWidth: "17rem",
   margin: semantics.spacing.spaceMd,
   minimizedMargin: "0.375rem",
-  contentMargin: "0.375rem",
-  contentGap: semantics.spacing.spaceXs,
+  mainNavMargin: "0.75rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: semantics.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: semantics.spacing.spaceXs,
   boxShadow: {
     0: {
       x: "0rem",

package/es/themes/newThemes/dark/index.js

@@ -55,6 +55,7 @@ import gridCol from "./components/gridCol.js";
 import gridRow from "./components/gridRow.js";
 import heading from "./components/heading.js";
 import icon from "./components/icon.js";
+import img from "./components/img.js";
 import inlineListItem from "./components/inlineListItem.js";
 import link from "./components/link.js";
 import list from "./components/list.js";
@@ -222,7 +223,8 @@ const theme = {
     AppNavItem: appNavItem,
     Byline: byline,
     SideNavBarNew: sideNavBarNew,
-    SideNavBarItemNew: sideNavBarItemNew
+    SideNavBarItemNew: sideNavBarItemNew,
+    Img: img
   }
 };
 export default theme;

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

@@ -0,0 +1,29 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+export default img;

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

@@ -26,7 +26,8 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: "0rem",
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: "0.375rem",
+  verticalPadding: "0.25rem",
   fontColor: semantics.color.text.onColor,
   fontFamily: semantics.fontFamily.base,
   fontSize: semantics.fontSize.textSm,

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

@@ -26,13 +26,16 @@ const sideNavBarNew = {
   backgroundColor: semantics.color.background.dark,
   fill: semantics.color.icon.onColor,
   fontColor: semantics.color.text.onColor,
-  minimizedWidth: "3.375rem",
+  minimizedminWidth: "3.375rem",
   toggleTransition: "300ms",
-  width: "5.25rem",
+  minWidth: "5.25rem",
   margin: "0rem",
   minimizedMargin: "0rem",
-  contentMargin: "0rem",
-  contentGap: "0rem",
+  mainNavMargin: "0rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: semantics.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: "0rem",
   boxShadow: {
     0: {
       x: "0rem",

package/es/themes/newThemes/legacyCanvas/index.js

@@ -55,6 +55,7 @@ import gridCol from "./components/gridCol.js";
 import gridRow from "./components/gridRow.js";
 import heading from "./components/heading.js";
 import icon from "./components/icon.js";
+import img from "./components/img.js";
 import inlineListItem from "./components/inlineListItem.js";
 import link from "./components/link.js";
 import list from "./components/list.js";
@@ -222,7 +223,8 @@ const theme = {
     AppNavItem: appNavItem,
     Byline: byline,
     SideNavBarNew: sideNavBarNew,
-    SideNavBarItemNew: sideNavBarItemNew
+    SideNavBarItemNew: sideNavBarItemNew,
+    Img: img
   }
 };
 export default theme;

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

@@ -0,0 +1,29 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+export default img;

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

@@ -26,7 +26,8 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: "0rem",
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: "0.375rem",
+  verticalPadding: "0.25rem",
   fontColor: semantics.color.text.onColor,
   fontFamily: semantics.fontFamily.base,
   fontSize: semantics.fontSize.textSm,

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

@@ -26,13 +26,16 @@ const sideNavBarNew = {
   backgroundColor: semantics.color.background.dark,
   fill: semantics.color.icon.onColor,
   fontColor: semantics.color.text.onColor,
-  minimizedWidth: "3.375rem",
+  minimizedminWidth: "3.375rem",
   toggleTransition: "300ms",
-  width: "5.25rem",
+  minWidth: "5.25rem",
   margin: "0rem",
   minimizedMargin: "0rem",
-  contentMargin: "0rem",
-  contentGap: "0rem",
+  mainNavMargin: "0rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: semantics.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: "0rem",
   boxShadow: {
     0: {
       x: "0rem",

package/es/themes/newThemes/legacyCanvasHighContrast/index.js

@@ -55,6 +55,7 @@ import gridCol from "./components/gridCol.js";
 import gridRow from "./components/gridRow.js";
 import heading from "./components/heading.js";
 import icon from "./components/icon.js";
+import img from "./components/img.js";
 import inlineListItem from "./components/inlineListItem.js";
 import link from "./components/link.js";
 import list from "./components/list.js";
@@ -222,7 +223,8 @@ const theme = {
     AppNavItem: appNavItem,
     Byline: byline,
     SideNavBarNew: sideNavBarNew,
-    SideNavBarItemNew: sideNavBarItemNew
+    SideNavBarItemNew: sideNavBarItemNew,
+    Img: img
   }
 };
 export default theme;

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

@@ -0,0 +1,29 @@
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+export default img;

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

@@ -26,7 +26,7 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: semantics.borderRadius.lg,
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: semantics.spacing.spaceSm,
   fontColor: semantics.color.text.base,
   fontFamily: semantics.fontFamily.base,
   fontSize: semantics.fontSize.textSm,
@@ -39,6 +39,7 @@ const sideNavBarItemNew = {
   innerFocusOutlineColor: semantics.color.stroke.interactive.focusRing.base,
   selectedInnerFocusOutlineColor: semantics.color.icon.inverse,
   outerFocusOutlineColor: semantics.color.transparentColor,
-  selectedOuterFocusOutlineColor: semantics.color.transparentColor
+  selectedOuterFocusOutlineColor: semantics.color.transparentColor,
+  verticalPadding: "0.25rem"
 };
 export default sideNavBarItemNew;

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

@@ -27,13 +27,16 @@ const sideNavBarNew = {
   fill: semantics.color.icon.interactive.action.primaryOnColor.base,
   borderColor: semantics.color.stroke.muted,
   fontColor: semantics.color.text.base,
-  minimizedWidth: "3.75rem",
+  minimizedminWidth: "6.75rem",
   toggleTransition: "300ms",
-  width: "5.875rem",
+  minWidth: "17rem",
   margin: semantics.spacing.spaceMd,
   minimizedMargin: "0.375rem",
-  contentMargin: "0.375rem",
-  contentGap: semantics.spacing.spaceXs,
+  mainNavMargin: "0.75rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: semantics.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: semantics.spacing.spaceXs,
   boxShadow: {
     0: {
       x: "0rem",

package/es/themes/newThemes/light/index.js

@@ -55,6 +55,7 @@ import gridCol from "./components/gridCol.js";
 import gridRow from "./components/gridRow.js";
 import heading from "./components/heading.js";
 import icon from "./components/icon.js";
+import img from "./components/img.js";
 import inlineListItem from "./components/inlineListItem.js";
 import link from "./components/link.js";
 import list from "./components/list.js";
@@ -222,7 +223,8 @@ const theme = {
     AppNavItem: appNavItem,
     Byline: byline,
     SideNavBarNew: sideNavBarNew,
-    SideNavBarItemNew: sideNavBarItemNew
+    SideNavBarItemNew: sideNavBarItemNew,
+    Img: img
   }
 };
 export default theme;

package/lib/themes/newThemes/componentTypes/img.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+var _default = exports.default = img;

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

@@ -34,7 +34,7 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: _semantics.default.borderRadius.lg,
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: _semantics.default.spacing.spaceSm,
   fontColor: _semantics.default.color.text.base,
   fontFamily: _semantics.default.fontFamily.base,
   fontSize: _semantics.default.fontSize.textSm,
@@ -47,6 +47,7 @@ const sideNavBarItemNew = {
   innerFocusOutlineColor: _semantics.default.color.stroke.interactive.focusRing.base,
   selectedInnerFocusOutlineColor: _semantics.default.color.icon.inverse,
   outerFocusOutlineColor: _semantics.default.color.transparentColor,
-  selectedOuterFocusOutlineColor: _semantics.default.color.transparentColor
+  selectedOuterFocusOutlineColor: _semantics.default.color.transparentColor,
+  verticalPadding: "0.25rem"
 };
 var _default = exports.default = sideNavBarItemNew;

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

@@ -35,13 +35,16 @@ const sideNavBarNew = {
   fill: _semantics.default.color.icon.interactive.action.primaryOnColor.base,
   borderColor: _semantics.default.color.stroke.muted,
   fontColor: _semantics.default.color.text.base,
-  minimizedWidth: "3.75rem",
+  minimizedminWidth: "6.75rem",
   toggleTransition: "300ms",
-  width: "5.875rem",
+  minWidth: "17rem",
   margin: _semantics.default.spacing.spaceMd,
   minimizedMargin: "0.375rem",
-  contentMargin: "0.375rem",
-  contentGap: _semantics.default.spacing.spaceXs,
+  mainNavMargin: "0.75rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: _semantics.default.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: _semantics.default.spacing.spaceXs,
   boxShadow: {
     0: {
       x: "0rem",

package/lib/themes/newThemes/dark/index.js

@@ -39,6 +39,7 @@ var _gridCol = _interopRequireDefault(require("./components/gridCol"));
 var _gridRow = _interopRequireDefault(require("./components/gridRow"));
 var _heading = _interopRequireDefault(require("./components/heading"));
 var _icon = _interopRequireDefault(require("./components/icon"));
+var _img = _interopRequireDefault(require("./components/img"));
 var _inlineListItem = _interopRequireDefault(require("./components/inlineListItem"));
 var _link = _interopRequireDefault(require("./components/link"));
 var _list = _interopRequireDefault(require("./components/list"));
@@ -230,7 +231,8 @@ const theme = {
     AppNavItem: _appNavItem.default,
     Byline: _byline.default,
     SideNavBarNew: _sideNavBarNew.default,
-    SideNavBarItemNew: _sideNavBarItemNew.default
+    SideNavBarItemNew: _sideNavBarItemNew.default,
+    Img: _img.default
   }
 };
 var _default = exports.default = theme;

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

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+var _default = exports.default = img;

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

@@ -34,7 +34,8 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: "0rem",
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: "0.375rem",
+  verticalPadding: "0.25rem",
   fontColor: _semantics.default.color.text.onColor,
   fontFamily: _semantics.default.fontFamily.base,
   fontSize: _semantics.default.fontSize.textSm,

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

@@ -34,13 +34,16 @@ const sideNavBarNew = {
   backgroundColor: _semantics.default.color.background.dark,
   fill: _semantics.default.color.icon.onColor,
   fontColor: _semantics.default.color.text.onColor,
-  minimizedWidth: "3.375rem",
+  minimizedminWidth: "3.375rem",
   toggleTransition: "300ms",
-  width: "5.25rem",
+  minWidth: "5.25rem",
   margin: "0rem",
   minimizedMargin: "0rem",
-  contentMargin: "0rem",
-  contentGap: "0rem",
+  mainNavMargin: "0rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: _semantics.default.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: "0rem",
   boxShadow: {
     0: {
       x: "0rem",

package/lib/themes/newThemes/legacyCanvas/index.js

@@ -39,6 +39,7 @@ var _gridCol = _interopRequireDefault(require("./components/gridCol"));
 var _gridRow = _interopRequireDefault(require("./components/gridRow"));
 var _heading = _interopRequireDefault(require("./components/heading"));
 var _icon = _interopRequireDefault(require("./components/icon"));
+var _img = _interopRequireDefault(require("./components/img"));
 var _inlineListItem = _interopRequireDefault(require("./components/inlineListItem"));
 var _link = _interopRequireDefault(require("./components/link"));
 var _list = _interopRequireDefault(require("./components/list"));
@@ -230,7 +231,8 @@ const theme = {
     AppNavItem: _appNavItem.default,
     Byline: _byline.default,
     SideNavBarNew: _sideNavBarNew.default,
-    SideNavBarItemNew: _sideNavBarItemNew.default
+    SideNavBarItemNew: _sideNavBarItemNew.default,
+    Img: _img.default
   }
 };
 var _default = exports.default = theme;

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

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const img = {
+  effectTransitionDuration: "1s",
+  imageBlurAmount: "0.25em"
+};
+var _default = exports.default = img;

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

@@ -34,7 +34,8 @@ const sideNavBarItemNew = {
   iconWrapperHeight: "2.25rem",
   borderRadius: "0rem",
   backgroundColor: "transparent",
-  contentPadding: "0.375rem",
+  horizontalPadding: "0.375rem",
+  verticalPadding: "0.25rem",
   fontColor: _semantics.default.color.text.onColor,
   fontFamily: _semantics.default.fontFamily.base,
   fontSize: _semantics.default.fontSize.textSm,

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

@@ -34,13 +34,16 @@ const sideNavBarNew = {
   backgroundColor: _semantics.default.color.background.dark,
   fill: _semantics.default.color.icon.onColor,
   fontColor: _semantics.default.color.text.onColor,
-  minimizedWidth: "3.375rem",
+  minimizedminWidth: "3.375rem",
   toggleTransition: "300ms",
-  width: "5.25rem",
+  minWidth: "5.25rem",
   margin: "0rem",
   minimizedMargin: "0rem",
-  contentMargin: "0rem",
-  contentGap: "0rem",
+  mainNavMargin: "0rem",
+  mainNavMinimizedMargin: "0rem",
+  mainNavGap: _semantics.default.spacing.padding.container.xxs,
+  mainNavMinimizedGap: "0rem",
+  navItemsGap: "0rem",
   boxShadow: {
     0: {
       x: "0rem",

package/lib/themes/newThemes/legacyCanvasHighContrast/index.js

@@ -39,6 +39,7 @@ var _gridCol = _interopRequireDefault(require("./components/gridCol"));
 var _gridRow = _interopRequireDefault(require("./components/gridRow"));
 var _heading = _interopRequireDefault(require("./components/heading"));
 var _icon = _interopRequireDefault(require("./components/icon"));
+var _img = _interopRequireDefault(require("./components/img"));
 var _inlineListItem = _interopRequireDefault(require("./components/inlineListItem"));
 var _link = _interopRequireDefault(require("./components/link"));
 var _list = _interopRequireDefault(require("./components/list"));
@@ -230,7 +231,8 @@ const theme = {
     AppNavItem: _appNavItem.default,
     Byline: _byline.default,
     SideNavBarNew: _sideNavBarNew.default,
-    SideNavBarItemNew: _sideNavBarItemNew.default
+    SideNavBarItemNew: _sideNavBarItemNew.default,
+    Img: _img.default
   }
 };
 var _default = exports.default = theme;