@kickstartds/ds-agency-premium 1.6.71--canary.49.2211.0 → 1.6.71--canary.50.2218.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (91) hide show
  1. package/dist/BlogOverviewProps-9f207f1c.d.ts +1 -1
  2. package/dist/BlogPostProps-6b3cff22.d.ts +1 -1
  3. package/dist/HeadlineProps-e1305784.d.ts +53 -0
  4. package/dist/PageProps-aa29c554.d.ts +1 -1
  5. package/dist/SearchBarProps-26263244.d.ts +29 -0
  6. package/dist/{SectionProps-2a23ef89.d.ts → SectionProps-d60aba86.d.ts} +1 -1
  7. package/dist/components/blog-overview/blog-overview.schema.dereffed.json +1 -1
  8. package/dist/components/blog-post/blog-post.schema.dereffed.json +1 -1
  9. package/dist/components/button/button.css +1 -1
  10. package/dist/components/cookie-consent/C15t.client.js +32 -3
  11. package/dist/components/cookie-consent/CookieConsent.client.d.ts +0 -1
  12. package/dist/components/cookie-consent/CookieConsent.client.js +8 -13
  13. package/dist/components/cookie-consent/cookie-consent.css +3 -15
  14. package/dist/components/cookie-consent/index.js +1 -1
  15. package/dist/components/features/features.css +1 -2
  16. package/dist/components/footer/footer.css +2 -2
  17. package/dist/components/footer/footer.schema.dereffed.json +9 -154
  18. package/dist/components/header/header.schema.dereffed.json +9 -154
  19. package/dist/components/headline/headline.css +7 -7
  20. package/dist/components/headline/index.d.ts +1 -53
  21. package/dist/components/hero/hero.css +4 -4
  22. package/dist/components/mosaic/index.js +0 -1
  23. package/dist/components/nav-dropdown/nav-dropdown.css +5 -5
  24. package/dist/components/nav-flyout/nav-flyout.schema.dereffed.json +9 -154
  25. package/dist/components/nav-main/nav-main.schema.dereffed.json +9 -154
  26. package/dist/components/nav-main/nav-main.schema.json +9 -154
  27. package/dist/components/nav-topbar/nav-topbar.css +1 -1
  28. package/dist/components/nav-topbar/nav-topbar.schema.dereffed.json +9 -154
  29. package/dist/components/page/page.schema.dereffed.json +1 -1
  30. package/dist/components/page-wrapper/index.js +0 -43
  31. package/dist/components/page-wrapper/tokens.css +353 -353
  32. package/dist/components/presets.json +20 -305
  33. package/dist/components/search/Search.client.d.ts +6 -0
  34. package/dist/components/search/Search.client.js +71 -0
  35. package/dist/components/search/index.d.ts +10 -0
  36. package/dist/components/search/index.js +29 -20
  37. package/dist/components/search/search.schema.dereffed.json +133 -0
  38. package/dist/components/search/search.schema.json +6 -0
  39. package/dist/components/search-bar/index.d.ts +1 -29
  40. package/dist/components/search-bar/index.js +1 -1
  41. package/dist/components/section/index.d.ts +1 -1
  42. package/dist/components/section/section.css +12 -8
  43. package/dist/components/section/section.schema.dereffed.json +1 -1
  44. package/dist/components/section/section.schema.json +1 -1
  45. package/dist/components/settings/settings.schema.dereffed.json +18 -308
  46. package/dist/components/slider/slider.css +2 -2
  47. package/dist/components/teaser-card/index.js +1 -1
  48. package/dist/components/teaser-card/teaser-card.css +9 -10
  49. package/dist/global.css +5 -5
  50. package/dist/static/logo-dark.svg +12 -8
  51. package/dist/static/logo.svg +12 -8
  52. package/dist/tokens/IconSprite.js +0 -43
  53. package/dist/tokens/icon-sprite.html +0 -18
  54. package/dist/tokens/themes.css +4 -4
  55. package/dist/tokens/tokens.css +353 -353
  56. package/dist/tokens/tokens.js +557 -561
  57. package/package.json +4 -2
  58. package/dist/static/logo.png +0 -0
  59. package/dist/static/optoma/2989.jpg +0 -0
  60. package/dist/static/optoma/3081.jpg +0 -0
  61. package/dist/static/optoma/3124.jpg +0 -0
  62. package/dist/static/optoma/3276.jpg +0 -0
  63. package/dist/static/optoma/3333.jpg +0 -0
  64. package/dist/static/optoma/3342.jpg +0 -0
  65. package/dist/static/optoma/bannerimgpro.jpg +0 -0
  66. package/dist/static/optoma/beamer.jpg +0 -0
  67. package/dist/static/optoma/beamer.png +0 -0
  68. package/dist/static/optoma/beamer.svg +0 -10
  69. package/dist/static/optoma/creative-board-girl.jpg +0 -0
  70. package/dist/static/optoma/hero.jpg +0 -0
  71. package/dist/static/optoma/interaktive-displays.svg +0 -9
  72. package/dist/static/optoma/landing-banner.jpg +0 -0
  73. package/dist/static/optoma/led.svg +0 -21
  74. package/dist/static/optoma/location-1.jpg +0 -0
  75. package/dist/static/optoma/location-2.jpg +0 -0
  76. package/dist/static/optoma/logo.svg +0 -9
  77. package/dist/static/optoma/l/303/266sungen.svg +0 -13
  78. package/dist/static/optoma/product-1.jpg +0 -0
  79. package/dist/static/optoma/product-1.png +0 -0
  80. package/dist/static/optoma/product-2.jpg +0 -0
  81. package/dist/static/optoma/product-2.png +0 -0
  82. package/dist/static/optoma/product-3.jpg +0 -0
  83. package/dist/static/optoma/product-3.png +0 -0
  84. package/dist/static/optoma/product-4.jpg +0 -0
  85. package/dist/static/optoma/product-4.png +0 -0
  86. package/dist/static/optoma/product-5.jpg +0 -0
  87. package/dist/static/optoma/product-6.jpg +0 -0
  88. package/dist/static/optoma/professionelle-displays.svg +0 -4
  89. package/dist/static/optoma/square-1.jpg +0 -0
  90. package/dist/static/optoma/square-2.jpg +0 -0
  91. package/dist/static/optoma/zubeh/303/266r.svg +0 -5
