LumeWeb
/
skynet-webportal
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

move index page cards to yaml data layer

This commit is contained in:
Karol Wypchlo 2021-06-10 16:03:59 +02:00
parent 56d5073755
commit 3437e76fcc
10 changed files with 320 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/website/data/pages/index/assets/decentralized-internet-skynet.svg Normal file
View File

@ -0,0 +1,31 @@
<svg xmlns="http://www.w3.org/2000/svg" width="320" height="131" viewBox="0 0 320 131">
<defs>
<filter id="tz44a43s9a">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<g>
<path fill="#00C65E" d="M112 49.889L112 80.111 142 99 172 80.111 172 49.889 142.938 31z" transform="translate(-448 -1089) translate(448 949) translate(0 140) translate(66)"/>
<path stroke="#0D0D0D" stroke-width="2" d="M125.612 88.681L142 99 172 80.111 172 49.889 158.725 41.261" transform="translate(-448 -1089) translate(448 949) translate(0 140) translate(66)"/>
<g filter="url(#tz44a43s9a)" transform="translate(-448 -1089) translate(448 949) translate(0 140) translate(66)">
<g stroke="#222829" stroke-width="2">
<path d="M32 14L48 4 64 14 64 30 48 40 32 30z" transform="translate(46 5)"/>
<path d="M64 14L48 24 32 14M48.5 24L48.5 40M68.5 82L68.5 126M46 64.5L50 64.5M38 64.5L42 64.5M54 64.5L58 64.5" transform="translate(46 5)"/>
<g>
<path d="M52 126v-24c0-2.207-1.791-4-4-4s-4 1.793-4 4v24M25 0h-5C6.762 8.547 0 21.074 0 38c0 19.43 11.396 36.449 28 44v44" transform="translate(46 5)"/>
<path d="M48 86c26.51 0 48-21.488 48-48 0-16.93-6.758-29.453-20-38h-4v36L48 52 24 36V0" transform="translate(46 5)"/>
<path d="M72.004 6C81.719 13.299 88 24.916 88 38c0 22.094-17.908 40-40 40S8 60.094 8 38" transform="translate(46 5)"/>
</g>
</g>
</g>
<path stroke="#0D0D0D" stroke-width="2" d="M29 11.5H0m34 9H15m29-20H25" transform="translate(-448 -1089) translate(448 949) translate(0 140) translate(66)"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

26
packages/website/data/pages/index/assets/decentralized-storage-benefits.svg Normal file
View File

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80">
<defs>
<filter id="nw0z1sy8ta">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<path fill="#00C65E" d="M31 10L8 19v21c0 18 23 30 23 30V10z" transform="translate(-1144 -1966) translate(0 1544) translate(1144 422)"/>
<g filter="url(#nw0z1sy8ta)" transform="translate(-1144 -1966) translate(0 1544) translate(1144 422)">
<g>
<path stroke="#222829" stroke-linejoin="round" stroke-width="2" d="M10.224 40L16.22 40 24.218 26 32.214 38 40.214 26 48.215 38 56.214 24 62.224 24" transform="translate(8 10)"/>
<path fill="#1C1C1C" d="M6 39H8V41H6zM64 23H66V25H64z" transform="translate(8 10)"/>
<g stroke="#000" stroke-linejoin="round" stroke-width="2">
<path d="M48 21.3V9L24 0 0 9v21c0 18 24 30 24 30s12.902-6.451 19.786-16.988" transform="translate(8 10)"/>
</g>
<path fill="#D8D8D8" d="M22 1H24V17H22z" transform="translate(8 10)"/>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

30
packages/website/data/pages/index/assets/decentralized-storage-without-wallet.svg Normal file
View File

