@kickstartds/ds-agency-premium 1.6.68--canary.1587.98fc9e3.0 → 1.6.68--canary.1593.79f68de.0

package/dist/components/nav-flyout/nav-flyout.css

@@ -1,7 +1,7 @@
 .dsa-nav-flyout {
   --dsa-nav-flyout--padding: 0 var(--ks-spacing-inset-xl);
-  --dsa-nav-flyout--max-width: 18em;
-  --dsa-nav-flyout--shadow: 20px 0px 30px var(--ks-color-fg-inverted-alpha-5-base);
+  --dsa-nav-flyout--max-width: 100%;
+  --dsa-nav-flyout--shadow: 0px 0px 0px 100px var(--ks-color-fg-alpha-2-base);
   --dsa-nav-flyout--gap: var(--ks-spacing-stack-m);
   --dsa-nav-flyout--background: linear-gradient(
     125deg,
@@ -30,18 +30,18 @@
   font: var(--dsa-nav-flyout__label--font);
   flex-direction: column;
   gap: var(--dsa-nav-flyout--gap);
-  left: -100%;
-  height: 100vh;
+  top: var(--dsa-header--height);
+  opacity: 0;
+  left: 0;
   overflow: hidden;
   position: fixed;
-  width: 78vw;
+  width: 100%;
   transition: all var(--ks-duration-slow);
+  transition-delay: 100ms;
   padding: var(--dsa-nav-flyout--padding);
   right: 0;
   bottom: 0;
-  top: 0;
   overflow-y: auto;
-  background: var(--dsa-nav-flyout--background);
   backface-visibility: hidden;
   -webkit-overflow-scrolling: touch;
   max-width: var(--dsa-nav-flyout--max-width);
@@ -50,16 +50,19 @@
   padding: 0;
   margin: 0;
 }
+.dsa-header--floating .dsa-nav-flyout {
+  border-radius: var(--ks-border-radius-surface);
+  padding: 0 var(--dsa-header_floating--spacing-horizontal);
+}
 .overlay-open .dsa-nav-flyout {
-  left: 0;
-  box-shadow: var(--dsa-nav-flyout--shadow);
+  opacity: 1;
 }
 .dsa-nav-flyout .dsa-nav-flyout__logo {
   margin-top: var(--dsa-header--spacing-vertical);
   margin-bottom: var(--dsa-header--spacing-vertical);
 }
 .dsa-nav-flyout .dsa-nav-flyout__list {
-  padding-top: calc(var(--dsa-header--spacing-vertical) - var(--ks-spacing-s));
+  padding-top: var(--ks-spacing-xs);
   padding-bottom: 15vh;
 }
 .dsa-nav-flyout .dsa-nav-flyout__list:hover .dsa-nav-flyout__item:not(:hover, .dsa-nav-flyout__item--active) .dsa-nav-flyout__label {
@@ -94,6 +97,7 @@
 .dsa-nav-flyout .dsa-nav-flyout__sublist {
   padding: var(--dsa-nav-flyout__sublist--padding);
   font: var(--dsa-nav-flyout__sublist__label--font);
+  font-weight: var(--dsa-nav-flyout__sublist__label--font-weight);
 }
 .dsa-nav-flyout .dsa-nav-flyout__sublist .dsa-nav-flyout__label {
   font: inherit;

package/dist/components/nav-main/index.js

@@ -13,8 +13,6 @@ import 'classnames';
 import '@kickstartds/base/lib/link';
 import '@kickstartds/base/lib/icon';
 import '../nav-dropdown/index.js';
-import '../logo/index.js';
-import '@kickstartds/base/lib/picture';
 
 const NavMainContextDefault = forwardRef(({ logo, items, flyoutInverted, dropdownInverted }, ref) => items && items.length > 0 ? (jsxs("div", { ref: ref, className: "dsa-nav-main", children: [jsx(NavToggle, {}), jsx(NavTopbar, { items: items, inverted: dropdownInverted }), jsx(NavFlyout, { items: items, inverted: flyoutInverted, logo: logo })] })) : null);
 const NavMainContext = createContext(NavMainContextDefault);

package/dist/components/page/index.d.ts

@@ -1,4 +1,4 @@
-import { PageProps } from "../../PageProps-aa29c554.js";
+import { PageProps } from "../../PageProps-7caa223c.js";
 import { FC, PropsWithChildren } from "react";
 declare const Page: FC<PropsWithChildren<PageProps>>;
 export type { PageProps };

package/dist/components/page/page.schema.dereffed.json

@@ -39,9 +39,7 @@
             "enum": [
               "framed",
               "deko",
-              "colorful",
-              "accentTransition",
-              "boldTransition"
+              "colorful"
             ]
           },
           "backgroundColor": {
@@ -55,6 +53,19 @@
             ],
             "default": "default"
           },
+          "transition": {
+            "type": "string",
+            "title": "Style",
+            "description": "Color of background",
+            "enum": [
+              "none",
+              "to-default",
+              "to-accent",
+              "to-bold",
+              "to-inverted"
+            ],
+            "default": "default"
+          },
           "backgroundImage": {
             "title": "Background image",
             "description": "Background image for the whole section",
@@ -868,6 +879,12 @@
                       "type": "string",
                       "default": "bottom"
                     },
+                    "inverted": {
+                      "type": "boolean",
+                      "title": "Inverted",
+                      "description": "Inverted color scheme for the box",
+                      "default": false
+                    },
                     "type": {
                       "const": "hero"
                     }
@@ -2064,6 +2081,12 @@
                                 "type": "string",
                                 "default": "bottom"
                               },