@@ -3,7 +3,7 @@
3
3
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
4
4
  * and run json-schema-to-typescript to regenerate this file.
5
5
  */
6
- import { SectionProps } from "./SectionProps-2a23ef89.js";
6
+ import { SectionProps } from "./SectionProps-d60aba86.js";
7
7
  import { BlogTeaserProps } from "./BlogTeaserProps-f5855e93.js";
8
8
  import { CtaProps } from "./CtaProps-789f8508.js";
9
9
  import { SeoProps } from "./SeoProps-f2d6dcaa.js";
@@ -5,7 +5,7 @@
5
5
  */
6
6
  import { BlogHeadProps } from "./BlogHeadProps-c04a5ed8.js";
7
7
  import { BlogAsideProps } from "./BlogAsideProps-c760fd2a.js";
8
- import { SectionProps } from "./SectionProps-2a23ef89.js";
8
+ import { SectionProps } from "./SectionProps-d60aba86.js";
9
9
  import { CtaProps } from "./CtaProps-789f8508.js";
10
10
  import { SeoProps } from "./SeoProps-f2d6dcaa.js";
11
11
  /**
@@ -0,0 +1,53 @@
1
+ /**
2
+ * This file was automatically generated by json-schema-to-typescript.
3
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
4
+ * and run json-schema-to-typescript to regenerate this file.
5
+ */
6
+ /**
7
+ * Text content of headline
8
+ */
9
+ type Text = string;
10
+ /**
11
+ * Subheadline content
12
+ */
13
+ type Sub = string;
14
+ /**
15
+ * Switch order of headline and subheadline
16
+ */
17
+ type SwitchOrder = boolean;
18
+ type SectionAlignment = "left" | "center" | "right";
19
+ /**
20
+ * Level of headline to use
21
+ */
22
+ type Level = "h1" | "h2" | "h3" | "h4" | "p";
23
+ /**
24
+ * Style of headline to show
25
+ */
26
+ type Style = "h1" | "h2" | "h3" | "h4" | "p";
27
+ /**
28
+ * Whether to display space after headline
29
+ */
30
+ type SpaceAfter = "minimum" | "small" | "large";
31
+ /**
32
+ * Set a custom class name
33
+ */
34
+ type ClassName = string;
35
+ /**
36
+ * Set a custom id attribute
37
+ */
38
+ type ID = string;
39
+ /**
40
+ * Component used for headlines
41
+ */
42
+ interface HeadlineProps {
43
+ text: Text;
44
+ sub?: Sub;
45
+ switchOrder?: SwitchOrder;
46
+ align?: SectionAlignment;
47
+ level: Level;
48
+ style?: Style;
49
+ spaceAfter?: SpaceAfter;
50
+ className?: ClassName;
51
+ id?: ID;
52
+ }
53
+ export { Text, Sub, SwitchOrder, SectionAlignment, Level, Style, SpaceAfter, ClassName, ID, HeadlineProps };
@@ -3,7 +3,7 @@
3
3
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
4
4
  * and run json-schema-to-typescript to regenerate this file.
