@utrecht/design-tokens 3.1.0 → 3.3.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 (54) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/_mixin-theme.scss +10 -0
  3. package/dist/_mixin.scss +10 -0
  4. package/dist/_variables.scss +10 -0
  5. package/dist/dark/_mixin-theme.scss +10 -0
  6. package/dist/dark/_mixin.scss +10 -0
  7. package/dist/dark/_variables.scss +10 -0
  8. package/dist/dark/index.cjs +10 -0
  9. package/dist/dark/index.css +10 -0
  10. package/dist/dark/index.d.ts +10 -0
  11. package/dist/dark/index.flat.json +10 -0
  12. package/dist/dark/index.json +354 -0
  13. package/dist/dark/index.mjs +10 -0
  14. package/dist/dark/index.tokens.json +89 -0
  15. package/dist/dark/list.json +354 -0
  16. package/dist/dark/list.mjs +354 -0
  17. package/dist/dark/property.css +9 -0
  18. package/dist/dark/root.css +10 -0
  19. package/dist/dark/theme-prince-xml.css +10 -0
  20. package/dist/dark/theme.css +10 -0
  21. package/dist/dark/tokens.cjs +433 -0
  22. package/dist/dark/tokens.d.ts +53 -0
  23. package/dist/dark/tokens.json +433 -0
  24. package/dist/dark/variables.cjs +10 -0
  25. package/dist/dark/variables.css +10 -0
  26. package/dist/dark/variables.d.ts +10 -0
  27. package/dist/dark/variables.json +10 -0
  28. package/dist/dark/variables.less +10 -0
  29. package/dist/dark/variables.mjs +10 -0
  30. package/dist/index.cjs +10 -0
  31. package/dist/index.css +20 -0
  32. package/dist/index.d.ts +10 -0
  33. package/dist/index.flat.json +10 -0
  34. package/dist/index.json +354 -0
  35. package/dist/index.mjs +10 -0
  36. package/dist/index.tokens.json +89 -0
  37. package/dist/list.json +354 -0
  38. package/dist/list.mjs +354 -0
  39. package/dist/property.css +9 -0
  40. package/dist/root.css +10 -0
  41. package/dist/theme-prince-xml.css +10 -0
  42. package/dist/theme.css +10 -0
  43. package/dist/tokens.cjs +433 -0
  44. package/dist/tokens.d.ts +53 -0
  45. package/dist/tokens.json +433 -0
  46. package/dist/variables.cjs +10 -0
  47. package/dist/variables.css +10 -0
  48. package/dist/variables.d.ts +10 -0
  49. package/dist/variables.json +10 -0
  50. package/dist/variables.less +10 -0
  51. package/dist/variables.mjs +10 -0
  52. package/package.json +1 -1
  53. package/src/component/utrecht/breadcrumb-nav.tokens.json +5 -0
  54. package/src/component/utrecht/tooltip.tokens.json +15 -0
@@ -3810,6 +3810,47 @@
3810
3810
  "type": "textCase"
3811
3811
  },
