Merge pull request #29 from web3privacy/pages-redesign

Patch Notes: Web 3 Privacy (Home, About, Get Involved - Redesign)
This commit is contained in:
PG 2024-09-29 20:39:01 +02:00 committed by GitHub
commit 9f9c8d473d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
81 changed files with 7038 additions and 696 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 126 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

BIN
public/events/masonry/1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,016 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

BIN
public/events/masonry/2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 672 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.3 KiB

BIN
public/events/masonry/3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

BIN
public/events/masonry/4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 632 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

BIN
public/events/masonry/5.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
public/events/masonry/6.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 604 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
public/events/masonry/7.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 932 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
public/events/masonry/8.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
public/events/masonry/9.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,017 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

BIN
public/hp-bg-redesign.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

13
public/icons/signal.svg Normal file
View file

@ -0,0 +1,13 @@
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_140_218)">
<path
d="M18.24 0.701236L18.78 2.88374C16.6557 3.40615 14.6227 4.24691 12.75 5.37749L11.595 3.44999C13.6587 2.20398 15.8991 1.27725 18.24 0.701236ZM29.76 0.701236L29.22 2.88374C31.3442 3.40615 33.3772 4.24691 35.25 5.37749L36.4125 3.44999C34.3464 2.20329 32.1035 1.27654 29.76 0.701236ZM3.44999 11.595C2.20398 13.6587 1.27725 15.8991 0.701236 18.24L2.88374 18.78C3.40615 16.6557 4.24691 14.6227 5.37749 12.75L3.44999 11.595ZM2.24999 24C2.24926 22.9092 2.33074 21.8198 2.49374 20.7412L0.269986 20.4037C-0.0899954 22.7877 -0.0899954 25.2122 0.269986 27.5962L2.49374 27.2587C2.33074 26.1802 2.24926 25.0908 2.24999 24ZM36.405 44.55L35.25 42.6225C33.3796 43.7524 31.3491 44.5931 29.2275 45.1162L29.7675 47.2987C32.1058 46.722 34.3435 45.7953 36.405 44.55ZM45.75 24C45.7507 25.0908 45.6692 26.1802 45.5062 27.2587L47.73 27.5962C48.09 25.2122 48.09 22.7877 47.73 20.4037L45.5062 20.7412C45.6692 21.8198 45.7507 22.9092 45.75 24ZM47.2987 29.76L45.1162 29.22C44.5938 31.3442 43.7531 33.3772 42.6225 35.25L44.55 36.4125C45.7967 34.3464 46.7234 32.1035 47.2987 29.76ZM27.2587 45.51C25.0984 45.835 22.9016 45.835 20.7412 45.51L20.4037 47.7337C22.7877 48.0937 25.2122 48.0937 27.5962 47.7337L27.2587 45.51ZM41.5087 36.9037C40.2115 38.6606 38.6579 40.2129 36.9 41.5087L38.235 43.32C40.1743 41.8941 41.8884 40.1851 43.32 38.25L41.5087 36.9037ZM36.9 6.49124C38.6582 7.78819 40.2118 9.34175 41.5087 11.1L43.32 9.74999C41.893 7.81602 40.1839 6.10701 38.25 4.67999L36.9 6.49124ZM6.49124 11.1C7.78819 9.34175 9.34175 7.78819 11.1 6.49124L9.74999 4.67999C7.81602 6.10701 6.10701 7.81602 4.67999 9.74999L6.49124 11.1ZM44.55 11.595L42.6225 12.75C43.7524 14.6204 44.5931 16.6508 45.1162 18.7725L47.2987 18.2325C46.722 15.8942 45.7953 13.6564 44.55 11.595ZM20.7412 2.49374C22.9016 2.16871 25.0984 2.16871 27.2587 2.49374L27.5962 0.269986C25.2122 -0.0899954 22.7877 -0.0899954 20.4037 0.269986L20.7412 2.49374ZM7.64624 43.9162L2.99999 45L4.08374 40.3537L1.89374 39.84L0.809986 44.4862C0.722695 44.859 0.731962 45.2479 0.836911 45.616C0.941859 45.9842 1.13902 46.3195 1.40973 46.5902C1.68044 46.861 2.01575 47.0581 2.38393 47.1631C2.75211 47.268 3.14098 47.2773 3.51374 47.19L8.15624 46.125L7.64624 43.9162ZM2.36249 37.8337L4.55249 38.3437L5.30249 35.1225C4.2093 33.2852 3.39421 31.2961 2.88374 29.22L0.701236 29.76C1.1905 31.7484 1.93413 33.6655 2.91374 35.4637L2.36249 37.8337ZM12.8625 42.7087L9.64124 43.4587L10.1512 45.6487L12.5212 45.0975C14.3195 46.0771 16.2365 46.8207 18.225 47.31L18.765 45.1275C16.6932 44.6109 14.7093 43.7908 12.8775 42.6937L12.8625 42.7087ZM24 4.49999C20.5159 4.50179 17.0959 5.43705 14.0957 7.20848C11.0955 8.97992 8.62472 11.5228 6.94032 14.5727C5.25593 17.6226 4.41944 21.0681 4.51787 24.5508C4.61629 28.0336 5.64603 31.4263 7.49999 34.3762L5.62499 42.375L13.6237 40.5C16.182 42.1113 19.0799 43.1056 22.0885 43.4045C25.0971 43.7033 28.134 43.2985 30.9593 42.222C33.7845 41.1455 36.3208 39.4267 38.3676 37.2015C40.4145 34.9764 41.9159 32.3057 42.7532 29.4006C43.5906 26.4954 43.7409 23.4354 43.1924 20.4622C42.6439 17.4889 41.4115 14.684 39.5926 12.2689C37.7738 9.85375 35.4182 7.89467 32.7121 6.54637C30.006 5.19808 27.0234 4.4975 24 4.49999Z"
fill="white" />
</g>
<defs>
<clipPath id="clip0_140_218">
<rect width="48" height="48" fill="white" />
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 292 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

BIN
public/membersLogo/GCC.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 232 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

BIN
public/membersLogo/Urbe.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 254 KiB

View file

@ -0,0 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40" fill="none">
<script xmlns="" id="eppiocemhmnlbhjplcgkofciiegomcon" />
<script xmlns="" />
<script xmlns="" />
<g clip-path="url(#clip0_291_2793)">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M19.7001 32.7386C19.7705 32.7792 19.8502 32.8001 19.9306 32.8001C20.0111 32.8001 20.188 32.7226 20.188 32.7226L30.85 26.581C30.8555 26.5783 30.8632 26.5744 30.8706 26.5702C30.942 26.5296 31.0002 26.4707 31.0406 26.4008C31.0819 26.3303 31.1036 26.25 31.1036 26.1685C31.1036 26.1588 31.1032 26.1499 31.1028 26.1432V13.8597C31.1036 13.8486 31.1036 13.8387 31.1036 13.8337L31.1036 13.8324C31.1036 13.7507 31.0818 13.671 31.0413 13.6009C31.0008 13.5302 30.9421 13.4718 30.872 13.4313C30.8644 13.4269 30.8564 13.4225 30.8484 13.4186L20.1868 7.27759C20.179 7.27231 20.1714 7.2677 20.165 7.26392L20.1644 7.26357C20.0937 7.22258 20.0136 7.20154 19.9325 7.20154H19.9306C19.8495 7.20154 19.77 7.22298 19.701 7.26236C19.692 7.26736 19.6837 7.2726 19.6762 7.27766L9.01204 13.4202C9.00655 13.423 8.99886 13.4269 8.99144 13.4311C8.92049 13.4717 8.86173 13.5311 8.82123 13.6011C8.78067 13.6712 8.75879 13.751 8.75879 13.8328C8.75879 13.8425 8.75919 13.8514 8.75956 13.858V26.1419C8.75876 26.153 8.75878 26.1629 8.75879 26.1679L8.75879 26.1693C8.75879 26.2509 8.78058 26.3312 8.82193 26.4019C8.86238 26.4712 8.92065 26.5297 8.98909 26.5693L8.99047 26.5701L8.99187 26.5709C9.00023 26.5755 9.00781 26.5793 9.01357 26.5822L19.6768 32.7242C19.6818 32.7275 19.6906 32.7333 19.7001 32.7386ZM30.8023 26.4503C30.7969 26.4534 30.7908 26.4564 30.7847 26.4595C30.788 26.4578 30.7915 26.4561 30.7946 26.4545C30.7973 26.4531 30.7999 26.4517 30.8023 26.4503ZM30.9649 26.1472C30.9651 26.1495 30.9652 26.152 30.9653 26.1545C30.9655 26.159 30.9657 26.1637 30.9657 26.1685C30.9657 26.167 30.9657 26.1655 30.9656 26.164C30.9655 26.1581 30.9652 26.1524 30.9649 26.1472ZM20.3983 26.9772L24.3592 29.2549L20.3951 31.538L20.3983 26.9772ZM15.5034 29.2548L19.4645 26.977L19.4676 31.538L15.5034 29.2548ZM25.7528 23.8924L29.7137 26.1701L25.7497 28.4532L25.7528 23.8924ZM20.3984 25.3628V20.8084L24.3514 23.0856L20.3984 25.3628ZM15.0439 22.2784V17.724L18.9969 20.0012L15.0439 22.2784ZM20.3984 19.1932V14.6389L24.3514 16.916L20.3984 19.1932ZM19.4649 13.0247L15.5038 10.7468L19.468 8.46363L19.4649 13.0247ZM10.1491 26.1701L14.1131 28.4532L14.11 23.8922L10.1491 26.1701ZM24.8194 23.8928L24.8225 28.4527L20.8658 26.1705L24.8194 23.8928ZM15.0438 23.8928L15.0406 28.4527L18.9974 26.1705L15.0438 23.8928ZM26.2198 23.0856L30.178 20.8025V25.3687L26.2198 23.0856ZM9.68483 20.8025V25.3687L13.643 23.0856L9.68483 20.8025ZM15.5111 23.085L19.4644 25.3624V20.8077L15.5111 23.085ZM29.7125 20.0004L25.7529 17.7227V22.2782L29.7125 20.0004ZM10.1503 20.0008L14.1099 22.2786V17.7231L10.1503 20.0008ZM24.8189 17.7233V22.278L20.8656 20.0006L24.8189 17.7233ZM30.178 14.6329V19.1992L26.2198 16.916L30.178 14.6329ZM13.643 16.916L9.68483 19.1992V14.6329L13.643 16.916ZM19.4644 14.6385V19.1928L15.5114 16.9157L19.4644 14.6385ZM29.7141 13.8315L25.7497 11.5482L25.7528 16.1095L29.7141 13.8315ZM14.1135 11.5484L14.1104 16.1095L10.1491 13.8315L14.1135 11.5484ZM24.8225 11.549L24.8194 16.1089L20.8658 13.8312L24.8225 11.549ZM18.9974 13.8312L15.0438 16.1089L15.0406 11.549L18.9974 13.8312ZM24.3596 10.7467L20.3951 8.46362L20.3983 13.0247L24.3596 10.7467Z"
fill="white" />
</g>
<defs>
<clipPath id="clip0_291_2793">
<rect width="40" height="40" fill="white" />
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
public/membersLogo/dyne.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View file