5
5
  */
6
- import { SectionProps } from "./SectionProps-2a23ef89.js";
6
+ import { SectionProps } from "./SectionProps-d60aba86.js";
7
7
  import { SeoProps } from "./SeoProps-f2d6dcaa.js";
8
8
  /**
9
9
  * Collection of sections (with their contents) to render on the page
@@ -0,0 +1,29 @@
1
+ /**
2
+ * This file was automatically generated by json-schema-to-typescript.
3
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
4
+ * and run json-schema-to-typescript to regenerate this file.
5
+ */
6
+ /**
7
+ * Placeholder text for the search input field.
8
+ */
9
+ type Placeholder = string;
10
+ interface SearchBarProps {
11
+ placeholder?: Placeholder;
12
+ /**
13
+ * Text displayed on the search button.
14
+ */
15
+ buttonText?: string;
16
+ /**
17
+ * Additional information or instructions related to the search functionality.
18
+ */
19
+ hint?: string;
20
+ /**
21
+ * Text to display when offering alternative results.
22
+ */
23
+ alternativeText?: string;
24
+ /**
25
+ * The alternative result to display when offering suggestions.
26
+ */
27
+ alternativeResult?: string;
28
+ }
29
+ export { Placeholder, SearchBarProps };
@@ -33,7 +33,7 @@ type Width = "full" | "max" | "wide" | "default" | "narrow";
33
33
  /**
34
34
  * Style of background
35
35
  */
36
- type Style = "default" | "framed" | "inset";
36
+ type Style = "default" | "framed" | "deko";
37
37
  /**
38
38
  * Color of background
39
39
  */
@@ -39,7 +39,7 @@
39
39
  "enum": [
40
40
  "default",
41
41
  "framed",
42
- "inset"
42
+ "deko"
43
43
  ],
44
44
  "default": "default"
45
45
  },
@@ -311,7 +311,7 @@
311
311
  "enum": [
312
312
  "default",
313
313
  "framed",
314
- "inset"
314
+ "deko"
315
315
  ],
316
316
  "default": "default"
317
317
  },