@ -0,0 +1,30 @@
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80">
<defs>
<filter id="p9eklku59a">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<path fill="#00C65E" d="M39 11c1.105 0 2 .895 2 2v11l-3.12.5-3.417 2.3L33 31l1.898 4.871 2.102.804V50h-.328l-2.209-4L31 43l-1.467.5-.925 1 .392 2 1.458 3.5H13c-1.105 0-2-.895-2-2V13c0-1.105.895-2 2-2h26z" transform="translate(-792 -1661) translate(0 1544) translate(792 117)"/>
<g filter="url(#p9eklku59a)" transform="translate(-792 -1661) translate(0 1544) translate(792 117)">
<g stroke="#222829" stroke-width="2">
<path d="M42 34L42 37M37 33L37 36M32 31L32 35" transform="translate(11 12)"/>
<g>
<path d="M26 63v-4c0-.553.447-1 1-1h19c.553 0 1 .447 1 1v4" transform="translate(11 12)"/>
<path stroke-linejoin="round" d="M44 32c1.656 0 3 1.344 3 3v7c0 7-2 11-2 13v3M39 30c1.656 0 3 1.344 3 3v2M34 28c1.656 0 3 1.344 3 3v2" transform="translate(11 12)"/>
<path stroke-linecap="round" stroke-linejoin="round" d="M26 40V19c0-1.656 1.344-3 3-3s3 1.344 3 3v12" transform="translate(11 12)"/>
<path stroke-linejoin="round" d="M28 58v-3l-6-8s-3.293-12.293-4-13c-1-1 0-3 2-3s3 3 3 3l3 6M26.004 25.328C23.637 24.205 22 21.794 22 19c0-3.866 3.134-7 7-7s7 3.134 7 7c0 2.793-1.635 5.203-4 6.326" transform="translate(11 12)"/>
<path stroke-linejoin="round" d="M19.778 25C18.653 23.273 18 21.213 18 19c0-6.075 4.925-11 11-11s11 4.925 11 11c0 2.214-.654 4.274-1.78 6" transform="translate(11 12)"/>
<path stroke-linejoin="round" d="M14 19c0-8.284 6.716-15 15-15 8.284 0 15 6.716 15 15" transform="translate(11 12)"/>
<path stroke-linejoin="round" d="M14 38H1c-.552 0-1-.447-1-1V1c0-.553.448-1 1-1h56c.552 0 1 .447 1 1v36c0 .553-.448 1-1 1h-7M4 38L4 3M54 35L54 0" transform="translate(11 12)"/>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

35
packages/website/data/pages/index/assets/empower-global-citizens-skynet.svg Normal file
View File

@ -0,0 +1,35 @@
<svg xmlns="http://www.w3.org/2000/svg" width="320" height="142" viewBox="0 0 320 142">
<defs>
<filter id="ggm010n4ja">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
<filter id="5cxph9rhkb">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<g transform="translate(-1152 -1078) translate(448 949) translate(704 129) translate(75)">
<circle cx="38" cy="75" r="30" fill="#00C65E"/>
<path stroke="#0D0D0D" stroke-width="2" d="M18.658 51.258c-5.026 3.877-8.866 9.373-10.636 15.977-4.288 16.004 5.21 32.455 21.213 36.743 5.008 1.342 10.06 1.334 14.768.2"/>
<g filter="url(#ggm010n4ja)">
<g stroke="#222829" stroke-width="2">
<path d="M82 20L82 56.068 80 60.075 80 104M46 6c0-3.313 2.688-6 6-6 3.313 0 6 2.687 6 6M46 14V6c0-3.314-2.688-6-6-6-3.313 0-6 2.686-6 6v8M58 20c0 3.313-2.691 6-6.007 6-2.082 0-3.913-1.056-4.993-2.66M70 20c0 3.313-2.688 6-6 6-3.313 0-6-2.687-6-6V6c0-3.313 2.687-6 6-6 3.312 0 6 2.687 6 6" transform="translate(25 21)"/>
<path d="M82 6c0-3.313-2.688-6-6-6-3.313 0-6 2.687-6 6v14c0 3.313 2.687 6 6 6 3.312 0 6-2.687 6-6V6zM80 59.5L72 59.5M42 59.5L50 59.5M46 34c8.836 0 16 7.163 16 16M80 67.5L68 67.5" transform="translate(25 21)"/>
<path d="M40 36v-9.999S50 24 50 18c0-2.209-1.791-4-4-4H34c-4.419 0-8 3.583-8 8.001v22l16 16V90M40 25.5L34 25.5M89.5 74L89.5 78M89.5 82L89.5 86M89.5 90L89.5 94M33.5 62L33.5 66M33.5 70L33.5 74M33.5 78L33.5 82M17 89.5L62 89.5M0 103.5L120 103.5M36 117.5L92 117.5" transform="translate(25 21)"/>
</g>
</g>
<g stroke-linecap="round" stroke-linejoin="round" filter="url(#5cxph9rhkb)">
<g stroke="#000" stroke-width="2" transform="translate(122)">
<circle cx="19.5" cy="19.5" r="19.5"/>
<path d="M0 19.5L39 19.5M19.5 0c4.877 5.34 7.65 12.27 7.8 19.5-.15 7.23-2.923 14.16-7.8 19.5-4.877-5.34-7.65-12.27-7.8-19.5.15-7.23 2.923-14.16 7.8-19.5h0z"/>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

