@kickstartds/ds-agency-premium 1.6.68--canary.44.1645.0 → 1.6.68--canary.44.1652.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.
- package/dist/components/header/header.css +0 -2
- package/dist/components/page-wrapper/tokens.css +1 -1
- package/dist/components/teaser-card/teaser-card.css +22 -6
- package/dist/global.css +138 -0
- package/dist/tokens/themes.css +4 -4
- package/dist/tokens/tokens.css +1 -1
- package/dist/tokens/tokens.js +1 -1
- package/package.json +1 -1
|
@@ -11,9 +11,7 @@
|
|
|
11
11
|
:root,
|
|
12
12
|
[ks-theme],
|
|
13
13
|
[ks-inverted] {
|
|
14
|
-
--dsa-header--spacing-vertical: var(--ks-spacing-stack-s);
|
|
15
14
|
--dsa-header--spacing-horizontal: var(--dsa-content--horizontal-spacing);
|
|
16
|
-
--dsa-header_floating--spacing-horizontal: var(--ks-spacing-inset-m);
|
|
17
15
|
}
|
|
18
16
|
}
|
|
19
17
|
|
|
@@ -19,29 +19,41 @@
|
|
|
19
19
|
--dsa-teaser-card__label--padding: 0.5em 1em;
|
|
20
20
|
--dsa-teaser-card__label--border-radius: var(--ks-border-radius-pill);
|
|
21
21
|
--dsa-teaser-card__label--border: 1px solid var(--ks-border-color-interface);
|
|
22
|
-
--dsa-teaser-
|
|
22
|
+
--dsa-teaser-card__button--font: var(--ks-font-interface-m);
|
|
23
|
+
--dsa-teaser-card--padding: var(--ks-spacing-inset-m);
|
|
24
|
+
--dsa-teaser-card__topic--font: var(--ks-font-display-m);
|
|
23
25
|
--dsa-teaser-card__topic--font-weight: var(--dsa-topic--font-weight);
|
|
24
|
-
--dsa-teaser-card__copy--font: var(--
|
|
26
|
+
--dsa-teaser-card__copy--font: var(--ks-font-copy-s);
|
|
25
27
|
--dsa-teaser-card__copy--color: var(--ks-text-color-default);
|
|
26
|
-
--dsa-teaser-
|
|
28
|
+
--dsa-teaser-card__button--font: var(--ks-font-interface-s);
|
|
29
|
+
}
|
|
30
|
+
@container teaser-card (min-width: 400px) {
|
|
31
|
+
.dsa-teaser-card {
|
|
32
|
+
--dsa-teaser-card--padding: var(--ks-spacing-inset-l);
|
|
33
|
+
--dsa-teaser-card__topic--font: var(--ks-font-display-l);
|
|
34
|
+
--dsa-teaser-card__copy--font: var(--ks-font-copy-m);
|
|
35
|
+
--dsa-teaser-card__button--font: var(--ks-font-interface-m);
|
|
36
|
+
}
|
|
27
37
|
}
|
|
28
38
|
@media (min-width: 48em) {
|
|
29
39
|
.dsa-teaser-card {
|
|
30
40
|
--dsa-teaser-card__topic--font: var(--ks-font-display-s);
|
|
31
41
|
--dsa-teaser-card__copy--font: var(--ks-font-copy-s);
|
|
32
|
-
--dsa-teaser-card--padding: var(--ks-spacing-inset-
|
|
42
|
+
--dsa-teaser-card--padding: var(--ks-spacing-inset-m);
|
|
43
|
+
--dsa-teaser-card__button--font: var(--ks-font-interface-s);
|
|
33
44
|
}
|
|
34
|
-
@container teaser-card (min-width:
|
|
45
|
+
@container teaser-card (min-width: 400px) {
|
|
35
46
|
.dsa-teaser-card {
|
|
36
47
|
--dsa-teaser-card__copy--font: var(--ks-font-copy-m);
|
|
37
48
|
--dsa-teaser-card__topic--font: var(--ks-font-display-m);
|
|
49
|
+
--dsa-teaser-card__button--font: var(--ks-font-interface-m);
|
|
38
50
|
}
|
|
39
51
|
}
|
|
40
52
|
@container teaser-card (min-width: 820px) {
|
|
41
53
|
.dsa-teaser-card {
|
|
54
|
+
--dsa-teaser-card--padding: var(--ks-spacing-inset-l);
|
|
42
55
|
--dsa-teaser-card__topic--font: var(--ks-font-display-l);
|
|
43
56
|
--dsa-teaser-card__copy--font: var(--ks-font-copy-l);
|
|
44
|
-
--dsa-teaser-card--padding: var(--ks-spacing-inset-l);
|
|
45
57
|
}
|
|
46
58
|
}
|
|
47
59
|
}
|
|
@@ -113,6 +125,10 @@
|
|
|
113
125
|
color: var(--dsa-teaser-card__label--color);
|
|
114
126
|
background-color: var(--dsa-teaser-card__label--background-color);
|
|
115
127
|
}
|
|
128
|
+
.dsa-teaser-card .c-teaser__link .dsa-button {
|
|
129
|
+
font: var(--dsa-teaser-card__button--font, var(--dsa-button_medium--font));
|
|
130
|
+
padding: var(--dsa-teaser-card__button--padding, var(--dsa-button--padding));
|
|
131
|
+
}
|
|
116
132
|
@container teaser-card (min-width: 640px) {
|
|
117
133
|
.dsa-teaser-card--unset img {
|
|
118
134
|
height: 100%;
|
package/dist/global.css
CHANGED
|
@@ -342,6 +342,144 @@ h3 {
|
|
|
342
342
|
}
|
|
343
343
|
}
|
|
344
344
|
|
|
345
|
+
:root,
|
|
346
|
+
[ks-theme],
|
|
347
|
+
[ks-inverted=false],
|
|
348
|
+
[ks-inverted=true] {
|
|
349
|
+
--spacing-base: 18px;
|
|
350
|
+
--spacing-shrink-factor: 0.75;
|
|
351
|
+
--spacing-grow-factor: 1.275;
|
|
352
|
+
--spacing-bp-factor: 1.0135;
|
|
353
|
+
--spacing-xxs-bp-factor: calc(1 * var(--spacing-bp-factor));
|
|
354
|
+
--spacing-xs-bp-factor: calc(var(--spacing-xxs-bp-factor) * var(--spacing-bp-factor));
|
|
355
|
+
--spacing-s-bp-factor: calc(var(--spacing-xs-bp-factor) * var(--spacing-bp-factor));
|
|
356
|
+
--spacing-m-bp-factor: calc(var(--spacing-s-bp-factor) * var(--spacing-bp-factor));
|
|
357
|
+
--spacing-l-bp-factor: calc(var(--spacing-m-bp-factor) * var(--spacing-bp-factor));
|
|
358
|
+
--spacing-xl-bp-factor: calc(var(--spacing-l-bp-factor) * var(--spacing-bp-factor));
|
|
359
|
+
--spacing-xxl-bp-factor: calc(var(--spacing-xl-bp-factor) * var(--spacing-bp-factor));
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
:root,
|
|
363
|
+
[ks-theme],
|
|
364
|
+
[ks-inverted=false],
|
|
365
|
+
[ks-inverted=true] {
|
|
366
|
+
--ks-spacing-xxs-base: calc(var(--ks-spacing-xs-base) * calc(var(--spacing-shrink-factor) * 1));
|
|
367
|
+
--ks-spacing-xs-base: calc(var(--ks-spacing-s-base) * calc(var(--spacing-shrink-factor) * 1));
|
|
368
|
+
--ks-spacing-s-base: calc(var(--ks-spacing-m-base) * calc(var(--spacing-shrink-factor) * 1));
|
|
369
|
+
--ks-spacing-m-base: var(--spacing-base);
|
|
370
|
+
--ks-spacing-l-base: calc(var(--ks-spacing-m-base) * var(--spacing-grow-factor));
|
|
371
|
+
--ks-spacing-xl-base: calc(var(--ks-spacing-l-base) * var(--spacing-grow-factor));
|
|
372
|
+
--ks-spacing-xxl-base: calc(var(--ks-spacing-xl-base) * var(--spacing-grow-factor));
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
:root,
|
|
376
|
+
[ks-theme],
|
|
377
|
+
[ks-inverted=false],
|
|
378
|
+
[ks-inverted=true] {
|
|
379
|
+
--ks-spacing-xxs-bp-factor-phone: calc(1 * var(--spacing-xxs-bp-factor));
|
|
380
|
+
--ks-spacing-xxs-bp-factor-tablet: calc(var(--ks-spacing-xxs-bp-factor-phone) * var(--spacing-xxs-bp-factor));
|
|
381
|
+
--ks-spacing-xxs-bp-factor-laptop: calc(var(--ks-spacing-xxs-bp-factor-tablet) * var(--spacing-xxs-bp-factor));
|
|
382
|
+
--ks-spacing-xxs-bp-factor-desktop: calc(var(--ks-spacing-xxs-bp-factor-laptop) * var(--spacing-xxs-bp-factor));
|
|
383
|
+
--ks-spacing-xs-bp-factor-phone: calc(1 * var(--spacing-xs-bp-factor));
|
|
384
|
+
--ks-spacing-xs-bp-factor-tablet: calc(var(--ks-spacing-xs-bp-factor-phone) * var(--spacing-xs-bp-factor));
|
|
385
|
+
--ks-spacing-xs-bp-factor-laptop: calc(var(--ks-spacing-xs-bp-factor-tablet) * var(--spacing-xs-bp-factor));
|
|
386
|
+
--ks-spacing-xs-bp-factor-desktop: calc(var(--ks-spacing-xs-bp-factor-laptop) * var(--spacing-xs-bp-factor));
|
|
387
|
+
--ks-spacing-s-bp-factor-phone: calc(1 * var(--spacing-s-bp-factor));
|
|
388
|
+
--ks-spacing-s-bp-factor-tablet: calc(var(--ks-spacing-s-bp-factor-phone) * var(--spacing-s-bp-factor));
|
|
389
|
+
--ks-spacing-s-bp-factor-laptop: calc(var(--ks-spacing-s-bp-factor-tablet) * var(--spacing-s-bp-factor));
|
|
390
|
+
--ks-spacing-s-bp-factor-desktop: calc(var(--ks-spacing-s-bp-factor-laptop) * var(--spacing-s-bp-factor));
|
|
391
|
+
--ks-spacing-m-bp-factor-phone: calc(1 * var(--spacing-m-bp-factor));
|
|
392
|
+
--ks-spacing-m-bp-factor-tablet: calc(var(--ks-spacing-m-bp-factor-phone) * var(--spacing-m-bp-factor));
|
|
393
|
+
--ks-spacing-m-bp-factor-laptop: calc(var(--ks-spacing-m-bp-factor-tablet) * var(--spacing-m-bp-factor));
|
|
394
|
+
--ks-spacing-m-bp-factor-desktop: calc(var(--ks-spacing-m-bp-factor-laptop) * var(--spacing-m-bp-factor));
|
|
395
|
+
--ks-spacing-l-bp-factor-phone: calc(1 * var(--spacing-l-bp-factor));
|
|
396
|
+
--ks-spacing-l-bp-factor-tablet: calc(var(--ks-spacing-l-bp-factor-phone) * var(--spacing-l-bp-factor));
|
|
397
|
+
--ks-spacing-l-bp-factor-laptop: calc(var(--ks-spacing-l-bp-factor-tablet) * var(--spacing-l-bp-factor));
|
|
398
|
+
--ks-spacing-l-bp-factor-desktop: calc(var(--ks-spacing-l-bp-factor-laptop) * var(--spacing-l-bp-factor));
|
|
399
|
+
--ks-spacing-xl-bp-factor-phone: calc(1 * var(--spacing-xl-bp-factor));
|
|
400
|
+
--ks-spacing-xl-bp-factor-tablet: calc(var(--ks-spacing-xl-bp-factor-phone) * var(--spacing-xl-bp-factor));
|
|
401
|
+
--ks-spacing-xl-bp-factor-laptop: calc(var(--ks-spacing-xl-bp-factor-tablet) * var(--spacing-xl-bp-factor));
|
|
402
|
+
--ks-spacing-xl-bp-factor-desktop: calc(var(--ks-spacing-xl-bp-factor-laptop) * var(--spacing-xl-bp-factor));
|
|
403
|
+
--ks-spacing-xxl-bp-factor-phone: calc(1 * var(--spacing-xxl-bp-factor));
|
|
404
|
+
--ks-spacing-xxl-bp-factor-tablet: calc(var(--ks-spacing-xxl-bp-factor-phone) * var(--spacing-xxl-bp-factor));
|
|
405
|
+
--ks-spacing-xxl-bp-factor-laptop: calc(var(--ks-spacing-xxl-bp-factor-tablet) * var(--spacing-xxl-bp-factor));
|
|
406
|
+
--ks-spacing-xxl-bp-factor-desktop: calc(var(--ks-spacing-xxl-bp-factor-laptop) * var(--spacing-xxl-bp-factor));
|
|
407
|
+
}
|
|
408
|
+
|
|
409
|
+
:root,
|
|
410
|
+
[ks-theme],
|
|
411
|
+
[ks-inverted=false],
|
|
412
|
+
[ks-inverted=true] {
|
|
413
|
+
--ks-spacing-xxs: calc(var(--ks-spacing-xxs-base) * var(--ks-spacing-xxs-bp-factor, 1));
|
|
414
|
+
--ks-spacing-xs: calc(var(--ks-spacing-xs-base) * var(--ks-spacing-xs-bp-factor, 1));
|
|
415
|
+
--ks-spacing-s: calc(var(--ks-spacing-s-base) * var(--ks-spacing-s-bp-factor, 1));
|
|
416
|
+
--ks-spacing-m: calc(var(--ks-spacing-m-base) * var(--ks-spacing-m-bp-factor, 1));
|
|
417
|
+
--ks-spacing-l: calc(var(--ks-spacing-l-base) * var(--ks-spacing-l-bp-factor, 1));
|
|
418
|
+
--ks-spacing-xl: calc(var(--ks-spacing-xl-base) * var(--ks-spacing-xl-bp-factor, 1));
|
|
419
|
+
--ks-spacing-xxl: calc(var(--ks-spacing-xxl-base) * var(--ks-spacing-xxl-bp-factor, 1));
|
|
420
|
+
--ks-spacing-stack: calc(var(--ks-spacing-stack-base) * var(--ks-spacing-stack-bp-factor, 1));
|
|
421
|
+
--ks-spacing-inline: calc(var(--ks-spacing-inline-base) * var(--ks-spacing-inline-bp-factor, 1));
|
|
422
|
+
--ks-spacing-inset: calc(var(--ks-spacing-inset-base) * var(--ks-spacing-inset-bp-factor, 1));
|
|
423
|
+
--ks-spacing-inset-squish: calc(var(--ks-spacing-inset-squish-base) * var(--ks-spacing-inset-squish-bp-factor, 1));
|
|
424
|
+
--ks-spacing-inset-stretch: calc(var(--ks-spacing-inset-stretch-base) * var(--ks-spacing-inset-stretch-bp-factor, 1));
|
|
425
|
+
}
|
|
426
|
+
|
|
427
|
+
@media (min-width: 36em) {
|
|
428
|
+
:root,
|
|
429
|
+
[ks-theme],
|
|
430
|
+
[ks-inverted=false],
|
|
431
|
+
[ks-inverted=true] {
|
|
432
|
+
--ks-spacing-xxs-bp-factor: var(--ks-spacing-xxs-bp-factor-phone);
|
|
433
|
+
--ks-spacing-xs-bp-factor: var(--ks-spacing-xs-bp-factor-phone);
|
|
434
|
+
--ks-spacing-s-bp-factor: var(--ks-spacing-s-bp-factor-phone);
|
|
435
|
+
--ks-spacing-m-bp-factor: var(--ks-spacing-m-bp-factor-phone);
|
|
436
|
+
--ks-spacing-l-bp-factor: var(--ks-spacing-l-bp-factor-phone);
|
|
437
|
+
--ks-spacing-xl-bp-factor: var(--ks-spacing-xl-bp-factor-phone);
|
|
438
|
+
--ks-spacing-xxl-bp-factor: var(--ks-spacing-xxl-bp-factor-phone);
|
|
439
|
+
}
|
|
440
|
+
}
|
|
441
|
+
@media (min-width: 48em) {
|
|
442
|
+
:root,
|
|
443
|
+
[ks-theme],
|
|
444
|
+
[ks-inverted=false],
|
|
445
|
+
[ks-inverted=true] {
|
|
446
|
+
--ks-spacing-xxs-bp-factor: var(--ks-spacing-xxs-bp-factor-tablet);
|
|
447
|
+
--ks-spacing-xs-bp-factor: var(--ks-spacing-xs-bp-factor-tablet);
|
|
448
|
+
--ks-spacing-s-bp-factor: var(--ks-spacing-s-bp-factor-tablet);
|
|
449
|
+
--ks-spacing-m-bp-factor: var(--ks-spacing-m-bp-factor-tablet);
|
|
450
|
+
--ks-spacing-l-bp-factor: var(--ks-spacing-l-bp-factor-tablet);
|
|
451
|
+
--ks-spacing-xl-bp-factor: var(--ks-spacing-xl-bp-factor-tablet);
|
|
452
|
+
--ks-spacing-xxl-bp-factor: var(--ks-spacing-xxl-bp-factor-tablet);
|
|
453
|
+
}
|
|
454
|
+
}
|
|
455
|
+
@media (min-width: 62em) {
|
|
456
|
+
:root,
|
|
457
|
+
[ks-theme],
|
|
458
|
+
[ks-inverted=false],
|
|
459
|
+
[ks-inverted=true] {
|
|
460
|
+
--ks-spacing-xxs-bp-factor: var(--ks-spacing-xxs-bp-factor-laptop);
|
|
461
|
+
--ks-spacing-xs-bp-factor: var(--ks-spacing-xs-bp-factor-laptop);
|
|
462
|
+
--ks-spacing-s-bp-factor: var(--ks-spacing-s-bp-factor-laptop);
|
|
463
|
+
--ks-spacing-m-bp-factor: var(--ks-spacing-m-bp-factor-laptop);
|
|
464
|
+
--ks-spacing-l-bp-factor: var(--ks-spacing-l-bp-factor-laptop);
|
|
465
|
+
--ks-spacing-xl-bp-factor: var(--ks-spacing-xl-bp-factor-laptop);
|
|
466
|
+
--ks-spacing-xxl-bp-factor: var(--ks-spacing-xxl-bp-factor-laptop);
|
|
467
|
+
}
|
|
468
|
+
}
|
|
469
|
+
@media (min-width: 75em) {
|
|
470
|
+
:root,
|
|
471
|
+
[ks-theme],
|
|
472
|
+
[ks-inverted=false],
|
|
473
|
+
[ks-inverted=true] {
|
|
474
|
+
--ks-spacing-xxs-bp-factor: var(--ks-spacing-xxs-bp-factor-desktop);
|
|
475
|
+
--ks-spacing-xs-bp-factor: var(--ks-spacing-xs-bp-factor-desktop);
|
|
476
|
+
--ks-spacing-s-bp-factor: var(--ks-spacing-s-bp-factor-desktop);
|
|
477
|
+
--ks-spacing-m-bp-factor: var(--ks-spacing-m-bp-factor-desktop);
|
|
478
|
+
--ks-spacing-l-bp-factor: var(--ks-spacing-l-bp-factor-desktop);
|
|
479
|
+
--ks-spacing-xl-bp-factor: var(--ks-spacing-xl-bp-factor-desktop);
|
|
480
|
+
--ks-spacing-xxl-bp-factor: var(--ks-spacing-xxl-bp-factor-desktop);
|
|
481
|
+
}
|
|
482
|
+
}
|
|
345
483
|
.l-container--blog-teaser {
|
|
346
484
|
/* stylelint-disable-next-line property-no-unknown */
|
|
347
485
|
container-name: blog-teaser;
|
package/dist/tokens/themes.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 18 Jun 2025 10:20:02 GMT
|
|
4
4
|
*/
|
|
5
5
|
:root [ks-theme=business] {
|
|
6
6
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -2727,7 +2727,7 @@
|
|
|
2727
2727
|
}
|
|
2728
2728
|
/**
|
|
2729
2729
|
* Do not edit directly
|
|
2730
|
-
* Generated on
|
|
2730
|
+
* Generated on Wed, 18 Jun 2025 10:20:06 GMT
|
|
2731
2731
|
*/
|
|
2732
2732
|
:root [ks-theme=google] {
|
|
2733
2733
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -5458,7 +5458,7 @@
|
|
|
5458
5458
|
}
|
|
5459
5459
|
/**
|
|
5460
5460
|
* Do not edit directly
|
|
5461
|
-
* Generated on
|
|
5461
|
+
* Generated on Wed, 18 Jun 2025 10:20:04 GMT
|
|
5462
5462
|
*/
|
|
5463
5463
|
:root [ks-theme=ngo] {
|
|
5464
5464
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -8459,7 +8459,7 @@
|
|
|
8459
8459
|
}
|
|
8460
8460
|
/**
|
|
8461
8461
|
* Do not edit directly
|
|
8462
|
-
* Generated on
|
|
8462
|
+
* Generated on Wed, 18 Jun 2025 10:20:08 GMT
|
|
8463
8463
|
*/
|
|
8464
8464
|
:root [ks-theme=telekom] {
|
|
8465
8465
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
package/dist/tokens/tokens.css
CHANGED
package/dist/tokens/tokens.js
CHANGED