@@ -1,7 +1,7 @@
1
1
  .dsa-button {
2
2
  --dsa-button--padding: 0.75em 1.5em;
3
3
  --dsa-button--border-width: var(--ks-border-width-default);
4
- --dsa-button--border-radius: var(--ks-border-radius-pill);
4
+ --dsa-button--border-radius: var(--ks-border-radius-control);
5
5
  --dsa-button--font-weight: var(--ks-font-weight-semi-bold);
6
6
  --dsa-button--text-transform: default;
7
7
  --dsa-button_small--font: var(--ks-font-interface-s);
@@ -1,8 +1,25 @@
1
1
  import { define } from '@kickstartds/core/lib/component';
2
+ import 'c15t';
2
3
  import CookieConsent from './CookieConsent.client.js';
3
4
 
4
- const translate = (elements, state) => {
5
- const translations = state.translationConfig.translations[state.translationConfig.defaultLanguage];
5
+ const customTranslations = {
6
+ de: {
7
+ accept: "Akzeptieren",
8
+ reject: "Ablehnen",
9
+ required: "Immer aktiv",
10
+ settings: "Cookies verwalten",
11
+ },
12
+ en: {
13
+ accept: "Accept",
14
+ reject: "Reject",
15
+ required: "Always Active",
16
+ settings: "Cookie Preferences",
17
+ },
18
+ };
19
+ const translate = (elements, translationConfig) => {
20
+ const defaultLanguage = translationConfig.defaultLanguage;
21
+ const translations = translationConfig.translations[defaultLanguage];
22
+ const customTranslation = customTranslations[defaultLanguage] || customTranslations.en;
6
23
  // Notice
7
24
  elements.notice.title.textContent = translations.cookieBanner.title;
8
25
  elements.notice.description.textContent =
@@ -25,7 +42,19 @@ const translate = (elements, state) => {
25
42
  translation.title;
26
43
  option.querySelector(".dsa-cookie-consent-dialogue__option-description").textContent = translation.description;
27
44
  }
45
+ const requiredLabel = option.querySelector(".dsa-cookie-consent-dialogue__label");
46
+ if (requiredLabel)
47
+ requiredLabel.textContent = customTranslation.required;
48
+ }
49
+ for (const element of elements.dialog.form.elements) {
50
+ if (element.type === "radio") {
51
+ element.nextElementSibling.nextElementSibling.textContent =
52
+ customTranslation[element.value];
53
+ }
28
54
  }
55
+ // settings
56
+ elements.settings.button.firstElementChild.textContent =
57
+ customTranslation.settings;
29
58
  };
30
59
  class CookieConsentC15t extends CookieConsent {
31
60
  constructor(element) {
@@ -57,7 +86,7 @@ class CookieConsentC15t extends CookieConsent {
57
86
  }
58
87
  };
59
88
  const unsub = store.subscribe(update);
60
- translate(this.elements, initialState);
89
+ translate(this.elements, initialState.translationConfig);
61
90
  update(initialState);
62
91
  const acceptCustom = () => {
63
92
  const state = store.getState();
@@ -12,7 +12,6 @@ declare class CookieConsent {
12
12
  };
13
13
  dialog: {
14
14
  wrapper: any;
15
- overlay: any;
16
15
  title: any;
17
16
  description: any;
18
17
  closeBtn: any;
@@ -15,7 +15,6 @@ class CookieConsent extends Component {
15
15
  },
16
16
  dialog: {
17
17
  wrapper: $(".dsa-cookie-consent-dialogue"),
18
- overlay: $(".dsa-cookie-consent-overlay"),
19
18
  title: $(".dsa-cookie-consent-dialogue__title .dsa-headline__inner"),
20
19
  description: $(".dsa-cookie-consent-dialogue__description"),
21
20
  closeBtn: $(".dsa-cookie-consent-dialogue__close"),
@@ -29,19 +28,19 @@ class CookieConsent extends Component {
29
28
  },
30
29
  });
31
30
  const showDialog = () => {
32
- elements.dialog.overlay.removeAttribute("hidden");
33
- elements.dialog.wrapper.removeAttribute("hidden");
34
- elements.dialog.wrapper.setAttribute("aria-hidden", "false");
31
+ elements.dialog.wrapper.showModal();
35
32
  };
36
33
  const closeDialog = () => {
37
- elements.dialog.overlay.setAttribute("hidden", "");
38
- elements.dialog.wrapper.setAttribute("hidden", "");
39
- elements.dialog.wrapper.setAttribute("aria-hidden", "true");
34
+ elements.dialog.wrapper.close();
40
35
  };
41
36
  const closeDialogAndReset = () => {
42
37
  closeDialog();
43
38
  elements.dialog.form.reset();
44
39
  };
40
+ const onBackdropClick = (event) => {
41
+ if (event.target === elements.dialog.wrapper)
42
+ closeDialogAndReset();
43
+ };
45
44
  const activateAll = () => {
46
45
  for (const element of elements.dialog.form.elements) {
47
46
  if (element.value === "accept") {
@@ -56,16 +55,12 @@ class CookieConsent extends Component {
56
55
  }
57
56
  }
58
57
  };
59
- const onSubmit = (event) => {
60
- event.preventDefault();
61
- closeDialog();
62
- };
63
58
  elements.notice.customizeBtn.addEventListener("click", showDialog);
64
59
  elements.settings.button.addEventListener("click", showDialog);
65
60
  elements.dialog.closeBtn.addEventListener("click", closeDialogAndReset);
66
61
  elements.dialog.activateAllBtn.addEventListener("click", activateAll);
67
62
  elements.dialog.deactivateAllBtn.addEventListener("click", deactivateAll);
68
- elements.dialog.form.addEventListener("submit", onSubmit);
63
+ elements.dialog.wrapper.addEventListener("click", onBackdropClick);
69
64
  window._ks.radio.on(CookieConsent.identifier + ".showNotice", (_, value) => {
70
65
  this.showNotice = value;
71
66
  });
@@ -75,7 +70,7 @@ class CookieConsent extends Component {
75
70
  elements.dialog.closeBtn.removeEventListener("click", closeDialogAndReset);
76
71
  elements.dialog.activateAllBtn.removeEventListener("click", activateAll);
77
72
  elements.dialog.deactivateAllBtn.removeEventListener("click", deactivateAll);
78
- elements.dialog.form.removeEventListener("submit", onSubmit);
73
+ elements.dialog.wrapper.removeEventListener("click", onBackdropClick);
79
74
  });
80
75
  }
81
76
  set showNotice(value) {
@@ -144,20 +144,16 @@
144
144
  left: 0;
145
145
  }
146
146
 
147
- .dsa-cookie-consent-dialogue {
147
+ .dsa-cookie-consent-dialogue[open] {
148
148
  border-radius: var(--dsa-cookie-consent-dialogue--border-radius, var(--ks-border-radius-card));
149
149
  border: var(--dsa-cookie-consent-dialogue--border, var(--ks-border-color-interface) solid var(--ks-border-width-default));
150
150
  box-shadow: var(--dsa-cookie-consent-dialogue--box-shadow, var(--ks-box-shadow-card));
151
151
  background-color: var(--dsa-cookie-consent-dialogue--background-color, var(--ks-background-color-default));
152
152
  display: flex;
153
153
  flex-direction: column;
154
- position: absolute;
155
- top: 50%;
156
- left: 50%;
157
- transform: translate(-50%, -50%);
154
+ padding: 0;
158
155
  width: calc(100% - var(--dsa-cookie-consent-dialogue--spacing-horizontal, var(--ks-spacing-inset-xs)) * 2);
159
156
  max-width: var(--dsa-cookie-consent-dialogue--max-width, var(--dsa-tile--width_largest));
160
- z-index: 1000;
161
157
  max-height: calc(var(--dsa-cookie-consent-dialogue--max-height, 100%) - var(--dsa-cookie-consent-dialogue--spacing-vertical, var(--ks-spacing-inset-xs)) * 2);
162
158
  }
163
159
  .dsa-cookie-consent-dialogue__header {
@@ -254,14 +250,6 @@
254
250
  flex-direction: row;
255
251
  }
256
252
  }
257
-
258
- .dsa-cookie-consent-overlay {
259
- content: "";
260
- position: absolute;
261
- top: 0%;
262
- left: 0%;
263
- width: 100%;
264
- height: 100%;
265
- z-index: 999;
253
+ .dsa-cookie-consent-dialogue::backdrop {
266
254
  background-color: var(--dsa-cookie-consent-overlay--background-color, var(--dsa-overlay--background-color));
267
255
  }
@@ -14,7 +14,7 @@ import '@kickstartds/base/lib/button';
14
14
  import '@kickstartds/core/lib/component';
15
15
 
16
16
  const CookieConsentContextDefault = forwardRef(({ notice, revisitButton, dialogue, component = "dsa.cookie-consent" }, ref) => {
17
- return (jsxs("div", { className: "dsa-cookie-consent", "ks-component": component, ref: ref, children: [jsxs("div", { className: classnames(`dsa-cookie-consent-notice dsa-cookie-consent-notice--${notice?.displayMode}`), hidden: true, children: [jsx(Headline, { spaceAfter: "minimum", text: notice?.title, level: "h2", style: "h3", className: "dsa-cookie-consent-notice__title" }), jsx(RichText, { text: notice?.description, className: "dsa-cookie-consent-notice__description" }), jsxs("div", { className: "dsa-cookie-consent-notice__buttons", children: [jsx(Button, { size: "small", label: notice?.customizeButton?.label, variant: notice?.customizeButton?.variant, className: "dsa-cookie-consent-notice__button--customize" }), jsx(Button, { size: "small", label: notice?.rejectButton?.label, variant: notice?.decisionButtonVariant, className: "dsa-cookie-consent-notice__button--reject" }), jsx(Button, { size: "small", label: notice?.acceptButton?.label, variant: notice?.decisionButtonVariant, className: "dsa-cookie-consent-notice__button--accept" })] })] }), jsx(Button, { className: "dsa-cookie-consent-revisit", size: "small", variant: "primary", icon: "star", label: revisitButton?.label || "Cookie Preferences", hidden: true }), jsxs("div", { className: "dsa-cookie-consent-dialogue", hidden: true, "aria-hidden": true, children: [jsxs("div", { className: "dsa-cookie-consent-dialogue__header", children: [jsx(Headline, { spaceAfter: "minimum", text: dialogue?.title, level: "h2", style: "h3", className: "dsa-cookie-consent-dialogue__title" }), jsx(Button, { "aria-label": "Close Cookie Consent Dialogue", className: "dsa-cookie-consent-dialogue__close", icon: "close", label: "" })] }), jsxs("form", { className: "dsa-cookie-consent-dialogue__form", children: [jsxs("div", { className: "dsa-cookie-consent-dialogue__content", children: [jsx(RichText, { className: "dsa-cookie-consent-dialogue__description", text: dialogue?.description }), jsxs("div", { className: "dsa-cookie-consent-dialogue__options", children: [dialogue?.required?.map((option, index) => (jsxs("div", { className: "dsa-cookie-consent-dialogue__option", "data-consent-type": option.key, children: [jsx(Headline, { spaceAfter: "minimum", text: option.name, level: "h3", style: "h4" }), jsx(Markdown, { className: "dsa-cookie-consent-dialogue__option-description", children: option.description }), jsx("span", { className: "dsa-cookie-consent-dialogue__label", children: dialogue?.alwaysActiveLabel || "Always Active" })] }, index))), dialogue?.options?.map((option, index) => (jsxs("div", { className: "dsa-cookie-consent-dialogue__option", "data-consent-type": option.key, children: [jsx(Headline, { spaceAfter: "minimum", text: option.name, level: "h3", style: "h4" }), jsx(Markdown, { className: "dsa-cookie-consent-dialogue__option-description", children: option.description }), jsxs("div", { className: "dsa-cookie-consent-dialogue__toggle", children: [jsx(Radio, { name: option.key, label: dialogue?.toggleLabels?.accept || "Accept", value: "accept" }), jsx(Radio, { name: option.key, label: dialogue?.toggleLabels?.reject || "Reject", value: "reject" })] })] }, index)))] })] }), jsxs("div", { className: "dsa-cookie-consent-dialogue__buttons", children: [jsx(Button, { type: "button", size: "small", variant: dialogue?.decisionButtonVariant, label: dialogue?.buttons.acceptLabel || "Accept All", className: "dsa-cookie-consent-dialogue__button--activate-all" }), jsx(Button, { type: "button", size: "small", variant: dialogue?.decisionButtonVariant, label: dialogue?.buttons.rejectLabel || "Reject All", className: "dsa-cookie-consent-dialogue__button--deactivate-all" }), jsx(Button, { type: "submit", size: "small", variant: "primary", label: dialogue?.buttons.savePreferencesLabel || "Save Preferences", className: "dsa-cookie-consent-dialogue__button--save" })] })] })] }), jsx("div", { className: "dsa-cookie-consent-overlay", hidden: true })] }));
17
+ return (jsxs("div", { className: "dsa-cookie-consent", "ks-component": component, ref: ref, children: [jsxs("div", { className: classnames(`dsa-cookie-consent-notice dsa-cookie-consent-notice--${notice?.displayMode}`), hidden: true, children: [jsx(Headline, { spaceAfter: "minimum", text: notice?.title, level: "h2", style: "h3", className: "dsa-cookie-consent-notice__title" }), jsx(RichText, { text: notice?.description, className: "dsa-cookie-consent-notice__description" }), jsxs("div", { className: "dsa-cookie-consent-notice__buttons", children: [jsx(Button, { size: "small", label: notice?.customizeButton?.label, variant: notice?.customizeButton?.variant, className: "dsa-cookie-consent-notice__button--customize" }), jsx(Button, { size: "small", label: notice?.rejectButton?.label, variant: notice?.decisionButtonVariant, className: "dsa-cookie-consent-notice__button--reject" }), jsx(Button, { size: "small", label: notice?.acceptButton?.label, variant: notice?.decisionButtonVariant, className: "dsa-cookie-consent-notice__button--accept" })] })] }), jsx(Button, { className: "dsa-cookie-consent-revisit", size: "small", variant: "primary", icon: "star", label: revisitButton?.label || "Cookie Preferences", hidden: true }), jsxs("dialog", { className: "dsa-cookie-consent-dialogue", children: [jsxs("div", { className: "dsa-cookie-consent-dialogue__header", children: [jsx(Headline, { spaceAfter: "minimum", text: dialogue?.title, level: "h2", style: "h3", className: "dsa-cookie-consent-dialogue__title" }), jsx(Button, { "aria-label": "Close Cookie Consent Dialogue", className: "dsa-cookie-consent-dialogue__close", icon: "close", label: "", autoFocus: true })] }), jsxs("form", { className: "dsa-cookie-consent-dialogue__form", method: "dialog", children: [jsxs("div", { className: "dsa-cookie-consent-dialogue__content", children: [jsx(RichText, { className: "dsa-cookie-consent-dialogue__description", text: dialogue?.description }), jsxs("div", { className: "dsa-cookie-consent-dialogue__options", children: [dialogue?.required?.map((option, index) => (jsxs("div", { className: "dsa-cookie-consent-dialogue__option", "data-consent-type": option.key, children: [jsx(Headline, { spaceAfter: "minimum", text: option.name, level: "h3", style: "h4" }), jsx(Markdown, { className: "dsa-cookie-consent-dialogue__option-description", children: option.description }), jsx("span", { className: "dsa-cookie-consent-dialogue__label", children: dialogue?.alwaysActiveLabel || "Always Active" })] }, index))), dialogue?.options?.map((option, index) => (jsxs("div", { className: "dsa-cookie-consent-dialogue__option", "data-consent-type": option.key, children: [jsx(Headline, { spaceAfter: "minimum", text: option.name, level: "h3", style: "h4" }), jsx(Markdown, { className: "dsa-cookie-consent-dialogue__option-description", children: option.description }), jsxs("div", { className: "dsa-cookie-consent-dialogue__toggle", children: [jsx(Radio, { name: option.key, label: dialogue?.toggleLabels?.accept || "Accept", value: "accept" }), jsx(Radio, { name: option.key, label: dialogue?.toggleLabels?.reject || "Reject", value: "reject" })] })] }, index)))] })] }), jsxs("div", { className: "dsa-cookie-consent-dialogue__buttons", children: [jsx(Button, { type: "button", size: "small", variant: dialogue?.decisionButtonVariant, label: dialogue?.buttons.acceptLabel || "Accept All", className: "dsa-cookie-consent-dialogue__button--activate-all" }), jsx(Button, { type: "button", size: "small", variant: dialogue?.decisionButtonVariant, label: dialogue?.buttons.rejectLabel || "Reject All", className: "dsa-cookie-consent-dialogue__button--deactivate-all" }), jsx(Button, { type: "submit", size: "small", variant: "primary", label: dialogue?.buttons.savePreferencesLabel || "Save Preferences", className: "dsa-cookie-consent-dialogue__button--save" })] })] })] })] }));
18
18
  });
19
19
  const CookieConsentContext = createContext(CookieConsentContextDefault);
20
20
  const CookieConsent = forwardRef((props, ref) => {
@@ -4,7 +4,6 @@
4
4
  --dsa-feature__title--color: var(--dsa-topic--color);
5
5
  --dsa-feature__title--font: var(--ks-font-interface-m);
6
6
  --dsa-feature__title--font-family: var(--dsa-topic--font-family);
7
- --dsa-feature__title--font-weight: var(--dsa-topic--font-weight);
8
7
  --dsa-feature__copy--color: var(--ks-text-color-copy);
9
8
  --dsa-feature__copy--font: var(--ks-font-copy-s);
10
9
  --dsa-feature__link--font: var(--ks-font-copy-s);
@@ -15,7 +14,7 @@
15
14
  --dsa-feature__link--text-decoration_hover: none;
16
15
  --dsa-feature__icon--color: var(--ks-text-color-primary);
17
16
  --dsa-feature_small__icon--size: calc(var(--ks-line-height-interface-m) * var(--ks-font-size-interface-m));
18
- --dsa-feature_large__icon--size-multiplier: 2;
17
+ --dsa-feature_large__icon--size-multiplier: 2.5;
19
18
  --dsa-feature_small--gap: var(--ks-spacing-xs);
20
19
  --dsa-feature_large--gap: var(--ks-spacing-s);
21
20
  --dsa-feature_small__icon--gap: var(--ks-spacing-xs);
@@ -1,6 +1,6 @@
1
1
  .dsa-footer {
2
- --dsa-footer--background-color: var(--ks-background-color-accent);
3
- --dsa-footer--border-top: 0;
2
+ --dsa-footer--background-color: var(--ks-background-color-default);
3
+ --dsa-footer--border-top: 1px solid var(--ks-border-color-default);
4
4
  --dsa-footer--max-width: var(--dsa-content--width_wide);
5
5
  --dsa-footer--gap-vertical: var(--ks-spacing-stack-m);
6
6
  --dsa-footer__byline--font: var(--ks-font-copy-xs);
@@ -107,54 +107,16 @@
107
107
  "examples": [
108
108
  [
109
109
  {
110
- "label": "Beamer",
110
+ "label": "Active Item",
111
111
  "url": "#",
112
- "active": true,
113
- "items": [
114
- {
115
- "label": "Level 2 Item",
116
- "url": "#"
117
- },
118
- {
119
- "label": "Active Item",
120
- "active": true,
121
- "url": "#"
122
- },
123
- {
124
- "label": "An Item with a longer Label",
125
- "url": "#"
126
- },
127
- {
128
- "label": "And One last one",
129
- "url": "#"
130
- }
131
- ]
112
+ "active": true
132
113
  },
133
114
  {
134
- "label": "Interaktive Displays",
135
- "url": "#",
136
- "items": [
137
- {
138
- "label": "Level 2 Item",
139
- "url": "#"
140
- },
141
- {
142
- "label": "Active Item",
143
- "active": true,
144
- "url": "#"
145
- },
146
- {
147
- "label": "An Item with a longer Label",
148
- "url": "#"
149
- },
150
- {
151
- "label": "And One last one",
152
- "url": "#"
153
- }
154
- ]
115
+ "label": "Navigation Item",
116
+ "url": "#"
155
117
  },
156
118
  {
157
- "label": "Professional Displays",
119
+ "label": "Dropdown",
158
120
  "url": "#",
159
121
  "items": [
160
122
  {
@@ -177,119 +139,12 @@
177
139
  ]
178
140
  },
179
141
  {
180
- "label": "LED Displays",
181
- "url": "#",
182
- "items": [
183
- {
184
- "label": "Level 2 Item",
185
- "url": "#"
186
- },
187
- {
188
- "label": "Active Item",
189
- "active": true,
190
- "url": "#"
191
- },
192
- {
193
- "label": "An Item with a longer Label",
194
- "url": "#"
195
- },
196
- {
197
- "label": "And One last one",
198
- "url": "#"
199
- }
200
- ]
142
+ "label": "One more Item",
143
+ "url": "#"
201
144
  },
202
145
  {
203
- "label": "Lösungen",
204
- "url": "#",
205
- "items": [
206
- {
207
- "label": "Level 2 Item",
208
- "url": "#"
209
- },
210
- {
211
- "label": "Active Item",
212
- "active": true,
213
- "url": "#"
214
- },
215
- {
216
- "label": "An Item with a longer Label",
217
- "url": "#"
218
- },
219
- {
220
- "label": "And One last one",
221
- "url": "#"
222
- }
223
- ]
224
- },
225
- {
226
- "label": "Zubehör",
227
- "url": "#",
228
- "items": [
229
- {
230
- "label": "Level 2 Item",
231
- "url": "#"
232
- },
233
- {
234
- "label": "Active Item",
235
- "active": true,
236
- "url": "#"
237
- },
238
- {
239
- "label": "An Item with a longer Label",
240
- "url": "#"
241
- },
242
- {
243
- "label": "And One last one",
244
- "url": "#"
245
- }
246
- ]
247
- },
248
- {
249
- "label": "Über Optoma",
250
- "url": "#",
251
- "items": [
252
- {
253
- "label": "Level 2 Item",
254
- "url": "#"
255
- },
256
- {
257
- "label": "Active Item",
258
- "active": true,
259
- "url": "#"
260
- },
261
- {
262
- "label": "An Item with a longer Label",
263
- "url": "#"
264
- },
265
- {
266
- "label": "And One last one",
267
- "url": "#"
268
- }
269
- ]
270
- },
271
- {
272
- "label": "Support",
273
- "url": "#",
274
- "items": [
275
- {
276
- "label": "Level 2 Item",
277
- "url": "#"
278
- },
279
- {
280
- "label": "Active Item",
281
- "active": true,
282
- "url": "#"
283
- },
284
- {
285
- "label": "An Item with a longer Label",
286
- "url": "#"
287
- },
288
- {
289
- "label": "And One last one",
290
- "url": "#"
291
- }
292
- ]
146
+ "label": "Last Item",
147
+ "url": "#"
293
148
  }
294
149
  ]
295
150
  ]