@ -0,0 +1,36 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Ebene_1" x="0px" y="0px" viewBox="0 0 249.3 113.4" style="enable-background:new 0 0 249.3 113.4;" xml:space="preserve"><script xmlns="" id="eppiocemhmnlbhjplcgkofciiegomcon"/><script xmlns=""/><script xmlns=""/>
<style type="text/css">
.st0{fill:#FFFFFF;}
.st1{fill:#1D1D1B;}
.st2{fill:url(#SVGID_1_);}
.st3{fill:url(#SVGID_2_);}
.st4{fill:url(#SVGID_3_);}
.st5{fill:url(#SVGID_4_);}
</style>
<g>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="38.1501" y1="84.9116" x2="38.1501" y2="22.0279">
<stop offset="0" style="stop-color:#0000B4"/>
<stop offset="9.090910e-03" style="stop-color:#0000B4"/>
<stop offset="1" style="stop-color:#000050"/>
</linearGradient>
<path class="st2" d="M46.4,24.6c-0.7-0.1-1.3-0.1-2-0.1c-4.9,0-9.7,2-14,5.8c-2,1.8-3.9,4-5.6,6.4c-0.3-9.3-0.8-19.2-1.8-29.3H10.5 c2.7,28.4,2.4,53.2,1.9,75h0c0,0,0,0.1,0,0.1h12.5c0.4-21.8,5.8-35.8,13.9-43c2.2-1.9,4.3-2.8,6.2-2.6c9.9,1.1,8.3,31.9,7.6,45.6 h12.5c0.5-10.1,1.1-22.4-0.3-33C62.8,34,56.5,25.7,46.4,24.6z"/>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="158.5772" y1="84.9116" x2="158.5772" y2="22.0279">
<stop offset="0" style="stop-color:#0000B4"/>
<stop offset="9.090910e-03" style="stop-color:#0000B4"/>
<stop offset="1" style="stop-color:#000050"/>
</linearGradient>
<path class="st3" d="M174.2,26.5c-3-1.4-6.2-2.1-9.4-2.1c-3.3,0-6.6,0.7-9.9,2.2c-9,4.1-16.5,13.5-20,25.2c-5.4,18-5.1,39.6-5,53.9 c0,0.4,0,0.7,0,1.1h12.5c0-0.4,0-0.8,0-1.2c-0.1-13.5-0.4-34,4.5-50.2c2.4-8.2,7.5-14.8,13.2-17.4c3.1-1.4,6.1-1.4,8.8-0.2 c2.9,1.4,4.4,4.3,5,6.6c1.6,5.2,0.8,11.5-2.1,16c-4.5,7.3-10.7,9.9-22.1,9.6l0,12.4c12,0.1,25.1-2.7,32.8-15.5 c4.6-7.6,6-17.6,3.4-26.2C184,34.2,179.8,29.1,174.2,26.5z"/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="99.3556" y1="84.9116" x2="99.3556" y2="22.0279">
<stop offset="0" style="stop-color:#0000B4"/>
<stop offset="9.090910e-03" style="stop-color:#0000B4"/>
<stop offset="1" style="stop-color:#000050"/>
</linearGradient>
<path class="st4" d="M99.4,24.1c-16.1,0-29.1,13.4-29.1,29.9c0,16.5,13.1,29.9,29.1,29.9c16.1,0,29.1-13.4,29.1-29.9 C128.5,37.5,115.4,24.1,99.4,24.1z M99.4,71.4c-9.2,0-16.6-7.8-16.6-17.4c0-9.6,7.4-17.4,16.6-17.4c9.2,0,16.6,7.8,16.6,17.4 C116,63.6,108.5,71.4,99.4,71.4z"/>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="215.3602" y1="84.9116" x2="215.3602" y2="22.0279">
<stop offset="0" style="stop-color:#0000B4"/>
<stop offset="9.090910e-03" style="stop-color:#0000B4"/>
<stop offset="1" style="stop-color:#000050"/>
</linearGradient>
<path class="st5" d="M220.5,24.1c-4.6,0-8.8,1.7-12.5,5.1c-1.4,1.3-2.7,2.8-3.9,4.4c-0.3-2.6-0.6-5.3-0.9-8.1h-12.6 c3,22.3,2.7,40.7,2.5,52c0,1.7-0.1,3.2-0.1,4.5c0,0.1,0,0.2,0,0.4h0h12.5c0.1-8.4,0.4-15.1,2.3-25.3C209.7,47,215.3,36,221,36.6 c4.5,0.4,6,5.8,6.5,10.8h12.6C239.4,32.4,230.9,24.1,220.5,24.1z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

View file

@ -0,0 +1,21 @@
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40" fill="none">
<script xmlns="" id="eppiocemhmnlbhjplcgkofciiegomcon" />
<script xmlns="" />
<script xmlns="" />
<g clip-path="url(#clip0_291_2790)">
<path
d="M31.0278 33.2414H8.30322V19.5073H31.0064L31.0278 33.2414ZM19.6404 20.6091C17.7008 20.6111 15.7917 21.0823 14.0826 21.9809C12.3735 22.8795 10.9172 24.1777 9.84302 25.7603C9.70091 25.921 9.62269 26.1266 9.62269 26.3392C9.62269 26.5519 9.70091 26.7575 9.84302 26.9182C10.9241 28.4935 12.3831 29.7847 14.0922 30.6786C15.8012 31.5725 17.708 32.0418 19.6453 32.0453C21.5825 32.0487 23.4911 31.5863 25.2034 30.6985C26.9158 29.8107 28.3796 28.5247 29.4665 26.9533C29.6216 26.7835 29.7073 26.5636 29.7073 26.3357C29.7073 26.1079 29.6216 25.888 29.4665 25.7181C28.3826 24.142 26.919 22.852 25.2051 21.9621C23.4913 21.0722 21.58 20.6099 19.6404 20.6161V20.6091Z"
fill="white" />
<path
d="M19.7049 18.223C17.7777 18.2192 15.8802 17.7575 14.175 16.8774C12.4699 15.9974 11.008 14.7252 9.91466 13.1701C9.73237 12.9801 9.63088 12.7291 9.63088 12.4683C9.63088 12.2075 9.73237 11.9565 9.91466 11.7665C11.0074 10.2141 12.4702 8.94656 14.1763 8.07387C15.8823 7.20118 17.78 6.74975 19.7044 6.75874C21.6289 6.76773 23.5221 7.23688 25.2196 8.12546C26.917 9.01405 28.3675 10.2952 29.4451 11.8577C29.5996 12.0264 29.685 12.2451 29.685 12.4718C29.685 12.6985 29.5996 12.9171 29.4451 13.0858C28.3688 14.6523 26.9197 15.9386 25.2227 16.8336C23.5258 17.7286 21.632 18.2055 19.7049 18.223ZM23.9448 12.5384C23.9647 11.7017 23.7297 10.8782 23.2698 10.1729C22.8099 9.46765 22.146 8.9127 21.3627 8.57888C20.5795 8.24506 19.7125 8.14752 18.8725 8.29873C18.0324 8.44994 17.2574 8.84303 16.6463 9.42781C16.0353 10.0126 15.616 10.7625 15.4419 11.5819C15.2678 12.4013 15.3469 13.2529 15.6689 14.0281C15.991 14.8032 16.5415 15.4667 17.2502 15.9339C17.9589 16.4011 18.7935 16.6507 19.6476 16.651C20.7701 16.6513 21.8482 16.2211 22.6513 15.4526C23.4543 14.684 23.9186 13.6381 23.9448 12.5384Z"
fill="white" />
<path
d="M19.6618 30.4832C18.8289 30.4694 18.0189 30.2146 17.3333 29.751C16.6478 29.2874 16.1173 28.6356 15.8087 27.8775C15.5001 27.1194 15.4269 26.2888 15.5986 25.4901C15.7702 24.6914 16.1789 23.9602 16.7733 23.3884C17.3677 22.8166 18.1213 22.4298 18.9394 22.2764C19.7576 22.123 20.6037 22.21 21.3715 22.5264C22.1393 22.8429 22.7946 23.3746 23.2549 24.0548C23.7153 24.735 23.9602 25.5334 23.9589 26.3496C23.9571 26.8985 23.8441 27.4415 23.6265 27.9472C23.4089 28.453 23.0911 28.9114 22.6914 29.2959C22.2917 29.6804 21.8181 29.9833 21.298 30.1871C20.778 30.3909 20.2218 30.4916 19.6618 30.4832Z"
fill="white" />
</g>
<defs>
<clipPath id="clip0_291_2790">
<rect width="40" height="40" fill="white" />
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 170 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

4716
public/membersLogo/nomos.svg Normal file

File diff suppressed because it is too large Load diff

After

Width:  |  Height:  |  Size: 703 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 618 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

BIN
public/review.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View file

@ -0,0 +1,105 @@
function applyScrambleEffect() {
const glitchTextOnceElements = document.querySelectorAll('.glitch-text');
const glitchTextRepeatElements = document.querySelectorAll('.glitch-text-interval');
const glitchTextHoverElements = document.querySelectorAll('.glitch-text-hover');
const charset = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
function animateScramble(element, text, duration = 1000) {
const chars = [];
element.innerHTML = '';
const preScrambleWidth = element.offsetWidth;
element.style.width = `${preScrambleWidth}px`;
for (let t = 0; t < text.length; t++) {
const span = document.createElement('span');
span.innerHTML = text[t] === ' ' ? '&nbsp;' : text[t];
chars[t] = span;
span.style.display = 'inline-block';
element.appendChild(span);
}
const rand = Math.random;
const SECONDS = 1000;
const FPS = 30;
const animationLength = duration;
function animate3(k) {
const kk = k * text.length;
for (let i = 0; i < text.length; i++) {
if (kk < i) {
chars[i].innerHTML = charset[Math.floor(rand() * charset.length)];
} else {
chars[i].innerHTML = text[i] === ' ' ? '&nbsp;' : text[i];
}
}
}
let start = Date.now();
function animate() {
const current = Date.now();
const time = current - start;
const k = time / animationLength;
if (k < 1) {
setTimeout(animate, SECONDS / FPS);
animate3(k);
} else {
for (let i = 0; i < text.length; i++) {
chars[i].innerHTML = text[i] === ' ' ? '&nbsp;' : text[i];
}
element.style.width = 'auto';
element.isAnimating = false;
}
}
animate();
}
// Use IntersectionObserver for once-only animation
const observer = new IntersectionObserver((entries, observer) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const element = entry.target;
const text = element.innerText;
animateScramble(element, text);
observer.unobserve(element);
}
});
}, {
threshold: 0.1
});
glitchTextOnceElements.forEach((element) => {
observer.observe(element);
});
glitchTextRepeatElements.forEach((element) => {
const text = element.innerText;
animateScramble(element, text);
const intervalId = setInterval(() => {
if (!element.isAnimating) {
animateScramble(element, text);
}
}, 5000);
});
// Hover functionality for `.glitch-text-hover` elements
glitchTextHoverElements.forEach((element) => {
const text = element.innerText;
element.addEventListener('mouseenter', () => {
// Only start the animation if it isn't already in progress
if (!element.isAnimating) {
element.isAnimating = true;
animateScramble(element, text, 800);
}
});
// No need for 'mouseleave' as the animation will complete even if the mouse leaves
});
}
document.addEventListener('DOMContentLoaded', applyScrambleEffect);

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View file

@ -2,114 +2,157 @@
import * as config from "../config.yaml";
import core from "../core.json";
import contributors from "../contributors.json";
import { getPersonByGH } from "../lib/core.js";
import PeopleCarousel from "../components/PeopleCarousel.astro";
import SpeakerGrid from "./SpeakerGrid.astro";
import SliderTestimonial from "./SliderTestimonial.astro";
import MembersGrid from "./MembersGrid.astro";
import { fade } from "astro:transitions";
function findPerson(src) {
const p = core.people.find((p) =>
src.refs?.twitter
? p.refs?.twitter === src.refs.twitter
: src.refs?.bsky
? p.refs.bsky === src.refs.bsky
: {}
);
if (p) {
p.ct = src;
}
return p;
}
// Accept sectionsConfig as a prop
const {
sectionsConfig = [
{ name: "community", visible: true, order: 1 },
{ name: "socialLinks", visible: true, order: 2 },
{ name: "speakers", visible: true, order: 3 },
{ name: "core contributors", visible: true, order: 4 },
{ name: "contributors", visible: true, order: 5 },
{ name: "testimonials", visible: true, order: 6 },
{ name: "membersGrid", visible: true, order: 7 },
{ name: "communityPartners", visible: true, order: 8 },
],
} = Astro.props;
function personLink(person) {
return person.refs?.twitter
? `https://twitter.com/${person.refs.twitter}`
: person.refs?.bsky
? `https://bsky.app/profile/${person.refs.bsky}`
: "#";
}
// Function to sort sections by order
const sortedSections = sectionsConfig
.filter((section) => section.visible)
.sort((a, b) => a.order - b.order);
---
<!-- <div class="mt-20">
<h1><a href="https://docs.web3privacy.info/follow-us">Follow us</a></h1>
<div class="w3pn-wgrid">
{config.landing.follow.map((item) => (
<a href={item.url || core.links[item.link]} target="_blank">
<span><span class="icon" class:list={[item.ico || ""]}></span></span>
<span class="title">{item.name}</span>
<span>{item.text}</span>
{
sortedSections.map((section) => (
<div>
{section.name === "community" && (
<div class="middle-pane-medium mt-16">
<h1>
<a
class="glitch-text"
href="https://docs.web3privacy.info/get-involved"
>
Join the Community
</a>
))}
</div>
</div>
<div class="mt-10">
<h1><a href="https://docs.web3privacy.info/communication">Coordination</a></h1>
<div class="w3pn-wgrid">
{config.landing.coord.map((item) => (
<a href={item.url || core.links[item.link]} target="_blank">
<span><span class="icon" class:list={[item.ico || ""]}></span></span>
<span class="title">{item.name}</span>
<span>{item.text}</span>
</a>
))}
</div>
</div> -->
<div class="mt-16">
<h1>
<a href="https://docs.web3privacy.info/get-involved">Join the Community</a>
</h1>
<div>{config.landing.community}</div>
</h1>
<div>{config.landing.community}</div>
</div>
)}
<h2 class="my-6">Speakers</h2>
<div class="flex gap-3 flex-wrap items-center">
{
core.people
.filter((p) => !core.teams["core-team"].includes(p.id))
.filter((p) => p.imageUrl)
.map((person) => (
<div>
<a href={personLink(person)}>
<img
src={person.imageUrl}
title={person.name}
class="w-14 rounded-full aspect-square"
/>
</a>
</div>
))
}
</div>
<div class="flex gap-3 lg:gap-6 pt-4 flex-wrap mt-4 mb-14">
<a href={core.links.cfp} class="button inverted"
><button>Submit your proposal (CfP)</button></a
>
</div>
<h2 class="my-6">Git Contributors</h2>
<div class="flex gap-3 flex-wrap mb-4 items-center">
{
// filter(p => !core.teams['core-team'].includes(getPersonByGH(p.login)?.id))
contributors.items.map((contrib) => (
<div>
<a href={contrib.html_url} target="_blank" title={contrib.login}>
<img
src={contrib.avatar_url}
class="w-14 rounded-full aspect-square"
/>
{section.name === "socialLinks" && (
<div class=" middle-pane-big grid place-items-center grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-2 pt-4 w-full">
<a
href={core.links.twitter}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon twitter" />
@web3privacy
</button>
</a>
<a
href={core.links.telegram}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon telegram" />
Telegram
</button>
</a>
<a
href={core.links.signal}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon">
<img src="/icons/signal.svg" alt="" />
</div>
Signal
</button>
</a>
<a
href={core.links.matrix}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon matrix" />
matrix
</button>
</a>
</div>
))
}
</div>
)}
<div class="flex gap-4 lg:gap-6 pt-4 flex-wrap">
<a href={core.links.telegram} class="button inverted"
><button>Telegram</button></a
>
<a href={core.links.signal} class="button inverted"
><button>Signal</button></a
>
<a href={core.links.matrix} class="button inverted"
><button>matrix hub</button></a
>
</div>
</div>
{section.name === "speakers" && (
<div class="middle-pane-medium mt-16">
<h1 class="my-6 glitch-text ">Speakers</h1>
<SpeakerGrid
people={core.people}
team={core.teams["core-speakers"]}
core={true}
/>
</div>
)}
{section.name === "core contributors" && (
<div class="middle-pane-medium mt-16">
<h1 class="my-6 glitch-text">Core Contributors</h1>
<SpeakerGrid
people={core.people}
team={core.teams["core-contributors"]}
core={false}
/>
</div>
)}
{section.name === "contributors" && (
<div class="middle-pane-medium">
<h1 class="my-6 glitch-text">Contributors</h1>
<div class="flex gap-3 flex-wrap mb-4 items-center justify-center md:justify-start">
{contributors.items.map((contrib) => (
<div>
<a
href={contrib.html_url}
target="_blank"
title={contrib.login}
>
<img
src={contrib.avatar_url}
class="w-6 md:w-14 rounded-full aspect-square"
/>
</a>
</div>
))}
</div>
<div class="flex gap-4 lg:gap-6 pt-4 flex-wrap">
<a href={core.links.telegram} class="button inverted">
<button>Become a Contributor</button>
</a>
</div>
</div>
)}
{section.name === "testimonials" && (
<div class="middle-pane-medium">
<h1 class="my-6 mt-16 glitch-text">
What People Have To Say About US
</h1>
<SliderTestimonial />
</div>
)}
{section.name === "membersGrid" && (
<div class="mx-4 mt-16">
<h1 class="my-6 middle-pane-medium glitch-text">Members</h1>
<div class="middle-pane-medium">
<MembersGrid people={core.people} team={core.teams["members"]} core={false} />
</div>
</div>
)}
</div>
))
}

View file

@ -14,7 +14,7 @@ const { title, subtext, variant = "primary" } = Astro.props;
}`}
>
<span
class={`absolute bg-black z-10 top-[-20px] px-[12px] uppercase text-[1rem] ${variant === "secondary" ? "text-[#909090]" : "text-white"} font-bold`}
class={`absolute bg-black z-10 top-[-20px] px-[12px] uppercase text-[0.8rem] md:text-[1rem] ${variant === "secondary" ? "text-[#909090]" : "text-white"} font-bold`}
>
{title}
</span>

View file

@ -2,236 +2,110 @@
import AboutItem from "../components/AboutItem.astro";
---
<div>
<AboutItem
title="AUDIENCES"
subtext="For all of them we are building private platform to discuss and build privavy tooling and research"
>
<div class="w-full grid grid-cols-2">
<div class="flex flex-col gap-[8px] text-white font-bold">
<span> General public </span>
<span> Projects </span>
<span> Startupers</span>
</div>
<div class="flex flex-col gap-[8px] text-white font-bold">
<span> Developers </span>
<span> Audit companies </span>
<span> Investors</span>
</div>
<AboutItem title="RESEARCH" subtext="">
<div class="w-full">
<div class="flex flex-col gap-[8px]">
<p>
We cultivate and foster a culture of privacy in web3 making data free
and public.
</p>
<p>
Check our annual reports, infographics, privacy awards, newsletter, and
guidelines.
</p>
<a class="button inverted"><button>web3privacy Research</button></a>
</div>
</AboutItem>
<AboutItem
title="PLATFORM"
subtext="We need to create activation points, that will push community around privacy forward and establish new connections"
>
<div class="flex flex-col gap-[8px] items-start">
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/query_stats.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span
class="font-bold text-white leading-[1rem] w-full max-w-[110px]"
>
Market stats
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full">
Like Crunchbase, but free forever
</span>
</div>
</div>
</div>
</AboutItem>
<AboutItem title="PROJECTS & TOOLS PRODUCTION" subtext="">
<p class="mb-5">
By developing free and open tools, <br /> we empower people to make informed
decisions:
</p>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/star_half.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span
class="font-bold text-white leading-[1rem] w-full max-w-[140px]"
>
Privacy Ranking
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full">
Scoring and review of current privacy projects
</span>
<div class="flex flex-col gap-5">
<div class="flex gap-[12px] md:items-center items-start w-full">
<div class="flex flex-row space-x-5 w-full">
<div>
<img src="/icons/database.svg" class="inline-block" />
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/school.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit max-w-[140px]">
Academy
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full"
>Education for general public how to reach privacy
</span>
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/experiment.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit max-w-[140px]">
Research
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full">
Anual reports, Frameworks, Tools, Books
</span>
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/database.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit max-w-[140px]">
Data
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full"
<div>
<div class="flex items-center flex-nowrap space-x-5">
<a href="">
PRIVACY EXPLORER
<span
class="font-bold text-white underline"
style="text-underline-offset: 4px;"
>
</span>
</a>
</div>
<span class="text-[0.8rem] md:text-[1rem] mt-0 w-full"
>For Projects, Use-case list, Market & Funding info
</span>
</div>
</div>
</div>
</AboutItem>
<AboutItem
title="ACTIVATIONS"
subtext="With all of that we want to focus everybody more in web3 related privacy issues, those are our estimates and long-term goals"
>
<div class="flex flex-col gap-[8px] items-start">
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/visibility_lock.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit">
Advocacy
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full">
Branding “decentralization = privacy”
</span>
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/calendar_today.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit">
Events
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full">
Meetups, Summits, Hackathons, Camps
</span>
<div class="flex gap-[12px] md:items-center items-start w-full">
<div class="flex flex-row space-x-5 w-full">
<div>
<img src="/icons/experiment.svg" class="inline-block" />
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/group_work.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span
class="font-bold text-white leading-[1rem] w-full max-w-[220px]"
>
Ecosystems collaboration
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full"> Networks, Alliances, Media </span>
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/encrypted.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit max-w-[140px]">
Standartisation
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full">
Privacy-features, security audit (example)
</span>
</div>
</div>
<div class="flex gap-[12px] md:items-center items-start w-full">
<img src="/icons/local_florist.svg" class="inline-block" />
<div
class="flex md:flex-row flex-col md:items-center md:gap-[12px] w-full"
>
<span class="font-bold text-white leading-[1rem] w-fit max-w-[140px]">
Incubation
</span>
<span class="md:block hidden">-</span>
<span class="text-[1rem] w-full"
>Product managers facilitation, Business sustainability
<div>
<div class="flex items-center flex-nowrap space-x-5">
<span
class="font-bold text-white underline"
style="text-underline-offset: 4px;"
>
HACKATHON IDEA GENERATOR
</span>
</div>
<span class="text-[0.8rem] md:text-[1rem] mt-0 w-full"
>Helps developers build applications that address real-world
problems, that people will actually use.
</span>
</div>
</div>
</div>
</AboutItem>
<AboutItem variant="secondary" title="GOALS">
<div class="flex md:flex-row flex-col gap-[32px]">
<div class="flex flex-col gap-[16px]">
<div class="flex flex-col gap-[4px]">
<span class="font-bold text-white my-2 leading-[1rem] uppercase">
GENERAL PUBLIC
</span>
<ul class="list-decimal ml-[18px]">
<li>Milions of educated users</li>
<li>Higher privacy culture</li>
</ul>
<div class="flex gap-[12px] md:items-center items-start w-full">
<div class="flex flex-row space-x-5 w-full">
<div>
<img src="/icons/local_florist.svg" class="inline-block" />
</div>
<div class="flex flex-col gap-[4px]">
<span class="font-bold text-white my-2 leading-[1rem] uppercase">
PROJECTS
<div>
<div class="flex items-center flex-nowrap space-x-5">
<span
class="font-bold text-white underline"
style="text-underline-offset: 4px;"
>
WEEK IN PRIVACY
</span>
</div>
<span class="text-[1rem] mt-0 w-full"
>Weekly newsletter with round-up of the most important news
happening around privacy in Web3
</span>
<ul class="list-decimal ml-[18px]">
<li>Better privacy features</li>
<li>New use-cases</li>
<li>Efficient demos</li>
</ul>
</div>
<div class="flex flex-col gap-[4px]">
<span class="font-bold text-white my-2 leading-[1rem] uppercase">
SECURITY AUDIT COMPANIES
</span>
<ul class="list-decimal ml-[18px]">
<li>New “privacy audit” category</li>
<li>Significant growth of audited projects.</li>
</ul>
</div>
</div>
<div class="flex flex-col gap-[16px]">
<div class="flex flex-col gap-[4px]">
<span class="font-bold text-white mb-2 mt-0 leading-[1rem] uppercase">
DEVELOPERS
</span>
<ul class="list-decimal ml-[18px] w-full">
<li>More devs building privacy</li>
<li>More sustainable projects.</li>
</ul>
</div>
<div class="flex flex-col gap-[4px] w-full">
<span class="font-bold text-white my-2 leading-[1rem] uppercase">
STARTUPERS
</span>
<ul class="list-decimal ml-[18px]">
<li>More privacy-oriented projects</li>
<li>Longer runway</li>
</ul>
</div>
</div>
</div>
</AboutItem>
</div>
</div>
</AboutItem>
<AboutItem title="EDUCATION" subtext="">
<div class="w-full">
<div class="flex flex-col gap-[8px]">
<p>
We make privacy accessible for everyone, empowering people to learn and
implement best practices effectively.
</p>
<p>
From mentoring at hackathons, guidelines for developers, and the
Cypherpunk Academy - we offer training, incubation, and acceleration
programs.
</p>
<a class="button inverted"><button>Privacy Academy</button></a>
</div>
</div>
</AboutItem>

View file

@ -3,7 +3,7 @@ const { item } = Astro.props;
import { marked } from 'marked';
import EventsExt from '../events-ext.json';
import core from "../core.json";
import { dateFormat, dateInfo, dateEnd, nameRenderer, ccRenderer, eventStatus, getSpeaker, findExt, getEventPoster } from '../lib/events.js';
import { dateFormat, dateEnd, nameRenderer, ccRenderer, eventStatus, getSpeaker, findExt, getEventPoster } from '../lib/events.js';
import SpeakerList from './SpeakerList.astro';
import PeopleCarousel from './PeopleCarousel.astro';
@ -71,7 +71,7 @@ const eventPoster = getEventPoster(item)
}
{/*<div class="text-sm"></div>*/}
{item.links?.rsvp &&
<a href={item.links?.rsvp} class="button inverted"><button>Join</button></a>
<a href={item.links?.rsvp} class="button inverted border-2"><button>Join</button></a>
}
</div>

View file

@ -0,0 +1,147 @@
---
const {
images = [
{ webp: "/events/masonry/1.webp", png: "/events/masonry/1.png" },
{ webp: "/events/masonry/2.webp", png: "/events/masonry/2.png" },
{ webp: "/events/masonry/3.webp", png: "/events/masonry/3.png" },
{ webp: "/events/masonry/4.webp", png: "/events/masonry/4.png" },
{ webp: "/events/masonry/5.webp", png: "/events/masonry/5.png" },
{ webp: "/events/masonry/6.webp", png: "/events/masonry/6.png" },
{ webp: "/events/masonry/7.webp", png: "/events/masonry/7.png" },
{ webp: "/events/masonry/8.webp", png: "/events/masonry/8.png" },
{ webp: "/events/masonry/9.webp", png: "/events/masonry/9.png" },
],
} = Astro.props;
---
<!-- Display gallery with webp images -->
<div
class="middle-pane-big grid grid-cols-2 lg:flex lg:flex-nowrap gap-2 md:gap-[3px] pb-2 md:pb-0"
>
{
images.slice(0, 4).map((image, index) => (
<div class="flex-auto overflow-hidden">
<img
class="object-cover w-full max-h-[75px] md:max-h-[200px] cursor-pointer gallery-image"
src={image.webp}
alt={`Image ${index + 1}`}
data-index={index}
/>
</div>
))
}
</div>
<div
class="middle-pane-big grid grid-cols-2 lg:flex lg:flex-nowrap gap-2 md:gap-[3px]"
>
{
images.slice(4).map((image, index) => (
<div class="flex-auto overflow-hidden">
<img
class="object-cover w-full max-h-[75px] md:max-h-[200px] cursor-pointer gallery-image"
src={image.webp}
alt={`Image ${index + 5}`}
data-index={index + 4}
/>
</div>
))
}
</div>
<!-- Modal for fullscreen images -->
<div
class="image-modal hidden fixed inset-0 bg-black flex-col flex items-center justify-center z-50"
>
<div class="relative modal-content">
<button class="absolute top-6 right-0 text-white close-modal z-100"
></button>
</div>
<div class="flex flex-col" style="width: 54vw; height: 60vh;">
<img
class="w-full h-full object-contain modal-image"
src=""
alt="Selected Image"
loading="lazy"
/>
</div>
<div class="flex overflow-x-auto gap-3 mt-4 thumbnails">
{
images.map((image, index) => (
<img
class="w-24 h-24 object-contain cursor-pointer thumbnail-image"
src={image.webp}
alt={`Thumbnail ${index + 1}`}
data-index={index}
/>
))
}
</div>
</div>
<script>
let selectedIndex = 0;
const images = [
{ webp: "/events/masonry/1.webp", png: "/events/masonry/1.png" },
{ webp: "/events/masonry/2.webp", png: "/events/masonry/2.png" },
{ webp: "/events/masonry/3.webp", png: "/events/masonry/3.png" },
{ webp: "/events/masonry/4.webp", png: "/events/masonry/4.png" },
{ webp: "/events/masonry/5.webp", png: "/events/masonry/5.png" },
{ webp: "/events/masonry/6.webp", png: "/events/masonry/6.png" },
{ webp: "/events/masonry/7.webp", png: "/events/masonry/7.png" },
{ webp: "/events/masonry/8.webp", png: "/events/masonry/8.png" },
{ webp: "/events/masonry/9.webp", png: "/events/masonry/9.png" },
];
function openModal(index) {
selectedIndex = index;
updateModalImage();
document.querySelector(".image-modal").classList.remove("hidden");
}
function closeModal() {
document.querySelector(".image-modal").classList.add("hidden");
}
function updateModalImage() {
const imageSrc = images[selectedIndex].png;
document.querySelector(".modal-image").src = imageSrc;
}
function showNextImage() {
selectedIndex = (selectedIndex + 1) % images.length;
updateModalImage();
}
function showPrevImage() {
selectedIndex = (selectedIndex - 1 + images.length) % images.length;
updateModalImage();
}
document.querySelectorAll(".gallery-image").forEach((image) => {
image.addEventListener("click", (event) => {
const index = event.target.getAttribute("data-index");
openModal(Number(index));
});
});
document.querySelector(".close-modal").addEventListener("click", closeModal);
document.querySelector(".image-modal").addEventListener("click", (event) => {
if (event.target === document.querySelector(".image-modal")) closeModal();
});
document.querySelectorAll(".thumbnail-image").forEach((thumbnail) => {
thumbnail.addEventListener("click", (event) => {
const index = event.target.getAttribute("data-index");
openModal(Number(index));
});
});
document.addEventListener("keydown", (event) => {
if (event.key === "ArrowRight") showNextImage();
if (event.key === "ArrowLeft") showPrevImage();
if (event.key === "Escape") closeModal();
});
</script>

View file

@ -0,0 +1,61 @@
---
const { team, people, core } = Astro.props;
const filteredPeople = core
? people.filter((p) => !team.includes(p.id)).filter((p) => p.imageUrl)
: team;
// Limit the number of members to 12 (2 rows with a max of 6 columns each)
const limitedPeople = filteredPeople.slice(0, 12);
function personLink(person) {
if (person.refs?.twitter) {
return `https://twitter.com/${person.refs.twitter}`;
} else if (person.refs?.bsky) {
return `https://bsky.app/profile/${person.refs.bsky}`;
} else if (person.refs?.linkedin) {
return `https://www.linkedin.com/in/${person.refs.linkedin}`;
} else if (person.refs?.github) {
return `https://github.com/${person.refs.github}`;
} else if (person.refs?.matrix) {
return `https://matrix.to/#/${person.refs.matrix}`;
} else if (person.refs?.email) {
return `mailto:${person.refs.email}`;
} else {
return "#";
}
}
---
<div
class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-2 gap-y-10 md:gap-y-2 mb-6"
>
{
limitedPeople.map((person) => (
<div
class={`partner-item ${core ? "person-item" : ""} text-center items-center p-2`}
>
<a href={personLink(person)} class={`${core ? "person-item" : ""}`}>
<img
src={person.imageUrl}
alt={person.name}
class="partner-img h-24 md:h-48 aspect-[16/11] w-full h-full object-contain p-0 "
/>
</a>
<div class="p-2 partner-text">
<h3 class="text-xs md:text-lg font-bold leading-6">{person.name}</h3>
{person.refs && (
<p class="text-xs md:text-sm text-gray-500">
{person.refs.twitter && `@${person.refs.twitter}`}
{person.refs.bsky && ` | bsky: ${person.refs.bsky}`}
{person.refs.linkedin && ` | LinkedIn: ${person.refs.linkedin}`}
{person.refs.github && ` | GitHub: ${person.refs.github}`}
{person.refs.matrix && ` | Matrix: ${person.refs.matrix}`}
{person.refs.email && ` | Email: ${person.refs.email}`}
</p>
)}
</div>
</div>
))
}
</div>

View file

@ -0,0 +1,165 @@
<div class="flex flex-col md:flex-row gap-8">
<div class="flex flex-col h-full">
<div class="bg-white px-[16px] text-black">
<h3 style="color:black !important" class="pb-[3px]">SPONSORSHIP</h3>
</div>
<div class="border-4 h-full border-white w-full">
<div
class="w-full h-full md:border-x-4 md:border-b-4 border-l-0 md:border-b-0 border-b-4 border-white"
>
<div
class="flex flex-col h-full justify-between p-4 px-6 z-[10] relative"
>
<div class="flex flex-col mb-4">
<p>
Sponsors are our value-aligned partners who help us maintain
financial sustainability. They support our mission by contributing
to all our activities, whether it's a research project, an event,
a merchandise release.
</p>
</div>
<div class="flex flex-col z-[10] mb-6">
<span class="text-white font-bold text-[18px]"> 2024 </span>
<ul class="text-white">
<a href="/" class="underline" style="text-underline-offset: 4px;">
<li>Privacy Scaling Exploration</li></a
>
<a href="/" class="underline" style="text-underline-offset: 4px;">
<li>Ethereum</li></a
>
<a href="/" class="underline" style="text-underline-offset: 4px;">
<li>Foundation</li></a
>
<a href="/" class="underline" style="text-underline-offset: 4px;">
<li>Railgun</li></a
>
<a href="/" class="underline" style="text-underline-offset: 4px;">
<li>Payy</li></a
>
</ul>
</div>
<div class="flex flex-col z-[10] mb-8">
<span class="text-white font-bold text-[18px] leading-[1.4rem]">
2023
</span>
<p class="text-white leading-widest">
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>Zcash</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>Firo</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>Firn</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"
><span>Privacy Scaling Exploration</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>Railgun</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>ENS</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"
><span>Navio (ex Navcoin)</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>Panther</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"
><span>AragonTKResearch</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"
><span>Secret Network</span></a
> /
<a
href="#"
class="hover:underline"
style="text-underline-offset: 4px;"><span>Waku</span></a
>
</p>
</div>
<a class="button inverted"><button>BECOME A SPONSOR</button></a>
</div>
</div>
</div>
</div>
<div class="flex flex-col justify-between gap-8">
<div class="flex-1">
<div class="bg-white w-full px-[16px] text-black">
<h3 style="color:black !important" class="pb-[3px]">DONATE</h3>
</div>
<div class="border-4 border-white w-full">
<div
class="w-full md:border-x-4 md:border-b-4 border-l-0 md:border-b-0 border-b-4 border-white p-4"
>
<div class="flex flex-col h-full justify-between z-[10]">
<div class="flex flex-col my-4">
<p>
Our diverse array of research, projects development, events and
tools production is all offered freely, fueled by people and
organizations who care about digital privacy.
</p>
<p class="text-white my-2">
<strong
>Support our independence, help us to advocate for freedom</strong
>
</p>
</div>
<a class="button inverted"><button>DONATE</button></a>
</div>
</div>
</div>
</div>
<div class="">
<div class="bg-white w-full px-[16px] text-black">
<h3 style="color:black !important" class="pb-[3px]">
SPEAK at our events
</h3>
</div>
<div class="border-4 border-white w-full">
<div
class="w-full md:border-x-4 md:border-b-4 border-l-0 md:border-b-0 border-b-4 border-white p-4"
>
<div class="flex flex-col justify-between gap-10 z-[10]">
<div class="flex flex-col my-4">
<p>
At Web3Privacy Now, we are dedicated to fostering growth,
innovation, and collaboration. We offer a supportive environment
where like-minded individuals come together to share knowledge,
spark creativity, and drive positive change.
</p>
</div>
</div>
<a class="button inverted"><button>Become a speaker</button></a>
</div>
</div>
</div>
</div>
</div>

View file

@ -0,0 +1,163 @@
---
import core from "../core.json";
---
<div class="flex flex-col md:flex-row gap-8">
<div>
<div class="bg-white w-full px-[16px] text-black">
<h3 style="color:black !important" class="pb-[3px] pt-2">INDIVIDUAL</h3>
</div>
<div class="border-4 h-full border-white w-full">
<div
class="w-full h-full md:border-x-4 md:border-b-4 border-l-0 md:border-b-0 border-b-4 border-white"
>
<div class="flex flex-col h-full justify-between px-6 z-[10] relative">
<div class="flex flex-col my-4">
<p>
For members who want to be more involved in the governance of our
initiative, we offer the opportunity to participate in the
decisions and voting on our plans and other topics.
</p>
<div class="flex flex-col gap-[16px] md:p-[24px] z-[10]">
<span class="text-white font-bold text-[18px] leading-[1.4rem]">
Benefits
</span>
<ul class="list-disc ml-[18px] text-white">
<li>You are supporting a good thing!</li>
<li>Guaranteed access to all our events</li>
<li>Privacy Swag Pack</li>
<li>Deals from our partners</li>
</ul>
</div>
</div>
<div
class="flex relative w-full md:justify-between md:flex-row flex-col gap-[8px] md:items-end"
>
<div
class="flex flex-col justify-end h-full gap-4 mb-4 md:mb-8 z-50"
>
<span>Price</span>
<span
class="text-white font-bold text-lg md:text-[24px] leading-[1.4rem]"
>
€100 / Year
</span>
<a class="button inverted" href={core.links.individual}
><button>BECOME A MEMBER</button></a
>
<p class="max-w-72 text-sm">
After making your donation, kindly <span class="underline"
>send us</span
> the tx hash, your T-shirt size, and let us know if you would like
your membership to be public or kept private.
</p>
</div>
<img
src="/about/image1.png"
alt=""
class="absolute hidden md:block right-0 bottom-0 md:w-[280px] md:h-auto opacity-30"
/>
</div>
</div>
</div>
</div>
</div>
<div>
<div class="bg-white w-full px-[16px] text-black">
<h3 style="color:black !important" class="pb-[3px] pt-2">
Organisations
</h3>
</div>
<div class="border-4 h-full border-white w-full">
<div
class="w-full h-full md:border-x-4 md:border-b-4 border-l-0 md:border-b-0 border-b-4 border-white"
>
<div class="flex flex-col h-full justify-between px-6 z-[10] relative">
<div class="flex flex-col my-4">
<p>
Members are our chosen collaborators for mutual support and
growth. Rather than one-time deals for individual events or
projects, we strive for consistent collaboration to achieve
lasting impact.
</p>
</div>
<div class="flex flex-col gap-[16px] md:p-[24px] z-[10]">
<span class="text-white font-bold text-[18px] leading-[1.4rem]">
Benefits
</span>
<ul class="list-disc ml-4 text-white">
<li>
<span class="font-bold leading-wide"> Greater Exposure </span>
<p>
Ensure visibility at all our events [Congresses, Summits &
Hackathons]
</p>
</li>
<li>
<span class="font-bold leading-wide"> Access to Talent </span>
<p>
Connect with the right builders to test or develop your beta
projects or services.
</p>
</li>
<li>
<span class="font-bold leading-wide"> Targeted Outreach </span>
<p>Grow impact through strategic, targeted communications.</p>
</li>
<li>
<span class="font-bold leading-wide"> Tought Leadership </span>
<p>Participate in speaking engagements and mentorship roles.</p>
</li>
<li>
<span class="font-bold leading-wide"> Focused Engagement </span>
<p>
Reach and interact with specific, highly-relevant audiences.
</p>
</li>
</ul>
</div>
<div
class="flex w-full md:justify-between md:flex-row flex-col gap-[8px] md:items-end"
>
<div
class="relative flex w-full md:justify-between md:flex-row flex-col gap-[8px] md:items-end"
>
<div
class="flex flex-col justify-end h-full gap-4 mb-4 md:mb-8 z-50"
>
<div class="flex flex-col justify-end h-full gap-2">
<span>Our membership has multiple tiers ranging from</span>
<span
class="text-white font-bold text-lg md:text-[24px] leading-[1.4rem]"
>
7,000 to 70,000 € / year
</span>
<span
>Membership for registered non-profit organizations is
</span>
<span
class="text-white font-bold text-lg md:text-[24px] leading-[1.4rem]"
>
3,000 € / year
</span>
</div>
<a class="button inverted" href={core.links.individual}
><button>Request Tier Breakdown</button></a
>
</div>
<img
src="/about/image2.png"
alt=""
class="absolute hidden md:block right-0 bottom-0 md:w-[450px] md:h-auto"
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View file

@ -0,0 +1,274 @@
---
const testimonials = [
{
id: "jaromil",
author: "Jaromil",
designation: "Hacktivist, Founder & Director at Dyne.org Foundation",
reviewText:
"Privacy-by-design is the best way to approach the web3 frontier and develop something that empowers people and builds the critical mass for its sustainability. Web3Privacy Now focuses on the best possible goals for crypto developments: privacy, independence and decentralisation.",
imageUrl: "/testimonials/jaromil.png",
},
{
id: "hackguru",
author: "HackGuru",
designation: "Developer Relation at Waku",
reviewText:
"They have been organising amazing pro-privacy initiatives. Been a big fan and excited to continue contributing to this amazing community : )",
imageUrl: "/testimonials/hack-guru.jpg",
},
{
id: "lunar-dao",
author: "Lunar Dao",
designation: null,
reviewText:
"A catalyst leading a brilliant charge into privacy content for the web3 ecosystem.",
imageUrl: "/testimonials/lunar-dao.jpg",
},
{
id: "amit-chaudhary",
author: "Amit Chaudhary",
designation: "Founder Labyrinth, Ex Head of DeFi Research Polygon",
reviewText:
"This is the best community for privacy that unites people to collaborate and turns user privacy into reality with exciting narratives.",
imageUrl: "/testimonials/amit-chaudary.jpg",
},
{
id: "andreea",
author: "Andreea",
designation: null,
reviewText:
"I loved the event, the place, the people, the conversations, the swag. You guys are incredible! I think I wont be attending other crypto events that much anymore.",
imageUrl: "/testimonials/andreea.jpg",
},
{
id: "cryptocanal",
author: "CryptoCanal",
designation: null,
reviewText:
"One event at a time, they are building an ecosystem to ensure that no one forgets the political frontiers being pushed by crypto. Web3Privacy Now has been rallying support and ensuring that privacy holds a prime spot at all the major conferences worldwide.",
imageUrl: "/testimonials/cryptocanal.jpg",
},
{
id: "matteo-tambussi",
author: "Matteo Tambussi",
designation: "Founder of Spaghetteth, Project Manager StakeCapital",
reviewText:
"The balance between Transparency and Privacy, accountable and unaccountable, manifest and secret, convex and concave, 1 and 0 is one of the most fun puzzles blockchain tech has to solve for the world. W3P community approaches this with incredible humility and an unravel-the-knot open debate approach. Also I like how they dress.",
imageUrl: "/testimonials/matteo-tambussi.jpg",
},
{
id: "pie-man",
author: "Pie Man",
designation: "Co-Founder Fairblock Network",
reviewText:
"Most bullish event by far in EthCC was Web3Privacy Now: right in the middle of the park without anything fancy going on, the only incentive to stay was lovely people with extreme passion for deep but practical steps, cryptography, and amazing applications.",
imageUrl: "/testimonials/pie-man.jpg",
},
];
// Usage
let currentTestimonial = 0;
---
<div class="w-full mx-auto px-8 border-2 border-[#202020]">
<div class="relative" id="testimonial-container">
<div
class="flex flex-col md:flex-row my-4 md:my-0 items-center justify-center testimonial-fade active overflow-hidden person-item"
>
<img
src={testimonials[currentTestimonial].imageUrl}
class="grayscale h-24 rounded-full"
alt="Review Image"
id="testimonial-image"
/>
<div class="relative lg:w-9/12">
<div class="relative py-12 px-8 text-gray-700 leading-relaxed">
<h2 class="font-bold" id="testimonial-author">
{testimonials[currentTestimonial].author}:
</h2>
<p class="leading-tight" id="testimonial-text">
"{testimonials[currentTestimonial].reviewText}"
</p>
</div>
</div>
</div>
<!-- Navigation Buttons -->
<div class="absolute inset-y-0 left-0 lg:flex lg:items-center">
<button
class="mt-24 lg:mt-0 -ml-6 h-12 w-12 rounded-full p-3 shadow-lg"
id="prev-button"
>
<svg
class="h-full w-full text-white"
fill="currentColor"
viewBox="0 0 24 24"
>
<path
d="M5.41 11H21a1 1 0 0 1 0 2H5.41l5.3 5.3a1 1 0 0 1-1.42 1.4l-7-7a1 1 0 0 1 0-1.4l7-7a1 1 0 0 1 1.42 1.4L5.4 11z"
></path>
</svg>
</button>
</div>
<div class="absolute inset-y-0 right-0 lg:flex lg:items-center">
<button
class="mt-24 lg:mt-0 -mr-6 h-12 w-12 rounded-full p-3 shadow-lg"
id="next-button"
>
<svg
class="h-full w-full text-white"
fill="currentColor"
viewBox="0 0 24 24"
>
<path
d="M18.59 13H3a1 1 0 0 1 0-2h15.59l-5.3-5.3a1 1 0 1 1 1.42-1.4l7 7a1 1 0 0 1 0 1.4l-7 7a1 1 0 0 1-1.42-1.4l5.3-5.3z"
></path>
</svg>
</button>
</div>
<div
class="absolute bottom-4 left-1/2 transform -translate-x-1/2 flex space-x-2"
>
{
testimonials.map((_, index) => (
<button
class={`h-3 w-3 rounded-full ${index === currentTestimonial ? "bg-white" : "bg-transparent border"}`}
id={`dot-${index}`}
/>
))
}
</div>
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function () {
const testimonials = [
{
id: "jaromil",
author: "Jaromil",
designation: "Hacktivist, Founder & Director at Dyne.org Foundation",
reviewText:
"Privacy-by-design is the best way to approach the web3 frontier and develop something that empowers people and builds the critical mass for its sustainability. Web3Privacy Now focuses on the best possible goals for crypto developments: privacy, independence and decentralisation.",
imageUrl: "/testimonials/jaromil.png",
},
{
id: "hackguru",
author: "HackGuru",
designation: "Developer Relation at Waku",
reviewText:
"They have been organising amazing pro-privacy initiatives. Been a big fan and excited to continue contributing to this amazing community : )",
imageUrl: "/testimonials/hack-guru.jpg",
},
{
id: "lunar-dao",
author: "Lunar Dao",
designation: null,
reviewText:
"A catalyst leading a brilliant charge into privacy content for the web3 ecosystem.",
imageUrl: "/testimonials/lunar-dao.jpg",
},
{
id: "amit-chaudhary",
author: "Amit Chaudhary",
designation: "Founder Labyrinth, Ex Head of DeFi Research Polygon",
reviewText:
"This is the best community for privacy that unites people to collaborate and turns user privacy into reality with exciting narratives.",
imageUrl: "/testimonials/amit-chaudary.jpg",
},
{
id: "andreea",
author: "Andreea",
designation: null,
reviewText:
"I loved the event, the place, the people, the conversations, the swag. You guys are incredible! I think I wont be attending other crypto events that much anymore.",
imageUrl: "/testimonials/andreea.jpg",
},
{
id: "cryptocanal",
author: "CryptoCanal",
designation: null,
reviewText:
"One event at a time, they are building an ecosystem to ensure that no one forgets the political frontiers being pushed by crypto. Web3Privacy Now has been rallying support and ensuring that privacy holds a prime spot at all the major conferences worldwide.",
imageUrl: "/testimonials/cryptocanal.jpg",
},
{
id: "matteo-tambussi",
author: "Matteo Tambussi",
designation: "Founder of Spaghetteth, Project Manager StakeCapital",
reviewText:
"The balance between Transparency and Privacy, accountable and unaccountable, manifest and secret, convex and concave, 1 and 0 is one of the most fun puzzles blockchain tech has to solve for the world. W3P community approaches this with incredible humility and an unravel-the-knot open debate approach. Also I like how they dress.",
imageUrl: "/testimonials/matteo-tambussi.jpg",
},
{
id: "pie-man",
author: "Pie Man",
designation: "Co-Founder Fairblock Network",
reviewText:
"Most bullish event by far in EthCC was Web3Privacy Now: right in the middle of the park without anything fancy going on, the only incentive to stay was lovely people with extreme passion for deep but practical steps, cryptography, and amazing applications.",
imageUrl: "/testimonials/pie-man.jpg",
},
];
let currentTestimonial = 0;
const container = document.getElementById("testimonial-container");
const authorElement = document.getElementById("testimonial-author");
const textElement = document.getElementById("testimonial-text");
const imageElement = document.getElementById("testimonial-image");
const dots = testimonials.map((_, index) =>
document.getElementById(`dot-${index}`)
);
function showTestimonial(index) {
currentTestimonial = index;
const testimonial = testimonials[currentTestimonial];
// Add fade-out class before changing the content
container.classList.remove("active");
setTimeout(() => {
// Update content after fade-out
authorElement.innerText = testimonial.author;
textElement.innerText = `"${testimonial.reviewText}"`;
imageElement.src = testimonial.imageUrl;
// Add fade-in class
container.classList.add("active");
}, 500); // Match with the CSS transition duration
// Update dots
dots.forEach((dot, i) => {
if (i === currentTestimonial) {
dot.classList.add("bg-white");
dot.classList.remove("bg-transparent", "border");
} else {
dot.classList.remove("bg-white");
dot.classList.add("bg-transparent", "border");
}
});
}
document.getElementById("prev-button").addEventListener("click", () => {
showTestimonial(
(currentTestimonial - 1 + testimonials.length) % testimonials.length
);
});
document.getElementById("next-button").addEventListener("click", () => {
showTestimonial((currentTestimonial + 1) % testimonials.length);
});
dots.forEach((dot, index) => {
dot.addEventListener("click", () => {
showTestimonial(index);
});
});
// Automatically change testimonial every 6 seconds
setInterval(() => {
showTestimonial((currentTestimonial + 1) % testimonials.length);
}, 6000);
});
</script>

View file

@ -0,0 +1,75 @@
---
import { parseAndWrapCaptions } from "../../utils/captionParser";
const { people, team, core } = Astro.props;
// Filter based on the `core` parameter
const members = core ? people.filter((p) => {
return team.includes(p.id)
}).filter((p) => p.imageUrl) : team;
// const filteredPeople = members.filter((p) => p.imageUrl).slice(0, 12);
const filteredPeople = members.filter((p) => p.imageUrl);
function personLink(person) {
if (person.refs?.twitter) {
return `https://twitter.com/${person.refs.twitter}`;
} else if (person.refs?.bsky) {
return `https://bsky.app/profile/${person.refs.bsky}`;
} else if (person.refs?.linkedin) {
return `https://www.linkedin.com/in/${person.refs.linkedin}`;
} else if (person.refs?.github) {
return `https://github.com/${person.refs.github}`;
} else if (person.refs?.matrix) {
return `https://matrix.to/#/${person.refs.matrix}`;
} else if (person.refs?.designation) {
return `${person.refs.designation}`;
} else if (person.refs?.email) {
return `mailto:${person.refs.email}`;
} else {
return "#";
}
}
---
<div
class="grid grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 place-items-start"
>
{
filteredPeople.map((person) => (
<div
class={`max-w-xs w-full max-h-[340px] bg-transparent overflow-hidden p-1 space-y-1 mb-2`}
>
<a href={personLink(person)} class={`${core ? "person-item" : ""}`}>
<img
src={person.imageUrl}
alt={person.name}
class="min-h-[110px] w-full md:h-48 object-cover object-center transition duration-200 ease-in"
/>
</a>
<div class="mt-4">
<h3 class="text-[10px] pt-2 font-bold leading-3 md:leading-9 md:text-[16px] ">{person.name}</h3>
{person.refs && (
<p class="text-xs text-gray-500">
{person.refs.twitter && `@${person.refs.twitter}`}
{person.refs.email && ` | Email: ${person.refs.email}`}
{person.refs.bsky && ` | bsky: ${person.refs.bsky}`}
{person.refs.linkedin && ` | LinkedIn: ${person.refs.linkedin}`}
{person.refs.github && ` | GitHub: ${person.refs.github}`}
{person.refs.matrix && ` | Matrix: ${person.refs.matrix}`}
{person.refs.email && ` | Email: ${person.refs.email}`}
</p>
<p class="text-xs text-gray-500" set:html={person.caption && parseAndWrapCaptions(person.caption)}></p>
<p class="text-xs text-gray-500">
{person.refs.designation && `${person.refs.designation}`}
</p>
)}
</div>
</div>
))
}
</div>

View file

@ -1,5 +1,5 @@
title: Web3Privacy Now
description: Advocates worldwide are uniting to make privacy fundamental pillar of the Web3 industry, transforming it into a cultural movement that champions freedom and decentralization.
description: The leading nonprofit advancing Privacy & Freedom in the web3 industry. In our Ecosystem, we foster a culture that empowers decentralization, open-source , and anti surveillance.
header:
menu:
- name: Home
@ -22,7 +22,7 @@ header:
link: news
- name: Docs
link: docs
- name: Membership
- name: Get Involved
link: membership
url: /membership
#- name: Manifesto
@ -54,7 +54,9 @@ footer:
link: matrix
hero:
text: |
Advocates worldwide are uniting to make privacy fundamental pillar of the Web3 industry, transforming it into a cultural movement that champions freedom and decentralization.
The leading nonprofit advancing Privacy & Freedom in the web3 industry.
<br />
In our Ecosystem, we foster a culture that empowers decentralization, open-source, and anti surveillance.
landing:
merch: |
To make humans gain control over their privacy by utilizing Web3 stack. So privacy would become a cultural phenomena & active lifestyle.

View file

@ -24,10 +24,266 @@
"telegram": "https://t.me/+AKj7mTSVcTc3N2Q0"
},
"teams": {
"core-team": [
"mykola-siusko",
"pg",
"coinmandeer"
"core-team": ["mykola-siusko", "pg", "coinmandeer"],
"members": [
{
"name": "LOGOS",
"imageUrl": "/membersLogo/logos.svg",
"refs": {
"website": "https://logos.co/",
"twitter": "logos_network"
}
},
{
"name": "WAKU",
"imageUrl": "/membersLogo/waku.svg",
"refs": {
"website": "https://waku.org/",
"twitter": "waku_org"
}
},
{
"name": "Nomos",
"imageUrl": "/membersLogo/nomos.svg",
"refs": {
"website": "https://nomos.tech/",
"twitter": "Nomos_tech"
}
},
{
"name": "Codex",
"imageUrl": "/membersLogo/codex.svg",
"refs": {
"website": "https://nomos.tech/",
"twitter": "Codex_storage"
}
},
{
"name": "Dyne",
"imageUrl": "/membersLogo/dyne.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "dyneorg"
}
},
{
"name": "DNOSIS DAO",
"imageUrl": "/membersLogo/gnosisdao.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "dyneorg"
}
},
{
"name": "0xbow",
"imageUrl": "/membersLogo/0xbow.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "0xbowio"
}
},
{
"name": "Labyrinth",
"imageUrl": "/membersLogo/labyrinth.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "Labyrinth_HQ"
}
},
{
"name": "Namada",
"imageUrl": "/membersLogo/namada.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "namada"
}
},
{
"name": "Intmax",
"imageUrl": "/membersLogo/intmax.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "intmaxIO"
}
},
{
"name": "MorosNet",
"imageUrl": "/membersLogo/moros.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "morosnet"
}
},
{
"name": "TokenDynamics",
"imageUrl": "/membersLogo/tokendynamics.png",
"refs": {
"website": "https://nomos.tech/",
"twitter": "tokendynamics"
}
}
],
"community-partners": [
{
"name": "HOPR",
"imageUrl": "/membersLogo/hopr.svg",
"refs": {
"website": "https://hoprnet.org/",
"twitter": "hoprnet"
}
},
{
"name": "ETHRome",
"imageUrl": "/membersLogo/ETHRome.png",
"refs": {
"website": "https://www.ethrome.org/",
"twitter": "ETHRome"
}
},
{
"name": "LunarDAO",
"imageUrl": "/membersLogo/LunarDAO.png",
"refs": {
"website": "https://lunardao.net/",
"twitter": "lunarpunksquad"
}
},
{
"name": "MolochDAO",
"imageUrl": "/membersLogo/MolochDAO.png",
"refs": {
"website": "https://molochdao.com/",
"twitter": "molochdao"
}
},
{
"name": "Urbe.eth",
"imageUrl": "/membersLogo/Urbe.png",
"refs": {
"website": "https://linktr.ee/urbe.eth",
"twitter": "urbeEth"
}
},
{
"name": "CryptoCanal",
"imageUrl": "/membersLogo/CryptoCanal.png",
"refs": {
"website": "https://lu.ma/cryptocanal",
"twitter": "cryptocanal"
}
},
{
"name": "ParalelniPolis",
"imageUrl": "/membersLogo/polis.png",
"refs": {
"website": "https://www.paralelnipolis.cz/en/",
"twitter": "Paralelni_polis"
}
},
{
"name": "GCCofCommons",
"imageUrl": "/membersLogo/GCC.png",
"refs": {
"website": "https://www.gccofficial.org/en",
"twitter": "GCCofCommons"
}
},
{
"name": "Zcash",
"imageUrl": "/membersLogo/zcash.png",
"refs": {
"website": "https://z.cash/",
"twitter": "zcash"
}
},
{
"name": "Kernel Community",
"imageUrl": "/membersLogo/kernel.png",
"refs": {
"website": "https://kernel.community/",
"twitter": "Kernel0x"
}
},
{
"name": "Shielding Summit",
"imageUrl": "/membersLogo/ssummit.png",
"refs": {
"website": "https://shieldingsummit.org/",
"twitter": "ShieldingSummit"
}
}
],
"core-speakers": [
"david-chaum",
"tor-ekeland",
"michael-bauwens",
"vitalik-buterin",
"paul-dylan-ennis",
"jaromil",
"ameen-soleimani",
"ahmed-ghappour",
"scott-moore",
"juraj-bednar",
"kurt-opsahl",
"guy-zyskind"
],
"core-contributors": [
{
"id": "mykola-siusko",
"name": "Mykola Siusko",
"caption": "Chief empathy officer",
"country": "es",
"imageUrl": "https://data.web3privacy.info/img/people/mykola-siusko.png"
},
{
"id": "pg",
"name": "PG",
"caption": "Larrikin sling master",
"country": "it",
"imageUrl": "https://data.web3privacy.info/img/people/pg.jpg"
},
{
"id": "michael-parenti",
"name": "Michael Parenti",
"caption": "Ops & vibe",
"country": "us",
"imageUrl": "/core-contributors/michael-parenti.png"
},
{
"id": "coinmandeer",
"name": "Coinmandeer",
"caption": "UI/UX Design & Brand",
"imageUrl": "https://data.web3privacy.info/img/people/coinmandeer.png"
},
{
"id": "robert",
"name": "Robert De Groot",
"caption": "Partnership & Volunteers",
"imageUrl": "/core-contributors/robert.png"
},
{
"id": "cat",
"name": "CAT THAT LURKS",
"caption": "“Like all pure creatures, cats are practical.” William S. Burroughs",
"imageUrl": "/core-contributors/cat.png"
},
{
"id": "odd",
"name": "ODD",
"caption": "Copywriting & Education",
"imageUrl": "/core-contributors/odd.png"
},
{
"id": "mf",
"name": "MF",
"caption": "master of caffeine",
"imageUrl": "/core-contributors/mf.png"
}
]
},
"research": [
@ -36,12 +292,8 @@
"title": "ZK solutions DB",
"status": "live",
"sort": 1,
"labels": [
"db"
],
"assignees": [
"Msiusko"
],
"labels": ["db"],
"assignees": ["Msiusko"],
"caption": "General DB aggregation focused on ZK for privacy.",
"links": {
"web": "https://github.com/web3privacy/web3privacy/tree/main/ZKprivacylandscape#readme",
@ -53,12 +305,8 @@
"title": "Privacy Use-Cases DB",
"status": "live",
"sort": 3,
"labels": [
"db"
],
"assignees": [
"Msiusko"
],
"labels": ["db"],
"assignees": ["Msiusko"],
"caption": "Basic DB of the privacy-centric use-cases.",
"links": {
"web": "https://github.com/Msiusko/web3privacy/blob/main/Use-cases.md",
@ -71,9 +319,7 @@
"status": "live",
"sort": 5,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"caption": "Pagency framework for facilitation privacy use-cases (privacy services modelling)",
"links": {
"web": "https://github.com/web3privacy/web3privacy/blob/main/Pagency/Pagency%20-%20privacy%20use-case%20facilitation%20framework.pdf",
@ -85,12 +331,8 @@
"title": "Privacy Projects Hiring",
"status": "live",
"sort": 4,
"labels": [
"db"
],
"assignees": [
"Msiusko"
],
"labels": ["db"],
"assignees": ["Msiusko"],
"caption": "Hiring snapshot across the market: total vacancies, grades, technical x non-technical positions, hiring scope within specific companies & domains.",
"links": {
"web": "https://docs.google.com/spreadsheets/d/1dN6bIWyOh01Dl-y1iZh-1TASZxKUefD098BUALcnUb8/edit?usp=sharing",
@ -112,10 +354,7 @@
"status": "backlog",
"sort": 2,
"labels": [],
"assignees": [
"EclecticSamurai",
"Msiusko"
],
"assignees": ["EclecticSamurai", "Msiusko"],
"links": {}
},
{
@ -124,10 +363,7 @@
"status": "backlog",
"sort": 3,
"labels": [],
"assignees": [
"EclecticSamurai",
"Msiusko"
],
"assignees": ["EclecticSamurai", "Msiusko"],
"links": {}
},
{
@ -136,9 +372,7 @@
"status": "in-progress",
"sort": 0,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"caption": "Comprehensive privacy-centric research aimed to map Ethereum-centric privacy services, use-cases, product stages, missing areas (use-cases), funding landscape etc Supported by MolochDAO",
"links": {
"web": "https://github.com/web3privacy/web3privacy/blob/main/Market%20overview/Ethereum%20Ecosystem/Readme.md",
@ -150,9 +384,7 @@
"title": "Privacy use-cases DB 2.0 (major update)",
"status": "backlog",
"sort": 4,
"labels": [
"db"
],
"labels": ["db"],
"assignees": [],
"links": {}
},
@ -162,9 +394,7 @@
"status": "backlog",
"sort": 1,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"links": {}
},
{
@ -173,9 +403,7 @@
"status": "in-progress",
"sort": 1,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"links": {}
},
{
@ -184,9 +412,7 @@
"status": "live",
"sort": 2,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"caption": "150-pages report on the state of privacy x web3 from funding to key projects.",
"links": {
"web": "https://github.com/web3privacy/web3privacy/blob/main/Market%20overview/Privacy%20market%20outlook%20in%20Web3%20by%20Mykola%20Siusko%20(Jan%202023).pdf"
@ -198,9 +424,7 @@
"status": "live",
"sort": 6,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"caption": "Research how privacy tools can protect human rights, vulnerable audiences within the war, migration & cross-border relations. Supported by Zcash Foundation.",
"links": {
"web": "https://github.com/web3privacy/grants/blob/main/staticobjects/Privacy%20use%20cases%20with%20the%20focus%20on%20Zcash%20(privacy%20coins)_Siusko.pdf"
@ -212,9 +436,7 @@
"status": "live",
"sort": 0,
"labels": [],
"assignees": [
"Msiusko"
],
"assignees": ["Msiusko"],
"caption": "Privacy services x web3 initial market DB aggregation: segmentation, key links (web, git, docs), ecosystem, product liveliness etc. 600 projects in the DB.",
"links": {
"web": "https://github.com/web3privacy/web3privacy?tab=readme-ov-file#contents"
@ -1645,9 +1867,7 @@
"design": {
"image": "bucharest01"
},
"helpers": [
"Alina"
],
"helpers": ["Alina"],
"links": {
"rsvp": "https://lu.ma/w3pn-meetup-bucharest1"
},
@ -1693,10 +1913,7 @@
"place-address": "Paleisstraat 107, 1012 ZL Amsterdam, Paesi Bassi",
"lead": "PG",
"visitors": 90,
"helpers": [
"Mykola",
"Alina"
],
"helpers": ["Mykola", "Alina"],
"coincidence": "[ETHDam](https://www.ethdam.com/)",
"slots": 3,
"links": {
@ -1749,9 +1966,7 @@
"coincidence": "ETHBerlin",
"lead": "Mykola",
"visitors": 150,
"helpers": [
"ligi"
],
"helpers": ["ligi"],
"speakers": [
"afri-schoedon",
"joshua-davila",
@ -1800,11 +2015,7 @@
"country": "de",
"coincidence": "ETHBerlin",
"lead": "Tree",
"helpers": [
"Mykola",
"Coinmandeer",
"Robert"
],
"helpers": ["Mykola", "Coinmandeer", "Robert"],
"visitors": 210,
"links": {
"web": "https://c24ber.web3privacy.info/"
@ -1847,11 +2058,7 @@
"coincidence": "ETHPrague",
"lead": "PG",
"visitors": 180,
"helpers": [
"PG",
"Mykola",
"Coinmandeer"
],
"helpers": ["PG", "Mykola", "Coinmandeer"],
"slots": 16,
"links": {
"rsvp": "https://lu.ma/w3pn-summit-prague2"
@ -1921,11 +2128,7 @@
"links": {
"rsvp": "https://lu.ma/w3pn-meetup-bru1"
},
"speakers": [
"edward-fricker",
"joshua-davila",
"mykola-siusko"
],
"speakers": ["edward-fricker", "joshua-davila", "mykola-siusko"],
"images": {
"wide-square": "https://data.web3privacy.info/img/events/2024/m24bru-wide-square.png",
"poster": "https://data.web3privacy.info/img/events/2024/m24bru-poster.png",
@ -1964,10 +2167,7 @@
"design": {
"image": "rome02"
},
"helpers": [
"Mykola",
"Alina"
],
"helpers": ["Mykola", "Alina"],
"links": {
"rsvp": "https://lu.ma/w3pn-meetup-rome1"
},
@ -2107,11 +2307,7 @@
"links": {
"web": "https://lu.ma/w3pm-prg1"
},
"speakers": [
"vaclav-pavlin",
"radek-svarz",
"marcel-kolaja"
],
"speakers": ["vaclav-pavlin", "radek-svarz", "marcel-kolaja"],
"images": {},
"thumbs": {}
}

View file

@ -152,10 +152,16 @@ function genHeading(str) {
<div class="w-full flex mt-20 sm:mt-32 middle-pane-medium">
<div>
<div class="w3pn-logo w-64 sm:w-72 lg:w-80 xl:w-96" />
<div class="text-left mt-10">{config.hero.text}</div>
{/* <h1 class="glitch-text-interval text-6xl">
web3privacy summit #1
</h1> */}
<div class="text-left mt-10" set:html={config.hero.text} />
<div class="mt-6">
<a class="button" href="/about">
<button>About Web3Privacy Now</button>
<button>
<strong>About US</strong>
</button>
</a>
</div>
</div>
@ -165,18 +171,17 @@ function genHeading(str) {
{
!banner && (
<>
<div class="middle-pane-medium mt-8 sm:mt-14 mb-2 sm:mb-8">
<div class="leading-none flex justify-center text-[4px] sm:text-[8px] text-white">
{/*<img src="/page-events.png" class="h-8 sm:h-14" title="Events" />*/}
<div class="middle-pane-medium mt-8 sm:mt-14 sm:mb-8">
<div class="leading-none flex justify-center mb-3 text-[4px] sm:text-[8px] text-white">
<pre>
<code class="font-mono layout-heading ">
{genHeading(title)}
</code>
</pre>
</div>
</div>
<div class="flex items-center justify-center w-full text-center">
<h3 class=" w-full max-w-[938px]">{subtext}</h3>
<div class="flex items-center justify-center w-full text-center">
<h3 class=" w-full max-w-[938px] glitch-text">{subtext}</h3>
</div>
</div>
</>
)
@ -186,42 +191,81 @@ function genHeading(str) {
<slot />
<div
class="border border-t-2 border-b-0 border-l-0 border-r-0 border-[#0f0f0f] mt-20 pt-10 pb-10"
class="border border-t-2 border-b-0 border-l-0 border-r-0 border-[#0f0f0f] mt-20 pt-10 pb-10 middle-pane-medium"
>
<div class="middle-pane-big">
<div
class="flex gap-10 text-lg items-center flex-wrap align-top"
id="footerMenu"
>
<a href="/" class="w3pn-logo w-32"></a>
<div class="text-md">
<a
href="https://github.com/web3privacy/web"
class="text-white hover:underline">v{pkg.version}</a
>
</div>
<div class="grow flex sm:justify-end">
<div class="sm:flex justify-center flex-wrap gap-4 lg:gap-10">
{
config.footer.menu.map((item) => (
<div class="flex gap-4 items-center menuItem lg:mb-0 mb-2">
<div
class="icon small opacity-50"
class:list={[item.ico]}
/>
<div class="text-white hover:underline">
<a href={item.url || core.links[item.link]}>
{item.title}
</a>
</div>
</div>
))
}
<div
class="flex mx-6 gap-10 text-lg items-center flex-wrap align-top"
id="footerMenu"
>
<a href="/" class="w3pn-logo w-52"></a>
<div class="text-md">
<a
href="https://github.com/web3privacy/web"
class="text-white hover:underline">v{pkg.version}</a
>
</div>
</div>
<div class="flex justify-between">
<div class="mx-6 py-10 text-center md:text-left">
<div class="grid-1 grid gap-8 md:grid-cols-2 lg:grid-cols-3">
<div class="">
<p class="mb-4">
<a href="#!">Manifesto</a>
</p>
<p class="mb-4">
<a href="#!">How to get involved?</a>
</p>
<p class="mb-4">
<a href="#!">Grants / Support Us</a>
</p>
</div>
<div>
<p class="mb-4">
<a href="#!">Events</a>
</p>
<p class="mb-4">
<a href="#!">Articles</a>
</p>
<p class="mb-4">
<a href="#!">Talks</a>
</p>
</div>
<div>
<p class="mb-4">
<a href="/#">Privacy Explorer</a>
</p>
<p class="mb-4">
<a href="/#">Privacy use-cases database</a>
</p>
</div>
</div>
</div>
<div class="py-10 md:text-left">
<div class="grid-1 grid gap-4 md:grid-cols-2 lg:grid-cols-5">
{
config.footer.menu.map((item) => (
<div>
<p class="mb-4">
<a href={item.url || core.links[item.link]}>{item.title}</a>
</p>
</div>
))
}
</div>
</div>
</div>
<!--Copyright section-->
<div class="bg-black/5 p-6 text-start">
<a class="font-semibold" href="https://tw-elements.com/"
>All rights not reserved, Creative commons 2024 - Web3Privacy z.s.</a
>
</div>
</div>
<!-- Load TextScramble.js -->
<script src="/scripts/text-scramble.js" type="module"></script>
<script>
document.querySelector(".hamburger").addEventListener("click", () => {
document.querySelector(".nav-links").classList.toggle("expanded");

View file

@ -321,7 +321,7 @@ export function ccRenderer (item) {
return cc
}
export function eventStatus (item) {
export function eventStatus(item) {
const statuses = {
preregistration: {
title: 'Pre-registration',
@ -341,9 +341,12 @@ export function eventStatus (item) {
}
}
const date = dateInfo(item)
const date = dateInfo(item);
const eventDate = new Date(item.date);
const currentDate = new Date();
return item.confirmed
? (date.isDate ? statuses.past : statuses.confirmed)
? (eventDate < currentDate ? statuses.past : statuses.confirmed)
: (item.links?.rsvp ? statuses.preregistration : statuses.unconfirmed);
}

View file

@ -4,43 +4,89 @@ import * as config from "../config.yaml";
import core from "../core.json";
import AboutFooter from "../components/AboutFooter.astro";
import AboutItemGrid from "../components/AboutItemGrid.astro";
import AboutWidget from "../components/AboutWidget.astro";
import EventMasonry from "../components/EventMasonry.astro";
import EventItem from "../components/EventItem.astro";
import { isFutureDate } from "../lib/date";
const events = core.events;
const upcomingEvents = [];
let eventsPast = 0;
let eventsUpcoming = 0;
const sectionsConfig = [
{ name: "testimonials", visible: true, order: 1 },
{ name: "core contributors", visible: true, order: 2 },
{ name: "contributors", visible: true, order: 3 },
{ name: "membersGrid", visible: true, order: 4 },
{ name: "socialLinks", visible: true, order: 5 },
];
for (const ev of events) {
let future = isFutureDate(ev.date);
if (future) {
upcomingEvents.push(ev);
eventsUpcoming++;
} else {
eventsPast++;
}
}
const allowedFeaturedTypes = [
"summit",
"meetup",
"online-summit",
"congress",
"privacy-corner",
"meta-hackathons",
];
const featuredEvents = [];
for (const e of upcomingEvents) {
if (featuredEvents.length > 2) {
break;
}
if (
allowedFeaturedTypes.includes(e.type) &&
e.links?.rsvp &&
!featuredEvents.find((ex) => ex.type === e.type)
) {
featuredEvents.push(e);
}
}
---
<BaseLayout
title="About web3privacy"
image="og_about"
subimage="/about/about.png"
subtext="we are a privacy focused ecosystem of hacktivists, researchers, lawyers, event organisers... pushing web3privacy forward"
subtext="We are a think-and-do tank of hundreds of people, projects, and organizations committed to protecting and advancing civil liberties, decentralization, and open-source software."
>
<div class="middle-pane-medium mt-10">
<!-- <div class="mb-20">
<a href="https://docs.web3privacy.info/manifesto"
><img src="/bringing-100m-to-privacy-market.png" /></a
>
</div> -->
<div class="middle-pane-medium mt-10">th
<div class="grid grid-cols-1 xl:grid-cols-2 gap-16 mb-[82px]">
<div class="flex flex-col gap-[36px] md:order-2">
<div class="md:hidden block mb-[12px]">
<h1>Our mission</h1>
<h1>activism. care. solidarity.</h1>
<div set:html={config.landing.mission} />
<div class="mt-8 flex gap-6 items-center w-full">
<a class="button inverted" href={core.links.manifesto}
><button>Read manifesto</button></a
>
<a class="button" href={core.links.telegram}
<a class="button font-bold" href={core.links.telegram}
><button>Join us</button></a
>
</div>
</div>
<h1>how we support privacy in web3</h1>
<h1 class="glitch-text">how we support privacy in web3</h1>
<AboutItemGrid />
</div>
<div class="md:order-1 order-2">
<div class="md:block hidden">
<h1>Our mission</h1>
<h1 class="glitch-text">activism. care. solidarity.</h1>
<div set:html={config.landing.mission} />
<div class="mt-8 flex gap-6 items-center w-full">
<a class="button inverted" href={core.links.manifesto}
@ -51,58 +97,57 @@ import AboutWidget from "../components/AboutWidget.astro";
>
</div>
</div>
<div class="md:mt-[56px] mt-[26px]">
<h1>our events</h1>
<div set:html={config.landing.event} />
<div class="mt-8 flex flex-col gap-6 items-start w-full">
<div class="grid grid-cols-2 gap-[8px]">
<img src="/about/1.png" alt="" />
<img src="/about/2.png" alt="" />
<img src="/about/3.png" alt="" />
<img src="/about/4.png" alt="" />
</div>
<a class="button inverted" href={"/events"}
><button>EVENTS</button></a
>
</div>
<hr class="mt-10 border-[#e0e0e0]" />
<div class="md:block hidden mt-[26px]">
<h1 class="glitch-text">Our mission</h1>
<div set:html={config.landing.mission} />
</div>
<div class="md:mt-[56px] mt-[26px]">
<h1>Our Projects & research</h1>
<div set:html={config.landing.research} />
<hr class="mt-10 border-[#e0e0e0]" />
<div class="mt-[26px]">
<h1 class="glitch-text">why privacy</h1>
<p class="mt-0 w-full">
In any society, privacy is essential for protecting civil liberties
and human rights.
<br />
<br />
Privacy enables individuals to participate in political processes without
fear of retribution or surveillance, ensuring that they can freely express
their views, associate with others, and engage in activism. <br />
<br />
Robust privacy practices assist in balancing power between individuals
and the state or corporations. Without them, unchecked surveillance and
control leads to a loss of personal freedoms and the rise of authoritarianism.
<br />
<br /> When we talk about privacy, we are discussing more than just data
protection. We are addressing the fate of our societies, their present,
and their future.
</p>
<div class="mt-8 flex gap-6 items-center w-full">
<a class="button inverted" href={core.links.projects}
><button>Projects</button></a
>
<a class="button inverted" href={core.links.research}
><button>Research</button></a
<a class="button inverted" href={core.links.manifesto}
><button>Read More</button></a
>
</div>
</div>
<!-- <div>
<h1>Topics</h1>
<div class="columns-2 uppercase text-sm w3pn-topics">
{config.landing.topics.map((topic) => <div>{topic}</div>)}
</div>
</div> -->
</div>
</div>
<AboutWidget variant="membership" />
<div
class="flex md:flex-row flex-col items-center gap-[24px] justify-center w-full mt-[24px]"
>
<div class="md:mt-[56px] mt-[26px] max-w-[460px] md:order-1 order-2">
<h1>empowering community with our brand</h1>
<div set:html={config.landing.merch} />
<div class="mt-8 flex gap-6 items-center w-full">
<a class="button inverted" href={core.links.brand}
><button>Brand on Github</button></a
>
</div>
</div>
<div class="md:order-2 order-1">
<img src="/about/stickers.png" alt="" />
</div>
</div>
<div class="my-10">
<EventMasonry />
</div>
<div class="middle-pane-medium">
<div class="mb-6">
{featuredEvents.map((event) => <EventItem item={event} />)}
</div>
<AboutFooter />
<div class="mt-6">
<a href="/events" class="button inverted"
><button>Show all events</button></a
>
</div>
</div>
<div class="middle-pane-medium mt-10">
<AboutFooter {sectionsConfig} />
</div>
</BaseLayout>

View file

@ -1,159 +1,279 @@
---
import BaseLayout from '../layouts/base.astro';
import AboutFooter from '../components/AboutFooter.astro';
import core from '../core.json';
import articles from '../articles.json';
import talks from '../talks.json';
import explorer from '../explorer.json';
import dbRepo from '../db-repo.json';
import { format } from 'date-fns';
import EventItem from '../components/EventItem.astro';
import { isFutureDate } from '../lib/date';
import BaseLayout from "../layouts/base.astro";
import AboutFooter from "../components/AboutFooter.astro";
import core from "../core.json";
import articles from "../articles.json";
import talks from "../talks.json";
import dbRepo from "../db-repo.json";
import { format } from "date-fns";
import EventItem from "../components/EventItem.astro";
import { isFutureDate } from "../lib/date";
import EventMasonry from "../components/EventMasonry.astro";
import * as config from "../config.yaml";
const events = core.events;
const upcomingEvents = []
let eventsPast = 0
let eventsUpcoming = 0
const sectionsConfig = [
{ name: "socialLinks", visible: false, order: 2 },
{ name: "speakers", visible: true, order: 2 },
{ name: "contributors", visible: true, order: 3 },
{ name: "testimonials", visible: true, order: 4 },
{ name: "membersGrid", visible: true, order: 5 },
// { name: "community", visible: false, order: 6 },
];
const upcomingEvents = [];
let eventsPast = 0;
let eventsUpcoming = 0;
for (const ev of events) {
let future = isFutureDate(ev.date)
if (future) {
upcomingEvents.push(ev)
eventsUpcoming++
} else {
eventsPast++
}
let future = isFutureDate(ev.date);
if (future) {
upcomingEvents.push(ev);
eventsUpcoming++;
} else {
eventsPast++;
}
}
const featuredEvents = []
const allowedFeaturedTypes = [
"summit",
"meetup",
"online-summit",
"congress",
"privacy-corner",
"meta-hackathons",
];
const featuredEvents = [];
for (const e of upcomingEvents) {
if (featuredEvents.length > 2) {
break;
}
if (['summit', 'meetup', 'online-summit'].includes(e.type) &&
e.links?.rsvp && !featuredEvents.find(ex => ex.type === e.type)) {
featuredEvents.push(e)
}
if (featuredEvents.length > 2) {
break;
}
if (
allowedFeaturedTypes.includes(e.type) &&
e.links?.rsvp &&
!featuredEvents.find((ex) => ex.type === e.type)
) {
featuredEvents.push(e);
}
}
---
<BaseLayout banner="true" description="Advocates worldwide are uniting to make privacy fundamental pillar of the Web3 industry, transforming it into a cultural movement that champions freedom and decentralization.">
<BaseLayout
banner="true"
description="Advocates worldwide are uniting to make privacy fundamental pillar of the Web3 industry, transforming it into a cultural movement that champions freedom and decentralization."
>
<div class="middle-pane-big">
<div
class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 w3pn-hp-grid gap-2 mt-2"
>
<div class="bg-events" data-url="/events">
<div class="title glitch-text">Events</div>
<div class="numbers">
<div>
<div class="big">{eventsUpcoming}</div>
<div>Upcoming events</div>
</div>
<div>
<div class="big">{eventsPast}</div>
<div>Past events</div>
</div>
</div>
</div>
<div
class="bg-projects relative"
data-url="https://github.com/web3privacy/web3privacy/blob/main/README.md#contents"
>
<div class="title">
<div class="flex items-center">
<div class="icon github small mr-1.5 inline-block"></div>
<div class="text-white mt-1 ml-1.5">
<a
href="https://github.com/web3privacy/web3privacy/blob/main/README.md#contents"
class="glitch-text">Web3 Privacy Database</a
>
</div>
</div>
</div>
<!-- Place this tag where you want the button to render. -->
<div
class="flex items-center absolute top-4 right-4 text-white opacity-30"
>
<div class="icon star small mr-1.5"></div>
{dbRepo.stars}
</div>
<div class="numbers">
<div>
<div class="big">{dbRepo.count}</div>
<div>Projects</div>
</div>
<div>
<div class="big">{dbRepo.contributors}</div>
<div>Contributors</div>
</div>
</div>
</div>
<div class="bg-talks" data-url="/research">
<div class="title glitch-text">Research</div>
<div class="numbers">
<div>
<div class="big">{core.research.length} research projects →</div>
</div>
</div>
</div>
</div>
</div>
<div class="middle-pane-big">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 w3pn-hp-grid gap-2 mt-2">
<div class="bg-events" data-url="/events">
<div class="title">Events</div>
<div class="numbers">
<div>
<div class="big">{eventsUpcoming}</div>
<div>Upcoming events</div>
</div>
<div>
<div class="big">{ eventsPast}</div>
<div>Past events</div>
</div>
</div>
</div>
<div class="bg-projects relative" data-url="https://github.com/web3privacy/web3privacy/blob/main/README.md#contents">
<div class="title">
<div class="flex items-center">
<div class="icon github small mr-1.5 inline-block"></div>
<div class="text-white mt-1 ml-1.5"><a href="https://github.com/web3privacy/web3privacy/blob/main/README.md#contents">Web3 Privacy Database</a></div>
</div>
</div>
<!-- Place this tag where you want the button to render. -->
<div class="flex items-center absolute top-4 right-4 text-white opacity-30"><div class="icon star small mr-1.5"></div> {dbRepo.stars}</div>
<div class="numbers">
<div>
<div class="big">{dbRepo.count}</div>
<div>Projects</div>
</div>
<div>
<div class="big">{dbRepo.contributors}</div>
<div>Contributors</div>
</div>
</div>
</div>
<div class="bg-talks" data-url="/research">
<div class="title">Research</div>
<div class="numbers">
<div>
<div class="big">{core.research.length} research projects →</div>
</div>
</div>
</div>
</div>
</div>
<div class="middle-pane-medium mt-10">
<div class="mt-16">
<h1 class="glitch-text">Featured Events</h1>
</div>
<div class="text-left">
Our gatherings aim to build understanding and solidarity among diverse
interest groups, cultures, states, chains, ecosystems, and backgrounds. We
bring together Web3 and non-tech individuals, builders, researchers,
philosophers, lawyers, policymakers, hacktivists, key players, local
communities, and the general public. Formats: Meetups, Summits,
Congresses, Hackathons, Camp fires
</div>
</div>
<div class="middle-pane-medium mt-10">
<!--div class="mt-10">
<h1>Our Projects</h1>
</div-->
<div class="my-10">
<EventMasonry />
</div>
<div class="mt-16">
<h1>Featured Upcoming Events</h1>
</div>
<div class="middle-pane-medium">
<div class="mb-6">
{featuredEvents.map((event) => <EventItem item={event} />)}
</div>
<div class="mb-6">
{featuredEvents.map((event) => (
<EventItem item={event} />
))}
</div>
<div class="mt-6">
<a href="/events" class="button inverted"
><button>Show all events</button></a
>
</div>
<div class="mt-6">
<a href="/events" class="button inverted"><button>Show all events</button></a>
</div>
<div class="mt-16">
<h1 class="glitch-text">Latest Articles</h1>
</div>
<div class="mt-16">
<h1>Latest Articles</h1>
</div>
<div class="w3pn-articles grid md:grid-cols-2 gap-6">
{
articles.slice(0, 4).map((entry) => (
<div
class="basegrid-entry aspect-video"
style={{
backgroundImage: `url("${entry.img}")`,
backgroundSize: "100% 100%;",
}}
>
<div class="title">
<a href={entry.url}>{entry.title}</a>
<span class="date">
{format(new Date(entry.date), "MMMM do, yyyy")}
</span>
</div>
</div>
))
}
</div>
<div class="w3pn-articles grid md:grid-cols-2 gap-6">
{articles.slice(0,4).map((entry) => (
<div class="basegrid-entry aspect-video" style={{backgroundImage: `url("${entry.img}")`, backgroundSize: '100% 100%;'}}>
<div class="title">
<a href={entry.url}>{entry.title}</a>
<span class="date">{format(new Date(entry.date), 'MMMM do, yyyy')}</span>
</div>
</div>
))}
</div>
<div class="mt-8">
<a href={core.links.mirror} class="button inverted"
><button>More articles on Mirror</button></a
>
</div>
<div class="mt-8">
<a href={core.links.mirror} class="button inverted"><button>More articles on Mirror</button></a>
</div>
<div class="mt-16">
<h1 class="glitch-text">Latest Talks</h1>
</div>
<div class="mt-16">
<h1>Latest Talks</h1>
</div>
<div class="grid md:grid-cols-2 gap-6">
{
talks.slice(0, 4).map((entry) => (
<div
class="basegrid-entry aspect-video"
style={{
backgroundImage: `url("${entry.img}")`,
backgroundSize: "cover",
backgroundPosition: "center",
}}
>
<a href={entry.url} class="w-full h-full" title={entry.title} />
</div>
))
}
</div>
<div class="grid md:grid-cols-2 gap-6">
{talks.slice(0,4).map((entry) => (
<div class="basegrid-entry aspect-video" style={{backgroundImage: `url("${entry.img}")`, backgroundSize: 'cover', backgroundPosition: 'center'}}>
<a href={entry.url} class="w-full h-full" title={entry.title}></a>
</div>
))}
</div>
<div class="mt-8">
<a href={core.links.youtube} class="button inverted"
><button>More talks on YouTube</button></a
>
</div>
</div>
<div class="middle-pane-medium mt-16">
<h1>
<a class="glitch-text" href="https://docs.web3privacy.info/get-involved">
Join the Community
</a>
</h1>
<div>{config.landing.community}</div>
<div
class="grid place-items-center grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-2 pt-4 w-full"
>
<a
href={core.links.twitter}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon twitter"></div>
@web3privacy
</button>
</a>
<a
href={core.links.telegram}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon telegram"></div>
Telegram
</button>
</a>
<a
href={core.links.signal}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon">
<img src="/icons/signal.svg" alt="" />
</div>
Signal
</button>
</a>
<a
href={core.links.matrix}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon matrix"></div>
matrix
</button>
</a>
</div>
</div>
<div class="mt-8">
<a href={core.links.youtube} class="button inverted"><button>More talks on YouTube</button></a>
</div>
<AboutFooter />
</div>
<script is:inline>
document.querySelectorAll('.w3pn-hp-grid > div').forEach(el => {
el.addEventListener('click', () => {
window.location = el.getAttribute('data-url');
});
});
document.querySelectorAll('.w3pn-articles > div').forEach(el => {
el.addEventListener('click', () => {
window.location = el.querySelector('a').getAttribute('href');
});
});
</script>
<AboutFooter {sectionsConfig} />
<script is:inline>
document.querySelectorAll(".w3pn-hp-grid > div").forEach((el) => {
el.addEventListener("click", () => {
window.location = el.getAttribute("data-url");
});
});
document.querySelectorAll(".w3pn-articles > div").forEach((el) => {
el.addEventListener("click", () => {
window.location = el.querySelector("a").getAttribute("href");
});
});
</script>
</BaseLayout>

View file

@ -1,30 +1,156 @@
---
import BaseLayout from "../../layouts/base.astro";
import * as config from "../config.yaml";
import core from "../../core.json";
import AboutFooter from "../../components/AboutFooter.astro";
import AboutWidget from "../../components/AboutWidget.astro";
import MembershipWidget from "../../components/MembershipWidget.astro";
import contributors from "../../contributors.json";
import MembershipOtherOptionsWidget from "../../components/MembershipOtherOptionsWidget.astro";
import MembersGrid from "../../components/MembersGrid.astro";
const sectionsConfig = [
// { name: "membersGrid", visible: true, order: 1 },
// { name: "socialLinks", visible: true, order: 2 },
// { name: "testimonials", visible: true, order: 1 },
// { name: "speakers", visible: true, order: 2 },
// { name: "contributors", visible: true, order: 3 },
// { name: "community", visible: false, order: 6 },
];
---
<BaseLayout
title="MEMBERSHIP"
title="GET INVOLVED"
image="og_membership"
subimage="/membership/membership.png"
>
<div class="middle-pane-medium my-10">
<div
class="flex items-center justify-center w-full text-center mt-20 mb-20"
>
<div class="flex items-center justify-center w-full text-center my-12">
<h3 class="max-w-[900px] w-full">
for all privacy advocates, projects and companies, we offer a simple and
straightforward way to support us financially and become an integral
part of our ecosystem.
</h3>
</div>
<div>
<AboutWidget variant="membership" />
</div>
<AboutFooter />
</div>
<div class="middle-pane-medium my-10">
<div class="border-4 border-white">
<div class="bg-white w-full px-[16px] text-black">
<h3 style="color:black !important " class="pb-[3px] pl-4 font-[21px]">
Github Contributors
</h3>
</div>
<div class="w-full text-center my-10 text-lg">
<p>
This is the kind of support we value most: open-source, grassroots
initiatives driven by individual passion and the desire to create
something meaningful.
</p>
</div>
<div
class="flex gap-3 flex-wrap mb-4 justify-center md:justify-start mx-4"
>
{
contributors.items.map((contrib) => (
<div>
<a href={contrib.html_url} target="_blank" title={contrib.login}>
<img
src={contrib.avatar_url}
class="w-6 md:w-14 rounded-full aspect-square"
/>
</a>
</div>
))
}
</div>
<div class="flex gap-4 p-4 lg:gap-6 pt-4 flex-wrap">
<a href={core.links.telegram} class="button inverted">
<button>Become a Contributor</button>
</a>
</div>
</div>
<div class="my-10">
<h1 class="font-[32px]">membership</h1>
<MembershipWidget />
</div>
</div>
<div class="middle-pane-medium mt-20">
<h1 class="font-[32px]">other ways</h1>
<MembershipOtherOptionsWidget />
</div>
<div class="mx-4 mt-16">
<h1 class="my-6 middle-pane-medium">Members</h1>
<div class="middle-pane-big">
<MembersGrid
people={core.people}
team={core.teams["members"]}
core={false}
/>
</div>
</div>
<div class="middle-pane-medium my-10 mt-20 md:mt-10">
<h1>Join the community</h1>
<p>
We thrive on uniting diverse perspectives, skills, and visions. Both
online and offline, we bring together tech and non-tech individuals,
activists, key players, hackers, lawyers, researchers, philosophers,
policymakers, local communities, and grassroots movements.
</p>
<div
class="grid place-items-center grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-2 pt-4 w-full"
>
<a
href={core.links.twitter}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon twitter"></div>
@web3privacy
</button>
</a>
<a
href={core.links.telegram}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon telegram"></div>
Telegram
</button>
</a>
<a
href={core.links.signal}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon"><img src="/icons/signal.svg" alt="" /></div>
Signal
</button>
</a>
<a
href={core.links.matrix}
class="bg-[#101010] w-full flex items-center justify-center w-full h-40 overflow-hidden"
>
<button class="flex flex-col items-center justify-center">
<div class="icon matrix"></div>
matrix
</button>
</a>
</div>
</div>
<div class="mt-16 mx-4">
<h1 class="my-6 middle-pane-medium">Community Partners</h1>
<div class="middle-pane-big">
<MembersGrid
people={core.people}
team={core.teams["community-partners"]}
/>
</div>
</div>
<AboutFooter {sectionsConfig} />
</BaseLayout>

File diff suppressed because one or more lines are too long

19
utils/captionParser.js Normal file
View file

@ -0,0 +1,19 @@
export function parseAndWrapCaptions(caption) {
return caption.replace(/\[([^\]]+)\]\((https?:\/\/[^\)]+)\)/g, (match,text, content) => {
// Split the content by spaces to identify potential URLs
const parts = content.split(' ');
const url = parts.find(part => part.startsWith('https://'));
if (url) {
// If a URL is found, wrap the content in an anchor tag using the first URL
return `<a href="${url}"
target="_blank"
class="text-white underline"
style="text-underline-offset: 4px;"
>${text}</a>`;
} else {
// If no URL, join the parts with a comma
return content.split(' ').join(', ');
}
});
}