web3privacy
/
web
mirror of https://github.com/web3privacy/web
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: add individual & organistaion

This commit is contained in:
Diex5 2024-05-02 11:26:23 +02:00
parent 90de2fcc3c
commit f30b79c1c5
8 changed files with 771 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/engine.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 276 KiB

25
src/components/AboutWidget.astro
View File

@ -1,6 +1,11 @@
---
import * as config from "../config.yaml";
import core from "../core.json";
interface Props {
variant?: "about" | "membership";
}
const { variant = "about" } = Astro.props;
---
<div>
@ -39,7 +44,15 @@ import core from "../core.json";
€100 / Year
</span>
</div>
<a class="button" href="/membership"><button>LEARN MORE</button></a>
<a
class="button"
href={variant === "about"
? "/membership"
: "/membership/individual"}
><button
>{variant === "about" ? "LEARN MORE" : "INDIVIDUAL"}</button
></a
>
</div>
</div>
<img
@ -79,7 +92,15 @@ import core from "../core.json";
Variable tiers
</span>
</div>
<a class="button" href="/membership"><button>LEARN MORE</button></a>
<a
class="button"
href={variant === "about"
? "/membership"
: "/membership/organisation"}
><button
>{variant === "about" ? "LEARN MORE" : "ORGANISATION"}</button
></a
>
</div>
</div>
<img

173
src/components/OrganisationTableDesktop.astro Normal file
View File

@ -0,0 +1,173 @@
---
import * as config from "../config.yaml";
import core from "../core.json";
---
<div class="border-2 border-white flex flex-col">
<div
class="w-full bg-white px-[16px] flex py-[px] gap-4 items-start uppercase"
>
<div class="max-w-[120px] w-full">
<p class="text-black">CATEGORY</p>
</div>
<div class="max-w-[264px] w-full">
<p class="text-black">Objective</p>
</div>
<div class="max-w-[490px] w-full">
<p class="text-black">Details</p>
</div>
<div class="max-w-[120px] w-full">
<p class="text-black">More info</p>
</div>
</div>
<div class="px-[16px] py-[24px] flex items-start gap-4 border-b border-white">
<div class="max-w-[120px] w-full">
<p class="text-white font-bold uppercase">Events</p>
</div>
<div class="max-w-[264px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.events.map((item) => (
<p class="text-white " class:list={[`h-[${item.height}px]`]}>
{item.objective}
</p>
))
}
</div>
<div class="max-w-[490px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.events.map((item) => (
<p class="" class:list={[`h-[${item.height}px]`]}>
{item.details}
</p>
))
}
</div>
<div class="max-w-[120px] w-full flex flex-col gap-2 items-center">
{
config.organisation.table.events.map((item) => (
<a
class="button inverted"
class:list={[`h-[${item.height}px]`]}
href={item.url}
>
<button>MORE</button>
</a>
))
}
</div>
</div>
<div class="px-[16px] py-[24px] flex items-start gap-4 border-b border-white">
<div class="max-w-[120px] w-full">
<p class="text-white font-bold uppercase">RESEARCH</p>
</div>
<div class="max-w-[264px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.research.map((item) => (
<p class="text-white " class:list={[`h-[${item.height}px]`]}>
{item.objective}
</p>
))
}
</div>
<div class="max-w-[490px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.research.map((item) => (
<p class="" class:list={[`h-[${item.height}px]`]}>
{item.details}
</p>
))
}
</div>
<div class="max-w-[120px] w-full flex flex-col gap-2 items-center">
{
config.organisation.table.research.map((item) => (
<a
class="button inverted"
class:list={[`h-[${item.height}px]`]}
href={item.url}
>
<button>MORE</button>
</a>
))
}
</div>
</div>
<div class="px-[16px] py-[24px] flex items-start gap-4 border-b border-white">
<div class="max-w-[120px] w-full">
<p class="text-white font-bold uppercase">TOOLS</p>
</div>
<div class="max-w-[264px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.tools.map((item) => (
<p class="text-white " class:list={[`h-[${item.height}px]`]}>
{item.objective}
</p>
))
}
</div>
<div class="max-w-[490px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.tools.map((item) => (
<p class="" class:list={[`h-[${item.height}px]`]}>
{item.details}
</p>
))
}
</div>
<div class="max-w-[120px] w-full flex flex-col gap-2 items-center">
{
config.organisation.table.tools.map((item) => (
<a
class="button inverted"
class:list={[`h-[${item.height}px]`]}
href={item.url}
>
<button>MORE</button>
</a>
))
}
</div>
</div>
<div class="px-[16px] py-[24px] flex items-start gap-4 border-b border-white">
<div class="max-w-[120px] w-full">
<p class="text-white font-bold uppercase">education</p>
</div>
<div class="max-w-[264px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.education.map((item) => (
<p class="text-white " class:list={[`h-[${item.height}px]`]}>
{item.objective}
</p>
))
}
</div>
<div class="max-w-[490px] w-full flex flex-col gap-2 items-start">
{
config.organisation.table.education.map((item) => (
<p class="" class:list={[`h-[${item.height}px]`]}>
{item.details}
</p>
))
}
</div>
<div class="max-w-[120px] w-full flex flex-col gap-2 items-center">
{
config.organisation.table.education.map((item) =>
item.url ? (
<a
class="button inverted"
class:list={[`h-[${item.height}px]`]}
href={item.url}
>
<button>MORE</button>
</a>
) : (
<p class:list={[`h-[${item.height}px]`]} class="text-white">
&nbsp
</p>
)
)
}
</div>
</div>
</div>