37
packages/website/data/pages/index/assets/fight-corporate-control-skynet.svg Normal file
View File

@ -0,0 +1,37 @@
<svg xmlns="http://www.w3.org/2000/svg" width="320" height="131" viewBox="0 0 320 131">
<defs>
<filter id="d51k6oi84a">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<g>
<path fill="#00C65E" d="M99.41 100C114.094 100 126 88.136 126 73.5S114.095 47 99.41 47C89.618 47 58.481 55.833 6 73.5 58.482 91.167 89.619 100 99.41 100z" transform="translate(-800 -1089) translate(448 949) translate(352 140) translate(64) rotate(30 66 73.5)"/>
<g filter="url(#d51k6oi84a)" transform="translate(-800 -1089) translate(448 949) translate(352 140) translate(64)">
<g stroke-width="2">
<path stroke="#222829" d="M62.5 51L62.5 55M55 48.5L66 48.5M53 44.5L71 44.5" transform="translate(34 32)"/>
<g stroke="#222829">
<path d="M58 7v8l-8 13h-9c-1.656 0-3 1.344-3 3v17h-2v7" transform="translate(34 32) translate(33)"/>
<path d="M37 22L46 22 52 13M6 13L12 22 21 22" transform="translate(34 32) translate(33)"/>
<path d="M0 7v8l8 13h9c1.656 0 3 1.344 3 3v17h2v7" transform="translate(34 32) translate(33)"/>
<path d="M6 7c0 1.657-1.344 3-3 3S0 8.657 0 7s1.344-3 3-3 3 1.343 3 3zM58 7c0 1.657-1.344 3-3 3s-3-1.343-3-3 1.344-3 3-3 3 1.343 3 3zM42.5 35L42.5 37M42.5 39L42.5 41M42.5 43L42.5 45M16.5 35L16.5 37M16.5 39L16.5 41M16.5 43L16.5 45M38 9c0 4.971-4.029 9-9 9s-9-4.029-9-9 4.029-9 9-9 9 4.029 9 9z" transform="translate(34 32) translate(33)"/>
</g>
<g stroke="#222829" stroke-linejoin="round">
<path d="M20 0H6C2.688 0 0 2.686 0 6v60M108 66V6c0-3.314-2.688-6-6-6H88M44 60.5L48 60.5M36 60.5L40 60.5M52 60.5L56 60.5M60 60.5L64 60.5M68 60.5L72 60.5" transform="translate(34 32) translate(8 14)"/>
<path d="M88 8L100 8 100 60 76 60M32 60L8 60 8 8 20 8" transform="translate(34 32) translate(8 14)"/>
</g>
<path stroke="#00C65E" stroke-linejoin="round" d="M116 98L8 98 0 90 0 86 48 86 52 90 72 90 76 86 124 86 124 90z" transform="translate(34 32)"/>
</g>
</g>
<path stroke="#0D0D0D" stroke-linejoin="round" stroke-width="2" d="M177.6 54.514L186.88 58 179.92 44.054 195 38.243 179.92 33.595 188.04 20.811 171.8 26.622 166 15 160.2 26.622 143.96 20.811 152.08 34.757 137 38.243 152.08 44.054" transform="translate(-800 -1089) translate(448 949) translate(352 140) translate(64) rotate(45 166 36.5)"/>
<path stroke="#0D0D0D" stroke-linejoin="round" stroke-width="2" d="M168 41c0 3.314-2.687 6-6 6-3.312 0-6-2.686-6-6 0-3.313 2.688-6 6-6 3.313 0 6 2.687 6 6z" transform="translate(-800 -1089) translate(448 949) translate(352 140) translate(64)"/>
<path stroke="#0D0D0D" stroke-width="2" d="M27.662 58.841L14.038 43.5 31.449 47" transform="translate(-800 -1089) translate(448 949) translate(352 140) translate(64)"/>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

