on master help sign in
design updates to ids, groups, and application pages
3cd8702Gordon
components/gateway/GatewayHeader.js+2−2
@@ -16,11 +16,11 @@ const GatewayHeader = ({
16 <div className="flex flex-col">
16 <div className="flex flex-col">
17 <h2>{title}</h2>
17 <h2>{title}</h2>
18 {subtitle && (
18 {subtitle && (
19− <p className={(subtitleMono ? "font-mono" : "font-sans") + " pb-1"}>
19+ <p className={(subtitleMono ? "font-mono" : "font-sans") }>
20 {subtitle}
20 {subtitle}
21 </p>
21 </p>
22 )}
22 )}
23− <p>{item}</p>
23+ <p className="mt-1">{item}</p>
24 </div>
24 </div>
25 </div>
25 </div>
26 );
26 );
components/gateway/MetadataLink.js+1−1
@@ -5,7 +5,7 @@ const MetadataLink = ({ title, href, content }) => (
5 <p className="font-bold text-wall-400">{title}</p>
5 <p className="font-bold text-wall-400">{title}</p>
6 <Link href={href}>
6 <Link href={href}>
7 <div className="flex truncate">
7 <div className="flex truncate">
8− <a className="type-ui truncate font-mono text-green-400">{content}</a>
8+ <a className="truncate font-mono text-green-400">{content}</a>
9 </div>
9 </div>
10 </Link>
10 </Link>
11 </div>
11 </div>
content/applications/~dalten/gora.md+2
@@ -7,3 +7,5 @@ license = "MIT"
7website = "https://dalten.org"
7website = "https://dalten.org"
8bgColor = "#FCD977"
8bgColor = "#FCD977"
9+++
9+++
10+
11+A Proof of Attendance Protocol for Urbit
content/applications/~haddef-sigwen/transit.md+1
@@ -5,6 +5,7 @@ license = "MIT"
5image = "https://haddefsigwen1.s3.us-east-1.amazonaws.com/haddef-sigwen/2022.5.07..20.27.02-image.png"
5image = "https://haddefsigwen1.s3.us-east-1.amazonaws.com/haddef-sigwen/2022.5.07..20.27.02-image.png"
6bgColor = "#38285c"
6bgColor = "#38285c"
7developer = "~haddef-sigwen"
7developer = "~haddef-sigwen"
8+description = "Planetary transit occurs once per day."
8website = ""
9website = ""
9+++
10+++
10
11
content/applications/~lomder-librun/ballot.md+1
@@ -6,6 +6,7 @@ image = "https://lomder-librun.sfo3.digitaloceanspaces.com/tiles/ballot-app-tile
6bgColor = "#cebef0"
6bgColor = "#cebef0"
7developer = "~lomder-librun"
7developer = "~lomder-librun"
8website = "https://www.holium.com"
8website = "https://www.holium.com"
9+description = "An app that allows you to vote with other ships."
9+++
10+++
10
11
11An app that allows you to vote with other ships.
12An app that allows you to vote with other ships.
content/applications/~midlev-mindyr/astrolabe.md+1
@@ -6,6 +6,7 @@ image = "https://raw.githubusercontent.com/johnhyde/astrolabe/main/ui/src/assets
6bgColor = ""
6bgColor = ""
7developer = "~midlev-mindyr"
7developer = "~midlev-mindyr"
8website = "https://github.com/johnhyde/astrolabe"
8website = "https://github.com/johnhyde/astrolabe"
9+description = "Astrolabe (%astrolabe) is a one-stop shop %docket app for exploring Urbit address space."
9+++
10+++
10
11
11Astrolabe (%astrolabe) is a one-stop shop %docket app for exploring Urbit address space. Main features: ID Search, Sigil Search, Sky Chart, and Ship View (for viewing a given ship's details). Astrolabe integrates with %pals wherever possible, and contains documentation to explain the many quirks of Urbit address space to a new user.
12Astrolabe (%astrolabe) is a one-stop shop %docket app for exploring Urbit address space. Main features: ID Search, Sigil Search, Sky Chart, and Ship View (for viewing a given ship's details). Astrolabe integrates with %pals wherever possible, and contains documentation to explain the many quirks of Urbit address space to a new user.
content/applications/~nodmyn-dosrux/houston.md+1
@@ -6,6 +6,7 @@ image = "https://0x0.st/ojrj.png"
6bgColor = "#FFFFFF"
6bgColor = "#FFFFFF"
7developer = "~nodmyn-dosrux"
7developer = "~nodmyn-dosrux"
8website = "https://github.com/assemblycapital/houston"
8website = "https://github.com/assemblycapital/houston"
9+description = "Moon Management Dashboard"
9+++
10+++
10
11
11Moon Management Dashboard
12Moon Management Dashboard
content/applications/~norsyr-torryn/canvas.md+1
@@ -6,6 +6,7 @@ image = "https://yosoyubik.fra1.digitaloceanspaces.com/canvas/tile.svg"
6bgColor = "#3787B9"
6bgColor = "#3787B9"
7developer = "~norsyr-torryn"
7developer = "~norsyr-torryn"
8website = "https://github.com/yosoyubik/canvas"
8website = "https://github.com/yosoyubik/canvas"
9+description = "Collaborative Pixel Art"
9+++
10+++
10
11
11Collaborative Pixel Art
12Collaborative Pixel Art
content/applications/~ribben-donnyl/funes-notes.md+1
@@ -6,6 +6,7 @@ image = "https://is4-ssl.mzstatic.com/image/thumb/Purple112/v4/64/64/8b/64648bfc
6bgColor = ""
6bgColor = ""
7developer = "~ribben-donnyl"
7developer = "~ribben-donnyl"
8website = "https://funes.app"
8website = "https://funes.app"
9+description = "Mobile notetaking application using urbit's `%graph-store` as a backend."
9+++
10+++
10
11
11Mobile notetaking application [available for iOS](https://apps.apple.com/us/app/funes-notes/id1627315560), using urbit's `%graph-store` as a backend.
12Mobile notetaking application [available for iOS](https://apps.apple.com/us/app/funes-notes/id1627315560), using urbit's `%graph-store` as a backend.
content/applications/~sitden-sonnet/channel.md+1
@@ -6,6 +6,7 @@ image = "https://s3.us-east-1.amazonaws.com/haddefsigwen1/reciprocal/2022.7.09..
6bgColor = "#000000"
6bgColor = "#000000"
7developer = "Quartus Co., Reciprocal Ltd."
7developer = "Quartus Co., Reciprocal Ltd."
8website = "https://reciprocal.ltd"
8website = "https://reciprocal.ltd"
9+description = "A distributed imageboard platform, with love"
9+++
10+++
10
11
11### An imageboard platform, with love
12### An imageboard platform, with love
content/marketplaces/urbitex.md+1−1
@@ -4,4 +4,4 @@ image = "https://storage.googleapis.com/media.urbit.org/site/ecosystem/marketpla
4URL = "https://urbitex.io"
4URL = "https://urbitex.io"
5+++
5+++
6
6
7−Urbitex is a full-featured marketplace for buying and selling planets, stars, and galaxies.
7+Urbitex is an automated marketplace and network explorer for Urbit address space. Users can buy and sell planets, stars, and galaxies using a Web3 wallet, and search the network to find information about any Urbit ship.
pages/applications/[[...application]].js+2−5
@@ -105,12 +105,9 @@ const ApplicationPage = ({ data, markdown, params }) => {
105 Urbit is a clean-slate, peer-to-peer operating system and network.
105 Urbit is a clean-slate, peer-to-peer operating system and network.
106 </h3>
106 </h3>
107 <div className="flex flex-col space-y-4">
107 <div className="flex flex-col space-y-4">
108− <p className="text-sm font-semibold text-wall-400">
109− Learn how to install an Urbit application
110− </p>
111 <Link href="/guides/installing-applications" passHref>
108 <Link href="/guides/installing-applications" passHref>
112 <a className="button-lg max-w-xs bg-green-400 text-white">
109 <a className="button-lg max-w-xs bg-green-400 text-white">
113− Installing Urbit applications
110+ How to Install an Urbit Application
114 </a>
111 </a>
115 </Link>
112 </Link>
116 </div>
113 </div>
@@ -122,7 +119,7 @@ const ApplicationPage = ({ data, markdown, params }) => {
122 urbit.org?
119 urbit.org?
123 </p>
120 </p>
124 <Link href="/applications/submit" passHref>
121 <Link href="/applications/submit" passHref>
125− <a className="type-ui text-green-400">Submit your application</a>
122+ <a className="font-bold text-green-400">Submit your application</a>
126 </Link>
123 </Link>
127 </div>
124 </div>
128 <Link href="/" passHref>
125 <Link href="/" passHref>
pages/ecosystem/index.js+20−12
@@ -99,15 +99,19 @@ export default function Ecosystem({
99 Spotlight Archive
99 Spotlight Archive
100 </a>
100 </a>
101 </Link>
101 </Link>
102+ <Contact emphasize className="pt-36 self-center w-fit mx-auto" />
103+
102 </>
104 </>
103 )}
105 )}
104 <div
106 <div
105 className={classnames("grid gap-12 w-full", {
107 className={classnames("grid gap-12 w-full", {
106 "grid-cols-2 md:grid-cols-3": type !== "podcasts",
108 "grid-cols-2 md:grid-cols-3": type !== "podcasts",
107− "grid-cols-1 lg:grid-cols-2": type === "podcasts",
109+ "grid-cols-1": type === "podcasts",
110+ "grid-cols-1 md:grid-cols-1": type === "applications",
108 hidden: type === undefined,
111 hidden: type === undefined,
109 })}
112 })}
110 >
113 >
114+
111 {type === "organizations" &&
115 {type === "organizations" &&
112 organizations.map((org) => (
116 organizations.map((org) => (
113 <Link href={`/organizations/${org.slug}`}>
117 <Link href={`/organizations/${org.slug}`}>
@@ -120,18 +124,21 @@ export default function Ecosystem({
120 {type === "applications" &&
124 {type === "applications" &&
121 applications.map((app) => (
125 applications.map((app) => (
122 <Link href={`/applications/${app.ship}/${app.slug}`}>
126 <Link href={`/applications/${app.ship}/${app.slug}`}>
123− <div className="flex flex-col space-y-4 justify-center items-center cursor-pointer">
127+ <div className="flex space-x-4 items-center cursor-pointer ">
124 <div
128 <div
125− className="w-36 h-36 overflow-hidden rounded-xl"
129+ className="h-36 w-36 rounded-xl items-center justify-center"
126 style={{
130 style={{
127 backgroundColor: app?.bgColor || "rgba(0,0,0,0)",
131 backgroundColor: app?.bgColor || "rgba(0,0,0,0)",
128 }}
132 }}
129 >
133 >
130 {app?.image && (
134 {app?.image && (
131− <img className="w-full h-full" src={app.image} />
135+ <img className="items-center" src={app.image} />
132 )}
136 )}
133 </div>
137 </div>
138+ <div className="">
134− <p className="text-center font-bold">{app.title}</p>
139+ <p className="text-left font-bold">{app.title}</p>
140+ <p className="text-left text-wall-400 font-light">{app.description}</p>
141+ </div>
135 </div>
142 </div>
136 </Link>
143 </Link>
137 ))}
144 ))}
@@ -148,10 +155,10 @@ export default function Ecosystem({
148 podcasts.map((pod) => (
155 podcasts.map((pod) => (
149 <Link href={`/podcasts/${pod.slug}`}>
156 <Link href={`/podcasts/${pod.slug}`}>
150 <div className="flex cursor-pointer space-x-4 items-center">
157 <div className="flex cursor-pointer space-x-4 items-center">
151− <img className="w-36" src={pod.image} />
158+ <img className="w-28" src={pod.image} />
152− <div className="flex flex-col space-y-4 min-w-0">
159+ <div className="flex flex-col space-y-2 min-w-0">
153 <p className="font-bold">{pod.podcast}</p>
160 <p className="font-bold">{pod.podcast}</p>
154− <p className="truncate min-w-0 min-h-0">
161+ <p className="min-w-0 min-h-0 leading-5 ">
155 {pod.title}
162 {pod.title}
156 </p>
163 </p>
157 <p className="text-wall-400">{pod.date}</p>
164 <p className="text-wall-400">{pod.date}</p>
@@ -162,7 +169,8 @@ export default function Ecosystem({
162 </div>
169 </div>
163 </div>
170 </div>
164 </div>
171 </div>
165− <Contact emphasize className="pt-36 self-center w-fit mx-auto" />
172+
173+
166 </Section>
174 </Section>
167 </SingleColumn>
175 </SingleColumn>
168 <Footer />
176 <Footer />
@@ -176,8 +184,8 @@ function ActiveLink({ children, href, className, currentPath }) {
176 currentPath === "/ecosystem?type=archive" && href === "/ecosystem"
184 currentPath === "/ecosystem?type=archive" && href === "/ecosystem"
177 );
185 );
178 const activeClassName = classnames({
186 const activeClassName = classnames({
179− "text-wall-600": currentPath === href || archive,
187+ "text-wall-800": currentPath === href || archive,
180− "text-wall-500": currentPath !== href && !archive,
188+ "text-wall-400": currentPath !== href && !archive,
181 });
189 });
182
190
183 return (
191 return (
@@ -325,7 +333,7 @@ export async function getStaticProps({}) {
325 .filter((f) => f.isDirectory())
333 .filter((f) => f.isDirectory())
326 .map((dir) =>
334 .map((dir) =>
327 getAllPosts(
335 getAllPosts(
328− ["title", "bgColor", "image", "slug"],
336+ ["title", "bgColor", "image", "slug", "description"],
329 `applications/${dir.name}`
337 `applications/${dir.name}`
330 )
338 )
331 .map((e) => ({ ...e, ship: dir.name }))
339 .map((e) => ({ ...e, ship: dir.name }))
pages/groups/[[...group]].js+3−5
@@ -99,12 +99,10 @@ const GroupPage = ({ data, markdown, params }) => {
99 Urbit is a clean-slate, peer-to-peer operating system and network.
99 Urbit is a clean-slate, peer-to-peer operating system and network.
100 </h3>
100 </h3>
101 <div className="flex flex-col space-y-4">
101 <div className="flex flex-col space-y-4">
102− <p className="text-sm font-semibold text-wall-400">
102+
103− Get on the network and join this group.
104− </p>
105 <Link href="/guides/joining-groups" passHref>
103 <Link href="/guides/joining-groups" passHref>
106 <a className="button-lg max-w-xs bg-green-400 text-white">
104 <a className="button-lg max-w-xs bg-green-400 text-white">
107− How to join a group
105+ How to Join an Urbit Group
108 </a>
106 </a>
109 </Link>
107 </Link>
110 </div>
108 </div>
@@ -113,7 +111,7 @@ const GroupPage = ({ data, markdown, params }) => {
113 <div className="flex flex-col space-y-1">
111 <div className="flex flex-col space-y-1">
114 <p>Have a group you'd like to share publicly through urbit.org?</p>
112 <p>Have a group you'd like to share publicly through urbit.org?</p>
115 <Link href="/groups/submit" passHref>
113 <Link href="/groups/submit" passHref>
116− <a className="type-ui text-green-400">Submit your group</a>
114+ <a className="font-bold text-green-400">Submit your group</a>
117 </Link>
115 </Link>
118 </div>
116 </div>
119 <Link href="/" passHref>
117 <Link href="/" passHref>
pages/ids/[id].js+2−5
@@ -145,12 +145,9 @@ const IdPage = ({ data, markdown, applications, groups, network, params }) => {
145 Urbit is a clean-slate, peer-to-peer operating system and network.
145 Urbit is a clean-slate, peer-to-peer operating system and network.
146 </h3>
146 </h3>
147 <div className="flex flex-col space-y-4">
147 <div className="flex flex-col space-y-4">
148− <p className="text-md font-semibold text-wall-400">
149− Learn how get your own Urbit ID.
150− </p>
151 <Link href="/guides/getting-an-urbit-id">
148 <Link href="/guides/getting-an-urbit-id">
152 <button className="button-lg max-w-xs bg-green-400 text-white">
149 <button className="button-lg max-w-xs bg-green-400 text-white">
153− Get an Urbit ID
150+ Learn how to get an Urbit ID
154 </button>
151 </button>
155 </Link>
152 </Link>
156 </div>
153 </div>
@@ -159,7 +156,7 @@ const IdPage = ({ data, markdown, applications, groups, network, params }) => {
159 <div className="flex flex-col space-y-1">
156 <div className="flex flex-col space-y-1">
160 <p>Have an Urbit ID?</p>
157 <p>Have an Urbit ID?</p>
161 <Link href="/ids/submit" passHref>
158 <Link href="/ids/submit" passHref>
162− <a className="type-ui text-green-400">
159+ <a className="font-bold text-green-400">
163 Claim and customize your Urbit ID page
160 Claim and customize your Urbit ID page
164 </a>
161 </a>
165 </Link>
162 </Link>