81
src/components/OrganisationTableMobile.astro Normal file
View File

@ -0,0 +1,81 @@
---
import * as config from "../config.yaml";
import core from "../core.json";
---
<div class="border-2 border-white flex flex-col">
<div class="px-[16px] py-[18px] flex flex-col gap-4 border-b border-white">
<p class="text-white font-bold uppercase">EVENTS</p>
<div class="w-full flex flex-col items-start">
{
config.organisation.table.events.map((item) => (
<>
<p class="text-white ">{item.objective}</p>
<p>{item.details}</p>
{item.url && (
<a class="button inverted mb-4" href={item.url}>
<button>MORE</button>
</a>
)}
</>
))
}
</div>
</div>
<div
class="px-[16px] py-[18px] flex flex-col gap-4 border-b border-white h-full"
>
<p class="text-white font-bold uppercase">RESEARCH</p>
<div class="w-full flex flex-col items-start">
{
config.organisation.table.research.map((item) => (
<>
<p class="text-white ">{item.objective}</p>
<p>{item.details}</p>
{item.url && (
<a class="button inverted mb-4" href={item.url}>
<button>MORE</button>
</a>
)}
</>
))
}
</div>
</div>
<div class="px-[16px] py-[18px] flex flex-col gap-4 border-b border-white">
<p class="text-white font-bold uppercase">tools</p>
<div class="w-full flex flex-col items-start">
{
config.organisation.table.tools.map((item) => (
<>
<p class="text-white ">{item.objective}</p>
<p>{item.details}</p>
{item.url && (
<a class="button inverted mb-4" href={item.url}>
<button>MORE</button>
</a>
)}
</>
))
}
</div>
</div>
<div class="px-[16px] py-[18px] flex flex-col gap-4 border-b border-white">
<p class="text-white font-bold uppercase">education</p>
<div class="w-full flex flex-col items-start">
{
config.organisation.table.education.map((item) => (
<>
<p class="text-white ">{item.objective}</p>
<p>{item.details}</p>
{item.url && (
<a class="button inverted mb-4" href={item.url}>
<button>MORE</button>
</a>
)}
</>
))
}
</div>
</div>
</div>

67
src/config.yaml
View File

