Merge pull request #156 from life-itself/142-various-fixes
[site/theme]: Various UX/UI fixes
This commit is contained in:
Khalil Ali
GitHub
commit
979815a7ce
|
|
@ -59,6 +59,5 @@ Explore crypto and "web3" in terms of the claims made about it. These subclaims
|
|||
|
||||
## Taxonomy of Aspirations and Claims
|
||||
|
||||
https://coggle.it/diagram/YhTzF8ZnKihmLdpm/t/web3-taxonomy-of-aspirations-and-claims
|
||||
|
||||
|
||||
[](https://coggle.it/diagram/YhTzF8ZnKihmLdpm/t/web3-taxonomy-of-aspirations-and-claims
|
||||
)
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ export default function Features() {
|
|||
A Guide to Crypto and Web3
|
||||
</h2>
|
||||
<p className="mt-4 text-lg text-gray-500">
|
||||
Blockchain, tokens, NFTs, DAOs - what does it all mean? Our guide provides an accessible overview of the key concepts in Crypto and Web3.
|
||||
Blockchain, tokens, NFTs, DAOs - what does it all mean? Our guide provides an accessible overview of the key concepts in Crypto and Web3.
|
||||
</p>
|
||||
<div className="mt-6">
|
||||
<Link href="/guide/">
|
||||
|
|
@ -26,10 +26,10 @@ export default function Features() {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0">
|
||||
<div className="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md px-4 sm:max-w-xl sm:px-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="w-full lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none"
|
||||
className="w-full lg:absolute lg:inset-y-0 lg:left-0 lg:h-full lg:w-auto lg:max-w-3xl"
|
||||
src="/img/undraw_mind_map_re_nlb6_qh0jel.svg"
|
||||
alt="Discover"
|
||||
/>
|
||||
|
|
@ -46,12 +46,12 @@ export default function Features() {
|
|||
Library
|
||||
</h2>
|
||||
<p className="mt-4 text-lg text-gray-500">
|
||||
Want to learn more? We are maintaining a comprehensive library of articles, papers, books and other materials related to the space and the surrounding discourse. It provides deeper background on specific topics along with everything you need to fully engage with, and evaluate, Web3 and the claims being made about it.
|
||||
Want to learn more? We are maintaining a comprehensive library of articles, papers, books and other materials related to the space and the surrounding discourse. It provides deeper background on specific topics along with everything you need to fully engage with, and evaluate, Web3 and the claims being made about it.
|
||||
</p>
|
||||
<div className="mt-6">
|
||||
<Link href="/library/">
|
||||
<a
|
||||
|
||||
|
||||
className="inline-flex px-4 py-2 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-yellow-500 hover:bg-yellow-400"
|
||||
>
|
||||
Explore
|
||||
|
|
@ -61,10 +61,10 @@ export default function Features() {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1">
|
||||
<div className="pr-4 -ml-48 sm:pr-6 md:-ml-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md px-4 sm:max-w-xl sm:px-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:right-0 lg:h-full lg:w-auto lg:max-w-md"
|
||||
className="w-full lg:absolute lg:inset-y-0 lg:right-0 lg:h-full lg:w-auto lg:max-w-3xl"
|
||||
src="/img/undraw_bibliophile_re_xarc_ssxnqe.svg"
|
||||
alt="Library"
|
||||
/>
|
||||
|
|
@ -78,10 +78,10 @@ export default function Features() {
|
|||
<div>
|
||||
<div className="mt-6">
|
||||
<h2 className="text-3xl font-extrabold tracking-tight text-gray-900 dark:text-slate-100">
|
||||
Claims for Crypto and Web3
|
||||
Claims for Crypto and Web3
|
||||
</h2>
|
||||
<p className="mt-4 text-lg text-gray-500">
|
||||
Crypto and Web3 are associated with many bold claims. From classic technology boosterism of better and faster, to the radical transformation of our societies. But huge controversy surrounds these claims, and there’s a lack of agreement on even basic points and definitions.
|
||||
Crypto and Web3 are associated with many bold claims. From classic technology boosterism of better and faster, to the radical transformation of our societies. But huge controversy surrounds these claims, and there’s a lack of agreement on even basic points and definitions.
|
||||
</p>
|
||||
<div className="mt-6">
|
||||
<Link href="/claims">
|
||||
|
|
@ -95,10 +95,10 @@ export default function Features() {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0">
|
||||
<div className="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md px-4 sm:max-w-xl sm:px-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-md"
|
||||
className="w-full lg:absolute lg:inset-y-0 lg:left-0 lg:h-full lg:w-auto lg:max-w-3xl"
|
||||
src="/img/undraw_instant_analysis_re_mid5_i8r1hp.svg"
|
||||
alt="Learn More"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -2,86 +2,86 @@ import Link from 'next/link'
|
|||
|
||||
export default function GetInvolved() {
|
||||
return (
|
||||
<div className="relative bg-white dark:bg-transparent pt-16 pb-32 overflow-hidden">
|
||||
<div className="text-center">
|
||||
<h2 className="text-3xl tracking-tight font-extrabold text-white sm:text-4xl">Get Involved</h2>
|
||||
<p className="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
||||
This is a collective effort and we’re keen to involve collaborators and contributors.
|
||||
</p>
|
||||
</div>
|
||||
<div className="mt-20">
|
||||
<div className="lg:mx-auto lg:max-w-7xl lg:px-8 lg:grid lg:grid-cols-2 lg:grid-flow-col-dense lg:gap-24">
|
||||
<div className="px-4 max-w-xl mx-auto sm:px-6 lg:py-16 lg:max-w-none lg:mx-0 lg:px-0">
|
||||
<div>
|
||||
<div className="mt-6">
|
||||
<h2 className="text-3xl font-extrabold tracking-tight text-gray-900 dark:text-slate-100">
|
||||
Here's how you can get involved:
|
||||
</h2>
|
||||
<ul className="mt-4 text-lg text-gray-500 list-disc list-inside">
|
||||
<li> Contribute to the <a href="/library" className="text-white underline">library</a>, </li>
|
||||
<li> Write up key concepts, </li>
|
||||
<li> Proof edit articles and transcribe dialogs, </li>
|
||||
<li> Share the work with others. </li>
|
||||
</ul>
|
||||
<div className="relative bg-white dark:bg-transparent py-16 overflow-hidden">
|
||||
<div className="text-center">
|
||||
<h2 className="text-3xl tracking-tight font-extrabold text-white sm:text-4xl">Get Involved</h2>
|
||||
<p className="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
||||
This is a collective effort and we’re keen to involve collaborators and contributors.
|
||||
</p>
|
||||
</div>
|
||||
<div className="mt-20">
|
||||
<div className="lg:mx-auto lg:max-w-7xl lg:px-8 lg:grid lg:grid-cols-2 lg:grid-flow-col-dense lg:gap-24">
|
||||
<div className="px-4 max-w-xl mx-auto sm:px-6 lg:py-16 lg:max-w-none lg:mx-0 lg:px-0">
|
||||
<div>
|
||||
<div className="mt-6">
|
||||
<Link href="/contribute/">
|
||||
<h2 className="text-3xl font-extrabold tracking-tight text-gray-900 dark:text-slate-100">
|
||||
Here's how you can get involved:
|
||||
</h2>
|
||||
<ul className="mt-4 text-lg text-gray-500 list-disc list-inside">
|
||||
<li> Contribute to the <a href="/library" className="text-white underline">library</a>, </li>
|
||||
<li> Write up key concepts, </li>
|
||||
<li> Proof edit articles and transcribe dialogs, </li>
|
||||
<li> Share the work with others. </li>
|
||||
</ul>
|
||||
<div className="mt-6">
|
||||
<Link href="/contribute/">
|
||||
<a
|
||||
className="inline-flex px-4 py-2 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-yellow-500 hover:bg-yellow-400"
|
||||
>
|
||||
Get Involved
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md pl-4 sm:max-w-xl sm:pl-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="p-6 w-full lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none rounded-xl shadow-xl ring-1 ring-black ring-opacity-5"
|
||||
src="/img/undraw_development_re_g5hq_dyesjo.svg"
|
||||
alt="Get Involved"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-24">
|
||||
<div className="lg:mx-auto lg:max-w-7xl lg:px-8 lg:grid lg:grid-cols-2 lg:grid-flow-col-dense lg:gap-24">
|
||||
<div className="px-4 max-w-xl mx-auto sm:px-6 lg:py-32 lg:max-w-none lg:mx-0 lg:px-0 lg:col-start-2">
|
||||
<div>
|
||||
<div className="mt-6">
|
||||
<h2 className="text-3xl font-extrabold tracking-tight text-gray-900 dark:text-slate-100">
|
||||
We’d also love to have feedback through our forum:
|
||||
</h2>
|
||||
<ul className="mt-4 text-lg text-gray-500 list-disc list-inside">
|
||||
<li> Are there particular topics or areas we should cover? </li>
|
||||
<li> Do you disagree with any of our assessments? </li>
|
||||
<li> Have we missed or misunderstood something? </li>
|
||||
<li> Do you have feedback on how we structure or present the thinking? </li>
|
||||
</ul>
|
||||
<div className="mt-6">
|
||||
<a
|
||||
href="https://github.com/life-itself/web3/discussions"
|
||||
className="inline-flex px-4 py-2 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-yellow-500 hover:bg-yellow-400"
|
||||
>
|
||||
Get Involved
|
||||
Our Forum
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0">
|
||||
<div className="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-md"
|
||||
src="/img/undraw_development_re_g5hq_dyesjo.svg"
|
||||
alt="Get Involved"
|
||||
/>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md pr-4 sm:max-w-xl sm:pr-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="p-6 w-full lg:absolute lg:right-0 lg:h-full lg:w-auto lg:max-w-none rounded-xl shadow-xl ring-1 ring-black ring-opacity-5"
|
||||
src="/img/undraw_posts_re_ormv_bxhknn.svg"
|
||||
alt="Our Forum"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-24">
|
||||
<div className="lg:mx-auto lg:max-w-7xl lg:px-8 lg:grid lg:grid-cols-2 lg:grid-flow-col-dense lg:gap-24">
|
||||
<div className="px-4 max-w-xl mx-auto sm:px-6 lg:py-32 lg:max-w-none lg:mx-0 lg:px-0 lg:col-start-2">
|
||||
<div>
|
||||
<div className="mt-6">
|
||||
<h2 className="text-3xl font-extrabold tracking-tight text-gray-900 dark:text-slate-100">
|
||||
We’d also love to have feedback through our forum:
|
||||
</h2>
|
||||
<ul className="mt-4 text-lg text-gray-500 list-disc list-inside">
|
||||
<li> Are there particular topics or areas we should cover? </li>
|
||||
<li> Do you disagree with any of our assessments? </li>
|
||||
<li> Have we missed or misunderstood something? </li>
|
||||
<li> Do you have feedback on how we structure or present the thinking? </li>
|
||||
</ul>
|
||||
<div className="mt-6">
|
||||
<a
|
||||
href="https://github.com/life-itself/web3/discussions"
|
||||
className="inline-flex px-4 py-2 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-yellow-500 hover:bg-yellow-400"
|
||||
>
|
||||
Our Forum
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1">
|
||||
<div className="pr-4 -ml-48 sm:pr-6 md:-ml-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:right-0 lg:h-full lg:w-auto lg:max-w-md"
|
||||
src="/img/undraw_posts_re_ormv_bxhknn.svg"
|
||||
alt="Our Forum"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -57,10 +57,10 @@ export function Hero() {
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 -mb-16 sm:-mb-48 lg:m-0 lg:relative">
|
||||
<div className="mt-12 lg:m-0 lg:relative">
|
||||
<div className="mx-auto max-w-md px-4 sm:max-w-2xl sm:px-6 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="w-full lg:absolute lg:inset-y-0 lg:left-0 lg:h-full lg:w-auto lg:max-w-none"
|
||||
className="w-full lg:absolute lg:inset-y-0 lg:left-0 lg:h-full lg:w-auto lg:max-w-3xl"
|
||||
src="/img/undraw_digital_currency_qpak.svg"
|
||||
alt=""
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import Link from 'next/link'
|
|||
|
||||
export default function Why() {
|
||||
return (
|
||||
<div className="relative bg-white dark:bg-transparent pt-16 pb-32 overflow-hidden">
|
||||
<div className="relative bg-white dark:bg-transparent py-16 overflow-hidden">
|
||||
<div className="text-center">
|
||||
<h2 className="text-3xl tracking-tight font-extrabold text-white sm:text-4xl">
|
||||
Why this Project
|
||||
|
|
@ -38,10 +38,10 @@ export default function Why() {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0">
|
||||
<div className="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md px-4 sm:max-w-xl sm:px-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none"
|
||||
className="p-6 w-full lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none rounded-xl shadow-xl ring-1 ring-black ring-opacity-5"
|
||||
src="/img/undraw_nakamoto_-2-iv6_arq2lb.svg"
|
||||
alt="Read More"
|
||||
/>
|
||||
|
|
@ -80,9 +80,9 @@ export default function Why() {
|
|||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1">
|
||||
<div className="pr-4 -ml-48 sm:pr-6 md:-ml-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<div className="mx-auto max-w-xl px-4 sm:px-6 sm:max-w-2xl lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:right-0 lg:h-full lg:w-auto lg:max-w-none"
|
||||
className="p-6 w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:right-0 lg:h-full lg:w-auto lg:max-w-none"
|
||||
src="/img/undraw_connected_world_wuay_amttde.svg"
|
||||
alt="Read More"
|
||||
/>
|
||||
|
|
@ -117,25 +117,16 @@ export default function Why() {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0">
|
||||
<div className="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
|
||||
<div className="mx-auto max-w-md px-4 sm:max-w-xl sm:px-6 lg:m-0 lg:max-w-none lg:px-0">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none"
|
||||
className="p-6 w-full lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none rounded-xl shadow-xl ring-1 ring-black ring-opacity-5"
|
||||
src="/img/undraw_team_collaboration_re_ow29_s8gvrf.svg"
|
||||
alt="Read More"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-12 sm:mt-16 lg:mt-0">
|
||||
<div className="pl-4 -mr-48 sm:pl-6 md:-mr-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
|
||||
<img
|
||||
className="w-full rounded-xl shadow-xl ring-1 ring-black ring-opacity-5 lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-md"
|
||||
src="/img/undraw_team_collaboration_re_ow29_s8gvrf.svg"
|
||||
alt="Read More"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ We think good sensemaking begins by clarifying and agreeing the questions we wan
|
|||
|
||||
And here is our full structured tree of questions:
|
||||
|
||||
|
||||
[](https://coggle.it/diagram/Yh-L7j5DfRykGi7e/t/web3-what-is-the-evaluation-polarizing-way-as-possible)
|
||||
|
||||
## Our Approach
|
||||
|
||||
|
|
@ -57,7 +57,7 @@ We intend to take a distinctive approach. It has three key, layered components:
|
|||
|
||||
First, we distinguish the key claims being made and the underlying aspiration behind them. For example, “blockchain allows for easier collaborative decision making” connects to an aspiration of more democratic governance. This brings clarity to the discussion: claims are atomic, well-defined and separate but connected to aspirations.
|
||||
|
||||
|
||||
[](https://coggle.it/diagram/YnpnzQ8o3JWk-DSu/t/web3-taxonomy-of-aspirations-and-claims)
|
||||
|
||||
Second, we transparently structure and steel-man the claims. In particular, using hypothesis trees we can break down a larger claim into sub-claims. For example, “blockchain allows for easier collaborative decision making” could break down into the claims: “a major problem for collaborative decision making is creating and tracking votes, especially at scale” and “blockchain makes it easier to create and track votes”. We combine this structured approach with the principle of generosity or steel-manning: creating the best version of any claim or thesis.
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue