@mdn/fred 1.6.2 → 1.7.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 (65) hide show
  1. package/.env-dist +4 -0
  2. package/CHANGELOG.md +25 -0
  3. package/build/eslint-fred.js +6 -4
  4. package/build/plugins/generate-element-map.js +3 -2
  5. package/build/utils.js +0 -23
  6. package/components/curriculum/module.css +1 -0
  7. package/components/curriculum-module/server.css +1 -0
  8. package/components/env/index.js +3 -0
  9. package/components/footer/server.js +1 -1
  10. package/components/live-sample-result/element.js +1 -0
  11. package/components/menu/base.css +2 -1
  12. package/components/menu/constants.js +443 -147
  13. package/components/menu/missing-docs.json +140 -0
  14. package/components/menu/server.js +78 -657
  15. package/components/menu/types.d.ts +50 -0
  16. package/components/menu/update-missing-docs.js +66 -0
  17. package/components/outer-layout/utils.js +2 -2
  18. package/components/play-runner/element.js +14 -6
  19. package/entry.client.js +1 -0
  20. package/hooks/ga-init.js +31 -0
  21. package/hooks/glean-init.js +2 -6
  22. package/l10n/fr.ftl +145 -1
  23. package/out/service-worker.js +1 -1
  24. package/out/service-worker.js.map +1 -1
  25. package/out/static/client/{6480.09f744cd2fb69ed8.js → 6480.c839ead24f125a7e.js} +3 -2
  26. package/out/static/client/{6480.09f744cd2fb69ed8.js.map → 6480.c839ead24f125a7e.js.map} +1 -1
  27. package/out/static/client/9914.021220acc0d3e777.js +11 -0
  28. package/out/static/client/9914.021220acc0d3e777.js.map +1 -0
  29. package/out/static/client/index.0f1f5c05b3c9458b.js +412 -0
  30. package/out/static/client/index.0f1f5c05b3c9458b.js.map +1 -0
  31. package/out/static/client/{runtime.b178b9749f31202a.js → runtime.f3c0cd5b45c6e874.js} +2 -2
  32. package/out/static/client/{runtime.b178b9749f31202a.js.map → runtime.f3c0cd5b45c6e874.js.map} +1 -1
  33. package/out/static/client/stats.json +116 -116
  34. package/out/static/client/styles-curriculum-landing.cbaf6ff367369a26.css.map +1 -1
  35. package/out/static/client/styles-curriculum-module.c7ec78d3e724cf64.css.map +1 -1
  36. package/out/static/client/{styles-global.fb7afecd89ca2dff.js → styles-global.52fa98f0e9ec0040.js} +1 -1
  37. package/out/static/client/{styles-global.684fd2c5254c94b8.css → styles-global.75b8c75561733419.css} +2 -2
  38. package/out/static/client/{styles-global.684fd2c5254c94b8.css.map → styles-global.75b8c75561733419.css.map} +1 -1
  39. package/out/static/client/styles-menu.c41c14be9597dcd9.css +2 -0
  40. package/out/static/client/styles-menu.c41c14be9597dcd9.css.map +1 -0
  41. package/out/static/legacy/asset-manifest.json +5 -5
  42. package/out/static/legacy/{index.ad3600b01e18974e.html → index.4d5b9af908771553.html} +1 -1
  43. package/out/static/legacy/{index.5592b02d966df8ba.js → index.e275f57e34e5ad42.js} +3 -3
  44. package/out/static/legacy/{index.5592b02d966df8ba.js.map → index.e275f57e34e5ad42.js.map} +1 -1
  45. package/out/static/legacy/stats.json +10 -10
  46. package/out/static/legacy/{yari.8ce0be252d1ae155.js → yari.28c752c4002c881d.js} +3 -3
  47. package/out/static/legacy/{yari.8ce0be252d1ae155.js.map → yari.28c752c4002c881d.js.map} +1 -1
  48. package/out/static/ssr/index.js +306 -580
  49. package/out/static/ssr/index.js.map +1 -1
  50. package/out/static/ssr/stats.json +4 -4
  51. package/package.json +9 -9
  52. package/utils/dnt-helper.js +59 -0
  53. package/utils/name-transformation.js +40 -0
  54. package/utils/telemetry-opt-out.js +12 -0
  55. package/components/menu/check-missing-docs.js +0 -44
  56. package/out/static/client/9914.251fe19f0038e97b.js +0 -11
  57. package/out/static/client/9914.251fe19f0038e97b.js.map +0 -1
  58. package/out/static/client/index.26176fe4ab13dce5.js +0 -268
  59. package/out/static/client/index.26176fe4ab13dce5.js.map +0 -1
  60. package/out/static/client/styles-menu.5193bf2642ae7d64.css +0 -2
  61. package/out/static/client/styles-menu.5193bf2642ae7d64.css.map +0 -1
  62. /package/out/static/client/{6480.09f744cd2fb69ed8.js.LICENSE.txt → 6480.c839ead24f125a7e.js.LICENSE.txt} +0 -0
  63. /package/out/static/client/{index.26176fe4ab13dce5.js.LICENSE.txt → index.0f1f5c05b3c9458b.js.LICENSE.txt} +0 -0
  64. /package/out/static/legacy/{index.5592b02d966df8ba.js.LICENSE.txt → index.e275f57e34e5ad42.js.LICENSE.txt} +0 -0
  65. /package/out/static/legacy/{yari.8ce0be252d1ae155.js.LICENSE.txt → yari.28c752c4002c881d.js.LICENSE.txt} +0 -0
@@ -11,7 +11,7 @@
11
11
  ],
12
12
  "assets": [
13
13
  {
14
- "name": "runtime.b178b9749f31202a.js",
14
+ "name": "runtime.f3c0cd5b45c6e874.js",
15
15
  "size": 19280
16
16
  },
17
17
  {
@@ -23,15 +23,15 @@
23
23
  "size": 55435
24
24
  },
25
25
  {
26
- "name": "index.26176fe4ab13dce5.js",
27
- "size": 34604
26
+ "name": "index.0f1f5c05b3c9458b.js",
27
+ "size": 43845
28
28
  }
29
29
  ],
30
30
  "filteredAssets": 0,
31
- "assetsSize": 157498,
31
+ "assetsSize": 166739,
32
32
  "auxiliaryAssets": [
33
33
  {
34
- "name": "runtime.b178b9749f31202a.js.map",
34
+ "name": "runtime.f3c0cd5b45c6e874.js.map",
35
35
  "size": 44364
36
36
  },
37
37
  {
@@ -42,16 +42,16 @@
42
42
  "name": "1127.49790b26827d316c.js.map",
43
43
  "size": 201489
44
44
  },
45
- {
46
- "name": "index.26176fe4ab13dce5.js.map",
47
- "size": 84198
48
- },
49
45
  {
50
46
  "name": "search.5dd31cbeea7d1af9.svg",
51
47
  "size": 246
48
+ },
49
+ {
50
+ "name": "index.0f1f5c05b3c9458b.js.map",
51
+ "size": 98427
52
52
  }
53
53
  ],
54
- "auxiliaryAssetsSize": 584105,
54
+ "auxiliaryAssetsSize": 598334,
55
55
  "children": {},
56
56
  "childAssets": {}
57
57
  },
@@ -67,11 +67,11 @@
67
67
  "size": 548
