tokono.ma / diffuse-applets
Experiment to rebuild Diffuse using web applets.
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: Reorganise into themes + Index page

Steven Vandevelde 6e8f170f 5af91ea7

+387 -71
+2 -1
deno.json
··· 1 1 { 2 2 "imports": { 3 - "@web-applets/sdk": "npm:@web-applets/sdk@0.2.0-alpha.12", 3 + "@picocss/pico": "npm:@picocss/pico@^2.0.6", 4 + "@web-applets/sdk": "npm:@web-applets/sdk@^0.2.6", 4 5 "astro": "npm:astro@^5.4.1", 5 6 "spellcaster": "npm:spellcaster@^5.0.2" 6 7 },
+9 -4
deno.lock
··· 1 1 { 2 2 "version": "4", 3 3 "specifiers": { 4 - "npm:@web-applets/sdk@0.2.0-alpha.12": "0.2.0-alpha.12", 4 + "npm:@picocss/pico@^2.0.6": "2.0.6", 5 + "npm:@web-applets/sdk@~0.2.6": "0.2.6", 5 6 "npm:asto@*": "0.1.0", 6 7 "npm:asto@0.1.0": "0.1.0", 7 8 "npm:astro@5.4.2": "5.4.2_vite@6.2.1_zod@3.24.2", ··· 333 334 "@oslojs/encoding@1.1.0": { 334 335 "integrity": "sha512-70wQhgYmndg4GCPxPPxPGevRKqTIJ2Nh4OkiMWmDAVYsTQ+Ta7Sq+rPevXyXGdzr30/qZBnyOalCszoMxlyldQ==" 335 336 }, 337 + "@picocss/pico@2.0.6": { 338 + "integrity": "sha512-/d8qsykowelD6g8k8JYgmCagOIulCPHMEc2NC4u7OjmpQLmtSetLhEbt0j1n3fPNJVcrT84dRp0RfJBn3wJROA==" 339 + }, 336 340 "@rollup/pluginutils@5.1.4": { 337 341 "integrity": "sha512-USm05zrsFxYLPdWWq+K3STlWiT/3ELn3RcV5hJMghpeAIhxfsUIg6mt12CBJBInWMV4VneoV7SfGv8xIwo2qNQ==", 338 342 "dependencies": [ ··· 485 489 "@ungap/structured-clone@1.3.0": { 486 490 "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==" 487 491 }, 488 - "@web-applets/sdk@0.2.0-alpha.12": { 489 - "integrity": "sha512-LCGHB/7q3h5EZReZAK9zrrODBDsFbJaNXhEhGFF8ga2JKXKnBCkeF3fYg7tTVsIOLY52dG7JkUo2911hEABfhw==" 492 + "@web-applets/sdk@0.2.6": { 493 + "integrity": "sha512-cL1FolasPPlvUpcPo8BeXVsgKH4aZp1Bv/BY9yu0XHNPLkoPC2qJlltKfbLQtN2L6kIV+VTMJ+L64UFNjXci6w==" 490 494 }, 491 495 "acorn@8.14.1": { 492 496 "integrity": "sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==" ··· 2318 2322 }, 2319 2323 "workspace": { 2320 2324 "dependencies": [ 2321 - "npm:@web-applets/sdk@0.2.0-alpha.12", 2325 + "npm:@picocss/pico@^2.0.6", 2326 + "npm:@web-applets/sdk@~0.2.6", 2322 2327 "npm:astro@^5.4.1", 2323 2328 "npm:spellcaster@^5.0.2" 2324 2329 ]
public/fonts/InterVariable-Italic.woff2

This is a binary file and will not be displayed.

public/fonts/InterVariable.woff2

This is a binary file and will not be displayed.

+4
public/images/diffuse-current.svg
··· 1 + <?xml version="1.0" encoding="UTF-8"?> 2 + <svg width="902px" height="134px" viewBox="0 0 902 134" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="currentColor"> 3 + <path d="M119.9,80.9 C119.9,86 118.6,89.8 116,92.3 C113.2,95 109.5,96.4 105.7,96.2 L93.4,96.2 L93.4,37.6 L105.7,37.6 C115.1,37.6 119.9,42.6 119.9,52.7 L119.9,80.9 Z M367.2,2.3 C368.2,3.2 368.7,4.5 368.7,5.9 L368.7,34.6 C368.7,37.4 366.4,39.7 363.6,39.7 L309.5,39.7 L309.5,53.7 L359.8,53.7 C362.6,53.7 364.9,56 364.9,58.8 L364.9,87.4 C364.9,90.2 362.6,92.5 359.8,92.5 L309.5,92.5 L309.5,128 C309.5,130.8 307.2,133.1 304.4,133.1 L268.3,133.1 C265.5,133.1 263.2,130.8 263.2,128 L263.2,116.7 C263.2,115.3 262.1,114.2 260.7,114.2 L259,114.2 C254.3,114.3 250.2,110.9 249.4,106.2 C248.6,101 252.2,96.2 257.3,95.5 C257.8,95.4 258.2,95.4 258.7,95.4 L267.8,95.4 C268.2,95.4 268.6,95.4 269,95.3 C274.1,94.6 277.7,90.1 277.1,85 C276.5,80.1 272.3,76.5 267.4,76.6 L265.1,76.6 C264.4,76.6 263.1,76.6 263.1,76.6 C257.9,76.6 253.7,72.4 253.6,67.2 C253.6,62.7 256.7,58.9 261.1,57.9 C262.3,57.7 263.1,56.7 263.1,55.5 L263.1,5.9 C263.1,3.1 265.4,0.8 268.2,0.8 L363.5,0.8 C365,0.8 366.3,1.3 367.2,2.3 Z M490.3,87.4 C490.3,90.2 488,92.5 485.2,92.5 L434.9,92.5 L434.9,128 C434.9,130.8 432.6,133.1 429.8,133.1 L393.7,133.1 C390.9,133.1 388.6,130.8 388.6,128 L388.6,60.8 C388.8,59.1 387.6,57.6 385.9,57.4 C385.7,57.4 385.4,57.4 385.2,57.4 C380.4,57.5 376.3,54 375.5,49.3 C374.7,44.1 378.3,39.3 383.5,38.6 C384,38.5 384.4,38.5 384.9,38.5 L395.3,38.5 C400,38.6 404.1,35.2 404.9,30.5 C405.7,25.3 402.1,20.5 397,19.8 C396.5,19.7 396.1,19.7 395.6,19.7 L389.7,19.7 C384.3,19.7 380.8,13.9 381.5,8.9 C382.3,4.2 386.4,0.8 391.1,0.8 L489,0.8 C491.8,0.8 494.1,3.1 494.1,5.9 L494.1,34.6 C494.1,37.4 491.8,39.7 489,39.7 L434.9,39.7 L434.9,53.7 L485.2,53.7 C488,53.7 490.3,56 490.3,58.8 L490.3,87.4 Z M775.7,91 C775.7,103.5 769.8,113.6 758,121.5 C746.2,129.4 730.8,133.3 711.8,133.3 C692.8,133.3 677.8,129.4 667,121.7 C656.2,114 650.7,104.5 650.7,93.5 C650.7,92.3 651.2,91.1 652.2,90.4 C653,89.7 654,89.4 655,89.4 L690.8,89.4 C693.5,89.4 696.4,90.6 699.6,93 C702.8,95.4 707.2,96.6 712.9,96.6 C722.4,96.6 727.1,94.9 727.1,91.5 C727.1,89.3 725.4,87.6 722,86.5 C718.6,85.4 712.2,84.2 702.7,82.9 C697.5,82.3 692.3,81.3 687.2,79.9 C683.8,79 676.9,75.9 670.8,75.9 L666.3,75.9 C661.4,75.9 656.6,72.2 656.2,67.3 C655.7,61.9 659.3,57.6 663.5,57.1 C669.3,56.4 674.1,52 672.7,45.8 C671.6,41.5 667.7,38.5 663.2,38.6 L656,38.6 C655.4,38.6 654.7,38.5 654.1,38.4 C649.2,37.4 646,32.8 646.6,27.9 C647.3,23.2 651.4,19.7 656.2,19.7 L659.3,19.7 C660.9,19.7 662.5,19 663.6,17.8 C665.5,15.8 667.6,13.9 669.8,12.3 C680.5,4.5 694.5,0.6 711.8,0.6 C729.1,0.6 743.3,4.8 754.3,13.2 C765.4,21.6 770.9,30.4 770.9,39.5 C770.9,40.6 770.5,41.6 769.7,42.4 C769,43.2 768,43.6 767,43.6 L729.1,43.6 C726.2,43.6 723.4,42.5 721.2,40.6 C718.8,38.6 715.6,37.6 711.6,37.6 C705.5,37.6 702.5,39.3 702.5,42.7 C702.5,44.5 704,46.1 707,47.3 C710,48.5 715.5,49.6 723.5,50.6 C742.3,52.9 755.7,57.1 763.7,63.3 C771.7,69.5 775.7,78.6 775.7,91 Z M902.4,101.3 L902.4,128 C902.4,130.8 900.1,133.1 897.3,133.1 L798.8,133.1 C796,133.1 793.7,130.8 793.7,128 L793.7,59.9 C793.7,58.6 792.7,57.5 791.4,57.3 C787.2,56.8 783.9,53.5 783.2,49.4 C782.4,44.2 786,39.4 791.1,38.7 C791.6,38.6 792,38.6 792.5,38.6 L794.8,38.6 C799.5,38.7 803.6,35.3 804.4,30.6 C805.2,25.4 801.7,20.6 796.5,19.8 C796,19.7 795.5,19.7 795,19.7 L781.2,19.7 C776.5,19.8 772.4,16.4 771.6,11.7 C770.8,6.5 774.4,1.7 779.5,1 C780,0.9 780.4,0.9 780.9,0.9 L895.8,0.9 C898.6,0.9 900.9,3.2 900.9,6 L900.9,32.7 C900.9,35.5 898.6,37.8 895.8,37.8 L839,37.8 L839,49.7 L891.6,49.7 C893,49.7 894.3,50.2 895.2,51.2 C896.2,52.1 896.7,53.4 896.7,54.8 L896.7,79.4 C896.7,80.8 896.2,82.1 895.2,83 C894.3,84 893,84.5 891.6,84.5 L839,84.5 L839,96.4 L897.2,96.4 C898.6,96.4 899.9,96.9 900.8,97.9 C901.8,98.7 902.4,100 902.4,101.3 Z M250.7,125 C249.8,129.7 245.7,133.1 240.8,133.1 L195,133.1 C192.2,133.1 189.9,130.8 189.9,128 L189.9,58.8 C189.9,57.9 189.4,57.1 188.5,56.7 C184.9,55.3 182.5,51.8 182.5,47.9 C182.5,43.4 185.6,39.1 189.9,38.7 C190.5,38.6 191.7,38.6 192.2,38.6 C197,38.6 201.1,35.2 201.8,30.4 C202.6,25.2 199,20.4 193.9,19.7 C193.4,19.6 193,19.6 192.5,19.6 L178.8,19.6 C174.1,19.7 170,16.3 169.2,11.6 C168.4,6.4 172,1.6 177.1,0.9 C177.6,0.8 178,0.8 178.5,0.8 L233.5,0.8 C236.3,0.8 238.6,3.1 238.6,5.9 L238.6,74.6 C238.6,75.5 239.2,76.4 240.1,76.6 C245.2,77.8 248.3,82.9 247.1,87.9 C246.1,91.9 242.7,94.9 238.5,95.1 C238.5,95.1 238.1,95.1 237.9,95.1 L229.1,95.1 C224.4,95 220.3,98.4 219.5,103.1 C218.7,108.3 222.2,113.1 227.4,113.9 C227.9,114 228.4,114 228.8,114 L241.3,114 C246.5,114 250.7,118.2 250.7,123.5 C250.8,124 250.8,124.5 250.7,125 Z M645.2,43 C647.1,46 647.1,49.8 645.2,52.8 C643.5,55.6 640.5,57.3 637.2,57.3 C635.8,57.2 634.7,58.3 634.7,59.7 C634.7,59.8 634.7,59.9 634.7,60.1 L634.7,80.9 C634.7,98.3 629.2,111.4 618.2,120.2 C607.2,129 593.7,133 573.5,133 C570.3,133 564.1,132.9 564,132.9 L499.8,132.9 C495.1,133 491,129.6 490.2,124.9 C489.4,119.7 493,114.9 498.2,114.2 C498.7,114.1 499.1,114.1 499.6,114.1 L524.1,114.1 C528.8,114.2 532.9,110.8 533.7,106.1 C534.5,100.9 530.9,96.1 525.8,95.4 C525.3,95.3 524.9,95.3 524.4,95.3 L515.3,95.3 C514.8,95.3 514.3,95.4 513.8,95.4 C513.8,95.3 513.8,95.3 513.8,95.3 L513.5,95.3 C509.1,95.3 504.7,91.8 504,87.5 C503.1,82.6 506.3,77.8 511.2,76.7 C511.9,76.6 512.4,75.9 512.4,75.2 L512.4,5.9 C512.4,4.6 512.9,3.3 513.9,2.3 C514.8,1.3 516.1,0.8 517.5,0.8 L554.6,0.8 C556,0.8 557.3,1.3 558.2,2.3 C559.2,3.2 559.7,4.5 559.7,5.8 L559.7,81 C559.7,90.5 564.4,95.3 573.7,95.3 C583,95.3 587.7,90.5 587.7,81 L587.7,5.8 C587.7,4.5 588.2,3.2 589.2,2.3 C590.1,1.3 591.4,0.8 592.8,0.8 L633,0.8 C637.8,0.7 642,4.3 642.7,9 C643.3,14.2 639.9,19.6 633.8,19.6 L620.2,19.6 C615.5,19.5 611.4,22.9 610.6,27.6 C609.8,32.8 613.4,37.6 618.6,38.3 C619.1,38.4 619.5,38.4 620,38.4 L634.8,38.4 L635.1,38.4 L637.6,38.4 C640.5,38.5 643.5,40.2 645.2,43 Z M151.1,14.4 C139.2,5.3 124,0.7 105.6,0.7 L25.5,0.7 C20.4,0.6 16.2,4.5 15.8,9.5 C15.5,14.7 19.4,19.2 24.6,19.5 C24.8,19.5 25,19.5 25.2,19.5 L45.4,19.5 C50.5,19.4 54.7,23.3 55.1,28.3 C55.5,33.5 51.5,38 46.3,38.3 C46.1,38.3 45.9,38.3 45.7,38.3 L10.7,38.3 C5.6,38.2 1.4,42.1 1,47.1 C0.7,52.3 4.6,56.8 9.8,57.1 C10,57.1 10.2,57.1 10.4,57.1 L26.4,57.1 C31.5,57 35.7,60.9 36.2,65.9 C36.6,71.1 32.6,75.6 27.4,76 C27.2,76 27,76 26.8,76 L25.5,76 C20.4,75.9 16.2,79.8 15.8,84.8 C15.5,90 19.4,94.5 24.6,94.8 C24.8,94.8 25,94.8 25.2,94.8 L33.7,94.8 C35.1,94.8 36.2,95.9 36.2,97.3 L36.2,128 C36.2,130.8 38.5,133.1 41.3,133.1 L105.8,133.1 C124.7,133.1 140,128.7 151.6,119.9 C163.2,111.1 169,98.1 169,80.9 L169,52.8 C169,36.4 163,23.6 151.1,14.4 Z" id="diffuse"></path> 4 + </svg>
+8
public/images/diffuse-dark.svg
··· 1 + <?xml version="1.0" encoding="UTF-8"?> 2 + <svg width="902px" height="134px" viewBox="0 0 902 134" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 3 + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 4 + <g transform="translate(-1.000000, 0.000000)" fill="#231F20" fill-rule="nonzero"> 5 + <path d="M119.9,80.9 C119.9,86 118.6,89.8 116,92.3 C113.2,95 109.5,96.4 105.7,96.2 L93.4,96.2 L93.4,37.6 L105.7,37.6 C115.1,37.6 119.9,42.6 119.9,52.7 L119.9,80.9 Z M367.2,2.3 C368.2,3.2 368.7,4.5 368.7,5.9 L368.7,34.6 C368.7,37.4 366.4,39.7 363.6,39.7 L309.5,39.7 L309.5,53.7 L359.8,53.7 C362.6,53.7 364.9,56 364.9,58.8 L364.9,87.4 C364.9,90.2 362.6,92.5 359.8,92.5 L309.5,92.5 L309.5,128 C309.5,130.8 307.2,133.1 304.4,133.1 L268.3,133.1 C265.5,133.1 263.2,130.8 263.2,128 L263.2,116.7 C263.2,115.3 262.1,114.2 260.7,114.2 L259,114.2 C254.3,114.3 250.2,110.9 249.4,106.2 C248.6,101 252.2,96.2 257.3,95.5 C257.8,95.4 258.2,95.4 258.7,95.4 L267.8,95.4 C268.2,95.4 268.6,95.4 269,95.3 C274.1,94.6 277.7,90.1 277.1,85 C276.5,80.1 272.3,76.5 267.4,76.6 L265.1,76.6 C264.4,76.6 263.1,76.6 263.1,76.6 C257.9,76.6 253.7,72.4 253.6,67.2 C253.6,62.7 256.7,58.9 261.1,57.9 C262.3,57.7 263.1,56.7 263.1,55.5 L263.1,5.9 C263.1,3.1 265.4,0.8 268.2,0.8 L363.5,0.8 C365,0.8 366.3,1.3 367.2,2.3 Z M490.3,87.4 C490.3,90.2 488,92.5 485.2,92.5 L434.9,92.5 L434.9,128 C434.9,130.8 432.6,133.1 429.8,133.1 L393.7,133.1 C390.9,133.1 388.6,130.8 388.6,128 L388.6,60.8 C388.8,59.1 387.6,57.6 385.9,57.4 C385.7,57.4 385.4,57.4 385.2,57.4 C380.4,57.5 376.3,54 375.5,49.3 C374.7,44.1 378.3,39.3 383.5,38.6 C384,38.5 384.4,38.5 384.9,38.5 L395.3,38.5 C400,38.6 404.1,35.2 404.9,30.5 C405.7,25.3 402.1,20.5 397,19.8 C396.5,19.7 396.1,19.7 395.6,19.7 L389.7,19.7 C384.3,19.7 380.8,13.9 381.5,8.9 C382.3,4.2 386.4,0.8 391.1,0.8 L489,0.8 C491.8,0.8 494.1,3.1 494.1,5.9 L494.1,34.6 C494.1,37.4 491.8,39.7 489,39.7 L434.9,39.7 L434.9,53.7 L485.2,53.7 C488,53.7 490.3,56 490.3,58.8 L490.3,87.4 Z M775.7,91 C775.7,103.5 769.8,113.6 758,121.5 C746.2,129.4 730.8,133.3 711.8,133.3 C692.8,133.3 677.8,129.4 667,121.7 C656.2,114 650.7,104.5 650.7,93.5 C650.7,92.3 651.2,91.1 652.2,90.4 C653,89.7 654,89.4 655,89.4 L690.8,89.4 C693.5,89.4 696.4,90.6 699.6,93 C702.8,95.4 707.2,96.6 712.9,96.6 C722.4,96.6 727.1,94.9 727.1,91.5 C727.1,89.3 725.4,87.6 722,86.5 C718.6,85.4 712.2,84.2 702.7,82.9 C697.5,82.3 692.3,81.3 687.2,79.9 C683.8,79 676.9,75.9 670.8,75.9 L666.3,75.9 C661.4,75.9 656.6,72.2 656.2,67.3 C655.7,61.9 659.3,57.6 663.5,57.1 C669.3,56.4 674.1,52 672.7,45.8 C671.6,41.5 667.7,38.5 663.2,38.6 L656,38.6 C655.4,38.6 654.7,38.5 654.1,38.4 C649.2,37.4 646,32.8 646.6,27.9 C647.3,23.2 651.4,19.7 656.2,19.7 L659.3,19.7 C660.9,19.7 662.5,19 663.6,17.8 C665.5,15.8 667.6,13.9 669.8,12.3 C680.5,4.5 694.5,0.6 711.8,0.6 C729.1,0.6 743.3,4.8 754.3,13.2 C765.4,21.6 770.9,30.4 770.9,39.5 C770.9,40.6 770.5,41.6 769.7,42.4 C769,43.2 768,43.6 767,43.6 L729.1,43.6 C726.2,43.6 723.4,42.5 721.2,40.6 C718.8,38.6 715.6,37.6 711.6,37.6 C705.5,37.6 702.5,39.3 702.5,42.7 C702.5,44.5 704,46.1 707,47.3 C710,48.5 715.5,49.6 723.5,50.6 C742.3,52.9 755.7,57.1 763.7,63.3 C771.7,69.5 775.7,78.6 775.7,91 Z M902.4,101.3 L902.4,128 C902.4,130.8 900.1,133.1 897.3,133.1 L798.8,133.1 C796,133.1 793.7,130.8 793.7,128 L793.7,59.9 C793.7,58.6 792.7,57.5 791.4,57.3 C787.2,56.8 783.9,53.5 783.2,49.4 C782.4,44.2 786,39.4 791.1,38.7 C791.6,38.6 792,38.6 792.5,38.6 L794.8,38.6 C799.5,38.7 803.6,35.3 804.4,30.6 C805.2,25.4 801.7,20.6 796.5,19.8 C796,19.7 795.5,19.7 795,19.7 L781.2,19.7 C776.5,19.8 772.4,16.4 771.6,11.7 C770.8,6.5 774.4,1.7 779.5,1 C780,0.9 780.4,0.9 780.9,0.9 L895.8,0.9 C898.6,0.9 900.9,3.2 900.9,6 L900.9,32.7 C900.9,35.5 898.6,37.8 895.8,37.8 L839,37.8 L839,49.7 L891.6,49.7 C893,49.7 894.3,50.2 895.2,51.2 C896.2,52.1 896.7,53.4 896.7,54.8 L896.7,79.4 C896.7,80.8 896.2,82.1 895.2,83 C894.3,84 893,84.5 891.6,84.5 L839,84.5 L839,96.4 L897.2,96.4 C898.6,96.4 899.9,96.9 900.8,97.9 C901.8,98.7 902.4,100 902.4,101.3 Z M250.7,125 C249.8,129.7 245.7,133.1 240.8,133.1 L195,133.1 C192.2,133.1 189.9,130.8 189.9,128 L189.9,58.8 C189.9,57.9 189.4,57.1 188.5,56.7 C184.9,55.3 182.5,51.8 182.5,47.9 C182.5,43.4 185.6,39.1 189.9,38.7 C190.5,38.6 191.7,38.6 192.2,38.6 C197,38.6 201.1,35.2 201.8,30.4 C202.6,25.2 199,20.4 193.9,19.7 C193.4,19.6 193,19.6 192.5,19.6 L178.8,19.6 C174.1,19.7 170,16.3 169.2,11.6 C168.4,6.4 172,1.6 177.1,0.9 C177.6,0.8 178,0.8 178.5,0.8 L233.5,0.8 C236.3,0.8 238.6,3.1 238.6,5.9 L238.6,74.6 C238.6,75.5 239.2,76.4 240.1,76.6 C245.2,77.8 248.3,82.9 247.1,87.9 C246.1,91.9 242.7,94.9 238.5,95.1 C238.5,95.1 238.1,95.1 237.9,95.1 L229.1,95.1 C224.4,95 220.3,98.4 219.5,103.1 C218.7,108.3 222.2,113.1 227.4,113.9 C227.9,114 228.4,114 228.8,114 L241.3,114 C246.5,114 250.7,118.2 250.7,123.5 C250.8,124 250.8,124.5 250.7,125 Z M645.2,43 C647.1,46 647.1,49.8 645.2,52.8 C643.5,55.6 640.5,57.3 637.2,57.3 C635.8,57.2 634.7,58.3 634.7,59.7 C634.7,59.8 634.7,59.9 634.7,60.1 L634.7,80.9 C634.7,98.3 629.2,111.4 618.2,120.2 C607.2,129 593.7,133 573.5,133 C570.3,133 564.1,132.9 564,132.9 L499.8,132.9 C495.1,133 491,129.6 490.2,124.9 C489.4,119.7 493,114.9 498.2,114.2 C498.7,114.1 499.1,114.1 499.6,114.1 L524.1,114.1 C528.8,114.2 532.9,110.8 533.7,106.1 C534.5,100.9 530.9,96.1 525.8,95.4 C525.3,95.3 524.9,95.3 524.4,95.3 L515.3,95.3 C514.8,95.3 514.3,95.4 513.8,95.4 C513.8,95.3 513.8,95.3 513.8,95.3 L513.5,95.3 C509.1,95.3 504.7,91.8 504,87.5 C503.1,82.6 506.3,77.8 511.2,76.7 C511.9,76.6 512.4,75.9 512.4,75.2 L512.4,5.9 C512.4,4.6 512.9,3.3 513.9,2.3 C514.8,1.3 516.1,0.8 517.5,0.8 L554.6,0.8 C556,0.8 557.3,1.3 558.2,2.3 C559.2,3.2 559.7,4.5 559.7,5.8 L559.7,81 C559.7,90.5 564.4,95.3 573.7,95.3 C583,95.3 587.7,90.5 587.7,81 L587.7,5.8 C587.7,4.5 588.2,3.2 589.2,2.3 C590.1,1.3 591.4,0.8 592.8,0.8 L633,0.8 C637.8,0.7 642,4.3 642.7,9 C643.3,14.2 639.9,19.6 633.8,19.6 L620.2,19.6 C615.5,19.5 611.4,22.9 610.6,27.6 C609.8,32.8 613.4,37.6 618.6,38.3 C619.1,38.4 619.5,38.4 620,38.4 L634.8,38.4 L635.1,38.4 L637.6,38.4 C640.5,38.5 643.5,40.2 645.2,43 Z M151.1,14.4 C139.2,5.3 124,0.7 105.6,0.7 L25.5,0.7 C20.4,0.6 16.2,4.5 15.8,9.5 C15.5,14.7 19.4,19.2 24.6,19.5 C24.8,19.5 25,19.5 25.2,19.5 L45.4,19.5 C50.5,19.4 54.7,23.3 55.1,28.3 C55.5,33.5 51.5,38 46.3,38.3 C46.1,38.3 45.9,38.3 45.7,38.3 L10.7,38.3 C5.6,38.2 1.4,42.1 1,47.1 C0.7,52.3 4.6,56.8 9.8,57.1 C10,57.1 10.2,57.1 10.4,57.1 L26.4,57.1 C31.5,57 35.7,60.9 36.2,65.9 C36.6,71.1 32.6,75.6 27.4,76 C27.2,76 27,76 26.8,76 L25.5,76 C20.4,75.9 16.2,79.8 15.8,84.8 C15.5,90 19.4,94.5 24.6,94.8 C24.8,94.8 25,94.8 25.2,94.8 L33.7,94.8 C35.1,94.8 36.2,95.9 36.2,97.3 L36.2,128 C36.2,130.8 38.5,133.1 41.3,133.1 L105.8,133.1 C124.7,133.1 140,128.7 151.6,119.9 C163.2,111.1 169,98.1 169,80.9 L169,52.8 C169,36.4 163,23.6 151.1,14.4 Z" id="Shape"></path> 6 + </g> 7 + </g> 8 + </svg>
+8
public/images/diffuse-grey.svg
··· 1 + <?xml version="1.0" encoding="UTF-8"?> 2 + <svg width="902px" height="134px" viewBox="0 0 902 134" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 3 + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 4 + <g transform="translate(-1.000000, 0.000000)" fill="#888888" fill-rule="nonzero"> 5 + <path d="M119.9,80.9 C119.9,86 118.6,89.8 116,92.3 C113.2,95 109.5,96.4 105.7,96.2 L93.4,96.2 L93.4,37.6 L105.7,37.6 C115.1,37.6 119.9,42.6 119.9,52.7 L119.9,80.9 Z M367.2,2.3 C368.2,3.2 368.7,4.5 368.7,5.9 L368.7,34.6 C368.7,37.4 366.4,39.7 363.6,39.7 L309.5,39.7 L309.5,53.7 L359.8,53.7 C362.6,53.7 364.9,56 364.9,58.8 L364.9,87.4 C364.9,90.2 362.6,92.5 359.8,92.5 L309.5,92.5 L309.5,128 C309.5,130.8 307.2,133.1 304.4,133.1 L268.3,133.1 C265.5,133.1 263.2,130.8 263.2,128 L263.2,116.7 C263.2,115.3 262.1,114.2 260.7,114.2 L259,114.2 C254.3,114.3 250.2,110.9 249.4,106.2 C248.6,101 252.2,96.2 257.3,95.5 C257.8,95.4 258.2,95.4 258.7,95.4 L267.8,95.4 C268.2,95.4 268.6,95.4 269,95.3 C274.1,94.6 277.7,90.1 277.1,85 C276.5,80.1 272.3,76.5 267.4,76.6 L265.1,76.6 C264.4,76.6 263.1,76.6 263.1,76.6 C257.9,76.6 253.7,72.4 253.6,67.2 C253.6,62.7 256.7,58.9 261.1,57.9 C262.3,57.7 263.1,56.7 263.1,55.5 L263.1,5.9 C263.1,3.1 265.4,0.8 268.2,0.8 L363.5,0.8 C365,0.8 366.3,1.3 367.2,2.3 Z M490.3,87.4 C490.3,90.2 488,92.5 485.2,92.5 L434.9,92.5 L434.9,128 C434.9,130.8 432.6,133.1 429.8,133.1 L393.7,133.1 C390.9,133.1 388.6,130.8 388.6,128 L388.6,60.8 C388.8,59.1 387.6,57.6 385.9,57.4 C385.7,57.4 385.4,57.4 385.2,57.4 C380.4,57.5 376.3,54 375.5,49.3 C374.7,44.1 378.3,39.3 383.5,38.6 C384,38.5 384.4,38.5 384.9,38.5 L395.3,38.5 C400,38.6 404.1,35.2 404.9,30.5 C405.7,25.3 402.1,20.5 397,19.8 C396.5,19.7 396.1,19.7 395.6,19.7 L389.7,19.7 C384.3,19.7 380.8,13.9 381.5,8.9 C382.3,4.2 386.4,0.8 391.1,0.8 L489,0.8 C491.8,0.8 494.1,3.1 494.1,5.9 L494.1,34.6 C494.1,37.4 491.8,39.7 489,39.7 L434.9,39.7 L434.9,53.7 L485.2,53.7 C488,53.7 490.3,56 490.3,58.8 L490.3,87.4 Z M775.7,91 C775.7,103.5 769.8,113.6 758,121.5 C746.2,129.4 730.8,133.3 711.8,133.3 C692.8,133.3 677.8,129.4 667,121.7 C656.2,114 650.7,104.5 650.7,93.5 C650.7,92.3 651.2,91.1 652.2,90.4 C653,89.7 654,89.4 655,89.4 L690.8,89.4 C693.5,89.4 696.4,90.6 699.6,93 C702.8,95.4 707.2,96.6 712.9,96.6 C722.4,96.6 727.1,94.9 727.1,91.5 C727.1,89.3 725.4,87.6 722,86.5 C718.6,85.4 712.2,84.2 702.7,82.9 C697.5,82.3 692.3,81.3 687.2,79.9 C683.8,79 676.9,75.9 670.8,75.9 L666.3,75.9 C661.4,75.9 656.6,72.2 656.2,67.3 C655.7,61.9 659.3,57.6 663.5,57.1 C669.3,56.4 674.1,52 672.7,45.8 C671.6,41.5 667.7,38.5 663.2,38.6 L656,38.6 C655.4,38.6 654.7,38.5 654.1,38.4 C649.2,37.4 646,32.8 646.6,27.9 C647.3,23.2 651.4,19.7 656.2,19.7 L659.3,19.7 C660.9,19.7 662.5,19 663.6,17.8 C665.5,15.8 667.6,13.9 669.8,12.3 C680.5,4.5 694.5,0.6 711.8,0.6 C729.1,0.6 743.3,4.8 754.3,13.2 C765.4,21.6 770.9,30.4 770.9,39.5 C770.9,40.6 770.5,41.6 769.7,42.4 C769,43.2 768,43.6 767,43.6 L729.1,43.6 C726.2,43.6 723.4,42.5 721.2,40.6 C718.8,38.6 715.6,37.6 711.6,37.6 C705.5,37.6 702.5,39.3 702.5,42.7 C702.5,44.5 704,46.1 707,47.3 C710,48.5 715.5,49.6 723.5,50.6 C742.3,52.9 755.7,57.1 763.7,63.3 C771.7,69.5 775.7,78.6 775.7,91 Z M902.4,101.3 L902.4,128 C902.4,130.8 900.1,133.1 897.3,133.1 L798.8,133.1 C796,133.1 793.7,130.8 793.7,128 L793.7,59.9 C793.7,58.6 792.7,57.5 791.4,57.3 C787.2,56.8 783.9,53.5 783.2,49.4 C782.4,44.2 786,39.4 791.1,38.7 C791.6,38.6 792,38.6 792.5,38.6 L794.8,38.6 C799.5,38.7 803.6,35.3 804.4,30.6 C805.2,25.4 801.7,20.6 796.5,19.8 C796,19.7 795.5,19.7 795,19.7 L781.2,19.7 C776.5,19.8 772.4,16.4 771.6,11.7 C770.8,6.5 774.4,1.7 779.5,1 C780,0.9 780.4,0.9 780.9,0.9 L895.8,0.9 C898.6,0.9 900.9,3.2 900.9,6 L900.9,32.7 C900.9,35.5 898.6,37.8 895.8,37.8 L839,37.8 L839,49.7 L891.6,49.7 C893,49.7 894.3,50.2 895.2,51.2 C896.2,52.1 896.7,53.4 896.7,54.8 L896.7,79.4 C896.7,80.8 896.2,82.1 895.2,83 C894.3,84 893,84.5 891.6,84.5 L839,84.5 L839,96.4 L897.2,96.4 C898.6,96.4 899.9,96.9 900.8,97.9 C901.8,98.7 902.4,100 902.4,101.3 Z M250.7,125 C249.8,129.7 245.7,133.1 240.8,133.1 L195,133.1 C192.2,133.1 189.9,130.8 189.9,128 L189.9,58.8 C189.9,57.9 189.4,57.1 188.5,56.7 C184.9,55.3 182.5,51.8 182.5,47.9 C182.5,43.4 185.6,39.1 189.9,38.7 C190.5,38.6 191.7,38.6 192.2,38.6 C197,38.6 201.1,35.2 201.8,30.4 C202.6,25.2 199,20.4 193.9,19.7 C193.4,19.6 193,19.6 192.5,19.6 L178.8,19.6 C174.1,19.7 170,16.3 169.2,11.6 C168.4,6.4 172,1.6 177.1,0.9 C177.6,0.8 178,0.8 178.5,0.8 L233.5,0.8 C236.3,0.8 238.6,3.1 238.6,5.9 L238.6,74.6 C238.6,75.5 239.2,76.4 240.1,76.6 C245.2,77.8 248.3,82.9 247.1,87.9 C246.1,91.9 242.7,94.9 238.5,95.1 C238.5,95.1 238.1,95.1 237.9,95.1 L229.1,95.1 C224.4,95 220.3,98.4 219.5,103.1 C218.7,108.3 222.2,113.1 227.4,113.9 C227.9,114 228.4,114 228.8,114 L241.3,114 C246.5,114 250.7,118.2 250.7,123.5 C250.8,124 250.8,124.5 250.7,125 Z M645.2,43 C647.1,46 647.1,49.8 645.2,52.8 C643.5,55.6 640.5,57.3 637.2,57.3 C635.8,57.2 634.7,58.3 634.7,59.7 C634.7,59.8 634.7,59.9 634.7,60.1 L634.7,80.9 C634.7,98.3 629.2,111.4 618.2,120.2 C607.2,129 593.7,133 573.5,133 C570.3,133 564.1,132.9 564,132.9 L499.8,132.9 C495.1,133 491,129.6 490.2,124.9 C489.4,119.7 493,114.9 498.2,114.2 C498.7,114.1 499.1,114.1 499.6,114.1 L524.1,114.1 C528.8,114.2 532.9,110.8 533.7,106.1 C534.5,100.9 530.9,96.1 525.8,95.4 C525.3,95.3 524.9,95.3 524.4,95.3 L515.3,95.3 C514.8,95.3 514.3,95.4 513.8,95.4 C513.8,95.3 513.8,95.3 513.8,95.3 L513.5,95.3 C509.1,95.3 504.7,91.8 504,87.5 C503.1,82.6 506.3,77.8 511.2,76.7 C511.9,76.6 512.4,75.9 512.4,75.2 L512.4,5.9 C512.4,4.6 512.9,3.3 513.9,2.3 C514.8,1.3 516.1,0.8 517.5,0.8 L554.6,0.8 C556,0.8 557.3,1.3 558.2,2.3 C559.2,3.2 559.7,4.5 559.7,5.8 L559.7,81 C559.7,90.5 564.4,95.3 573.7,95.3 C583,95.3 587.7,90.5 587.7,81 L587.7,5.8 C587.7,4.5 588.2,3.2 589.2,2.3 C590.1,1.3 591.4,0.8 592.8,0.8 L633,0.8 C637.8,0.7 642,4.3 642.7,9 C643.3,14.2 639.9,19.6 633.8,19.6 L620.2,19.6 C615.5,19.5 611.4,22.9 610.6,27.6 C609.8,32.8 613.4,37.6 618.6,38.3 C619.1,38.4 619.5,38.4 620,38.4 L634.8,38.4 L635.1,38.4 L637.6,38.4 C640.5,38.5 643.5,40.2 645.2,43 Z M151.1,14.4 C139.2,5.3 124,0.7 105.6,0.7 L25.5,0.7 C20.4,0.6 16.2,4.5 15.8,9.5 C15.5,14.7 19.4,19.2 24.6,19.5 C24.8,19.5 25,19.5 25.2,19.5 L45.4,19.5 C50.5,19.4 54.7,23.3 55.1,28.3 C55.5,33.5 51.5,38 46.3,38.3 C46.1,38.3 45.9,38.3 45.7,38.3 L10.7,38.3 C5.6,38.2 1.4,42.1 1,47.1 C0.7,52.3 4.6,56.8 9.8,57.1 C10,57.1 10.2,57.1 10.4,57.1 L26.4,57.1 C31.5,57 35.7,60.9 36.2,65.9 C36.6,71.1 32.6,75.6 27.4,76 C27.2,76 27,76 26.8,76 L25.5,76 C20.4,75.9 16.2,79.8 15.8,84.8 C15.5,90 19.4,94.5 24.6,94.8 C24.8,94.8 25,94.8 25.2,94.8 L33.7,94.8 C35.1,94.8 36.2,95.9 36.2,97.3 L36.2,128 C36.2,130.8 38.5,133.1 41.3,133.1 L105.8,133.1 C124.7,133.1 140,128.7 151.6,119.9 C163.2,111.1 169,98.1 169,80.9 L169,52.8 C169,36.4 163,23.6 151.1,14.4 Z" id="Shape"></path> 6 + </g> 7 + </g> 8 + </svg>
+8
public/images/diffuse-light.svg
··· 1 + <?xml version="1.0" encoding="UTF-8"?> 2 + <svg width="902px" height="134px" viewBox="0 0 902 134" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 3 + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 4 + <g transform="translate(-1.000000, 0.000000)" fill="#FFFFFF" fill-rule="nonzero"> 5 + <path d="M119.9,80.9 C119.9,86 118.6,89.8 116,92.3 C113.2,95 109.5,96.4 105.7,96.2 L93.4,96.2 L93.4,37.6 L105.7,37.6 C115.1,37.6 119.9,42.6 119.9,52.7 L119.9,80.9 Z M367.2,2.3 C368.2,3.2 368.7,4.5 368.7,5.9 L368.7,34.6 C368.7,37.4 366.4,39.7 363.6,39.7 L309.5,39.7 L309.5,53.7 L359.8,53.7 C362.6,53.7 364.9,56 364.9,58.8 L364.9,87.4 C364.9,90.2 362.6,92.5 359.8,92.5 L309.5,92.5 L309.5,128 C309.5,130.8 307.2,133.1 304.4,133.1 L268.3,133.1 C265.5,133.1 263.2,130.8 263.2,128 L263.2,116.7 C263.2,115.3 262.1,114.2 260.7,114.2 L259,114.2 C254.3,114.3 250.2,110.9 249.4,106.2 C248.6,101 252.2,96.2 257.3,95.5 C257.8,95.4 258.2,95.4 258.7,95.4 L267.8,95.4 C268.2,95.4 268.6,95.4 269,95.3 C274.1,94.6 277.7,90.1 277.1,85 C276.5,80.1 272.3,76.5 267.4,76.6 L265.1,76.6 C264.4,76.6 263.1,76.6 263.1,76.6 C257.9,76.6 253.7,72.4 253.6,67.2 C253.6,62.7 256.7,58.9 261.1,57.9 C262.3,57.7 263.1,56.7 263.1,55.5 L263.1,5.9 C263.1,3.1 265.4,0.8 268.2,0.8 L363.5,0.8 C365,0.8 366.3,1.3 367.2,2.3 Z M490.3,87.4 C490.3,90.2 488,92.5 485.2,92.5 L434.9,92.5 L434.9,128 C434.9,130.8 432.6,133.1 429.8,133.1 L393.7,133.1 C390.9,133.1 388.6,130.8 388.6,128 L388.6,60.8 C388.8,59.1 387.6,57.6 385.9,57.4 C385.7,57.4 385.4,57.4 385.2,57.4 C380.4,57.5 376.3,54 375.5,49.3 C374.7,44.1 378.3,39.3 383.5,38.6 C384,38.5 384.4,38.5 384.9,38.5 L395.3,38.5 C400,38.6 404.1,35.2 404.9,30.5 C405.7,25.3 402.1,20.5 397,19.8 C396.5,19.7 396.1,19.7 395.6,19.7 L389.7,19.7 C384.3,19.7 380.8,13.9 381.5,8.9 C382.3,4.2 386.4,0.8 391.1,0.8 L489,0.8 C491.8,0.8 494.1,3.1 494.1,5.9 L494.1,34.6 C494.1,37.4 491.8,39.7 489,39.7 L434.9,39.7 L434.9,53.7 L485.2,53.7 C488,53.7 490.3,56 490.3,58.8 L490.3,87.4 Z M775.7,91 C775.7,103.5 769.8,113.6 758,121.5 C746.2,129.4 730.8,133.3 711.8,133.3 C692.8,133.3 677.8,129.4 667,121.7 C656.2,114 650.7,104.5 650.7,93.5 C650.7,92.3 651.2,91.1 652.2,90.4 C653,89.7 654,89.4 655,89.4 L690.8,89.4 C693.5,89.4 696.4,90.6 699.6,93 C702.8,95.4 707.2,96.6 712.9,96.6 C722.4,96.6 727.1,94.9 727.1,91.5 C727.1,89.3 725.4,87.6 722,86.5 C718.6,85.4 712.2,84.2 702.7,82.9 C697.5,82.3 692.3,81.3 687.2,79.9 C683.8,79 676.9,75.9 670.8,75.9 L666.3,75.9 C661.4,75.9 656.6,72.2 656.2,67.3 C655.7,61.9 659.3,57.6 663.5,57.1 C669.3,56.4 674.1,52 672.7,45.8 C671.6,41.5 667.7,38.5 663.2,38.6 L656,38.6 C655.4,38.6 654.7,38.5 654.1,38.4 C649.2,37.4 646,32.8 646.6,27.9 C647.3,23.2 651.4,19.7 656.2,19.7 L659.3,19.7 C660.9,19.7 662.5,19 663.6,17.8 C665.5,15.8 667.6,13.9 669.8,12.3 C680.5,4.5 694.5,0.6 711.8,0.6 C729.1,0.6 743.3,4.8 754.3,13.2 C765.4,21.6 770.9,30.4 770.9,39.5 C770.9,40.6 770.5,41.6 769.7,42.4 C769,43.2 768,43.6 767,43.6 L729.1,43.6 C726.2,43.6 723.4,42.5 721.2,40.6 C718.8,38.6 715.6,37.6 711.6,37.6 C705.5,37.6 702.5,39.3 702.5,42.7 C702.5,44.5 704,46.1 707,47.3 C710,48.5 715.5,49.6 723.5,50.6 C742.3,52.9 755.7,57.1 763.7,63.3 C771.7,69.5 775.7,78.6 775.7,91 Z M902.4,101.3 L902.4,128 C902.4,130.8 900.1,133.1 897.3,133.1 L798.8,133.1 C796,133.1 793.7,130.8 793.7,128 L793.7,59.9 C793.7,58.6 792.7,57.5 791.4,57.3 C787.2,56.8 783.9,53.5 783.2,49.4 C782.4,44.2 786,39.4 791.1,38.7 C791.6,38.6 792,38.6 792.5,38.6 L794.8,38.6 C799.5,38.7 803.6,35.3 804.4,30.6 C805.2,25.4 801.7,20.6 796.5,19.8 C796,19.7 795.5,19.7 795,19.7 L781.2,19.7 C776.5,19.8 772.4,16.4 771.6,11.7 C770.8,6.5 774.4,1.7 779.5,1 C780,0.9 780.4,0.9 780.9,0.9 L895.8,0.9 C898.6,0.9 900.9,3.2 900.9,6 L900.9,32.7 C900.9,35.5 898.6,37.8 895.8,37.8 L839,37.8 L839,49.7 L891.6,49.7 C893,49.7 894.3,50.2 895.2,51.2 C896.2,52.1 896.7,53.4 896.7,54.8 L896.7,79.4 C896.7,80.8 896.2,82.1 895.2,83 C894.3,84 893,84.5 891.6,84.5 L839,84.5 L839,96.4 L897.2,96.4 C898.6,96.4 899.9,96.9 900.8,97.9 C901.8,98.7 902.4,100 902.4,101.3 Z M250.7,125 C249.8,129.7 245.7,133.1 240.8,133.1 L195,133.1 C192.2,133.1 189.9,130.8 189.9,128 L189.9,58.8 C189.9,57.9 189.4,57.1 188.5,56.7 C184.9,55.3 182.5,51.8 182.5,47.9 C182.5,43.4 185.6,39.1 189.9,38.7 C190.5,38.6 191.7,38.6 192.2,38.6 C197,38.6 201.1,35.2 201.8,30.4 C202.6,25.2 199,20.4 193.9,19.7 C193.4,19.6 193,19.6 192.5,19.6 L178.8,19.6 C174.1,19.7 170,16.3 169.2,11.6 C168.4,6.4 172,1.6 177.1,0.9 C177.6,0.8 178,0.8 178.5,0.8 L233.5,0.8 C236.3,0.8 238.6,3.1 238.6,5.9 L238.6,74.6 C238.6,75.5 239.2,76.4 240.1,76.6 C245.2,77.8 248.3,82.9 247.1,87.9 C246.1,91.9 242.7,94.9 238.5,95.1 C238.5,95.1 238.1,95.1 237.9,95.1 L229.1,95.1 C224.4,95 220.3,98.4 219.5,103.1 C218.7,108.3 222.2,113.1 227.4,113.9 C227.9,114 228.4,114 228.8,114 L241.3,114 C246.5,114 250.7,118.2 250.7,123.5 C250.8,124 250.8,124.5 250.7,125 Z M645.2,43 C647.1,46 647.1,49.8 645.2,52.8 C643.5,55.6 640.5,57.3 637.2,57.3 C635.8,57.2 634.7,58.3 634.7,59.7 C634.7,59.8 634.7,59.9 634.7,60.1 L634.7,80.9 C634.7,98.3 629.2,111.4 618.2,120.2 C607.2,129 593.7,133 573.5,133 C570.3,133 564.1,132.9 564,132.9 L499.8,132.9 C495.1,133 491,129.6 490.2,124.9 C489.4,119.7 493,114.9 498.2,114.2 C498.7,114.1 499.1,114.1 499.6,114.1 L524.1,114.1 C528.8,114.2 532.9,110.8 533.7,106.1 C534.5,100.9 530.9,96.1 525.8,95.4 C525.3,95.3 524.9,95.3 524.4,95.3 L515.3,95.3 C514.8,95.3 514.3,95.4 513.8,95.4 C513.8,95.3 513.8,95.3 513.8,95.3 L513.5,95.3 C509.1,95.3 504.7,91.8 504,87.5 C503.1,82.6 506.3,77.8 511.2,76.7 C511.9,76.6 512.4,75.9 512.4,75.2 L512.4,5.9 C512.4,4.6 512.9,3.3 513.9,2.3 C514.8,1.3 516.1,0.8 517.5,0.8 L554.6,0.8 C556,0.8 557.3,1.3 558.2,2.3 C559.2,3.2 559.7,4.5 559.7,5.8 L559.7,81 C559.7,90.5 564.4,95.3 573.7,95.3 C583,95.3 587.7,90.5 587.7,81 L587.7,5.8 C587.7,4.5 588.2,3.2 589.2,2.3 C590.1,1.3 591.4,0.8 592.8,0.8 L633,0.8 C637.8,0.7 642,4.3 642.7,9 C643.3,14.2 639.9,19.6 633.8,19.6 L620.2,19.6 C615.5,19.5 611.4,22.9 610.6,27.6 C609.8,32.8 613.4,37.6 618.6,38.3 C619.1,38.4 619.5,38.4 620,38.4 L634.8,38.4 L635.1,38.4 L637.6,38.4 C640.5,38.5 643.5,40.2 645.2,43 Z M151.1,14.4 C139.2,5.3 124,0.7 105.6,0.7 L25.5,0.7 C20.4,0.6 16.2,4.5 15.8,9.5 C15.5,14.7 19.4,19.2 24.6,19.5 C24.8,19.5 25,19.5 25.2,19.5 L45.4,19.5 C50.5,19.4 54.7,23.3 55.1,28.3 C55.5,33.5 51.5,38 46.3,38.3 C46.1,38.3 45.9,38.3 45.7,38.3 L10.7,38.3 C5.6,38.2 1.4,42.1 1,47.1 C0.7,52.3 4.6,56.8 9.8,57.1 C10,57.1 10.2,57.1 10.4,57.1 L26.4,57.1 C31.5,57 35.7,60.9 36.2,65.9 C36.6,71.1 32.6,75.6 27.4,76 C27.2,76 27,76 26.8,76 L25.5,76 C20.4,75.9 16.2,79.8 15.8,84.8 C15.5,90 19.4,94.5 24.6,94.8 C24.8,94.8 25,94.8 25.2,94.8 L33.7,94.8 C35.1,94.8 36.2,95.9 36.2,97.3 L36.2,128 C36.2,130.8 38.5,133.1 41.3,133.1 L105.8,133.1 C124.7,133.1 140,128.7 151.6,119.9 C163.2,111.1 169,98.1 169,80.9 L169,52.8 C169,36.4 163,23.6 151.1,14.4 Z" id="Shape"></path> 6 + </g> 7 + </g> 8 + </svg>
+58 -61
src/pages/index.astro
··· 1 1 --- 2 2 import Page from "../layouts/page.astro"; 3 - --- 4 3 5 - <Page title="Diffuse Applets Usage Example"> 6 - <iframe src="engine/audio/" frameborder="0" height="0" width="0"></iframe> 7 - <iframe src="ui/audio/" frameborder="0" style="width: 100%"></iframe> 8 - </Page> 4 + import "@picocss/pico/css/pico.colors.css"; 5 + import "../styles/reset.css"; 6 + import "../styles/fonts.css"; 7 + import "../styles/pages/index.css"; 9 8 10 - <style> 11 - body { 12 - background: darkgrey; 13 - } 14 - </style> 9 + const engines = [{ url: "engine/audio/", title: "Audio" }]; 10 + const themes = [{ url: "themes/sakura/", title: "Sakura" }]; 11 + --- 15 12 16 - <script> 17 - import { type Applet, type AppletEvent, applets } from "@web-applets/sdk"; 18 - import { effect, signal } from "spellcaster/spellcaster.js"; 13 + <Page title="Index"> 14 + <header> 15 + <h1> 16 + <svg viewBox="0 0 902 134" style="fill: currentColor; opacity: 0.375;" width="160"> 17 + <title>Diffuse</title> 18 + <use 19 + xlink:href="/images/diffuse-current.svg#diffuse" 20 + href="/images/diffuse-current.svg#diffuse"></use> 21 + </svg> 22 + </h1> 23 + </header> 24 + <main> 25 + <section> 26 + <h2>Themes</h2> 19 27 20 - //////////////////////////////////////////// 21 - // 🗂️ Applets 22 - //////////////////////////////////////////// 23 - const engine = { 24 - audio: await applet("engine/audio"), 25 - }; 28 + <p> 29 + <em 30 + >Themes are “applet compositions” and opt for a traditional way of interacting with them, 31 + like a regular (web) app:</em 32 + > 33 + </p> 26 34 27 - const ui = { 28 - audio: await applet("ui/audio", { setHeight: true }), 29 - }; 35 + <ul> 36 + { 37 + themes.map((item: any) => ( 38 + <li> 39 + <a href={item.url}>{item.title}</a> 40 + </li> 41 + )) 42 + } 43 + </ul> 44 + </section> 30 45 31 - //////////////////////////////////////////// 32 - // ⚡ Connect applets 33 - //////////////////////////////////////////// 34 - reactive(ui.audio, (isPlaying: boolean) => 35 - engine.audio.sendAction(isPlaying ? "play" : "pause", null), 36 - ); 46 + <section> 47 + <h2>Applets</h2> 37 48 38 - reactive(engine.audio, (isPlaying: boolean) => ui.audio.sendAction("set_is_playing", isPlaying)); 39 - reactive(engine.audio, (progress: number) => ui.audio.sendAction("set_progress", progress)); 49 + <h3>Engines</h3> 40 50 41 - //////////////////////////////////////////// 42 - // 🪟 Applet initialiser 43 - //////////////////////////////////////////// 44 - async function applet(src: string, opts: { setHeight?: boolean } = {}) { 45 - const frame: HTMLIFrameElement = document.querySelector( 46 - `[src="${src}${src.endsWith("/") ? "" : "/"}"]`, 47 - ); 51 + <p> 52 + <em 53 + >These logic applets don't have any UI. There are specialised UI applets in themes that 54 + control these.</em 55 + > 56 + </p> 48 57 49 - const applet = await applets.connect(frame.contentWindow); 50 - if (opts.setHeight) applet.onresize = () => (frame.height = `${applet.height}px`); 51 - 52 - return applet; 53 - } 54 - 55 - //////////////////////////////////////////// 56 - // 🔮 Reactive state management 57 - //////////////////////////////////////////// 58 - function reactive<P extends string, T>(applet: Applet, effectFn: (t: T) => void) { 59 - const property = effectFn 60 - .toString() 61 - .slice(1) 62 - .match(/([^(\)|,|\s)]+)/)[1]; 63 - 64 - const [getter, setter] = signal(applet.data[property] as T); 65 - 66 - effect(() => effectFn(getter())); 67 - 68 - applet.addEventListener("data", (event: AppletEvent) => { 69 - setter(event.data[property]); 70 - }); 71 - } 72 - </script> 58 + <ul> 59 + { 60 + engines.map((item: any) => ( 61 + <li> 62 + <a href={item.url}>{item.title}</a> 63 + </li> 64 + )) 65 + } 66 + </ul> 67 + </section> 68 + </main> 69 + </Page>
+78
src/pages/themes/sakura/index.astro
··· 1 + --- 2 + import Page from "../../../layouts/page.astro"; 3 + --- 4 + 5 + <Page title="Diffuse Applets Usage Example"> 6 + <!-- Theme applets --> 7 + <iframe src="ui/audio/" frameborder="0" style="width: 100%"></iframe> 8 + 9 + <!-- Other applets --> 10 + <iframe src="../../engine/audio/" frameborder="0" height="0" width="0"></iframe> 11 + </Page> 12 + 13 + <style> 14 + @import "../../../styles/pages/themes/sakura/variables.css"; 15 + 16 + body { 17 + background-color: var(--reading-tea-leaves); 18 + } 19 + </style> 20 + 21 + <script> 22 + import { type Applet, type AppletEvent, applets } from "@web-applets/sdk"; 23 + import { effect, signal } from "spellcaster/spellcaster.js"; 24 + 25 + //////////////////////////////////////////// 26 + // 🗂️ Applets 27 + //////////////////////////////////////////// 28 + const engine = { 29 + audio: await applet("../../engine/audio"), 30 + }; 31 + 32 + const ui = { 33 + audio: await applet("ui/audio", { setHeight: true }), 34 + }; 35 + 36 + //////////////////////////////////////////// 37 + // ⚡ Connect applets 38 + //////////////////////////////////////////// 39 + reactive(ui.audio, (isPlaying: boolean) => 40 + engine.audio.sendAction(isPlaying ? "play" : "pause", null), 41 + ); 42 + 43 + reactive(engine.audio, (isPlaying: boolean) => ui.audio.sendAction("set_is_playing", isPlaying)); 44 + reactive(engine.audio, (progress: number) => ui.audio.sendAction("set_progress", progress)); 45 + 46 + //////////////////////////////////////////// 47 + // 🪟 Applet initialiser 48 + //////////////////////////////////////////// 49 + async function applet(src: string, opts: { setHeight?: boolean } = {}) { 50 + const frame: HTMLIFrameElement = document.querySelector( 51 + `[src="${src}${src.endsWith("/") ? "" : "/"}"]`, 52 + ); 53 + 54 + const applet = await applets.connect(frame.contentWindow); 55 + if (opts.setHeight) applet.onresize = () => (frame.height = `${applet.height}px`); 56 + 57 + return applet; 58 + } 59 + 60 + //////////////////////////////////////////// 61 + // 🔮 Reactive state management 62 + //////////////////////////////////////////// 63 + // TODO: Applet should have a subtype 64 + function reactive<T>(applet: Applet, effectFn: (t: T) => void) { 65 + const property = effectFn 66 + .toString() 67 + .slice(1) 68 + .match(/([^(\)|,|\s)]+)/)[1]; 69 + 70 + const [getter, setter] = signal(applet.data[property] as T); 71 + 72 + effect(() => effectFn(getter())); 73 + 74 + applet.addEventListener("data", (event: AppletEvent) => { 75 + setter(event.data[property]); 76 + }); 77 + } 78 + </script>
+15 -4
src/pages/ui/audio/index.astro src/pages/themes/sakura/ui/audio/index.astro
··· 1 1 --- 2 - import Applet from "../../../layouts/applet.astro"; 2 + import Applet from "../../../../../layouts/applet.astro"; 3 3 --- 4 4 5 5 <Applet title="Diffuse ui/audio applet"> 6 - <div 7 - style="background: dimgray; color: white; height: 100px; line-height: 100px; text-align: center;" 8 - > 6 + <div> 9 7 <button>▶️</button> 10 8 <progress max="100" value="0"></progress> 11 9 </div> 10 + 11 + <style> 12 + @import "../../../../../styles/pages/themes/sakura/variables.css"; 13 + 14 + div { 15 + /* 5% darker version */ 16 + background: oklch(from var(--reading-tea-leaves) calc(l - 0.05) c h); 17 + 18 + height: 100px; 19 + line-height: 100px; 20 + text-align: center; 21 + } 22 + </style> 12 23 13 24 <script> 14 25 import { applets } from "@web-applets/sdk";
+1 -1
src/pages/ui/audio/manifest.json.ts src/pages/themes/sakura/ui/audio/manifest.json.ts
··· 1 - import { manifest } from "../../../common/pages/manifest.ts"; 1 + import { manifest } from "../../../../../common/pages/manifest.ts"; 2 2 3 3 export const GET = manifest({ 4 4 name: "diffuse/ui/audio",
+15
src/styles/fonts.css
··· 1 + @font-face { 2 + font-display: swap; 3 + font-family: InterVariable; 4 + font-style: normal; 5 + font-weight: 100 900; 6 + src: url("/fonts/InterVariable.woff2") format("woff2"); 7 + } 8 + 9 + @font-face { 10 + font-display: swap; 11 + font-family: InterVariable; 12 + font-style: italic; 13 + font-weight: 100 900; 14 + src: url("/fonts/InterVariable-Italic.woff2") format("woff2"); 15 + }
+87
src/styles/pages/index.css
··· 1 + @import "../variables.css"; 2 + 3 + :root { 4 + font-family: "Inter", sans-serif; 5 + font-size: var(--fs-base); 6 + 7 + /* Colors */ 8 + --palm-leaf: #32472b; 9 + --mana-tree: #4c7541; 10 + --beyond-the-pines: #6c824a; 11 + --rural-green: #89854f; 12 + --wasteland: #a18a5a; 13 + --incense: #ac9b7d; 14 + } 15 + 16 + @supports (font-variation-settings: normal) { 17 + :root { 18 + font-family: "InterVariable", sans-serif; 19 + font-feature-settings: 20 + "ss03" 2, 21 + "ss02" 2; 22 + font-optical-sizing: auto; 23 + } 24 + } 25 + 26 + body { 27 + background: var(--palm-leaf); 28 + color: var(--incense); 29 + } 30 + 31 + header, 32 + main { 33 + margin: var(--space-m) var(--space-l); 34 + } 35 + 36 + header { 37 + margin-bottom: 0; 38 + } 39 + 40 + main { 41 + display: flex; 42 + flex-wrap: wrap; 43 + gap: var(--space-xl); 44 + margin-bottom: 0; 45 + } 46 + 47 + main > section { 48 + flex: 1; 49 + min-width: min(320px, 100%); 50 + width: 50%; 51 + } 52 + 53 + a { 54 + color: inherit; 55 + } 56 + 57 + h1, 58 + h2, 59 + h3 { 60 + /* font-family: "Chicago Kare"; */ 61 + } 62 + 63 + h2 { 64 + font-size: var(--fs-xl); 65 + font-weight: 900; 66 + margin: var(--space-xl) 0 var(--space-s); 67 + text-transform: uppercase; 68 + } 69 + 70 + h3 { 71 + font-size: var(--fs-l); 72 + font-weight: 800; 73 + margin: var(--space-s) 0 var(--space-s); 74 + text-transform: uppercase; 75 + } 76 + 77 + ul, 78 + ol, 79 + p { 80 + margin: var(--space-s) 0; 81 + } 82 + 83 + p, 84 + ul, 85 + ol { 86 + max-width: 420px; 87 + }
+5
src/styles/pages/themes/sakura/variables.css
··· 1 + :root { 2 + /* Colors */ 3 + --reading-tea-leaves: #7b6467; 4 + --sakura: #e1b3b9; 5 + }
+58
src/styles/reset.css
··· 1 + *, 2 + *::before, 3 + *::after { 4 + box-sizing: border-box; 5 + } 6 + 7 + * { 8 + margin: 0; 9 + } 10 + 11 + body { 12 + font-synthesis: none; 13 + line-height: 1.5; 14 + } 15 + 16 + img, 17 + picture, 18 + video, 19 + canvas, 20 + svg { 21 + display: block; 22 + max-width: 100%; 23 + } 24 + 25 + input, 26 + button, 27 + textarea, 28 + select { 29 + font: inherit; 30 + } 31 + 32 + p, 33 + h1, 34 + h2, 35 + h3, 36 + h4, 37 + h5, 38 + h6 { 39 + overflow-wrap: break-word; 40 + } 41 + 42 + p { 43 + text-wrap: pretty; 44 + } 45 + 46 + h1, 47 + h2, 48 + h3, 49 + h4, 50 + h5, 51 + h6 { 52 + text-wrap: balance; 53 + } 54 + 55 + #root, 56 + #__next { 57 + isolation: isolate; 58 + }
+31
src/styles/variables.css
··· 1 + :root { 2 + /* Font scales */ 3 + --fs-s: clamp(0.8rem, 0.08vi + 0.78rem, 0.84rem); 4 + --fs-base: clamp(1rem, 0.23vi + 0.94rem, 1.13rem); 5 + --fs-m: clamp(1.25rem, 0.45vi + 1.14rem, 1.5rem); 6 + --fs-l: clamp(1.56rem, 0.79vi + 1.36rem, 2rem); 7 + --fs-xl: clamp(1.95rem, 1.29vi + 1.63rem, 2.66rem); 8 + --fs-2xl: clamp(2.44rem, 2.02vi + 1.94rem, 3.55rem); 9 + --fs-3xl: clamp(3.05rem, 3.06vi + 2.29rem, 4.73rem); 10 + 11 + /* Space scales */ 12 + --space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem); 13 + --space-2xs: clamp(0.5625rem, 0.5408rem + 0.1087vw, 0.625rem); 14 + --space-xs: clamp(0.875rem, 0.8533rem + 0.1087vw, 0.9375rem); 15 + --space-s: clamp(1.125rem, 1.0815rem + 0.2174vw, 1.25rem); 16 + --space-m: clamp(1.6875rem, 1.6223rem + 0.3261vw, 1.875rem); 17 + --space-l: clamp(2.25rem, 2.163rem + 0.4348vw, 2.5rem); 18 + --space-xl: clamp(3.375rem, 3.2446rem + 0.6522vw, 3.75rem); 19 + --space-2xl: clamp(4.5rem, 4.3261rem + 0.8696vw, 5rem); 20 + --space-3xl: clamp(6.75rem, 6.4891rem + 1.3043vw, 7.5rem); 21 + 22 + /* One-up pairs */ 23 + --space-3xs-2xs: clamp(0.3125rem, 0.2038rem + 0.5435vw, 0.625rem); 24 + --space-2xs-xs: clamp(0.5625rem, 0.4321rem + 0.6522vw, 0.9375rem); 25 + --space-xs-s: clamp(0.875rem, 0.7446rem + 0.6522vw, 1.25rem); 26 + --space-s-m: clamp(1.125rem, 0.8641rem + 1.3043vw, 1.875rem); 27 + --space-m-l: clamp(1.6875rem, 1.4049rem + 1.413vw, 2.5rem); 28 + --space-l-xl: clamp(2.25rem, 1.7283rem + 2.6087vw, 3.75rem); 29 + --space-xl-2xl: clamp(3.375rem, 2.8098rem + 2.8261vw, 5rem); 30 + --space-2xl-3xl: clamp(4.5rem, 3.4565rem + 5.2174vw, 7.5rem); 31 + }