@forsakringskassan/docs-generator 2.32.2 → 2.33.1

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.
@@ -55,7 +55,7 @@
55
55
  }
56
56
  .docs-badge--component {
57
57
  background: var(--docs-badge-component-background);
58
- border-color: var(--docs-badge-component-background);
58
+ border-color: var(--docs-badge-component-border);
59
59
  color: var(--docs-badge-component-color);
60
60
  }
61
61
 
@@ -325,7 +325,6 @@ footer {
325
325
 
326
326
  main {
327
327
  padding: 0 3rem 2rem;
328
- background: #fff;
329
328
  max-width: 920px;
330
329
  }
331
330
 
@@ -712,8 +711,12 @@ main {
712
711
  }
713
712
 
714
713
  #version-dialog {
714
+ --docs-text-color-default: var(--docs-version-text-color);
715
715
  width: 30rem;
716
716
  max-height: 80vh;
717
+ background: var(--docs-version-background-color);
718
+ border: 1px solid var(--docs-version-border-color);
719
+ color: var(--docs-text-color-default);
717
720
  }
718
721
  #version-dialog a {
719
722
  text-decoration: none;
@@ -1009,7 +1012,7 @@ h6 code {
1009
1012
 
1010
1013
  .layout-wrapper {
1011
1014
  font-family: var(--docs-font-family);
1012
- background: #fff;
1015
+ background: var(--docs-background-color);
1013
1016
  }
1014
1017
 
1015
1018
  /* Page header - inverted */
@@ -1091,7 +1094,7 @@ header .label {
1091
1094
 
1092
1095
  /* navigering vänster */
1093
1096
  #sidenav {
1094
- background-color: #f4f4f4;
1097
+ background-color: var(--docs-menu-background-color);
1095
1098
  width: auto;
1096
1099
  display: flex;
1097
1100
  justify-content: space-between;
@@ -1163,6 +1166,17 @@ main #aside dd {
1163
1166
  margin: 0 0 1.5rem;
1164
1167
  }
1165
1168
 
1169
+ @media (prefers-color-scheme: light) {
1170
+ .user-background {
1171
+ background: repeating-conic-gradient(#fff 0 90deg, rgb(235, 235, 235) 0 180deg) 0 0/20px 20px round;
1172
+ }
1173
+ }
1174
+ @media (prefers-color-scheme: dark) {
1175
+ .user-background {
1176
+ background: repeating-conic-gradient(#1b1e23 0 90deg, #313438 0 180deg) 0 0/20px 20px round;
1177
+ }
1178
+ }
1179
+
1166
1180
  .code-preview main,
1167
1181
  .code-preview header,
1168
1182
  .code-preview footer {
@@ -1190,7 +1204,6 @@ main #aside dd {
1190
1204
  }
1191
1205
 
1192
1206
  .code-preview__preview {
1193
- background-color: #fff;
1194
1207
  flex: 1 1 auto;
1195
1208
  }
1196
1209
 
@@ -1273,11 +1286,15 @@ kbd {
1273
1286
  }
1274
1287
 
1275
1288
  #search button {
1276
- padding: 0 0.75rem;
1277
- cursor: text;
1289
+ background: transparent;
1290
+ color: var(--docs-text-color-discrete);
1291
+ border-radius: 4px;
1278
1292
  border: 0;
1279
1293
  box-shadow: none;
1280
- color: var(--f-text-color-default);
1294
+ cursor: text;
1295
+ min-height: 2.5rem;
1296
+ padding: 0 0.75rem;
1297
+ width: 100%;
1281
1298
  }
1282
1299
 
1283
1300
  #search button:hover {
@@ -1288,13 +1305,22 @@ kbd {
1288
1305
  box-shadow: var(--f-focus-box-shadow);
1289
1306
  }
1290
1307
 
1291
- #search button .icon {
1308
+ #search .search__icon {
1309
+ display: inline-block;
1310
+ height: 1rem;
1292
1311
  margin-right: 0.5rem;
1312
+ max-height: 100%;
1313
+ max-width: 100%;
1314
+ pointer-events: none;
1315
+ width: 1rem;
1293
1316
  }
1294
1317
 
1295
1318
  #search-dialog {
1319
+ --docs-text-color-default: var(--docs-search-text-color);
1296
1320
  margin-top: 80px;
1297
- border: 1px solid var(--f-border-color-modal);
1321
+ background: var(--docs-search-background-color);
1322
+ border: 1px solid var(--docs-search-border-color);
1323
+ color: var(--docs-text-color-default);
1298
1324
  width: 580px;
1299
1325
  }