34
packages/website/data/pages/index/assets/monetization-skynet.svg Normal file
View File

@ -0,0 +1,34 @@
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80">
<defs>
<filter id="q2pg3gceya">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.109804 0 0 0 0 0.109804 0 0 0 0 0.109804 0 0 0 1.000000 0"/>
</filter>
<filter id="x4s64m2qwb">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.000000 0 0 0 0 0.776471 0 0 0 0 0.368627 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<path fill="#00C65E" d="M57.5 37c0 9.389-7.611 17-17 17s-17-7.611-17-17 7.611-17 17-17 17 7.611 17 17z" transform="translate(-792 -1966) translate(0 1544) translate(792 422)"/>
<g filter="url(#q2pg3gceya)" transform="translate(-792 -1966) translate(0 1544) translate(792 422)">
<g>
<g filter="url(#x4s64m2qwb)" transform="translate(8 6)">
<g stroke="#222829" stroke-width="2">
<path stroke-linejoin="round" d="M47 58L63 58" transform="translate(.5)"/>
<path stroke-linecap="round" stroke-linejoin="round" d="M59 62L63 58 59 54M36 8L32 4 36 0" transform="translate(.5)"/>
<path d="M32 4c14.912 0 27 12.088 27 27S46.912 58 32 58H0" transform="translate(.5)"/>
<path stroke-linejoin="round" d="M18.004 54.096C10.208 49.36 5 40.786 5 31 5 17.772 14.514 6.764 27.074 4.45" transform="translate(.5)"/>
<path d="M49 31c0 9.389-7.611 17-17 17s-17-7.611-17-17 7.611-17 17-17 17 7.611 17 17zM32 39L32 42M32 20L32 23" transform="translate(.5)"/>
<path d="M28 35c0 2.209 1.791 4 4 4s4-1.791 4-4-4-4-4-4-4-1.791-4-4 1.791-4 4-4 4 1.791 4 4M23 31L21 31M43 31L41 31" transform="translate(.5)"/>
</g>
</g>
<path fill="#D8D8D8" d="M12 65H54V67H12z" transform="translate(8 6)"/>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

27
packages/website/data/pages/index/assets/skynet-decentralized-storage-speed.svg Normal file
View File

@ -0,0 +1,27 @@
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80">
<defs>
<filter id="589p9xvkwa">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
<filter id="y85n5y5inb">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.000000 0 0 0 0 0.776471 0 0 0 0 0.368627 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<path fill="#00C65E" d="M40 11c17.121 0 31 13.879 31 31 0 8.52-3.438 16.396-9 22H18c-5.564-5.604-9-13.479-9-22 0-17.121 13.879-31 31-31zm0 5c-13.807 0-25 11.26-25 25.15 0 6.914 2.771 13.303 7.258 17.85h35.484C62.227 54.453 65 48.063 65 41.15 65 27.26 53.807 16 40 16z" transform="translate(-1144 -1661) translate(0 1544) translate(1144 117)"/>
<g filter="url(#589p9xvkwa)" transform="translate(-1144 -1661) translate(0 1544) translate(1144 117)">
<g stroke="#222829" stroke-width="2" filter="url(#y85n5y5inb)" transform="translate(9 11)">
<path d="M34 31c0 1.656-1.344 3-3 3s-3-1.344-3-3 1.344-3 3-3 3 1.344 3 3z"/>
<path d="M11 46.003C7.86 41.823 6 36.629 6 31 6 17.193 17.193 6 31 6s25 11.193 25 25c0 5.628-1.859 10.82-4.998 15"/>
<path d="M53 53H9c-5.564-5.604-9-13.479-9-22C0 13.879 13.879 0 31 0c17.121 0 31 13.879 31 31 0 8.52-3.438 16.396-9 22zM31 46L31 48M27 46L27 48M35 46L35 48M39 46L39 48M23 46L23 48M6 31L9 31M31 6L31 9M56 31L53 31M13 13L16 16M46 16L49 13M33 29L43 19"/>
<path d="M23 37.002c-1.256-1.672-2-3.75-2-6.002 0-5.522 4.477-10 10-10s10 4.478 10 10c0 2.25-.744 4.328-1.999 6M11 60.5L51 60.5"/>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