3812
3812
  "item": {
3813
+ "first": {
3814
+ "padding-inline-start": {
3815
+ "$extensions": {
3816
+ "nl.nldesignsystem.css.property": {
3817
+ "syntax": "<length>",
3818
+ "inherits": true
3819
+ },
3820
+ "nl.nldesignsystem.figma.supports-token": false,
3821
+ "studio.tokens": {
3822
+ "originalType": "spacing"
3823
+ }
3824
+ },
3825
+ "type": "dimension",
3826
+ "value": "0",
3827
+ "filePath": "src/component/utrecht/breadcrumb-nav.tokens.json",
3828
+ "isSource": true,
3829
+ "original": {
3830
+ "$extensions": {
3831
+ "nl.nldesignsystem.css.property": {
3832
+ "syntax": "<length>",
3833
+ "inherits": true
3834
+ },
3835
+ "nl.nldesignsystem.figma.supports-token": false,
3836
+ "studio.tokens": {
3837
+ "originalType": "spacing"
3838
+ }
3839
+ },
3840
+ "type": "dimension",
3841
+ "value": "0"
3842
+ },
3843
+ "name": "utrechtBreadcrumbNavItemFirstPaddingInlineStart",
3844
+ "attributes": {},
3845
+ "path": [
3846
+ "utrecht",
3847
+ "breadcrumb-nav",
3848
+ "item",
3849
+ "first",
3850
+ "padding-inline-start"
3851
+ ]
3852
+ }
3853
+ },
3813
3854
  "padding-block-start": {
3814
3855
  "$extensions": {
3815
3856
  "nl.nldesignsystem.css.property": {
@@ -35147,6 +35188,398 @@
35147
35188
  }
35148
35189
  }
35149
35190
  },
35191
+ "tooltip": {
35192
+ "background-color": {
35193
+ "$extensions": {
35194
+ "nl.nldesignsystem.css.property": {
35195
+ "syntax": "<color>",
35196
+ "inherits": true
35197
+ },
35198
+ "nl.nldesignsystem.figma.supports-token": false
35199
+ },
35200
+ "type": "color",
35201
+ "value": "hsl(0 0% 100%)",
35202
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35203
+ "isSource": true,
35204
+ "original": {
35205
+ "$extensions": {
35206
+ "nl.nldesignsystem.css.property": {
35207
+ "syntax": "<color>",
35208
+ "inherits": true
35209
+ },
35210
+ "nl.nldesignsystem.figma.supports-token": false
35211
+ },
35212
+ "type": "color",
35213
+ "value": "{utrecht.color.white}"
35214
+ },
35215
+ "name": "utrechtTooltipBackgroundColor",
35216
+ "attributes": {},
35217
+ "path": [
35218
+ "utrecht",
35219
+ "tooltip",
35220
+ "background-color"
35221
+ ]
35222
+ },
35223
+ "border-color": {
35224
+ "$extensions": {
35225
+ "nl.nldesignsystem.css.property": {
35226
+ "syntax": "<color>",
35227
+ "inherits": true
35228
+ },
35229
+ "nl.nldesignsystem.figma.supports-token": false
35230
+ },
35231
+ "type": "color",
35232
+ "value": "hsl(0 0% 40%)",
35233
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35234
+ "isSource": true,
35235
+ "original": {
35236
+ "$extensions": {
35237
+ "nl.nldesignsystem.css.property": {
35238
+ "syntax": "<color>",
35239
+ "inherits": true
35240
+ },
35241
+ "nl.nldesignsystem.figma.supports-token": false
35242
+ },
35243
+ "type": "color",
35244
+ "value": "{utrecht.color.grey.40}"
35245
+ },
35246
+ "name": "utrechtTooltipBorderColor",
35247
+ "attributes": {},
35248
+ "path": [
35249
+ "utrecht",
35250
+ "tooltip",
35251
+ "border-color"
35252
+ ]
35253
+ },
35254
+ "border-radius": {
35255
+ "$extensions": {
35256
+ "nl.nldesignsystem.css.property": {
35257
+ "syntax": "<length-percentage>",
35258
+ "inherits": true
35259
+ },
35260
+ "nl.nldesignsystem.figma.supports-token": false,
35261
+ "studio.tokens": {
35262
+ "originalType": "borderRadius"
35263
+ }
35264
+ },
35265
+ "type": "dimension",
35266
+ "value": "0",
35267
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35268
+ "isSource": true,
35269
+ "original": {
35270
+ "$extensions": {
35271
+ "nl.nldesignsystem.css.property": {
35272
+ "syntax": "<length-percentage>",
35273
+ "inherits": true
35274
+ },
35275
+ "nl.nldesignsystem.figma.supports-token": false,
35276
+ "studio.tokens": {
35277
+ "originalType": "borderRadius"
35278
+ }
35279
+ },
35280
+ "type": "dimension",
35281
+ "value": "0"
35282
+ },
35283
+ "name": "utrechtTooltipBorderRadius",
35284
+ "attributes": {},
35285
+ "path": [
35286
+ "utrecht",
35287
+ "tooltip",
35288
+ "border-radius"
35289
+ ]
35290
+ },
35291
+ "border-width": {
35292
+ "$extensions": {
35293
+ "nl.nldesignsystem.css.property": {
35294
+ "syntax": "<length>",
35295
+ "inherits": true
35296
+ },
35297
+ "nl.nldesignsystem.figma.supports-token": false,
35298
+ "studio.tokens": {
35299
+ "originalType": "borderWidth"
35300
+ }
35301
+ },
35302
+ "type": "dimension",
35303
+ "value": "1px",
35304
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35305
+ "isSource": true,
35306
+ "original": {
35307
+ "$extensions": {
35308
+ "nl.nldesignsystem.css.property": {
35309
+ "syntax": "<length>",
35310
+ "inherits": true
35311
+ },
35312
+ "nl.nldesignsystem.figma.supports-token": false,
35313
+ "studio.tokens": {
35314
+ "originalType": "borderWidth"
35315
+ }
35316
+ },
35317
+ "type": "dimension",
35318
+ "value": "1px"
35319
+ },
35320
+ "name": "utrechtTooltipBorderWidth",
35321
+ "attributes": {},
35322
+ "path": [
35323
+ "utrecht",
35324
+ "tooltip",
35325
+ "border-width"
35326
+ ]
35327
+ },
35328
+ "color": {
35329
+ "$extensions": {
35330
+ "nl.nldesignsystem.css.property": {
35331
+ "syntax": "<color>",
35332
+ "inherits": true
35333
+ },
35334
+ "nl.nldesignsystem.figma.supports-token": false
35335
+ },
35336
+ "type": "color",
35337
+ "value": "hsl(0 0% 40%)",
35338
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35339
+ "isSource": true,
35340
+ "original": {
35341
+ "$extensions": {
35342
+ "nl.nldesignsystem.css.property": {
35343
+ "syntax": "<color>",
35344
+ "inherits": true
35345
+ },
35346
+ "nl.nldesignsystem.figma.supports-token": false
35347
+ },
35348
+ "type": "color",
35349
+ "value": "{utrecht.color.grey.40}"
35350
+ },
35351
+ "name": "utrechtTooltipColor",
35352
+ "attributes": {},
35353
+ "path": [
35354
+ "utrecht",
35355
+ "tooltip",
35356
+ "color"
35357
+ ]
35358
+ },
35359
+ "font-family": {
35360
+ "$extensions": {
35361
+ "nl.nldesignsystem.css.property": {
35362
+ "syntax": "*",
35363
+ "inherits": true
35364
+ },
35365
+ "nl.nldesignsystem.figma.supports-token": false,
35366
+ "studio.tokens": {
35367
+ "originalType": "fontFamilies"
35368
+ }
35369
+ },
35370
+ "type": "fontFamily",
35371
+ "value": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif",
35372
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35373
+ "isSource": true,
35374
+ "original": {
35375
+ "$extensions": {
35376
+ "nl.nldesignsystem.css.property": {
35377
+ "syntax": "*",
35378
+ "inherits": true
35379
+ },
35380
+ "nl.nldesignsystem.figma.supports-token": false,
35381
+ "studio.tokens": {
35382
+ "originalType": "fontFamilies"
35383
+ }
35384
+ },
35385
+ "type": "fontFamily",
35386
+ "value": "{utrecht.typography.sans-serif.font-family}"
35387
+ },
35388
+ "name": "utrechtTooltipFontFamily",
35389
+ "attributes": {},
35390
+ "path": [
35391
+ "utrecht",
35392
+ "tooltip",
35393
+ "font-family"
35394
+ ]
35395
+ },
35396
+ "font-size": {
35397
+ "$extensions": {
35398
+ "nl.nldesignsystem.css.property": {
35399
+ "syntax": "<length>",
35400
+ "inherits": true
35401
+ },
35402
+ "nl.nldesignsystem.figma.supports-token": false,
35403
+ "studio.tokens": {
35404
+ "originalType": "fontSizes"
35405
+ }
35406
+ },
35407
+ "type": "fontSize",
35408
+ "value": "1rem",
35409
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35410
+ "isSource": true,
35411
+ "original": {
35412
+ "$extensions": {
35413
+ "nl.nldesignsystem.css.property": {
35414
+ "syntax": "<length>",
35415
+ "inherits": true
35416
+ },
35417
+ "nl.nldesignsystem.figma.supports-token": false,
35418
+ "studio.tokens": {
35419
+ "originalType": "fontSizes"
35420
+ }
35421
+ },
35422
+ "type": "fontSize",
35423
+ "value": "{utrecht.typography.scale.md.font-size}"
35424
+ },
35425
+ "name": "utrechtTooltipFontSize",
35426
+ "attributes": {},
35427
+ "path": [
35428
+ "utrecht",
35429
+ "tooltip",
35430
+ "font-size"
35431
+ ]
35432
+ },
35433
+ "font-weight": {
35434
+ "$extensions": {
35435
+ "nl.nldesignsystem.css.property": {
35436
+ "syntax": "<number>",
35437
+ "inherits": false
35438
+ },
35439
+ "nl.nldesignsystem.figma.supports-token": false
35440
+ },
35441
+ "type": "fontWeights"
35442
+ },
35443
+ "line-height": {
35444
+ "$extensions": {
35445
+ "nl.nldesignsystem.css.property": {
35446
+ "syntax": [
35447
+ "<length>",
35448
+ "<number>"
35449
+ ],
35450
+ "inherits": true
35451
+ },
35452
+ "nl.nldesignsystem.figma.supports-token": false
35453
+ },
35454
+ "type": "lineHeights"
35455
+ },
35456
+ "max-inline-size": {
35457
+ "$extensions": {
35458
+ "nl.nldesignsystem.css.property": {
35459
+ "syntax": "<length>",
35460
+ "inherits": true
35461
+ },
35462
+ "nl.nldesignsystem.figma.supports-token": false
35463
+ },
35464
+ "type": "sizing"
35465
+ },
35466
+ "padding-block": {
35467
+ "$extensions": {
35468
+ "nl.nldesignsystem.css.property": {
35469
+ "syntax": "<length>",
35470
+ "inherits": true
35471
+ },
35472
+ "nl.nldesignsystem.figma.supports-token": false,
35473
+ "studio.tokens": {
35474
+ "originalType": "spacing"
35475
+ }
35476
+ },
35477
+ "type": "dimension",
35478
+ "value": "8px",
35479
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35480
+ "isSource": true,
35481
+ "original": {
35482
+ "$extensions": {
35483
+ "nl.nldesignsystem.css.property": {
35484
+ "syntax": "<length>",
35485
+ "inherits": true
35486
+ },
35487
+ "nl.nldesignsystem.figma.supports-token": false,
35488
+ "studio.tokens": {
35489
+ "originalType": "spacing"
35490
+ }
35491
+ },
35492
+ "type": "dimension",
35493
+ "value": "{utrecht.space.block.xs}"
35494
+ },
35495
+ "name": "utrechtTooltipPaddingBlock",
35496
+ "attributes": {},
35497
+ "path": [
35498
+ "utrecht",
35499
+ "tooltip",
35500
+ "padding-block"
35501
+ ]
35502
+ },
35503
+ "padding-inline": {
35504
+ "$extensions": {
35505
+ "nl.nldesignsystem.css.property": {
35506
+ "syntax": "<length>",
35507
+ "inherits": true
35508
+ },
35509
+ "nl.nldesignsystem.figma.supports-token": false,
35510
+ "studio.tokens": {
35511
+ "originalType": "spacing"
35512
+ }
35513
+ },
35514
+ "type": "dimension",
35515
+ "value": "16px",
35516
+ "filePath": "src/component/utrecht/tooltip.tokens.json",
35517
+ "isSource": true,
35518
+ "original": {
35519
+ "$extensions": {
35520
+ "nl.nldesignsystem.css.property": {
35521
+ "syntax": "<length>",
35522
+ "inherits": true
35523
+ },
35524
+ "nl.nldesignsystem.figma.supports-token": false,
35525
+ "studio.tokens": {
35526
+ "originalType": "spacing"
35527
+ }
35528
+ },
35529
+ "type": "dimension",
35530
+ "value": "{utrecht.space.inline.md}"
35531
+ },
35532
+ "name": "utrechtTooltipPaddingInline",
35533
+ "attributes": {},
35534
+ "path": [
35535
+ "utrecht",
35536
+ "tooltip",
35537
+ "padding-inline"
35538
+ ]
35539
+ },
35540
+ "transition-duration": {
35541
+ "$extensions": {
35542
+ "nl.nldesignsystem.css.property": {
35543
+ "syntax": "<time>",
35544
+ "inherits": true
35545
+ },
35546
+ "nl.nldesignsystem.figma.supports-token": false
35547
+ },
35548
+ "type": "other"
35549
+ },
35550
+ "transition-timing-function": {
35551
+ "$extensions": {
35552
+ "nl.nldesignsystem.css.property": {
35553
+ "syntax": "<time>",
35554
+ "inherits": true
35555
+ },
35556
+ "nl.nldesignsystem.figma.supports-token": false
35557
+ },
35558
+ "type": "other"
35559
+ },
35560
+ "z-index": {
35561
+ "$extensions": {
35562
+ "nl.nldesignsystem.css.property": {
35563
+ "syntax": "<number>",
35564
+ "inherits": true
35565
+ },
35566
+ "nl.nldesignsystem.figma.supports-token": false
35567
+ },
35568
+ "type": "other"
35569
+ },
35570
+ "arrow": {
35571
+ "size": {
35572
+ "$extensions": {
35573
+ "nl.nldesignsystem.css.property": {
35574
+ "syntax": "<length-percentage>",
35575
+ "inherits": true
35576
+ },
35577
+ "nl.nldesignsystem.figma.supports-token": false
35578
+ },
35579
+ "type": "sizing"
35580
+ }
35581
+ }
35582
+ },
35150
35583
  "toptask-link": {
35151
35584
  "background-color": {
35152
35585
  "$extensions": {
@@ -97,6 +97,7 @@ module.exports = {
97
97
  "utrechtBodyColor": "hsl(0 0% 0%)",
98
98
  "utrechtBreadcrumbNavMinBlockSize": "34px",
99
99
  "utrechtBreadcrumbNavFontSize": "1rem",
100
+ "utrechtBreadcrumbNavItemFirstPaddingInlineStart": "0",
100
101
  "utrechtBreadcrumbNavItemPaddingBlockStart": "8px",
101
102
  "utrechtBreadcrumbNavItemPaddingBlockEnd": "8px",
102
103
  "utrechtBreadcrumbNavItemPaddingInlineEnd": "8px",
@@ -905,6 +906,15 @@ module.exports = {
905
906
  "utrechtTextareaBorderBottomWidth": "3px",
906
907
  "utrechtTextareaLineHeight": "1.5",
907
908
  "utrechtTextboxBorderBottomWidth": "3px",
909
+ "utrechtTooltipBackgroundColor": "hsl(0 0% 100%)",
910
+ "utrechtTooltipBorderColor": "hsl(0 0% 40%)",
911
+ "utrechtTooltipBorderRadius": "0",
912
+ "utrechtTooltipBorderWidth": "1px",
913
+ "utrechtTooltipColor": "hsl(0 0% 40%)",
914
+ "utrechtTooltipFontFamily": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif",
915
+ "utrechtTooltipFontSize": "1rem",
916
+ "utrechtTooltipPaddingBlock": "8px",
917
+ "utrechtTooltipPaddingInline": "16px",
908
918
  "utrechtToptaskLinkBackgroundColor": "hsl(211 60% 80%)",
909
919
  "utrechtToptaskLinkColor": "hsl(0 0% 15%)",
910
920
  "utrechtToptaskLinkFontSize": "1rem",
@@ -30,6 +30,8 @@
30
30
  --utrecht-toptask-link-hover-transform-scale: 1.02;
31
31
  --utrecht-topnav-link-focus-text-decoration: none;
32
32
  --utrecht-topnav-link-focus-border-type: dotted;
33
+ --utrecht-tooltip-border-width: 1px;
34
+ --utrecht-tooltip-border-radius: 0;
33
35
  --utrecht-textbox-border-bottom-width: 3px;
34
36
  --utrecht-textarea-border-bottom-width: 3px;
35
37
  --utrecht-textarea-border-block-end-width: 3px;
@@ -354,6 +356,7 @@
354
356
  --utrecht-breadcrumb-nav-link-text-decoration: none;
355
357
  --utrecht-breadcrumb-nav-link-hover-text-decoration: underline;
356
358
  --utrecht-breadcrumb-nav-link-focus-text-decoration: underline;
359
+ --utrecht-breadcrumb-nav-item-first-padding-inline-start: 0;
357
360
  --utrecht-breadcrumb-nav-divider-inline-size: 1px;
358
361
  --utrecht-border-width-sm: 1px;
359
362
  --utrecht-border-width-md: 2px;
@@ -425,6 +428,13 @@
425
428
  --utrecht-topnav-link-focus-background-color: var(--utrecht-color-yellow-80);
426
429
  --utrecht-topnav-link-color: var(--utrecht-color-white);
427
430
  --utrecht-topnav-link-background-color: var(--utrecht-color-blue-40);
431
+ --utrecht-tooltip-padding-inline: var(--utrecht-space-inline-md);
432
+ --utrecht-tooltip-padding-block: var(--utrecht-space-block-xs);
433
+ --utrecht-tooltip-font-size: var(--utrecht-typography-scale-md-font-size);
434
+ --utrecht-tooltip-font-family: var(--utrecht-typography-sans-serif-font-family);
435
+ --utrecht-tooltip-color: var(--utrecht-color-grey-40);
436
+ --utrecht-tooltip-border-color: var(--utrecht-color-grey-40);
437
+ --utrecht-tooltip-background-color: var(--utrecht-color-white);
428
438
  --utrecht-textarea-line-height: var(--utrecht-typography-line-height-md);
429
439
  --utrecht-table-row-border-block-end-width: var(--utrecht-border-width-sm);
430
440
  --utrecht-table-row-border-block-end-color: var(--utrecht-color-grey-90);
@@ -106,6 +106,7 @@ export const utrechtBodyBackgroundColor : string;
106
106
  export const utrechtBodyColor : string;
107
107
  export const utrechtBreadcrumbNavMinBlockSize : string;
108
108
  export const utrechtBreadcrumbNavFontSize : string;
109
+ export const utrechtBreadcrumbNavItemFirstPaddingInlineStart : string;
109
110
  export const utrechtBreadcrumbNavItemPaddingBlockStart : string;
110
111
  export const utrechtBreadcrumbNavItemPaddingBlockEnd : string;
111
112
  export const utrechtBreadcrumbNavItemPaddingInlineEnd : string;
@@ -971,6 +972,15 @@ export const utrechtTextareaBorderBlockEndWidth : string;
971
972
  export const utrechtTextareaBorderBottomWidth : string;
972
973
  export const utrechtTextareaLineHeight : string;
973
974
  export const utrechtTextboxBorderBottomWidth : string;
975
+ export const utrechtTooltipBackgroundColor : string;
976
+ export const utrechtTooltipBorderColor : string;
977
+ export const utrechtTooltipBorderRadius : string;
978
+ export const utrechtTooltipBorderWidth : string;
979
+ export const utrechtTooltipColor : string;
980
+ export const utrechtTooltipFontFamily : string;
981
+ export const utrechtTooltipFontSize : string;
982
+ export const utrechtTooltipPaddingBlock : string;
983
+ export const utrechtTooltipPaddingInline : string;
974
984
  export const utrechtToptaskLinkBackgroundColor : string;
975
985
  export const utrechtToptaskLinkColor : string;
976
986
  export const utrechtToptaskLinkFontSize : string;
@@ -225,6 +225,7 @@
225
225
  "utrechtBreadcrumbNavArrowsLinkFocusColor": "hsl(0 0% 0%)",
226
226
  "utrechtBreadcrumbNavDividerInlineSize": "1px",
227
227
  "utrechtBreadcrumbNavFontSize": "1rem",
228
+ "utrechtBreadcrumbNavItemFirstPaddingInlineStart": "0",
228
229
  "utrechtBreadcrumbNavItemPaddingBlockEnd": "8px",
229
230
  "utrechtBreadcrumbNavItemPaddingBlockStart": "8px",
230
231
  "utrechtBreadcrumbNavItemPaddingInlineEnd": "8px",
@@ -1070,6 +1071,15 @@
1070
1071
  "utrechtTextareaBorderBottomWidth": "3px",
1071
1072
  "utrechtTextareaLineHeight": "1.5",
1072
1073
  "utrechtTextboxBorderBottomWidth": "3px",
1074
+ "utrechtTooltipBackgroundColor": "hsl(0 0% 100%)",
1075
+ "utrechtTooltipBorderColor": "hsl(0 0% 40%)",
1076
+ "utrechtTooltipBorderRadius": "0",
1077
+ "utrechtTooltipBorderWidth": "1px",
1078
+ "utrechtTooltipColor": "hsl(0 0% 40%)",
1079
+ "utrechtTooltipFontFamily": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif",
1080
+ "utrechtTooltipFontSize": "1rem",
1081
+ "utrechtTooltipPaddingBlock": "8px",
1082
+ "utrechtTooltipPaddingInline": "16px",
1073
1083
  "utrechtTopnavLinkBackgroundColor": "hsl(211 60% 40%)",
1074
1084
  "utrechtTopnavLinkColor": "hsl(0 0% 100%)",
1075
1085
  "utrechtTopnavLinkFocusBackgroundColor": "hsl(48 100% 80%)",
@@ -101,6 +101,8 @@
101
101
  @utrecht-toptask-link-min-inline-size: 15rem;
102
102
  @utrecht-toptask-link-min-block-size: 8.25rem;
103
103
  @utrecht-toptask-link-line-height: 1.2;
104
+ @utrecht-tooltip-border-width: 1px;
105
+ @utrecht-tooltip-border-radius: 0;
104
106
  @utrecht-textbox-border-bottom-width: 3px;
105
107
  @utrecht-textarea-border-bottom-width: 3px;
106
108
  @utrecht-textarea-border-block-end-width: 3px;
@@ -377,6 +379,7 @@
377
379
  @utrecht-breadcrumb-nav-link-text-decoration: none;
378
380
  @utrecht-breadcrumb-nav-link-hover-text-decoration: underline;
379
381
  @utrecht-breadcrumb-nav-link-focus-text-decoration: underline;
382
+ @utrecht-breadcrumb-nav-item-first-padding-inline-start: 0;
380
383
  @utrecht-breadcrumb-nav-min-block-size: 34px;
381
384
  @utrecht-body-line-height: 1.4;
382
385
  @utrecht-blockquote-margin-block-end: 1.6em;
@@ -503,6 +506,13 @@
503
506
  @utrecht-toptask-link-padding-block-start: @utrecht-space-block-xl;
504
507
  @utrecht-toptask-link-padding-block-end: @utrecht-space-block-xl;
505
508
  @utrecht-toptask-link-font-size: @utrecht-typography-scale-md-font-size;
509
+ @utrecht-tooltip-padding-inline: @utrecht-space-inline-md;
510
+ @utrecht-tooltip-padding-block: @utrecht-space-block-xs;
511
+ @utrecht-tooltip-font-size: @utrecht-typography-scale-md-font-size;
512
+ @utrecht-tooltip-font-family: @utrecht-typography-sans-serif-font-family;
513
+ @utrecht-tooltip-color: @utrecht-color-grey-40;
514
+ @utrecht-tooltip-border-color: @utrecht-color-grey-40;
515
+ @utrecht-tooltip-background-color: @utrecht-color-white;
506
516
  @utrecht-textarea-line-height: @utrecht-typography-line-height-md;
507
517
  @utrecht-table-row-alternate-even-color: @utrecht-color-black;
508
518
  @utrecht-table-row-alternate-even-background-color: @utrecht-color-grey-95;
@@ -96,6 +96,7 @@ export const utrechtBodyBackgroundColor = "hsl(0 0% 100%)";
96
96
  export const utrechtBodyColor = "hsl(0 0% 0%)";
97
97
  export const utrechtBreadcrumbNavMinBlockSize = "34px";
98
98
  export const utrechtBreadcrumbNavFontSize = "1rem";
99
+ export const utrechtBreadcrumbNavItemFirstPaddingInlineStart = "0";
99
100
  export const utrechtBreadcrumbNavItemPaddingBlockStart = "8px";
100
101
  export const utrechtBreadcrumbNavItemPaddingBlockEnd = "8px";
101
102
  export const utrechtBreadcrumbNavItemPaddingInlineEnd = "8px";
@@ -904,6 +905,15 @@ export const utrechtTextareaBorderBlockEndWidth = "3px";
904
905
  export const utrechtTextareaBorderBottomWidth = "3px";
905
906
  export const utrechtTextareaLineHeight = "1.5";
906
907
  export const utrechtTextboxBorderBottomWidth = "3px";
908
+ export const utrechtTooltipBackgroundColor = "hsl(0 0% 100%)";
909
+ export const utrechtTooltipBorderColor = "hsl(0 0% 40%)";
910
+ export const utrechtTooltipBorderRadius = "0";
911
+ export const utrechtTooltipBorderWidth = "1px";
912
+ export const utrechtTooltipColor = "hsl(0 0% 40%)";
913
+ export const utrechtTooltipFontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
914
+ export const utrechtTooltipFontSize = "1rem";
915
+ export const utrechtTooltipPaddingBlock = "8px";
916
+ export const utrechtTooltipPaddingInline = "16px";
907
917
  export const utrechtToptaskLinkBackgroundColor = "hsl(211 60% 80%)";
908
918
  export const utrechtToptaskLinkColor = "hsl(0 0% 15%)";
909
919
  export const utrechtToptaskLinkFontSize = "1rem";
package/dist/index.cjs CHANGED
@@ -95,6 +95,7 @@ module.exports = {
95
95
  "utrechtBodyColor": "hsl(0 0% 0%)",
96
96
  "utrechtBreadcrumbNavMinBlockSize": "34px",
97
97
  "utrechtBreadcrumbNavFontSize": "1rem",
98
+ "utrechtBreadcrumbNavItemFirstPaddingInlineStart": "0",
98
99
  "utrechtBreadcrumbNavItemPaddingBlockStart": "8px",
99
100
  "utrechtBreadcrumbNavItemPaddingBlockEnd": "8px",
100
101
  "utrechtBreadcrumbNavItemPaddingInlineEnd": "8px",
@@ -894,6 +895,15 @@ module.exports = {
894
895
  "utrechtTextareaBorderBottomWidth": "3px",
895
896
  "utrechtTextareaLineHeight": "1.5",
896
897
  "utrechtTextboxBorderBottomWidth": "3px",
898
+ "utrechtTooltipBackgroundColor": "hsl(0 0% 100%)",
899
+ "utrechtTooltipBorderColor": "hsl(0 0% 40%)",
900
+ "utrechtTooltipBorderRadius": "0",
901
+ "utrechtTooltipBorderWidth": "1px",
902
+ "utrechtTooltipColor": "hsl(0 0% 40%)",
903
+ "utrechtTooltipFontFamily": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif",
904
+ "utrechtTooltipFontSize": "1rem",
905
+ "utrechtTooltipPaddingBlock": "8px",
906
+ "utrechtTooltipPaddingInline": "16px",
897
907
  "utrechtToptaskLinkBackgroundColor": "hsl(211 60% 35%)",
898
908
  "utrechtToptaskLinkColor": "hsl(0 0% 100%)",
899
909
  "utrechtToptaskLinkFontSize": "1rem",