1300
1326
 
@@ -55,7 +55,7 @@
55
55
  }
56
56
  .docs-badge--component {
57
57
  background: var(--docs-badge-component-background);
58
- border-color: var(--docs-badge-component-background);
58
+ border-color: var(--docs-badge-component-border);
59
59
  color: var(--docs-badge-component-color);
60
60
  }
61
61
 
@@ -325,7 +325,6 @@ footer {
325
325
 
326
326
  main {
327
327
  padding: 0 3rem 2rem;
328
- background: #fff;
329
328
  max-width: 920px;
330
329
  }
331
330
 
@@ -712,8 +711,12 @@ main {
712
711
  }
713
712
 
714
713
  #version-dialog {
714
+ --docs-text-color-default: var(--docs-version-text-color);
715
715
  width: 30rem;
716
716
  max-height: 80vh;
717
+ background: var(--docs-version-background-color);
718
+ border: 1px solid var(--docs-version-border-color);
719
+ color: var(--docs-text-color-default);
717
720
  }
718
721
  #version-dialog a {
719
722
  text-decoration: none;
@@ -1009,7 +1012,7 @@ h6 code {
1009
1012
 
1010
1013
  .layout-wrapper {
1011
1014
  font-family: var(--docs-font-family);
1012
- background: #fff;
1015
+ background: var(--docs-background-color);
1013
1016
  }
1014
1017
 
1015
1018
  /* Page header - inverted */
@@ -1091,7 +1094,7 @@ header .label {
1091
1094
 
1092
1095
  /* navigering vänster */
1093
1096
  #sidenav {
1094
- background-color: #f4f4f4;
1097
+ background-color: var(--docs-menu-background-color);
1095
1098
  width: auto;
1096
1099
  display: flex;
1097
1100
  justify-content: space-between;
@@ -1163,6 +1166,17 @@ main #aside dd {
1163
1166
  margin: 0 0 1.5rem;
1164
1167
  }
1165
1168
 
1169
+ @media (prefers-color-scheme: light) {
1170
+ .user-background {
1171
+ background: repeating-conic-gradient(#fff 0 90deg, rgb(235, 235, 235) 0 180deg) 0 0/20px 20px round;
1172
+ }
1173
+ }
1174
+ @media (prefers-color-scheme: dark) {
1175
+ .user-background {
1176
+ background: repeating-conic-gradient(#1b1e23 0 90deg, #313438 0 180deg) 0 0/20px 20px round;
1177
+ }
1178
+ }
1179
+
1166
1180
  .code-preview main,
1167
1181
  .code-preview header,
1168
1182
  .code-preview footer {
@@ -1190,7 +1204,6 @@ main #aside dd {
1190
1204
  }
1191
1205
 
1192
1206
  .code-preview__preview {
1193
- background-color: #fff;
1194
1207
  flex: 1 1 auto;
1195
1208
  }
1196
1209
 
@@ -1273,11 +1286,15 @@ kbd {
1273
1286
  }
1274
1287
 
1275
1288
  #search button {
1276
- padding: 0 0.75rem;
1277
- cursor: text;
1289
+ background: transparent;
1290
+ color: var(--docs-text-color-discrete);
1291
+ border-radius: 4px;
1278
1292
  border: 0;
1279
1293
  box-shadow: none;
1280
- color: var(--f-text-color-default);
1294
+ cursor: text;
1295
+ min-height: 2.5rem;
1296
+ padding: 0 0.75rem;
1297
+ width: 100%;
1281
1298
  }
1282
1299
 
1283
1300
  #search button:hover {
@@ -1288,13 +1305,22 @@ kbd {
1288
1305
  box-shadow: var(--f-focus-box-shadow);
1289
1306
  }
1290
1307
 
1291
- #search button .icon {
1308
+ #search .search__icon {
1309
+ display: inline-block;
1310
+ height: 1rem;
1292
1311
  margin-right: 0.5rem;
1312
+ max-height: 100%;
1313
+ max-width: 100%;
1314
+ pointer-events: none;
1315
+ width: 1rem;
1293
1316
  }
1294
1317
 
1295
1318
  #search-dialog {
1319
+ --docs-text-color-default: var(--docs-search-text-color);
1296
1320
  margin-top: 80px;
1297
- border: 1px solid var(--f-border-color-modal);
1321
+ background: var(--docs-search-background-color);
1322
+ border: 1px solid var(--docs-search-border-color);
1323
+ color: var(--docs-text-color-default);
1298
1324
  width: 580px;
1299
1325
  }