25
packages/website/data/pages/index/assets/skynet-storage-free-use.svg Normal file
View File

@ -0,0 +1,25 @@
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80">
<defs>
<filter id="otngco3gva">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 0 0.050980 0 0 0 1.000000 0"/>
</filter>
<filter id="lj4budqwmb">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.000000 0 0 0 0 0.776471 0 0 0 0 0.368627 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<path fill="#00C65E" d="M69 60L54 72 39 60 39 30 47 33 50 30 58 30 61 33 69 30z" transform="translate(-440 -1965) translate(0 1544) translate(440 421)"/>
<g stroke-linejoin="round" filter="url(#otngco3gva)" transform="translate(-440 -1965) translate(0 1544) translate(440 421)">
<g stroke="#222829" stroke-width="2" filter="url(#lj4budqwmb)" transform="translate(11 9)">
<path d="M46 7c0 3.866-10.297 7-23 7S0 10.866 0 7s10.297-7 23-7 23 3.134 23 7z"/>
<path d="M23 26c-12.703 0-23-3.134-23-7V7M46 7L46 17M23 38c-12.703 0-23-3.134-23-7v-7M23 50c-12.703 0-23-3.134-23-7v-7M35 60.973C31.507 61.625 27.397 62 23 62c-12.703 0-23-3.134-23-7v-7M23 26L25 26M23 38L25 38M23 50L25 50M58 50L43 62 28 50 28 20 36 23 39 20 47 20 50 23 58 20zM50 31L50 33M50 43L50 45M46 31L46 33M46 35L46 37M46 43L46 45M46 47L46 49M50 35L50 37M36 31L36 33M36 43L36 45M40 31L40 33M40 35L40 37M40 43L40 45M40 47L40 49M36 35L36 37M46 39L46 41M50 39L50 41M40 39L40 41M36 39L36 41M36 23L36 27M50 23L50 27M24 20L22 20M24 32L22 32M24 44L22 44M24 56L22 56"/>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

31
packages/website/data/pages/index/pages-index.yml Normal file
View File

@ -0,0 +1,31 @@
- etosCards:
- title: Build a better web
src: ./assets/decentralized-internet-skynet.svg
alt: The top of a wrench and a cube representing a new kind of Internet
- title: Fight corporate control<br />of user data
src: ./assets/fight-corporate-control-skynet.svg
alt: Symbol of a strong person stretching arms out of screen
- title: Empower global citizens
src: ./assets/empower-global-citizens-skynet.svg
alt: Symbol of a fist in the air
- ecosystemCards:
- title: Easy to use
src: ./assets/decentralized-storage-without-wallet.svg
alt: Image of a finger pushing a button
text: Decentralized storage without needing to run a node or wallet. Skynet also includes SDKs for popular programming languages and APIs that integrate seamlessly with your existing apps.
- title: Fast
src: ./assets/skynet-decentralized-storage-speed.svg
alt: Image of a speedometer
text: Skynet's speeds rival centralized providers and surpass all decentralized offerings. A typical Skynet download starts in under 500 ms and can stream at rates as high as 1 Gbps!
- title: Free to use
src: ./assets/skynet-storage-free-use.svg
alt: Image of a server database and a shield
text: Focus on building, not overhead server costs. When users own their data, developers aren't asked to pay for it.
- title: Monetization
src: ./assets/monetization-skynet.svg
alt: Image of a coin symbol
text: Profit directly from the success of your skapp. Now you can truly prioritize your users, instead of advertisers.
- title: Persistence
src: ./assets/decentralized-storage-benefits.svg
alt: Abstract image of a shield and a graph line
text: Your skapp and data stay live, even if corporations pull your access to their resources. You can also use Skynet as a failover site for when centralized providers go down.

103
packages/website/src/pages/index.js
View File

