Merge pull request #156 from life-itself/142-various-fixes

[site/theme]: Various UX/UI fixes
This commit is contained in:
Khalil Ali 2022-05-11 16:50:04 +03:00 committed by GitHub
commit 979815a7ce
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 98 additions and 108 deletions

View File

@ -59,6 +59,5 @@ Explore crypto and "web3" in terms of the claims made about it. These subclaims
## Taxonomy of Aspirations and Claims ## Taxonomy of Aspirations and Claims
https://coggle.it/diagram/YhTzF8ZnKihmLdpm/t/web3-taxonomy-of-aspirations-and-claims [![](/img/Web3_Taxonomy_of_Aspirations_and_Claims_m4bmpq.png)](https://coggle.it/diagram/YhTzF8ZnKihmLdpm/t/web3-taxonomy-of-aspirations-and-claims
)
![](/img/Web3_Taxonomy_of_Aspirations_and_Claims_m4bmpq.png)

View File

@ -26,10 +26,10 @@ export default function Features() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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="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 <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" src="/img/undraw_mind_map_re_nlb6_qh0jel.svg"
alt="Discover" alt="Discover"
/> />
@ -61,10 +61,10 @@ export default function Features() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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-md px-4 sm:max-w-xl sm:px-6 lg:m-0 lg:max-w-none lg:px-0">
<img <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" src="/img/undraw_bibliophile_re_xarc_ssxnqe.svg"
alt="Library" alt="Library"
/> />
@ -95,10 +95,10 @@ export default function Features() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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="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 <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" src="/img/undraw_instant_analysis_re_mid5_i8r1hp.svg"
alt="Learn More" alt="Learn More"
/> />

View File

@ -2,7 +2,7 @@ import Link from 'next/link'
export default function GetInvolved() { export default function GetInvolved() {
return ( 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"> <div className="text-center">
<h2 className="text-3xl tracking-tight font-extrabold text-white sm:text-4xl">Get Involved</h2> <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"> <p className="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
@ -35,10 +35,10 @@ export default function GetInvolved() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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="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 <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="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" src="/img/undraw_development_re_g5hq_dyesjo.svg"
alt="Get Involved" alt="Get Involved"
/> />
@ -71,10 +71,10 @@ export default function GetInvolved() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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-md pr-4 sm:max-w-xl sm:pr-6 lg:m-0 lg:max-w-none lg:px-0">
<img <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="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" src="/img/undraw_posts_re_ormv_bxhknn.svg"
alt="Our Forum" alt="Our Forum"
/> />

View File

@ -57,10 +57,10 @@ export function Hero() {
</p> </p>
</div> </div>
</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"> <div className="mx-auto max-w-md px-4 sm:max-w-2xl sm:px-6 lg:max-w-none lg:px-0">
<img <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" src="/img/undraw_digital_currency_qpak.svg"
alt="" alt=""
/> />

View File

@ -2,7 +2,7 @@ import Link from 'next/link'
export default function Why() { export default function Why() {
return ( 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"> <div className="text-center">
<h2 className="text-3xl tracking-tight font-extrabold text-white sm:text-4xl"> <h2 className="text-3xl tracking-tight font-extrabold text-white sm:text-4xl">
Why this Project Why this Project
@ -38,10 +38,10 @@ export default function Why() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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="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 <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" src="/img/undraw_nakamoto_-2-iv6_arq2lb.svg"
alt="Read More" alt="Read More"
/> />
@ -80,9 +80,9 @@ export default function Why() {
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1"> <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 <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" src="/img/undraw_connected_world_wuay_amttde.svg"
alt="Read More" alt="Read More"
/> />
@ -117,25 +117,16 @@ export default function Why() {
</div> </div>
</div> </div>
</div> </div>
<div className="mt-12 sm:mt-16 lg:mt-0"> <div className="mt-12 sm:mt-16 lg:mt-0 lg:relative">
<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="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 <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" src="/img/undraw_team_collaboration_re_ow29_s8gvrf.svg"
alt="Read More" alt="Read More"
/> />
</div> </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_team_collaboration_re_ow29_s8gvrf.svg"
alt="Read More"
/>
</div>
</div>
</div> </div>
</div> </div>
); );

View File

@ -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: And here is our full structured tree of questions:
![](/img/Web3_What_is_the_evaluation_of_the_various_claims_ve_or_-ve_for_web3crypto_and_the_supporting_reasoningsensemaking_so_that__we_collectively_as_individuals_societies_etc_make_good_choices_te_the_technology_wh_awh0yl.png) [![](/img/Web3_What_is_the_evaluation_of_the_various_claims_ve_or_-ve_for_web3crypto_and_the_supporting_reasoningsensemaking_so_that__we_collectively_as_individuals_societies_etc_make_good_choices_te_the_technology_wh_awh0yl.png)](https://coggle.it/diagram/Yh-L7j5DfRykGi7e/t/web3-what-is-the-evaluation-polarizing-way-as-possible)
## Our Approach ## 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. 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.
![](/img/Web3_Taxonomy_of_Aspirations_and_Claims_m4bmpq.png) [![](/img/Web3_Taxonomy_of_Aspirations_and_Claims_m4bmpq.png)](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. 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.