@ -120,3 +120,70 @@ landing:
ico: forum
community: |
Our aim with gatherings is to bring together key players, different perspectives, skills and visions. We aggregate tech and non tech people, key players and contributors, builders, researchers, philosophers, lawyers, policymakers, activists, local communities and general public.
organisation:
table:
events:
- objective: 6+ Events in different countires
details: |
1 Summit + 1 Hackathon + 3 Meetups [target outreach: 1000 people IRL]
height: 50
research:
- objective: Privacy in Ethereum
details: |
The most comprehensive report of privacy
url: /research/ethereum
height: 50
- objective: Use cases DB update & improve (500 → 700 privacy projects
details: |
Most extensive web3 db of privacy-enhancing solutions
url: /research/ethereum
height: 80
- objective: Privacy Annual Report (150+ pages)
details: |
Showcase all happenings and achievements of the year (3rd Edition)
url: /research/ethereum
height: 60
- objective: Privacy Awards
details: |
Annual vote of most popular and interesting privacy projects
url: /research/ethereum
height: 60
- objective: Week in Privacy
details: |
Newsletter with round-up of the most important privacy news
url: /research/ethereum
height: 60
- objective: Monthly Infographics & Articles
details: |
Release of useful material for tech & general public
url: /research/ethereum
height: 30
tools:
- objective: Privacy Explorer V.2
details: |
300 services, 5 new categories, improve scoring model
url: /research/ethereum
height: 50
- objective: Privacy Routing tool (V0.1 release)
details: |
Help users to choose the right service for their transactions
url: /research/ethereum
height: 50
education:
- objective: Academy
details: |
101 privacy educational track with our partners
height: 50
- objective: Hackathon Curation Pack
details: |
Guidelines to help the builders uderstand actual issues
url: /research/ethereum
height: 60
- objective: Privacy Guidelines for the public
details: |
url: /research/ethereum
height: 50

10
src/pages/membership.astro → src/pages/membership/index.astro
View File

@ -1,9 +1,9 @@
---
import BaseLayout from "../layouts/base.astro";
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 core from "../../core.json";
import AboutFooter from "../../components/AboutFooter.astro";
import AboutWidget from "../../components/AboutWidget.astro";
---
<BaseLayout
@ -22,7 +22,7 @@ import AboutWidget from "../components/AboutWidget.astro";
</h3>
</div>
<div>
<AboutWidget />
<AboutWidget variant="membership" />
</div>
<AboutFooter />

112
src/pages/membership/individual.astro Normal file
View File

@ -0,0 +1,112 @@
---
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";
---
<BaseLayout
title="MEMBERSHIP"
image="og_membership"
subimage="/membership/membership.png"
>
<div class="middle-pane-medium my-10">
<div class="flex flex-col gap-8 md:max-w-[1000px]">
<div class="flex flex-col gap-2">
<h1 class="mb-[0px]">individual membership</h1>
<span class=""> Become an integral part of our community! </span>
</div>
<div class="relative w-full border-b border-gray-950">
<div class="flex flex-col gap-[16px] py-[24px] 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 good thing!</li>
<li>Free access to all our events</li>
<li>"Privacy Survival Kit" swag bundle</li>
<li>Access to our researches and special group chats</li>
<li>Deals from our partners</li>
<li>Voting rights in our association</li>
</ul>
<div
class="flex w-full md:justify-between md:flex-row flex-col gap-[8px] md:items-center"
>
<div class="flex flex-col md:flex-row md:items-center gap-4">
<span>Price</span>
<span class="text-white font-bold text-[18px] leading-[1.4rem]">
€100 / Year
</span>
<a class="button" href=""><button>BECOME a member</button></a>
</div>
</div>
</div>
<img
src="/about/image1.png"
alt=""
class="absolute right-0 bottom-0 z-[-1] md:w-[280px]"
/>
</div>
<div class="flex flex-col gap-6">
<p class="text-white font-bold text-[18px] leading-[1.4rem]">
Membership details
</p>
<div class="flex flex-col gap-2">
<sp class="text-white"> Voting rights in our association </sp>
<p class="md:max-w-[1000px]">
For members who want to be more involved in the governance of our
initiative, we offer the opportunity to become a voting member of
our association. As a voting member, you will have the opportunity
to participate in the decisions of our Congress once a year by
voting on our plans and other topics. To become a voting member, you
must fill out a special form (upcoming) and be approved by the
association comittee.
</p>
</div>
<div class="flex flex-col gap-2">
<p class="text-white">Special chat group access</p>
<p class="md:max-w-[1000px]">
Private chat for all members where you can communicate directly with
the Core Team and connect with each other.
</p>
</div>
<div class="flex flex-col gap-2">
<p class="text-white">"Privacy Survival Kit" swag bundle</p>
<p class="md:max-w-[1000px]">
Collect your Privacy Survival Kit once a year [Pick up at our events
(for free) or by delivery (extra fee)]
</p>
</div>
<div class="flex flex-col gap-2">
<p class="text-white max-w-[900px]">
Opportunity to vote in a special category 
at the Privacy Tech
Awards
</p>
<p>
We are planning a special category in the Privacy Tech Awards where
only our members will be able to vote.
</p>
</div>
</div>
<div
class="border-2 border-white p-[24px] flex flex-col items-center justify-center text-center gap-6"
>
<p class="font-bold text-white text-[18px] leading-[1.4rem]">
We respect your privacy!
</p>
<p class="text-white">
Membership is essentially anonymous
and the list of members is
confidential
 - we do not require or collect any personal information
about our members unless they explicitly declare that they want to be
listed publicly.
</p>
<p class="text-white">
We only need one verifiable identifier, which can be an email or
cryptocurrency address 
(private key), which is used to prove your
membership.
</p>
</div>
</div>
</div>
</BaseLayout>

310
src/pages/membership/organisation.astro Normal file
View File

@ -0,0 +1,310 @@
---
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 OrganisationTableDesktop from "../../components/OrganisationTableDesktop.astro";
import OrganisationTableMobile from "../../components/OrganisationTableMobile.astro";
---
<BaseLayout
title="MEMBERSHIP"
image="og_membership"
subimage="/membership/membership.png"
>
<div class="middle-pane-medium my-10">
<div class="flex flex-col gap-8 md:max-w-[1000px]">
<div class="flex flex-col gap-2">
<h1 class="mb-[0px]">organisation membership</h1>
<span class="">
Instead of proposing partnerships for every event and/or
initiative,
we decided to implement a continuous membership approach.
</span>
</div>
<div class="relative w-full border-b border-gray-950">
<div class="flex flex-col gap-[16px] py-[24px] 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>Visibility at our Summits, Meetups & Hackathons</li>
<li>Free Tickets for team and discounts for your partners</li>
<li>
Finding right builders for your beta, product to test or develop
</li>
<li>Speaking and mentoring opportunities</li>
<li>Raise awareness within specific inputs</li>
<li>
Engage target audience via using (your and others) experts opinion
</li>
</ul>
<div
class="flex w-full md:justify-between md:flex-row flex-col gap-[8px] md:items-center"
>
<div class="flex flex-col md:flex-row md:items-center gap-4">
<span>Price</span>
<span class="text-white font-bold text-[18px] leading-[1.4rem]">
Variable tiers €7000+
</span>
<a class="button" href=""><button>CONTACT US</button></a>
</div>
</div>
</div>
<img
src="/about/image2.png"
alt=""
class="absolute right-0 bottom-0 z-[-1] md:w-[280px]"
/>
</div>
<div class="mb-[12px]">
<p class="text-white font-bold text-[18px] leading-[1.4rem]">
Why membership?
</p>
<ul class="list-decimal ml-[18px] text-white">
<li>Help to meet our respective specific and market needs</li>
<li>Avoid wasting time and resources.</li>
<li>
Guarantee visibility and services by leveraging all our ecosystem
and activities, and to structure a common growth path.
</li>
</ul>
</div>
<div>
<p class="text-white font-bold text-[18px] leading-[1.4rem]">
Our Principles
</p>
<ul class="list-decimal ml-[18px] text-white">
<li>
We care about our independence being an open-source &
community-driven organisation.
</li>
<li>
We don’t work for any company, but collaborate with them. The last
decision always on us.
</li>
<li>
Perfect match is a partner who cares about privacy market growth &
support advocacy. Together we can growth.
</li>
</ul>
</div>
<div>
<p>
This enable not just integrity of our work, but increase trust to both
W3PN activities & partner representation.
</p>
</div>
<div>
<img src="/engine.png" alt="" class="w-full" />
</div>
<div class="flex flex-col gap-6">
<p class="text-white font-bold text-[18px] leading-[1.4rem]">
Our OKRs for the year (2024)
</p>
<div>
<p>MAJOR</p>
<p class="text-white font-bold text-[18px] leading-[1.6rem]">
#1 Privacy-centric think tank behind critical advocacy ecosystem
</p>
<p>
“L2beat for privacy” aka Explorer, the biggest privacy-services DB,
privacy reports & researches, essential summits & meetups
</p>
</div>
<div>
<p>SUB</p>
<ul class="list-disc ml-[18px] text-white">
<li>
<span class="font-bold"> 10M annual reach </span>(socials, media,
events)
</li>
<li>
<span class="font-bold"> 2000 events visitors </span>(incl 100
privacy leaders)
</li>
<li>
<span class="font-bold"> 50 contributors </span> (beyond core team)
</li>
</ul>
</div>
<div>
<p class="text-white font-bold text-[18px]">Our Activities</p>
<p>
Our activities are multispectral as we want to improve privacy
alltogetgher.
</p>
</div>
<div>
<div class="md:block hidden">
<OrganisationTableDesktop />
</div>
<div class="md:hidden block">
<OrganisationTableMobile />
</div>
</div>
<div class="flex flex-col gap-2">
<p class="text-white text-[24px] font-bold my-8">
Value we can deliver
</p>
<div class="mb-16">
<p class="font-bold text-white text-[24px] mb-2">Events</p>
<ul class="list-disc ml-4 text-white">
<li>10M annual reach (socials, media, events)</li>
<li>
Visibility - before, during and after - at our Summits, Meetups
& Hackathons (Logo, Merch, Talks, Workshops, Recordings)
</li>
<li>Free Tickets for team and discounts for your partners</li>
<li>
Finding right builders for your beta, product to test or develop
</li>
<li>Speaking and mentoring opportunities</li>
<li>Panel curation upon specific needs</li>
<li>
Bigger outreach and Impact (we bring your brand, your team and
developing needs around every event we attend 
(ETHDam, ETHRome,
ETHBrno, ETHBarcelona, BlackSky…)
</li>
<li>50 contributors (beyond core team)</li>
</ul>
</div>
<div class="mb-6">
<p class="font-bold text-white text-[24px]">Research</p>
<span class="mb-2">
We carry on research delivering essays, reports, infographics,
github repos, decks, guidelines
</span>
<div class="mt-4">
<p class="text-white font-bold text-[16px]">Brand</p>
<ul class="list-disc ml-4 text-white">
<li>
Raise awareness within specific inputs (category, specs,
market)
</li>
<li>
Empower trust (product of choice, Tier1 category service, top
of mind)
</li>
<li>Logo at the end of every report</li>
<li>
Use report’s results stating you are supporting privacy
research (positive image)
</li>
<li>Underline your role in the market</li>
</ul>
</div>
<div class="mt-6">
<p class="text-white font-bold text-[16px]">Growth</p>
<ul class="list-disc ml-4 text-white">
<li>
Engage target audience via using (your and others) experts
opinion
</li>
<li>
Additional marketing content from infographics to charts
</li>
<li>
Third party validation of your specific claims (if they are
attested)
</li>
<li>Community building content</li>
<li>Priority in our publications and newsletter</li>
<li>Tailor made articles based upon specific needs</li>
</ul>
</div>
</div>
<div class="mb-6">
<p class="font-bold text-white text-[24px]">Explorer</p>
<span class="mb-2">
3in1: a ranking system, database & comprehensive profiling to
empower the general public in discerning the privacy levels,
security, and reliability of Web3 projects.
</span>
<div class="mt-4">
<p class="text-white font-bold text-[16px]">Brand</p>
<ul class="list-disc ml-4 text-white">
<li>Raise awareness within the category (gain reach)</li>
<li>Increase trust by building great profile</li>
<li>Improve trust by receiving a third party validation</li>
<li>Visibility through benchmarks</li>
</ul>
</div>
<div class="mt-4">
<p class="text-white font-bold text-[16px]">Product</p>
<ul class="list-disc ml-4 text-white">
<li>
Increase trial or generate leads by building a transparent
profile
</li>
<li>Support your releases</li>
</ul>
</div>
</div>
<div class="mb-4">
<p class="font-bold text-white text-[24px]">Academy</p>
<span class="mb-2">
We aim to realize Academy to educate tech and non tech people,
giving basics about digital privacy and practical use-cases,
directions…
</span>
<div class="mt-4">
<ul class="list-disc ml-4 text-white">
<li>Feature your experts opinion and content</li>
<li>Content joint production</li>
<li>
Co-develop domain-specific courses (wallet privacy 101,
ethereum privacy…)
</li>
</ul>
</div>
</div>
<div class="mb-4">
<p class="font-bold text-white text-[24px]">Financial</p>
<div class="mt-4">
<ul class="list-disc ml-4 text-white">
<li>Tax optimization through donation</li>
</ul>
</div>
</div>
<div class="mb-4">
<p class="font-bold text-white text-[24px]">Other</p>
<div class="mt-4">
<ul class="list-disc ml-4 text-white">
<li>
Organizing educational seminars for your employees, clients,
target audience
</li>
<li>Job listings (web, newsletter, socials…)</li>
<li>
We transform content you share in conferences into educational
material
</li>
<li>Special insights on market growth and evolution</li>
<li>Group for company members</li>
<li>Access to special members-only events</li>
</ul>
</div>
</div>
<div class="mb-4">
<p class="font-bold text-white text-[24px]">Tiers</p>
<div class="mt-4">
<ul class="list-disc ml-4 text-white">
<li>Membership fee: 7K - 40K EUR / year (depends on tier)</li>
<li>Non-profit membership fee: 1K EUR / year</li>
</ul>
</div>
</div>
<span class="text-white">
For Tier breakdown and details please write us
<a href="mailto:hello@web3privacy.info" class="underline"
>hello@web3privacy.info</a
>
</span>
</div>
</div>
</div>
</div></BaseLayout
>