@ -1,72 +1,31 @@
import * as React from "react"; import * as React from "react";
import { graphql } from "gatsby";
import { Section, SectionTitle, CardWithDescription, CardWithTitle } from "../components/Layout"; import { Section, SectionTitle, CardWithDescription, CardWithTitle } from "../components/Layout";
import { Carousel } from "../components/Carousel/Carousel"; import { Carousel } from "../components/Carousel/Carousel";
import Seo from "../components/seo"; import Seo from "../components/seo";
import CommunitySection from "../components/CommunitySection"; import CommunitySection from "../components/CommunitySection";
import Uploader from "../components/Uploader"; import Uploader from "../components/Uploader";
import { ArrowRight } from "../components/Icons"; import { ArrowRight } from "../components/Icons";
import SkynetToolBig from "../components/Icons/SkynetToolBig.svg";
import SkynetUserBig from "../components/Icons/SkynetUserBig.svg";
import SkynetPowerBig from "../components/Icons/SkynetPowerBig.svg";
import SkynetMonetizationSmall from "../components/Icons/SkynetMonetizationSmall.svg";
import SkynetPersistenceSmall from "../components/Icons/SkynetPersistenceSmall.svg";
import SkynetSpeedSmall from "../components/Icons/SkynetSpeedSmall.svg";
import SkynetUsageSmall from "../components/Icons/SkynetUsageSmall.svg";
import SkynetSiaSmall from "../components/Icons/SkynetSiaSmall.svg";
import Link from "../components/Link"; import Link from "../components/Link";
const etosCards = [ const IndexPage = ({ data }) => {
{ const etosCards = React.useMemo(
src: SkynetToolBig, () =>
title: "Build a better web", data.allPagesIndexYaml.edges[0].node.etosCards.map((card) => ({
alt: "The top of a wrench and a cube representing a new kind of Internet", ...card,
}, src: card.src.publicURL,
{ })),
src: SkynetUserBig, [data]
title: "Fight corporate control<br />of user data", );
alt: "Symbol of a strong person stretching arms out of screen", const ecosystemCards = React.useMemo(
}, () =>
{ data.allPagesIndexYaml.edges[1].node.ecosystemCards.map((card) => ({
src: SkynetPowerBig, ...card,
title: "Empower global citizens", src: card.src.publicURL,
alt: "Symbol of a fist in the air", })),
}, [data]
]; );
const ecosystemCards = [
{
src: SkynetUsageSmall,
title: "Easy to use",
text: "Decentralized storage without needing to run a node or wallet. Skynet also includes SDKs for popular programming languages and APIs that integrate seamlessly with your existing apps.",
alt: "Image of a finger pushing a button",
},
{
src: SkynetSpeedSmall,
title: "Fast",
text: "Skynet's speeds rival centralized providers and surpass all decentralized offerings. A typical Skynet download starts in under 500 ms and can stream at rates as high as 1 Gbps!",
alt: "Image of a speedometer",
},
{
src: SkynetSiaSmall,
title: "Free to use",
text: "Focus on building, not overhead server costs. When users own their data, developers aren't asked to pay for it.",
alt: "Image of a server database and a shield",
},
{
src: SkynetMonetizationSmall,
title: "Monetization",
text: "Profit directly from the success of your skapp. Now you can truly prioritize your users, instead of advertisers.",
alt: "Image of a coin symbol",
},
{
src: SkynetPersistenceSmall,
title: "Persistence",
text: "Your skapp and data stay live, even if corporations pull your access to their resources. You can also use Skynet as a failover site for when centralized providers go down.",
alt: "Abstract image of a shield and a graph line",
},
];
const IndexPage = () => {
return ( return (
<> <>
<Seo title="Decentralized Internet for a Free Future" /> <Seo title="Decentralized Internet for a Free Future" />
@ -166,4 +125,30 @@ const IndexPage = () => {
); );
}; };
export const query = graphql`
query MainPageQuery {
allPagesIndexYaml {
edges {
node {
etosCards {
title
alt
src {
publicURL
}
}
ecosystemCards {
title
alt
text
src {
publicURL
}
}
}
}
}
}
`;
export default IndexPage; export default IndexPage;