68
68
  },
69
69
  {
70
- "name": "styles-global.684fd2c5254c94b8.css",
70
+ "name": "styles-global.75b8c75561733419.css",
71
71
  "size": 25102
72
72
  },
73
73
  {
74
- "name": "styles-global.fb7afecd89ca2dff.js",
74
+ "name": "styles-global.52fa98f0e9ec0040.js",
75
75
  "size": 832
76
76
  }
77
77
  ],
@@ -94,10 +94,6 @@
94
94
  "name": "external-link.4f3a2dc8e402cae5.svg",
95
95
  "size": 275
96
96
  },
97
- {
98
- "name": "styles-global.684fd2c5254c94b8.css.map",
99
- "size": 40004
100
- },
101
97
  {
102
98
  "name": "trash-2.73b28bc66fb8543c.svg",
103
99
  "size": 290
@@ -138,6 +134,10 @@
138
134
  "name": "inter-cyrillic.eecfbd79d522303a.woff2",
139
135
  "size": 29904
140
136
  },
137
+ {
138
+ "name": "styles-global.75b8c75561733419.css.map",
139
+ "size": 40004
140
+ },
141
141
  {
142
142
  "name": "jetbrains-mono-italic-latin.55b330522e5e3ed9.woff2",
143
143
  "size": 30860
@@ -1084,7 +1084,7 @@
1084
1084
  },
1085
1085
  {
1086
1086
  "name": "styles-curriculum-landing.cbaf6ff367369a26.css.map",
1087
- "size": 43220
1087
+ "size": 43222
1088
1088
  },
1089
1089
  {
1090
1090
  "name": "curriculum-ext-resource.7ccbd6b7cf9747db.svg",
@@ -1143,7 +1143,7 @@
1143
1143
  "size": 1095
1144
1144
  }
1145
1145
  ],
1146
- "auxiliaryAssetsSize": 148302,
1146
+ "auxiliaryAssetsSize": 148304,
1147
1147
  "children": {},
1148
1148
  "childAssets": {}
1149
1149
  },
@@ -1210,7 +1210,7 @@
1210
1210
  },
1211
1211
  {
1212
1212
  "name": "styles-curriculum-module.c7ec78d3e724cf64.css.map",
1213
- "size": 4004
1213
+ "size": 4006
1214
1214
  },
1215
1215
  {
1216
1216
  "name": "curriculum-landing-about-pace.04fd0a480b4ef342.svg",
@@ -1281,7 +1281,7 @@
1281
1281
  "size": 1095
1282
1282
  }
1283
1283
  ],
1284
- "auxiliaryAssetsSize": 87783,
1284
+ "auxiliaryAssetsSize": 87785,
1285
1285
  "children": {},
1286
1286
  "childAssets": {}
1287
1287
  },
@@ -1636,42 +1636,6 @@
1636
1636
  "children": {},
1637
1637
  "childAssets": {}
1638
1638
  },