1300
1326
 
@@ -1335,6 +1361,7 @@ kbd {
1335
1361
  }
1336
1362
 
1337
1363
  :root {
1364
+ --docs-background-color: #ffffff;
1338
1365
  --docs-font-family: "Inter Variable", sans-serif;
1339
1366
  --docs-font-line-height: 1.5;
1340
1367
  --docs-font-size: 16px;
@@ -1351,6 +1378,7 @@ kbd {
1351
1378
  --docs-error-background: #fcf3f3;
1352
1379
  --docs-badge-component-color: var(--docs-text-color-default);
1353
1380
  --docs-badge-component-background: #ddddde;
1381
+ --docs-badge-component-border: #ddddde;
1354
1382
  --docs-contextmenu-background-color: #ffffff;
1355
1383
  --docs-contextmenu-border-color: #ddddde;
1356
1384
  --docs-contextmenu-highlight-color: #e7f0e9;
@@ -1362,8 +1390,13 @@ kbd {
1362
1390
  --docs-heading-line-height: 1.4;
1363
1391
  --docs-header-text-color-default: #1b1e23;
1364
1392
  --docs-header-text-color-discrete: #5f6165;
1365
- --docs-header-background-color: #ffffff;
1393
+ --docs-header-background-color: transparent;
1366
1394
  --docs-header-border-color: #ddddde;
1395
+ --docs-footer-text-color-default: #1b1e23;
1396
+ --docs-footer-text-color-discrete: #5f6165;
1397
+ --docs-footer-background-color: transparent;
1398
+ --docs-footer-border-color: #ddddde;
1399
+ --docs-menu-background-color: transparent;
1367
1400
  --docs-menu-width-expanded: 230px;
1368
1401
  --docs-messagebox-details-border: #bbbbbd;
1369
1402
  --docs-messagebox-details-background: #f4f4f4;
@@ -1392,9 +1425,14 @@ kbd {
1392
1425
  --docs-topnav-link-color-highlight: var(--docs-text-color-link-hover);
1393
1426
  --docs-topnav-border-color-hover: #afcfb5;
1394
1427
  --docs-topnav-border-color-highlight: #116a3e;
1428
+ --docs-search-text-color: inherit;
1429
+ --docs-search-background-color: var(--docs-background-color);
1430
+ --docs-search-border-color: #000;
1395
1431
  --docs-version-text-color: var(--docs-text-color-discrete);
1396
1432
  --docs-version-link-color: var(--docs-text-color-discrete);
1397
1433
  --docs-version-hover-color: var(--docs-text-color-default);
1434
+ --docs-version-background-color: var(--docs-background-color);
1435
+ --docs-version-border-color: #000;
1398
1436
  --docs-cookie-background-color: #f5f6fa;
1399
1437
  --docs-cookie-border-color: #4a52b6;
1400
1438
  --docs-code-background-color: #f4f4f4;
@@ -1520,6 +1558,13 @@ textarea {
1520
1558
  src: url(./inter-latin-wght-normal.woff2) format("woff2-variations");
1521
1559
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
1522
1560
  }
1561
+ .docs-footer {
1562
+ --docs-text-color-default: var(--docs-footer-text-color-default);
1563
+ --docs-text-color-discrete: var(--docs-footer-text-color-discrete);
1564
+ background-color: var(--docs-footer-background-color);
1565
+ border-top: 1px solid var(--docs-footer-border-color);
1566
+ }
1567
+
1523
1568
  .cookie-warning {
1524
1569
  background: var(--docs-cookie-background-color);
1525
1570
  border-bottom: 2px solid var(--docs-cookie-border-color);
@@ -1,4 +1,5 @@
1
1
  :root {
2
+ --docs-background-color: #ffffff;
2
3
  --docs-font-family: "Inter Variable", sans-serif;
3
4
  --docs-font-line-height: 1.5;
4
5
  --docs-font-size: 16px;
@@ -15,6 +16,7 @@
15
16
  --docs-error-background: #fcf3f3;
16
17
  --docs-badge-component-color: var(--docs-text-color-default);
17
18
  --docs-badge-component-background: #ddddde;
19
+ --docs-badge-component-border: #ddddde;
18
20
  --docs-contextmenu-background-color: #ffffff;
19
21
  --docs-contextmenu-border-color: #ddddde;
20
22
  --docs-contextmenu-highlight-color: #e7f0e9;
@@ -26,8 +28,13 @@
26
28
  --docs-heading-line-height: 1.4;
27
29
  --docs-header-text-color-default: #1b1e23;
28
30
  --docs-header-text-color-discrete: #5f6165;
29
- --docs-header-background-color: #ffffff;
31
+ --docs-header-background-color: transparent;
30
32
  --docs-header-border-color: #ddddde;
33
+ --docs-footer-text-color-default: #1b1e23;
34
+ --docs-footer-text-color-discrete: #5f6165;
35
+ --docs-footer-background-color: transparent;
36
+ --docs-footer-border-color: #ddddde;
37
+ --docs-menu-background-color: transparent;
31
38
  --docs-menu-width-expanded: 230px;
32
39
  --docs-messagebox-details-border: #bbbbbd;
33
40
  --docs-messagebox-details-background: #f4f4f4;
@@ -56,9 +63,14 @@
56
63
  --docs-topnav-link-color-highlight: var(--docs-text-color-link-hover);
57
64
  --docs-topnav-border-color-hover: #afcfb5;
58
65
  --docs-topnav-border-color-highlight: #116a3e;
66
+ --docs-search-text-color: inherit;
67
+ --docs-search-background-color: var(--docs-background-color);
68
+ --docs-search-border-color: #000;
59
69
  --docs-version-text-color: var(--docs-text-color-discrete);
60
70
  --docs-version-link-color: var(--docs-text-color-discrete);
61
71
  --docs-version-hover-color: var(--docs-text-color-default);
72
+ --docs-version-background-color: var(--docs-background-color);
73
+ --docs-version-border-color: #000;
62
74
  --docs-cookie-background-color: #f5f6fa;
63
75
  --docs-cookie-border-color: #4a52b6;
64
76
  --docs-code-background-color: #f4f4f4;
@@ -184,6 +196,13 @@ textarea {
184
196
  src: url(./inter-latin-wght-normal.woff2) format("woff2-variations");
185
197
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
186
198
  }
199
+ .docs-footer {
200
+ --docs-text-color-default: var(--docs-footer-text-color-default);
201
+ --docs-text-color-discrete: var(--docs-footer-text-color-discrete);
202
+ background-color: var(--docs-footer-background-color);
203
+ border-top: 1px solid var(--docs-footer-border-color);
204
+ }
205
+
187
206
  .cookie-warning {
188
207
  background: var(--docs-cookie-background-color);
189
208
  border-bottom: 2px solid var(--docs-cookie-border-color);
@@ -3,10 +3,42 @@
3
3
  https://designsystem.forsakringskassan.se/latest/styles/colors.html
4
4
  */
5
5
  :root {
6
+ --docs-background-color: var(--fkds-color-background-primary);
7
+ --docs-text-color-default: var(--fkds-color-text-primary);
8
+ --docs-text-color-discrete: var(--fkds-color-text-secondary);
9
+ --docs-text-color-link: var(--fkds-color-action-text-primary-default);
10
+ --docs-text-color-link-hover: var(--fkds-color-action-text-primary-hover);
11
+ --docs-info-color: var(--fkds-color-feedback-border-info);
12
+ --docs-info-background: var(--fkds-color-feedback-background-info);
13
+ --docs-warning-color: var(--fkds-color-feedback-border-warning);
14
+ --docs-warning-background: var(--fkds-color-feedback-background-warning);
15
+ --docs-error-color: var(--fkds-color-feedback-border-negative);
16
+ --docs-error-background: var(--fkds-color-feedback-background-negative);
6
17
  --docs-font-line-height: var(--f-line-height-large);
7
18
  --docs-font-size: var(--f-font-size-default-rem);
8
- --docs-text-color-default: var(--fkds-color-text-primary);
19
+ --docs-badge-component-color: var(--fkds-color-text-primary);
20
+ --docs-badge-component-background: var(--fkds-color-feedback-background-neutral);
21
+ --docs-badge-component-border: var(--fkds-color-feedback-border-neutral);
22
+ --docs-contextmenu-background-color: var(--fkds-color-background-primary);
23
+ --docs-contextmenu-border-color: var(--fkds-color-border-weak);
24
+ --docs-contextmenu-highlight-color: var(--fkds-color-select-background-secondary-active);
25
+ --docs-contextmenu-link-color-default: var(--fkds-color-text-primary);
26
+ --docs-contextmenu-link-color-hover: var(--fkds-color-text-primary);
27
+ --docs-contextmenu-link-background-hover: var(--fkds-color-select-background-secondary-active);
28
+ --docs-header-text-color-default: var(--fkds-color-text-primary);
29
+ --docs-header-text-color-discrete: var(--fkds-color-text-secondary);
9
30
  --docs-header-background-color: var(--fkds-color-background-primary);
10
31
  --docs-header-border-color: var(--fkds-color-border-weak);
11
- --docs-code-background-color: var(--f-background-code);
32
+ --docs-topnav-background-color: var(--fkds-color-background-primary);
33
+ --docs-menu-background-color: var(--fkds-color-background-secondary);
34
+ --docs-topnav-link-color-default: var(--fkds-color-text-primary);
35
+ --docs-topnav-link-color-hover: var(--fkds-color-text-primary);
36
+ --docs-topnav-link-color-highlight: var(--fkds-color-text-primary);
37
+ --docs-topnav-border-color-hover: var(--fkds-color-select-background-secondary-hover);
38
+ --docs-topnav-border-color-highlighr: var(--fkds-color-select-background-secondary-default);
39
+ --docs-code-background-color: var(--fkds-color-background-primary);
40
+ --docs-code-optional-background-color: var(--fkds-color-background-tertiary);
41
+ --docs-search-border-color: var(--fkds-color-border-primary);
42
+ --docs-search-background-color: var(--fkds-color-background-primary);
43
+ --docs-search-text-color: var(--fkds-color-text-primary);
12
44
  }
@@ -5,7 +5,7 @@
5
5
  "toolPackages": [
6
6
  {
7
7
  "packageName": "@microsoft/api-extractor",
8
- "packageVersion": "7.53.3"
8
+ "packageVersion": "7.54.0"
9
9
  }
10
10
  ]
11
11
  }