git.iko.soy/urbit.org
on master help sign in
front page cleanup
2cf3a44Gavin Atkinson
components/Header.js+1−1
compare with master
unifiedsplit
@@ -8,7 +8,7 @@ export default function Header() {
8 <Link href="/docs"><a className="type-ui text-gray mr-6">Docs</a></Link>
8 <Link href="/docs"><a className="type-ui text-gray mr-6">Docs</a></Link>
9 <Link href="/blog"><a className="type-ui text-gray mr-6">Blog</a></Link>
9 <Link href="/blog"><a className="type-ui text-gray mr-6">Blog</a></Link>
10 <Link href="/events"><a className="type-ui text-gray mr-6">Events</a></Link>
10 <Link href="/events"><a className="type-ui text-gray mr-6">Events</a></Link>
11− <button className="button-sm">Download Port</button>
11+ <button className="button-sm bg-green">Download Port</button>
12 </nav>
12 </nav>
13 </header>
13 </header>
14 )
14 )
pages/blog/[slug].js+1−3
@@ -58,9 +58,7 @@ export async function getStaticProps({ params }) {
58 'description',
58 'description',
59 'extra',
59 'extra',
60 ], 'blog')
60 ], 'blog')
61−
61+
62− // console.log(previousPost, nextPost)
63−
64 const post = getPostBySlug(params.slug, [
62 const post = getPostBySlug(params.slug, [
65 'title',
63 'title',
66 'slug',
64 'slug',
pages/index.js+43−37
@@ -32,67 +32,73 @@ export default function Home({ posts, events }) {
32 <Header />
32 <Header />
33
33
34 <section className="layout-narrow pt-48">
34 <section className="layout-narrow pt-48">
35+ <h1>A general-purpose,</h1>
36+ <h1>peer-to-peer,</h1>
35− <h1>A general-purpose, peer-to-peer, personal computing system.</h1>
37+ <h1>personal computing system.</h1>
36 </section>
38 </section>
37
39
38 <section className="layout-wide pt-48">
40 <section className="layout-wide pt-48">
39− <div className="bg-yellow w-11/12 hero-card-height rounded-3xl flex">
41+ <div className="bg-wall w-11/12 hero-card-height rounded-3xl flex">
40 <div className="pt-20 pl-12 w-7/12">
42 <div className="pt-20 pl-12 w-7/12">
41− <div className="pb-7">
43+ <div className="pb-8">
42− <h2 className="text-gray p-0 m-0">Introducing</h2><h2 className="p-0 m-0">Port</h2>
44+ <h2 className="p-0 m-0 pb-2">Introducing</h2><h2 className="text-green p-0 m-0">Port</h2>
43 </div>
45 </div>
44− <h3 className="pb-5">The Urbit client, now in beta.</h3>
46+ <h3 className="pb-8">The Urbit client, now in beta.</h3>
45− <p className="pb-5">Port lets you... Sed iste iusto deserunt id dolores dignissimos est expedita. Earum ut et nemo et voluptatem sunt ea. Delectus sed unde fugit reiciendis. Voluptatum animi laborum fugit dolores. Dolore qui asperiores eum iusto debitis sit. Et vel dolores voluptas.</p>
47+ <p className="pb-24">Getting into Urbit is now as simple as installing an app on your computer.</p>
46− <button className="button-lg type-ui mb-5">Download For Mac</button>
48+ <button className="button-lg type-ui mb-5 bg-green">Download For Mac</button>
47− <a className="">View on GitHub</a>
49+ <a className="type-ui text-gray">View on GitHub</a>
48 </div>
50 </div>
49 <div className="bg-black w-full rounded-xl hero-image-height hero-image mt-8" />
51 <div className="bg-black w-full rounded-xl hero-image-height hero-image mt-8" />
50 </div>
52 </div>
51 </section>
53 </section>
52
54
53− <section className="layout-narrow pt-48">
54− <div className='measure'>
55− <h2 className="pb-12">Develop on Urbit</h2>
56− <h3 className="pb-12">
57− Urbit is a personal OS designed from scratch to run peer-to-peer applications.
58− </h3>
59− <p className="pb-12">
60− The entire OS is a <a>single pure function</a> that provides application developers with strong guarantees: automated persistence and memory management, repeatable builds, and support for hot code reloading.
61− </p>
62− <button className="button-lg type-ui">Contribute</button>
63− </div>
64− </section>
65−
66 <section className="layout-narrow pt-48">
55 <section className="layout-narrow pt-48">
67 <div className='flex items-center measure pb-12'>
56 <div className='flex items-center measure pb-12'>
68 <h2 className="m-0 p-0 mr-4">Urbit Grants</h2>
57 <h2 className="m-0 p-0 mr-4">Urbit Grants</h2>
69− <button className="flex bg-green type-ui px-4 items-center justify-center h-12 rounded-full">32 Open</button>
58+ <button className="flex bg-green text-white type-ui px-4 items-center justify-center h-12 rounded-full">32 Open</button>
70 </div>
59 </div>
71− <h3 className="pb-12 measure">
72− Contribute to Urbit and get rewarded with address space.
73− </h3>
74− <div className="flex w-full items-center bg-lightGreen px-8 py-10 rounded-xl">
60+ <div className="flex w-full items-center bg-washedGreen px-8 py-8 rounded-xl">
75 <div className="flex items-center flex-col p-4 w-full">
61 <div className="flex items-center flex-col p-4 w-full">
76− <h2>200+</h2>
62+ <h2 className="text-green">200+</h2>
77− <h3 className="text-gray text-center pt-4">Urbit stars awarded</h3>
63+ <h3 className="text-green text-center pt-2">Urbit stars awarded</h3>
78 </div>
64 </div>
79− <div className="h-32 w-4 bg-green" />
65+ <div className="h-24 w-4 bg-lightGreen" />
80 <div className="flex items-center flex-col p-4 w-full">
66 <div className="flex items-center flex-col p-4 w-full">
81− <h2>1M+</h2>
67+ <h2 className="text-green">1M+</h2>
82− <h3 className="text-gray text-center pt-4">USD Rewarded</h3>
68+ <h3 className="text-green text-center pt-2">USD Rewarded</h3>
83 </div>
69 </div>
84− <div className="h-32 w-4 bg-green" />
70+ <div className="h-24 w-4 bg-lightGreen" />
85 <div className="flex items-center flex-col p-4 w-full">
71 <div className="flex items-center flex-col p-4 w-full">
86− <h2>90+</h2>
72+ <h2 className="text-green">90+</h2>
87− <h3 className="text-gray text-center pt-4">Grants completed</h3>
73+ <h3 className="text-green text-center pt-2">Grants completed</h3>
88 </div>
74 </div>
89 </div>
75 </div>
90 <div className='measure py-12'>
76 <div className='measure py-12'>
91 <p className="pb-12">We regularly give away address space to reward community contributions, including education, promotion, and development.</p>
77 <p className="pb-12">We regularly give away address space to reward community contributions, including education, promotion, and development.</p>
92− <button className="button-lg">View Grants</button>
78+ <button className="button-lg bg-green">View Grants</button>
93 </div>
79 </div>
94 </section>
80 </section>
95
81
82+ <section className="layout-narrow pt-48">
83+ <div className='measure'>
84+ <h2 className="pb-12">Build on Urbit</h2>
85+ <h3 className="pb-12">
86+ Urbit is a personal OS designed from scratch to run peer-to-peer applications.
87+ </h3>
88+ <p className="pb-12">
89+ It solves the hard problems of implementing a peer-to-peer network (including identity, NAT traversal, and exactly-once delivery) in the kernel so app developers canfocus on business logic.
90+ </p>
91+ <p className="pb-12">
92+ The entire OS is a <a>single pure function</a> that provides application developers with strong guarantees: automated persistence and memory management, repeatable builds, and support for hot code reloading.
93+ </p>
94+ <p className="pb-12">
95+ You can get started learning how to <Link href=''><a>contribute to the project</a></Link>, or view a variety of <Link href=''><a>libraries</a></Link> for building on Urbit using the languages you already know.
96+ </p>
97+ <button className="button-lg type-ui bg-black">Read the Developer Docs</button>
98+ </div>
99+ </section>
100+
101+
96 <section className="layout-narrow pt-48">
102 <section className="layout-narrow pt-48">
97 <div className='flex items-center measure pb-12'>
103 <div className='flex items-center measure pb-12'>
98 <button
104 <button
@@ -116,9 +122,9 @@ export default function Home({ posts, events }) {
116 <Link href={'/blog/' + post.slug} key={`post-${post.slug}`}>
122 <Link href={'/blog/' + post.slug} key={`post-${post.slug}`}>
117 <div>
123 <div>
118 <BackgroundImage src={post.extra.image || ''} />
124 <BackgroundImage src={post.extra.image || ''} />
119− <p className='text-black mt-2'>{post.title}</p>
125+ <p className='text-black type-h3 mt-2'>{post.title}</p>
120 <caption className='text-black mt-2'>{post.extra.author}</caption>
126 <caption className='text-black mt-2'>{post.extra.author}</caption>
121− <caption className='text-gray'>{post.date}</caption>
127+ <caption className='text-gray mt-2'>{post.date}</caption>
122 </div>
128 </div>
123 </Link>
129 </Link>
124 </div>
130 </div>
styles/globals.css+3−3
@@ -47,7 +47,7 @@ h3, .type-h3 {
47 }
47 }
48
48
49 p, .type-p {
49 p, .type-p {
50− @apply text-lg font-sans font-medium;
50+ @apply text-lg font-sans;
51 }
51 }
52
52
53 caption, .type-caption {
53 caption, .type-caption {
@@ -55,12 +55,12 @@ h3, .type-h3 {
55 }
55 }
56
56
57 .button-sm {
57 .button-sm {
58− @apply flex px-4 py-1 bg-black rounded text-white type-ui;
58+ @apply flex px-4 py-1 rounded text-white type-ui;
59 border:none;
59 border:none;
60 }
60 }
61
61
62 .button-lg {
62 .button-lg {
63− @apply flex px-6 py-2 bg-black rounded-lg text-white h-16 flex-center type-ui;
63+ @apply flex px-6 py-2 rounded-lg text-white h-16 flex-center type-ui;
64 border:none;
64 border:none;
65 }
65 }
66
66
styles/markdown.module.css+2−2
@@ -1,6 +1,6 @@
1.markdown {
1.markdown {
2 @apply leading-relaxed;
2 @apply leading-relaxed;
3− }
3+}
4
4
5 .markdown p,
5 .markdown p,
6 .markdown ul,
6 .markdown ul,
@@ -14,7 +14,7 @@
14 }
14 }
15
15
16 .markdown h2 {
16 .markdown h2 {
17− @apply font-semibold mt-12 mb-4;
17+ @apply font-semibold mt-12 mb-4;
18 }
18 }
19
19
20 .markdown h3 {
20 .markdown h3 {
tailwind.config.js+2−1
@@ -6,11 +6,12 @@ module.exports = {
6 black: '#000',
6 black: '#000',
7 white: '#FFF',
7 white: '#FFF',
8 gray: 'rgba(0, 0, 0, 0.6)',
8 gray: 'rgba(0, 0, 0, 0.6)',
9+ wall: 'rgba(244, 243, 241, 1)',
9 yellow: '#FCDB63',
10 yellow: '#FCDB63',
10 midYellow: 'rgba(255, 199, 0, 0.6)',
11 midYellow: 'rgba(255, 199, 0, 0.6)',
11 lightYellow: 'rgba(255, 199, 0, 0.3)',
12 lightYellow: 'rgba(255, 199, 0, 0.3)',
12 washedYellow: 'rgba(255, 199, 0, 0.05)',
13 washedYellow: 'rgba(255, 199, 0, 0.05)',
13− green: 'rgba(0, 159, 101, 1)',
14+ green: 'rgba(0, 177, 113, 1)',
14 midGreen: 'rgba(0, 159, 101, 0.6)',
15 midGreen: 'rgba(0, 159, 101, 0.6)',
15 lightGreen: 'rgba(0, 159, 101, 0.3)',
16 lightGreen: 'rgba(0, 159, 101, 0.3)',
16 washedGreen: 'rgba(0, 159, 101, 0.05)',
17 washedGreen: 'rgba(0, 159, 101, 0.05)',