+                              "inverted": {
+                                "type": "boolean",
+                                "title": "Inverted",
+                                "description": "Inverted color scheme for the box",
+                                "default": false
+                              },
                               "type": {
                                 "const": "hero"
                               }
@@ -3091,8 +3114,10 @@
                       "description": "Choose the alginment of the module content",
                       "enum": [
                         "center",
+                        "below",
                         "left",
-                        "right"
+                        "right",
+                        "corner"
                       ],
                       "type": "string",
                       "default": "bottom"

package/dist/components/page-wrapper/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 12 May 2025 08:19:38 GMT
+ * Generated on Mon, 12 May 2025 12:52:01 GMT
  */
 :root, [ks-theme] {
   --ks-background-color-accent-base: var(--ks-color-fg-to-bg-9-base);
@@ -204,18 +204,18 @@
   --ks-border-width-default: 1px;
   --ks-border-width-emphasized: 2px;
   --ks-border-radius-control: 8px;
-  --ks-border-radius-card: 8px 8px 8px 24px;
-  --ks-border-radius-surface: 32px;
+  --ks-border-radius-card: 8px 8px 8px 32px;
+  --ks-border-radius-surface: 16px;
   --ks-border-radius-pill: 999px;
   --ks-border-radius-circle: 50%;
   --ks-box-shadow-opacity-control: 0.2;
   --ks-box-shadow-opacity-control-hover: 0.3;
   --ks-box-shadow-opacity-control-inverted: 0.2;
   --ks-box-shadow-opacity-control-inverted-hover: 0.3;
-  --ks-box-shadow-opacity-card: 0.2;
-  --ks-box-shadow-opacity-card-hover: 0.3;
-  --ks-box-shadow-opacity-card-inverted: 0.2;
-  --ks-box-shadow-opacity-card-inverted-hover: 0.3;
+  --ks-box-shadow-opacity-card: 0.1;
+  --ks-box-shadow-opacity-card-hover: 0.2;
+  --ks-box-shadow-opacity-card-inverted: 0.1;
+  --ks-box-shadow-opacity-card-inverted-hover: 0.2;
   --ks-box-shadow-opacity-surface: 0.1;
   --ks-box-shadow-opacity-surface-hover: 0.2;
   --ks-box-shadow-opacity-surface-inverted: 0.1;
@@ -732,7 +732,7 @@
   --ks-spacing-inset-stretch-m: var(--ks-spacing-l) var(--ks-spacing-m);
   --ks-spacing-inset-stretch-l: var(--ks-spacing-xl) var(--ks-spacing-l);
   --ks-spacing-inset-stretch-xl: var(--ks-spacing-xxl) var(--ks-spacing-xl);
-  --ks-text-color-default-base: var(--ks-color-fg-base);
+  --ks-text-color-default-base: var(--ks-color-fg-alpha-3-base);
   --ks-text-color-default-interactive-base: var(--ks-color-link-base);
   --ks-text-color-default-interactive-hover-base: var(--ks-color-link-base);
   --ks-text-color-default-interactive-active-base: var(--ks-color-link-base);
@@ -841,7 +841,7 @@
   --ks-timing-function-ease-in: ease-in;
   --ks-timing-function-ease-in-out: ease-in-out;
   --ks-timing-function-linear: linear;
-  --ks-transition-collapse: var(--ks-duration-slow) var(--ks-timing-function-ease-out);
+  --ks-transition-collapse: var(--ks-duration-medium) var(--ks-timing-function-ease-out);
   --ks-transition-hover: var(--ks-duration-fast) var(--ks-timing-function-ease-in-out);
   --ks-transition-fade: var(--ks-duration-slow) var(--ks-timing-function-ease-out);
   --ks-font-family-display: Inter, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;