1639
- "styles-generic-content": {
1640
- "name": "styles-generic-content",
1641
- "chunks": [
1642
- "4014",
1643
- "110"
1644
- ],
1645
- "assets": [
1646
- {
1647
- "name": "styles.5ce0bc180316e680.js",
1648
- "size": 548
1649
- },
1650
- {
1651
- "name": "styles-generic-content.1c2a87b0131358e4.js",
1652
- "size": 252
1653
- },
1654
- {
1655
- "name": "styles-generic-content.7444d40b2838f04c.css",
1656
- "size": 1389
1657
- }
1658
- ],
1659
- "filteredAssets": 0,
1660
- "assetsSize": 2189,
1661
- "auxiliaryAssets": [
1662
- {
1663
- "name": "styles.5ce0bc180316e680.js.map",
1664
- "size": 2649
1665
- },
1666
- {
1667
- "name": "styles-generic-content.7444d40b2838f04c.css.map",
1668
- "size": 2387
1669
- }
1670
- ],
1671
- "auxiliaryAssetsSize": 5036,
1672
- "children": {},
1673
- "childAssets": {}
1674
- },
1675
1639
  "styles-generic-community": {
1676
1640
  "name": "styles-generic-community",
1677
1641
  "chunks": [
@@ -1764,6 +1728,42 @@
1764
1728
  "children": {},
1765
1729
  "childAssets": {}
1766
1730
  },
1731
+ "styles-generic-content": {
1732
+ "name": "styles-generic-content",
1733
+ "chunks": [
1734
+ "4014",
1735
+ "110"
1736
+ ],
1737
+ "assets": [
1738
+ {
1739
+ "name": "styles.5ce0bc180316e680.js",
1740
+ "size": 548
1741
+ },
1742
+ {
1743
+ "name": "styles-generic-content.1c2a87b0131358e4.js",
1744
+ "size": 252
1745
+ },
1746
+ {
1747
+ "name": "styles-generic-content.7444d40b2838f04c.css",
1748
+ "size": 1389
1749
+ }
1750
+ ],
1751
+ "filteredAssets": 0,
1752
+ "assetsSize": 2189,
1753
+ "auxiliaryAssets": [
1754
+ {
1755
+ "name": "styles.5ce0bc180316e680.js.map",
1756
+ "size": 2649
1757
+ },
1758
+ {
1759
+ "name": "styles-generic-content.7444d40b2838f04c.css.map",
1760
+ "size": 2387
1761
+ }
1762
+ ],
1763
+ "auxiliaryAssetsSize": 5036,
1764
+ "children": {},
1765
+ "childAssets": {}
1766
+ },
1767
1767
  "styles-generic-layout": {
1768
1768
  "name": "styles-generic-layout",
1769
1769
  "chunks": [
@@ -1872,11 +1872,11 @@
1872
1872
  "children": {},
1873
1873
  "childAssets": {}
1874
1874
  },
1875
- "styles-homepage": {
1876
- "name": "styles-homepage",
1875
+ "styles-heading-anchor": {
1876
+ "name": "styles-heading-anchor",
1877
1877
  "chunks": [
1878
1878
  "4014",
1879
- "1187"
1879
+ "4015"
1880
1880
  ],
1881
1881
  "assets": [
1882
1882
  {
@@ -1884,35 +1884,35 @@
1884
1884
  "size": 548
1885
1885
  },
1886
1886
  {
1887
- "name": "styles-homepage.0980eec27925cc11.css",
1888
- "size": 381
1887
+ "name": "styles-heading-anchor.ce77b5e405bc0cd8.js",
1888
+ "size": 253
1889
1889
  },
1890
1890
  {
1891
- "name": "styles-homepage.3a64b2680d95139f.js",
1892
- "size": 245
1891
+ "name": "styles-heading-anchor.0eec5185ab9425b7.css",
1892
+ "size": 694
1893
1893
  }
1894
1894
  ],
1895
1895
  "filteredAssets": 0,
1896
- "assetsSize": 1174,
1896
+ "assetsSize": 1495,
1897
1897
  "auxiliaryAssets": [
1898
1898
  {
1899
1899
  "name": "styles.5ce0bc180316e680.js.map",
1900
1900
  "size": 2649
1901
1901
  },
1902
1902
  {
1903
- "name": "styles-homepage.0980eec27925cc11.css.map",
1904
- "size": 685
1903
+ "name": "styles-heading-anchor.0eec5185ab9425b7.css.map",
1904
+ "size": 1296
1905
1905
  }
1906
1906
  ],
1907
- "auxiliaryAssetsSize": 3334,
1907
+ "auxiliaryAssetsSize": 3945,
1908
1908
  "children": {},
1909
1909
  "childAssets": {}
1910
1910
  },
1911
- "styles-heading-anchor": {
1912
- "name": "styles-heading-anchor",
1911
+ "styles-homepage": {
1912
+ "name": "styles-homepage",
1913
1913
  "chunks": [
1914
1914
  "4014",
1915
- "4015"
1915
+ "1187"
1916
1916
  ],
1917
1917
  "assets": [
1918
1918
  {
@@ -1920,27 +1920,27 @@
1920
1920
  "size": 548
1921
1921
  },
1922
1922
  {
1923
- "name": "styles-heading-anchor.ce77b5e405bc0cd8.js",
1924
- "size": 253
1923
+ "name": "styles-homepage.0980eec27925cc11.css",
1924
+ "size": 381
1925
1925
  },
1926
1926
  {
1927
- "name": "styles-heading-anchor.0eec5185ab9425b7.css",
1928
- "size": 694
1927
+ "name": "styles-homepage.3a64b2680d95139f.js",
1928
+ "size": 245
1929
1929
  }
1930
1930
  ],
1931
1931
  "filteredAssets": 0,
1932
- "assetsSize": 1495,
1932
+ "assetsSize": 1174,
1933
1933
  "auxiliaryAssets": [
1934
1934
  {
1935
1935
  "name": "styles.5ce0bc180316e680.js.map",
1936
1936
  "size": 2649
1937
1937
  },
1938
1938
  {
1939
- "name": "styles-heading-anchor.0eec5185ab9425b7.css.map",
1940
- "size": 1296
1939
+ "name": "styles-homepage.0980eec27925cc11.css.map",
1940
+ "size": 685
1941
1941
  }
1942
1942
  ],
1943
- "auxiliaryAssetsSize": 3945,
1943
+ "auxiliaryAssetsSize": 3334,
1944
1944
  "children": {},
1945
1945
  "childAssets": {}
1946
1946
  },
@@ -2301,12 +2301,12 @@
2301
2301
  "size": 243
2302
2302
  },
2303
2303
  {
2304
- "name": "styles-menu.5193bf2642ae7d64.css",
2305
- "size": 5594
2304
+ "name": "styles-menu.c41c14be9597dcd9.css",
2305
+ "size": 5601
2306
2306
  }
2307
2307
  ],
2308
2308
  "filteredAssets": 0,
2309
- "assetsSize": 6385,
2309
+ "assetsSize": 6392,
2310
2310
  "auxiliaryAssets": [
2311
2311
  {
2312
2312
  "name": "styles.5ce0bc180316e680.js.map",
@@ -2337,12 +2337,12 @@
2337
2337
  "size": 367
2338
2338
  },
2339
2339
  {
2340
- "name": "shield-check.07bdc37f20ac5cc6.svg",
2341
- "size": 386
2340
+ "name": "styles-menu.c41c14be9597dcd9.css.map",
2341
+ "size": 9854
2342
2342
  },
2343
2343
  {
2344
- "name": "styles-menu.5193bf2642ae7d64.css.map",
2345
- "size": 9843
2344
+ "name": "shield-check.07bdc37f20ac5cc6.svg",
2345
+ "size": 386
2346
2346
  },
2347
2347
  {
2348
2348
  "name": "github.4d94e1bf436aa7ed.svg",
@@ -2353,15 +2353,15 @@
2353
2353
  "size": 351
2354
2354
  }
2355
2355
  ],
2356
- "auxiliaryAssetsSize": 15579,
2356
+ "auxiliaryAssetsSize": 15590,
2357
2357
  "children": {},
2358
2358
  "childAssets": {}
2359
2359
  },
2360
- "styles-not-found": {
2361
- "name": "styles-not-found",
2360
+ "styles-navigation": {
2361
+ "name": "styles-navigation",
2362
2362
  "chunks": [
2363
2363
  "4014",
2364
- "4575"
2364
+ "1445"
2365
2365
  ],
2366
2366
  "assets": [
2367
2367
  {
@@ -2369,35 +2369,43 @@
2369
2369
  "size": 548
2370
2370
  },
2371
2371
  {
2372
- "name": "styles-not-found.f0e61f91b37b60f9.js",
2373
- "size": 248
2372
+ "name": "styles-navigation.013b4a4ed330892a.css",
2373
+ "size": 2143
2374
2374
  },
2375
2375
  {
2376
- "name": "styles-not-found.7b511b835e4030ea.css",
2377
- "size": 293
2376
+ "name": "styles-navigation.66c2ffc4334c99fc.js",
2377
+ "size": 249
2378
2378
  }
2379
2379
  ],
2380
2380
  "filteredAssets": 0,
2381
- "assetsSize": 1089,
2381
+ "assetsSize": 2940,
2382
2382
  "auxiliaryAssets": [
2383
2383
  {
2384
2384
  "name": "styles.5ce0bc180316e680.js.map",
2385
2385
  "size": 2649
2386
2386
  },
2387
2387
  {
2388
- "name": "styles-not-found.7b511b835e4030ea.css.map",
2389
- "size": 570
2388
+ "name": "menu.74ccd9bb64dbf543.svg",
2389
+ "size": 222
2390
+ },
2391
+ {
2392
+ "name": "cancel.7362f2cdf3515e0d.svg",
2393
+ "size": 219
2394
+ },
2395
+ {
2396
+ "name": "styles-navigation.013b4a4ed330892a.css.map",
2397
+ "size": 4251
2390
2398
  }
2391
2399
  ],
2392
- "auxiliaryAssetsSize": 3219,
2400
+ "auxiliaryAssetsSize": 7341,
2393
2401
  "children": {},
2394
2402
  "childAssets": {}
2395
2403
  },
2396
- "styles-navigation": {
2397
- "name": "styles-navigation",
2404
+ "styles-not-found": {
2405
+ "name": "styles-not-found",
2398
2406
  "chunks": [
2399
2407
  "4014",
2400
- "1445"
2408
+ "4575"
2401
2409
  ],
2402
2410
  "assets": [
2403
2411
  {
@@ -2405,35 +2413,27 @@
2405
2413
  "size": 548
2406
2414
  },
2407
2415
  {
2408
- "name": "styles-navigation.013b4a4ed330892a.css",
2409
- "size": 2143
2416
+ "name": "styles-not-found.f0e61f91b37b60f9.js",
2417
+ "size": 248
2410
2418
  },
2411
2419
  {
2412
- "name": "styles-navigation.66c2ffc4334c99fc.js",
2413
- "size": 249
2420
+ "name": "styles-not-found.7b511b835e4030ea.css",
2421
+ "size": 293
2414
2422
  }
2415
2423
  ],
2416
2424
  "filteredAssets": 0,
2417
- "assetsSize": 2940,
2425
+ "assetsSize": 1089,
2418
2426
  "auxiliaryAssets": [
2419
2427
  {
2420
2428
  "name": "styles.5ce0bc180316e680.js.map",
2421
2429
  "size": 2649
2422
2430
  },
2423
2431
  {
2424
- "name": "menu.74ccd9bb64dbf543.svg",
2425
- "size": 222
2426
- },
2427
- {
2428
- "name": "cancel.7362f2cdf3515e0d.svg",
2429
- "size": 219
2430
- },
2431
- {
2432
- "name": "styles-navigation.013b4a4ed330892a.css.map",
2433
- "size": 4251
2432
+ "name": "styles-not-found.7b511b835e4030ea.css.map",
2433
+ "size": 570
2434
2434
  }
2435
2435
  ],
2436
- "auxiliaryAssetsSize": 7341,
2436
+ "auxiliaryAssetsSize": 3219,
2437
2437
  "children": {},
2438
2438
  "childAssets": {}
2439
2439
  },
@@ -1 +1 @@
1
- {"version":3,"file":"styles-curriculum-landing.cbaf6ff367369a26.css","sources":["webpack://@mdn/fred/./components/curriculum/module.css","webpack://@mdn/fred/./components/curriculum/partner-banner.css","webpack://@mdn/fred/./components/curriculum-landing/server.css"],"sourcesContent":["\n :is(.curriculum-content-container.curriculum-module .curriculum-content) > header {\n display: grid;\n\n grid-template-areas:\n \". group\"\n \"icon heading\"\n \"icon category\";\n\n column-gap: 1.5rem;\n justify-content: flex-start;\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon {\n --background-primary: var(--curriculum-bg-color-topic);\n grid-area: icon;\n\n align-self: flex-start;\n\n width: 4rem;\n height: 4rem;\n }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon) + h1 {\n grid-area: heading;\n margin-bottom: 0;\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic {\n grid-area: category;\n\n margin: 0;\n margin-top: 0.5rem;\n\n font-size: var(--font-size-normal);\n\n color: var(--curriculum-color-topic);\n }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic)::before {\n content: \"Category: \";\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-group {\n grid-area: group;\n\n align-self: center;\n\n width: fit-content;\n height: max-content;\n\n padding: 0.125rem 0.5rem;\n margin: 0;\n margin-bottom: 0.25rem;\n\n font-size: var(--font-size-normal);\n\n color: var(--curriculum-module-label-color);\n\n background-color: var(--curriculum-module-label-bg-color);\n border-radius: var(--elem-radius);\n }:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources {\n margin-top: 2rem;\n margin-bottom: 0.5rem;\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul {\n padding-left: 2rem;\n }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li {\n list-style-image: var(--curriculum-module-mdn-resource);\n }.curriculum-external-li:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) {\n list-style-image: url(\"./assets/curriculum-ext-resource.svg\");\n }:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) em {\n display: inline-block;\n\n padding: 0 0.4em;\n\n font-size: 0.5rem;\n font-weight: bold;\n\n line-height: var(--font-line-content);\n vertical-align: super;\n\n color: var(--color-text-primary);\n\n text-transform: uppercase;\n\n background: var(--curriculum-bg-color);\n border-radius: 1em;\n text-rendering: optimizelegibility;\n }\n","\n .curriculum-partner-banner-container .partner-banner {\n display: grid;\n\n grid-template-areas: \"h2\" \"image\" \"p\" \"a\";\n\n margin: 1rem auto;\n\n background-color: var(--curriculum-bg-color-partner);\n background-image: var(--curriculum-bg-image-partner);\n background-repeat: no-repeat;\n border: 1px solid var(--curriculum-border-color);\n box-shadow: var(--curriculum-shadow);\n }@media screen and (769px < width) {.curriculum-partner-banner-container .partner-banner {\n grid-template-areas: \"copy image\";\n grid-template-columns: 2fr minmax(24rem, 1fr);\n }\n }:is(.curriculum-partner-banner-container .partner-banner) > mdn-themed-image {\n grid-area: image;\n\n align-self: end;\n justify-self: center;\n\n width: 90%;\n max-width: max-content;\n height: max-content;\n }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner) > mdn-themed-image {\n justify-self: end;\n width: 100%;\n }\n }:is(.curriculum-partner-banner-container .partner-banner) > section {\n display: contents;\n grid-area: copy;\n padding: 2rem 4rem;\n }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner) > section {\n display: block;\n }\n }:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2 {\n grid-area: h2;\n margin: 1rem 0 2rem;\n text-align: center;\n }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2 {\n margin: 0 0 1rem;\n text-align: left;\n }\n }:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a {\n display: inline-block;\n min-width: max-content;\n color: var(--curriculum-category-color);\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited:not([href^=\"#\"]) {\n color: var(--curriculum-category-color);\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n position: absolute;\n content: url(\"./assets/curriculum-partner-underline-small.svg\");\n transform: translate3d(-0.1em, 0.4em, 0);\n }@media screen and (769px < width) {:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n content: url(\"./assets/curriculum-partner-underline-large.svg\");\n }\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover {\n -webkit-text-decoration: none;\n text-decoration: none;\n }:is(:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover)::before {\n content: none;\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::after {\n width: 0.625em;\n height: 0.625em;\n background-color: var(--curriculum-category-color);\n }:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > p {\n grid-area: p;\n margin: 1.5rem 1rem;\n }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > p {\n margin: 1rem 0 1.5rem;\n }\n }:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > a {\n grid-area: a;\n margin: 1rem;\n color: var(--color-text-primary);\n }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > a {\n margin: 1rem 0 0;\n }\n }\n","@import url(\"../curriculum/shared.css\");\n@import url(\"../curriculum/module.css\");\n@import url(\"../curriculum/module-list.css\");\n@import url(\"../curriculum/partner-banner.css\");\n@import url(\"../button/server.css\");\n\n.curriculum-content-container.curriculum-landing {\n width: 100%;\n max-width: 100%;\n\n padding: 0;\n margin: 0;\n\n background-color: var(--color-background-page);\n}\n\n:is(.curriculum-content-container.curriculum-landing article) > header,:is(.curriculum-content-container.curriculum-landing article) > section {\n width: 100%;\n max-width: min(var(--max-width), 74rem);\n\n padding-right: var(--gutter);\n padding-left: var(--gutter);\n margin: 0 auto 3rem;\n }\n\n.curriculum-content-container.curriculum-landing .curriculum-content {\n padding-top: 0;\n\n /* number of columns in module list depending on screen width */\n }\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n\n@media (width <= 426px) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr;\n }\n }\n\n@media (426px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr;\n }\n }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr 1fr;\n }\n }\n\n@media (1200px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n }\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n display: grid;\n grid-template-areas: \"copy\" \"svg\";\n }\n\n@media (769px < width) {\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n grid-template-areas: \"copy svg\";\n grid-template-columns: 30rem auto;\n }\n }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg {\n z-index: 1;\n\n grid-area: svg;\n\n align-self: end;\n justify-self: end;\n\n width: 100%;\n max-width: 28rem;\n\n margin-bottom: 3rem;\n }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg {\n margin-bottom: 0;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) #icons-bg {\n fill: var(--curriculum-bg-color-landing-top-icon);\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) .laptop {\n fill: var(--curriculum-color-landing-laptop);\n }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > section {\n grid-area: copy;\n\n max-width: 30rem;\n\n padding-right: 1rem;\n margin-top: 3rem;\n margin-right: auto;\n }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > section {\n margin-bottom: 4rem;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n margin-bottom: 0.5rem;\n font-size: var(--font-size-larger);\n color: var(--curriculum-color-topic);\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n font-size: var(--font-size-largest);\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-size: var(--font-size-large);\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n margin-bottom: 2rem;\n font-size: var(--font-size-larger);\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) p {\n color: var(--color-text-secondary);\n }\n\n.curriculum-content-container.curriculum-landing .landing-about-container {\n max-width: 100%;\n\n margin: 0;\n margin-top: -6rem;\n\n background-color: var(--curriculum-bg-large-color);\n }\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n display: grid;\n\n grid-template-areas:\n \"li\"\n \"h2\"\n \"p1\"\n \"p2\"\n \"p3\"\n \"p4\"\n \"scrim\";\n grid-template-columns: 1fr;\n\n max-width: min(var(--max-width), 74rem);\n\n margin: 0 auto 3rem;\n }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n grid-template-areas:\n \"li li li \"\n \"h2 . scrim\"\n \"p1 . scrim\"\n \"p2 . scrim\"\n \"p3 arrow scrim\"\n \"p4 arrow scrim\";\n grid-template-columns: 1fr 7rem 24rem;\n column-gap: 1rem;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) h2 {\n grid-area: h2;\n margin: 1rem 0;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content {\n display: contents;\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n display: grid;\n\n grid-area: li;\n grid-template-columns: auto auto auto;\n\n align-items: start;\n justify-content: center;\n\n width: 100%;\n min-height: 5rem;\n\n padding: 1rem;\n margin: auto;\n\n color: var(--color-text-secondary);\n\n background-color: var(--curriculum-bg-color-landing-about-ul);\n border-radius: var(--elem-radius);\n box-shadow: var(--curriculum-shadow-landing-about-ul);\n\n transform: translateY(-1rem);\n }\n\n@media (426px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n gap: 1rem;\n align-items: center;\n }\n }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n justify-content: start;\n }\n }\n\n@media (992px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n justify-content: center;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li {\n margin: 0 0.5rem;\n text-align: center;\n }\n\n@media (426px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li {\n width: max-content;\n margin: 0 1rem;\n }\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li {\n display: inline-flex;\n gap: 1rem;\n align-items: center;\n }\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n display: block;\n\n width: 3rem;\n height: 3rem;\n\n margin: 0 auto;\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n display: initial;\n margin: 0;\n }\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(1)::before {\n content: var(--curriculum-landing-about-beginner);\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(2)::before {\n content: var(--curriculum-landing-about-pace);\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(3)::before {\n content: var(--curriculum-landing-about-free);\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p {\n display: grid;\n\n grid-template-columns: auto auto;\n\n align-items: center;\n justify-content: start;\n\n margin: 1rem 0;\n\n color: var(--color-text-secondary);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p)::before {\n display: block;\n\n align-self: start;\n\n width: 4rem;\n height: 4rem;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2) {\n grid-area: p1;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2)::before {\n content: var(--curriculum-landing-about-bullet);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3) {\n grid-area: p2;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3)::before {\n content: var(--curriculum-landing-about-bullet);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4) {\n grid-area: p3;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4)::before {\n content: var(--curriculum-landing-about-bullet);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) {\n grid-area: p4;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a {\n margin-left: 4rem;\n font-weight: var(--font-weight-bold);\n -webkit-text-decoration: underline;\n text-decoration: underline;\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):hover,:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):active {\n -webkit-text-decoration: none;\n text-decoration: none;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.arrow {\n grid-area: arrow;\n\n background-image: var(--curriculum-landing-arrow);\n background-repeat: no-repeat;\n background-position: center;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n display: flex;\n\n flex-direction: column;\n\n grid-area: scrim;\n\n justify-content: center;\n justify-self: center;\n\n max-width: 24rem;\n\n margin-top: 1rem;\n }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n justify-self: end;\n margin-top: 0;\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) .scrim-border {\n width: 100%;\n height: 16rem;\n\n background-image: var(--curriculum-scrim-bg);\n background-repeat: no-repeat;\n background-position: bottom right;\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) mdn-scrim-inline {\n display: block;\n\n width: 22rem;\n max-width: calc(100vw - var(--gutter) * 2);\n height: 14.25rem;\n\n background: #000000;\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) p {\n padding: 1rem 0;\n margin: 0;\n }\n\n.curriculum-content-container.curriculum-landing .landing-stairway {\n max-width: 100%;\n margin: 0;\n background-color: var(--color-background-secondary);\n }\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div {\n display: grid;\n\n grid-template-areas: \"a\" \"b\";\n grid-template-rows: auto auto;\n grid-template-columns: auto;\n\n justify-content: center;\n\n width: 100%;\n max-width: min(var(--max-width), 74rem);\n\n padding: 2rem;\n padding-right: var(--gutter);\n padding-left: var(--gutter);\n margin: 0 auto 3rem;\n\n color: var(--color-text-secondary);\n }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div {\n grid-template-columns: min(100%, 34rem);\n }\n }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div {\n grid-template-areas: \"a b\";\n grid-template-columns: 1fr 1.4fr;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) svg {\n width: 100%;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container {\n --fs: clamp(1rem, calc(3 * calc(100vw / 100)), 1.75rem);\n position: relative;\n\n grid-area: a;\n\n width: 100%;\n\n margin: 0;\n\n transform: translateX(2vw);\n }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container {\n --fs: clamp(1rem, calc(2 * calc(100vw / 100)), 1.75rem);\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1 {\n position: absolute;\n top: 18%;\n left: 32%;\n\n font-size: var(--fs);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1) > span {\n display: block;\n\n width: max-content;\n\n line-height: calc(1.25 * var(--fs));\n\n text-wrap: nowrap;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1) .color {\n color: var(--curriculum-color);\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container {\n --fs: clamp(0.75rem, calc(1.25 * calc(100vw / 100)), 1rem);\n position: relative;\n grid-area: b;\n transform: translateX(-5vw);\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container {\n --fs: clamp(0.75rem, calc(100vw / 100), 0.825rem);\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2 {\n position: absolute;\n top: 0;\n left: 0;\n\n width: calc(100% + 5vw);\n height: 100%;\n\n margin: 0;\n\n font-size: var(--fs);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) > span {\n position: absolute;\n\n display: block;\n\n max-width: 10rem;\n\n line-height: calc(1.25 * var(--fs));\n\n text-wrap: wrap;\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) > span {\n max-width: initial;\n text-wrap: nowrap;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n top: 36%;\n left: 47%;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n top: 52%;\n left: 33%;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n top: 71%;\n left: 23%;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n top: 86%;\n left: 8%;\n }\n\n@media (769px < width) {\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n top: 53%;\n left: 35%;\n }\n\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n top: 65%;\n left: 27%;\n }\n\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n top: 77%;\n left: 13%;\n }\n\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n top: 90%;\n left: 0%;\n }\n }\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n display: none;\n grid-area: b;\n }\n\n@media (769px < width) {\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n display: initial;\n }\n }\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n grid-area: b;\n max-width: 100%;\n }\n\n@media (769px < width) {\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n display: none;\n }\n }\n\n.curriculum-content-container.curriculum-landing #dont_know_where_toget_started {\n width: fit-content;\n\n margin: 1rem auto 5rem;\n\n line-height: 3rem;\n\n text-align: center;\n }\n\n:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started)::after {\n position: absolute;\n\n width: 6em;\n\n content: url(\"../curriculum/assets/curriculum-started-underline.svg\");\n\n transform: translate3d(-6em, 1.25rem, 0);\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul {\n display: grid;\n\n grid-template-areas: \"beginner\" \"advanced\" \"employ\" \"educator\";\n\n gap: 1rem;\n\n max-width: 52rem;\n\n margin: 0 auto;\n\n overflow: clip;\n\n scroll-snap-type: inline mandatory;\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul {\n grid-template-areas:\n \"beginner advanced\"\n \"employ educator\";\n grid-template-columns: auto auto;\n gap: 5rem 4rem;\n }\n }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul {\n gap: 5rem 8rem;\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li {\n display: grid;\n\n grid-template-areas:\n \"i h\"\n \"p p\"\n \"c c\";\n grid-template-rows: 4rem minmax(2rem, max-content) max-content;\n grid-template-columns: 3rem 1fr;\n\n gap: 1rem;\n align-items: center;\n\n height: max-content;\n\n padding: 1rem 0.5rem;\n\n color: var(--color-text-secondary);\n\n scroll-snap-align: center;\n\n background-color: var(--curriculum-bg-large-color);\n border-radius: var(--elem-radius);\n }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li {\n grid-template-areas:\n \"i h\"\n \"i p\"\n \"i c\";\n grid-template-rows: 4rem auto max-content;\n grid-template-columns: auto auto;\n\n gap: 1rem 2rem;\n align-items: start;\n\n width: initial;\n height: initial;\n\n padding: 0;\n\n background-color: initial;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n display: inline-block;\n\n align-self: start;\n\n width: 3rem;\n height: 3rem;\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n grid-area: i;\n width: 5rem;\n height: 5rem;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(1)::before {\n content: var(--curriculum-landing-started-beginner);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(2)::before {\n content: var(--curriculum-landing-started-advanced);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(3)::before {\n content: var(--curriculum-landing-started-employment);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(4)::before {\n content: var(--curriculum-landing-started-educator);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) h3 {\n grid-area: h;\n\n margin-top: 0;\n\n font-weight: var(--font-weight-bold);\n\n line-height: var(--font-line-normal);\n\n color: var(--color-text-primary);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(2) {\n grid-area: p;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(3) {\n grid-area: c;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) em {\n grid-area: p;\n align-self: start;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n --button-color--default: var(--color-background-primary);\n\n --button-bg: var(--button-bg--default);\n --button-bg-hover: var(--button-bg-hover--default);\n --button-bg-active: var(--button-bg-active--default);\n --button-border-color: var(--button-border-color--default);\n --button-height: 2rem;\n --button-color: var(--button-color--default);\n --button-radius: var(--elem-radius, 0.25rem);\n position: relative;\n\n display: flex;\n\n grid-area: c;\n\n gap: 0.25rem;\n align-items: center;\n justify-content: center;\n justify-self: center;\n\n width: fit-content;\n min-height: var(--button-height);\n\n padding: 0.5rem;\n padding-right: var(--button-padding);\n padding-left: var(--button-padding);\n\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-bold);\n\n color: var(--button-color);\n\n text-align: center;\n\n -webkit-text-decoration: none;\n\n -webkit-text-decoration: none;\n\n text-decoration: none;\n\n cursor: pointer;\n\n background-color: var(--button-bg);\n border: 1px solid var(--button-border-color);\n border-radius: var(--button-radius);\n }\n\n@supports (color: light-dark(red, red)){\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n --button-bg--default: light-dark(#1b1b1b, #ffffff);\n --button-bg-hover--default: light-dark(#696969, #cdcdcd);\n --button-bg-active--default: light-dark(#9e9e9e, #9e9e9e);\n --button-border-color--default: light-dark(#1d1d1d, #ffffff);\n }\n}\n\n@supports not (color: light-dark(tan, tan)){\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a) *{\n --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n }\n}\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n justify-self: start;\n }\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a):hover {\n background-color: var(--button-bg-hover, var(--button-bg));\n }\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"styles-curriculum-landing.cbaf6ff367369a26.css","sources":["webpack://@mdn/fred/./components/curriculum/module.css","webpack://@mdn/fred/./components/curriculum/partner-banner.css","webpack://@mdn/fred/./components/curriculum-landing/server.css"],"sourcesContent":["\n :is(.curriculum-content-container.curriculum-module .curriculum-content) > header {\n display: grid;\n\n grid-template-areas:\n \". group\"\n \"icon heading\"\n \"icon category\";\n\n column-gap: 1.5rem;\n justify-content: flex-start;\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon {\n --background-primary: var(--curriculum-bg-color-topic);\n grid-area: icon;\n\n align-self: flex-start;\n\n width: 4rem;\n height: 4rem;\n }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon) + h1 {\n grid-area: heading;\n margin-bottom: 0;\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic {\n grid-area: category;\n\n margin: 0;\n margin-top: 0.5rem;\n\n font-size: var(--font-size-normal);\n\n color: var(--curriculum-color-topic);\n }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic)::before {\n content: \"Category: \";\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-group {\n grid-area: group;\n\n align-self: center;\n\n width: fit-content;\n height: max-content;\n\n padding: 0.125rem 0.5rem;\n margin: 0;\n margin-bottom: 0.25rem;\n\n font-size: var(--font-size-normal);\n\n color: var(--curriculum-module-label-color);\n\n background-color: var(--curriculum-module-label-bg-color);\n border-radius: var(--elem-radius);\n }:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources {\n margin-top: 2rem;\n margin-bottom: 0.5rem;\n }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul {\n padding-left: 2rem;\n }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li {\n list-style-image: var(--curriculum-module-mdn-resource);\n }.curriculum-external-li:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) {\n list-style-image: url(\"./assets/curriculum-ext-resource.svg\");\n }:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) em {\n display: inline-block;\n\n padding: 0 0.4em;\n\n font-size: 0.5rem;\n font-weight: bold;\n\n line-height: var(--font-line-content);\n vertical-align: super;\n\n color: var(--color-text-primary);\n\n text-transform: uppercase;\n\n background: var(--curriculum-bg-color);\n border-radius: 1em;\n\n text-rendering: optimizelegibility;\n }\n","\n .curriculum-partner-banner-container .partner-banner {\n display: grid;\n\n grid-template-areas: \"h2\" \"image\" \"p\" \"a\";\n\n margin: 1rem auto;\n\n background-color: var(--curriculum-bg-color-partner);\n background-image: var(--curriculum-bg-image-partner);\n background-repeat: no-repeat;\n border: 1px solid var(--curriculum-border-color);\n box-shadow: var(--curriculum-shadow);\n }@media screen and (769px < width) {.curriculum-partner-banner-container .partner-banner {\n grid-template-areas: \"copy image\";\n grid-template-columns: 2fr minmax(24rem, 1fr);\n }\n }:is(.curriculum-partner-banner-container .partner-banner) > mdn-themed-image {\n grid-area: image;\n\n align-self: end;\n justify-self: center;\n\n width: 90%;\n max-width: max-content;\n height: max-content;\n }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner) > mdn-themed-image {\n justify-self: end;\n width: 100%;\n }\n }:is(.curriculum-partner-banner-container .partner-banner) > section {\n display: contents;\n grid-area: copy;\n padding: 2rem 4rem;\n }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner) > section {\n display: block;\n }\n }:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2 {\n grid-area: h2;\n margin: 1rem 0 2rem;\n text-align: center;\n }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2 {\n margin: 0 0 1rem;\n text-align: left;\n }\n }:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a {\n display: inline-block;\n min-width: max-content;\n color: var(--curriculum-category-color);\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited:not([href^=\"#\"]) {\n color: var(--curriculum-category-color);\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n position: absolute;\n content: url(\"./assets/curriculum-partner-underline-small.svg\");\n transform: translate3d(-0.1em, 0.4em, 0);\n }@media screen and (769px < width) {:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n content: url(\"./assets/curriculum-partner-underline-large.svg\");\n }\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover {\n -webkit-text-decoration: none;\n text-decoration: none;\n }:is(:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover)::before {\n content: none;\n }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::after {\n width: 0.625em;\n height: 0.625em;\n background-color: var(--curriculum-category-color);\n }:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > p {\n grid-area: p;\n margin: 1.5rem 1rem;\n }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > p {\n margin: 1rem 0 1.5rem;\n }\n }:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > a {\n grid-area: a;\n margin: 1rem;\n color: var(--color-text-primary);\n }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > a {\n margin: 1rem 0 0;\n }\n }\n","@import url(\"../curriculum/shared.css\");\n@import url(\"../curriculum/module.css\");\n@import url(\"../curriculum/module-list.css\");\n@import url(\"../curriculum/partner-banner.css\");\n@import url(\"../button/server.css\");\n\n.curriculum-content-container.curriculum-landing {\n width: 100%;\n max-width: 100%;\n\n padding: 0;\n margin: 0;\n\n background-color: var(--color-background-page);\n}\n\n:is(.curriculum-content-container.curriculum-landing article) > header,:is(.curriculum-content-container.curriculum-landing article) > section {\n width: 100%;\n max-width: min(var(--max-width), 74rem);\n\n padding-right: var(--gutter);\n padding-left: var(--gutter);\n margin: 0 auto 3rem;\n }\n\n.curriculum-content-container.curriculum-landing .curriculum-content {\n padding-top: 0;\n\n /* number of columns in module list depending on screen width */\n }\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n\n@media (width <= 426px) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr;\n }\n }\n\n@media (426px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr;\n }\n }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr 1fr;\n }\n }\n\n@media (1200px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n }\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n display: grid;\n grid-template-areas: \"copy\" \"svg\";\n }\n\n@media (769px < width) {\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n grid-template-areas: \"copy svg\";\n grid-template-columns: 30rem auto;\n }\n }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg {\n z-index: 1;\n\n grid-area: svg;\n\n align-self: end;\n justify-self: end;\n\n width: 100%;\n max-width: 28rem;\n\n margin-bottom: 3rem;\n }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg {\n margin-bottom: 0;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) #icons-bg {\n fill: var(--curriculum-bg-color-landing-top-icon);\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) .laptop {\n fill: var(--curriculum-color-landing-laptop);\n }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > section {\n grid-area: copy;\n\n max-width: 30rem;\n\n padding-right: 1rem;\n margin-top: 3rem;\n margin-right: auto;\n }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header) > section {\n margin-bottom: 4rem;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n margin-bottom: 0.5rem;\n font-size: var(--font-size-larger);\n color: var(--curriculum-color-topic);\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n font-size: var(--font-size-largest);\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-size: var(--font-size-large);\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n margin-bottom: 2rem;\n font-size: var(--font-size-larger);\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) p {\n color: var(--color-text-secondary);\n }\n\n.curriculum-content-container.curriculum-landing .landing-about-container {\n max-width: 100%;\n\n margin: 0;\n margin-top: -6rem;\n\n background-color: var(--curriculum-bg-large-color);\n }\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n display: grid;\n\n grid-template-areas:\n \"li\"\n \"h2\"\n \"p1\"\n \"p2\"\n \"p3\"\n \"p4\"\n \"scrim\";\n grid-template-columns: 1fr;\n\n max-width: min(var(--max-width), 74rem);\n\n margin: 0 auto 3rem;\n }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n grid-template-areas:\n \"li li li \"\n \"h2 . scrim\"\n \"p1 . scrim\"\n \"p2 . scrim\"\n \"p3 arrow scrim\"\n \"p4 arrow scrim\";\n grid-template-columns: 1fr 7rem 24rem;\n column-gap: 1rem;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) h2 {\n grid-area: h2;\n margin: 1rem 0;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content {\n display: contents;\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n display: grid;\n\n grid-area: li;\n grid-template-columns: auto auto auto;\n\n align-items: start;\n justify-content: center;\n\n width: 100%;\n min-height: 5rem;\n\n padding: 1rem;\n margin: auto;\n\n color: var(--color-text-secondary);\n\n background-color: var(--curriculum-bg-color-landing-about-ul);\n border-radius: var(--elem-radius);\n box-shadow: var(--curriculum-shadow-landing-about-ul);\n\n transform: translateY(-1rem);\n }\n\n@media (426px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n gap: 1rem;\n align-items: center;\n }\n }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n justify-content: start;\n }\n }\n\n@media (992px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n justify-content: center;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li {\n margin: 0 0.5rem;\n text-align: center;\n }\n\n@media (426px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li {\n width: max-content;\n margin: 0 1rem;\n }\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li {\n display: inline-flex;\n gap: 1rem;\n align-items: center;\n }\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n display: block;\n\n width: 3rem;\n height: 3rem;\n\n margin: 0 auto;\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n display: initial;\n margin: 0;\n }\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(1)::before {\n content: var(--curriculum-landing-about-beginner);\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(2)::before {\n content: var(--curriculum-landing-about-pace);\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(3)::before {\n content: var(--curriculum-landing-about-free);\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p {\n display: grid;\n\n grid-template-columns: auto auto;\n\n align-items: center;\n justify-content: start;\n\n margin: 1rem 0;\n\n color: var(--color-text-secondary);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p)::before {\n display: block;\n\n align-self: start;\n\n width: 4rem;\n height: 4rem;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2) {\n grid-area: p1;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2)::before {\n content: var(--curriculum-landing-about-bullet);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3) {\n grid-area: p2;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3)::before {\n content: var(--curriculum-landing-about-bullet);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4) {\n grid-area: p3;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4)::before {\n content: var(--curriculum-landing-about-bullet);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) {\n grid-area: p4;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a {\n margin-left: 4rem;\n font-weight: var(--font-weight-bold);\n -webkit-text-decoration: underline;\n text-decoration: underline;\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):hover,:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):active {\n -webkit-text-decoration: none;\n text-decoration: none;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.arrow {\n grid-area: arrow;\n\n background-image: var(--curriculum-landing-arrow);\n background-repeat: no-repeat;\n background-position: center;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n display: flex;\n\n flex-direction: column;\n\n grid-area: scrim;\n\n justify-content: center;\n justify-self: center;\n\n max-width: 24rem;\n\n margin-top: 1rem;\n }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n justify-self: end;\n margin-top: 0;\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) .scrim-border {\n width: 100%;\n height: 16rem;\n\n background-image: var(--curriculum-scrim-bg);\n background-repeat: no-repeat;\n background-position: bottom right;\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) mdn-scrim-inline {\n display: block;\n\n width: 22rem;\n max-width: calc(100vw - var(--gutter) * 2);\n height: 14.25rem;\n\n background: #000000;\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) p {\n padding: 1rem 0;\n margin: 0;\n }\n\n.curriculum-content-container.curriculum-landing .landing-stairway {\n max-width: 100%;\n margin: 0;\n background-color: var(--color-background-secondary);\n }\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div {\n display: grid;\n\n grid-template-areas: \"a\" \"b\";\n grid-template-rows: auto auto;\n grid-template-columns: auto;\n\n justify-content: center;\n\n width: 100%;\n max-width: min(var(--max-width), 74rem);\n\n padding: 2rem;\n padding-right: var(--gutter);\n padding-left: var(--gutter);\n margin: 0 auto 3rem;\n\n color: var(--color-text-secondary);\n }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div {\n grid-template-columns: min(100%, 34rem);\n }\n }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div {\n grid-template-areas: \"a b\";\n grid-template-columns: 1fr 1.4fr;\n }\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) svg {\n width: 100%;\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container {\n --fs: clamp(1rem, calc(3 * calc(100vw / 100)), 1.75rem);\n position: relative;\n\n grid-area: a;\n\n width: 100%;\n\n margin: 0;\n\n transform: translateX(2vw);\n }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container {\n --fs: clamp(1rem, calc(2 * calc(100vw / 100)), 1.75rem);\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1 {\n position: absolute;\n top: 18%;\n left: 32%;\n\n font-size: var(--fs);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1) > span {\n display: block;\n\n width: max-content;\n\n line-height: calc(1.25 * var(--fs));\n\n text-wrap: nowrap;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1) .color {\n color: var(--curriculum-color);\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container {\n --fs: clamp(0.75rem, calc(1.25 * calc(100vw / 100)), 1rem);\n position: relative;\n grid-area: b;\n transform: translateX(-5vw);\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container {\n --fs: clamp(0.75rem, calc(100vw / 100), 0.825rem);\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2 {\n position: absolute;\n top: 0;\n left: 0;\n\n width: calc(100% + 5vw);\n height: 100%;\n\n margin: 0;\n\n font-size: var(--fs);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) > span {\n position: absolute;\n\n display: block;\n\n max-width: 10rem;\n\n line-height: calc(1.25 * var(--fs));\n\n text-wrap: wrap;\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) > span {\n max-width: initial;\n text-wrap: nowrap;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n top: 36%;\n left: 47%;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n top: 52%;\n left: 33%;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n top: 71%;\n left: 23%;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n top: 86%;\n left: 8%;\n }\n\n@media (769px < width) {\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n top: 53%;\n left: 35%;\n }\n\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n top: 65%;\n left: 27%;\n }\n\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n top: 77%;\n left: 13%;\n }\n\n :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n top: 90%;\n left: 0%;\n }\n }\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n display: none;\n grid-area: b;\n }\n\n@media (769px < width) {\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n display: initial;\n }\n }\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n grid-area: b;\n max-width: 100%;\n }\n\n@media (769px < width) {\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n display: none;\n }\n }\n\n.curriculum-content-container.curriculum-landing #dont_know_where_toget_started {\n width: fit-content;\n\n margin: 1rem auto 5rem;\n\n line-height: 3rem;\n\n text-align: center;\n }\n\n:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started)::after {\n position: absolute;\n\n width: 6em;\n\n content: url(\"../curriculum/assets/curriculum-started-underline.svg\");\n\n transform: translate3d(-6em, 1.25rem, 0);\n }\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul {\n display: grid;\n\n grid-template-areas: \"beginner\" \"advanced\" \"employ\" \"educator\";\n\n gap: 1rem;\n\n max-width: 52rem;\n\n margin: 0 auto;\n\n overflow: clip;\n\n scroll-snap-type: inline mandatory;\n }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul {\n grid-template-areas:\n \"beginner advanced\"\n \"employ educator\";\n grid-template-columns: auto auto;\n gap: 5rem 4rem;\n }\n }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul {\n gap: 5rem 8rem;\n }\n }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li {\n display: grid;\n\n grid-template-areas:\n \"i h\"\n \"p p\"\n \"c c\";\n grid-template-rows: 4rem minmax(2rem, max-content) max-content;\n grid-template-columns: 3rem 1fr;\n\n gap: 1rem;\n align-items: center;\n\n height: max-content;\n\n padding: 1rem 0.5rem;\n\n color: var(--color-text-secondary);\n\n scroll-snap-align: center;\n\n background-color: var(--curriculum-bg-large-color);\n border-radius: var(--elem-radius);\n }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li {\n grid-template-areas:\n \"i h\"\n \"i p\"\n \"i c\";\n grid-template-rows: 4rem auto max-content;\n grid-template-columns: auto auto;\n\n gap: 1rem 2rem;\n align-items: start;\n\n width: initial;\n height: initial;\n\n padding: 0;\n\n background-color: initial;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n display: inline-block;\n\n align-self: start;\n\n width: 3rem;\n height: 3rem;\n }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n grid-area: i;\n width: 5rem;\n height: 5rem;\n }\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(1)::before {\n content: var(--curriculum-landing-started-beginner);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(2)::before {\n content: var(--curriculum-landing-started-advanced);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(3)::before {\n content: var(--curriculum-landing-started-employment);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(4)::before {\n content: var(--curriculum-landing-started-educator);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) h3 {\n grid-area: h;\n\n margin-top: 0;\n\n font-weight: var(--font-weight-bold);\n\n line-height: var(--font-line-normal);\n\n color: var(--color-text-primary);\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(2) {\n grid-area: p;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(3) {\n grid-area: c;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) em {\n grid-area: p;\n align-self: start;\n }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n --button-color--default: var(--color-background-primary);\n\n --button-bg: var(--button-bg--default);\n --button-bg-hover: var(--button-bg-hover--default);\n --button-bg-active: var(--button-bg-active--default);\n --button-border-color: var(--button-border-color--default);\n --button-height: 2rem;\n --button-color: var(--button-color--default);\n --button-radius: var(--elem-radius, 0.25rem);\n position: relative;\n\n display: flex;\n\n grid-area: c;\n\n gap: 0.25rem;\n align-items: center;\n justify-content: center;\n justify-self: center;\n\n width: fit-content;\n min-height: var(--button-height);\n\n padding: 0.5rem;\n padding-right: var(--button-padding);\n padding-left: var(--button-padding);\n\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-bold);\n\n color: var(--button-color);\n\n text-align: center;\n\n -webkit-text-decoration: none;\n\n -webkit-text-decoration: none;\n\n text-decoration: none;\n\n cursor: pointer;\n\n background-color: var(--button-bg);\n border: 1px solid var(--button-border-color);\n border-radius: var(--button-radius);\n }\n\n@supports (color: light-dark(red, red)){\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n --button-bg--default: light-dark(#1b1b1b, #ffffff);\n --button-bg-hover--default: light-dark(#696969, #cdcdcd);\n --button-bg-active--default: light-dark(#9e9e9e, #9e9e9e);\n --button-border-color--default: light-dark(#1d1d1d, #ffffff);\n }\n}\n\n@supports not (color: light-dark(tan, tan)){\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a) *{\n --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n }\n}\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n justify-self: start;\n }\n }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a):hover {\n background-color: var(--button-bg-hover, var(--button-bg));\n }\n"],"names":[],"mappings":"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"}