mirror of
https://github.com/urbit/developers.urbit.org.git
synced 2024-07-07 10:36:26 +03:00
build: new site landing page
This commit is contained in:
Matilde Park
parent
497bf2c326
commit
53fddd1811
17
.eslintrc.js
17
.eslintrc.js
|
|
@ -1,17 +0,0 @@
|
|||
module.exports = {
|
||||
env: {
|
||||
browser: true,
|
||||
es2021: false,
|
||||
node: true,
|
||||
},
|
||||
extends: ["plugin:react/recommended", "standard", "prettier"],
|
||||
parserOptions: {
|
||||
ecmaFeatures: {
|
||||
jsx: true,
|
||||
},
|
||||
ecmaVersion: 8,
|
||||
sourceType: "module",
|
||||
},
|
||||
plugins: ["react"],
|
||||
rules: { "react/prop-types": 0 },
|
||||
};
|
||||
13
.gitignore
vendored
13
.gitignore
vendored
|
|
@ -1,19 +1,14 @@
|
|||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# next.js
|
||||
/.next/
|
||||
/out/
|
||||
.next
|
||||
|
||||
# production
|
||||
/build
|
||||
/cache
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
|
|
@ -25,6 +20,7 @@ yarn-debug.log*
|
|||
yarn-error.log*
|
||||
|
||||
# local env files
|
||||
.env
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
|
|
@ -32,3 +28,6 @@ yarn-error.log*
|
|||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
# editors
|
||||
/.nova
|
||||
34
README.md
34
README.md
|
|
@ -1,10 +1,34 @@
|
|||
# Urbit Developers Portal
|
||||
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
|
||||
|
||||
Uses [Next.js](https://nextjs.org/docs) with [remark](https://unifiedjs.com/explore/package/remark/) and [Tailwind CSS](https://tailwindcss.com/docs)
|
||||
## Getting Started
|
||||
|
||||
To develop locally:
|
||||
First, run the development server:
|
||||
|
||||
```
|
||||
yarn install
|
||||
```bash
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
|
||||
|
||||
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
|
||||
|
||||
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
|
||||
|
||||
## Learn More
|
||||
|
||||
To learn more about Next.js, take a look at the following resources:
|
||||
|
||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
||||
|
||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
|
||||
|
||||
## Deploy on Vercel
|
||||
|
||||
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
||||
|
||||
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
|
||||
|
|
|
|||
49
components/Card.js
Normal file
49
components/Card.js
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
import Link from "next/link";
|
||||
import classNames from "classnames";
|
||||
|
||||
export default function Card({
|
||||
href = "/",
|
||||
icon = null,
|
||||
title,
|
||||
text,
|
||||
callout = "",
|
||||
className = "",
|
||||
}) {
|
||||
return callout ? (
|
||||
<div
|
||||
id={callout === "" ? "card" : ""}
|
||||
className={classNames(
|
||||
"bg-wall-100 rounded-xl p-7 items-stretch relative flex",
|
||||
{ "space-x-4": icon },
|
||||
className
|
||||
)}
|
||||
>
|
||||
{icon}
|
||||
<div className="flex flex-col justify-between pr-4">
|
||||
<h3 className="font-bold">{title}</h3>
|
||||
<p>{text}</p>
|
||||
<Link href={href} passHref>
|
||||
<a className="button-sm bg-green-400 text-white w-fit mt-4">
|
||||
{callout}
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<Link href={href}>
|
||||
<div
|
||||
id={callout === "" ? "card" : ""}
|
||||
className={
|
||||
"bg-wall-100 rounded-xl flex space-x-4 p-7 items-center relative cursor-pointer " +
|
||||
className
|
||||
}
|
||||
>
|
||||
{icon}
|
||||
<div className="flex flex-col pr-4">
|
||||
<p className="font-bold">{title}</p>
|
||||
<p>{text}</p>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
import React from "react";
|
||||
|
||||
export default function Container({ children }) {
|
||||
return (
|
||||
<div className="flex flex-col min-h-screen w-full items-center">
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,163 +1,6 @@
|
|||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import SingleColumn from "./SingleColumn";
|
||||
import Section from "./Section";
|
||||
import { Footer as FooterComponent } from "foundation-design-system";
|
||||
import { footerData } from "../lib/constants";
|
||||
|
||||
export default function Footer() {
|
||||
return (
|
||||
<footer className="bg-wall-100 mt-20 w-full flex justify-center">
|
||||
<SingleColumn>
|
||||
<Section short className="flex flex-row flex-wrap">
|
||||
<div className="w-1/2 md:w-1/3 flex flex-col flex-shrink">
|
||||
<h4 className="mt-16 mb-8">Use Urbit</h4>
|
||||
<Link href="https://urbit.org/getting-started">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Getting Started</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/using">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">User's Manual</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://github.com/urbit/port/releases">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Urbit Client</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://github.com/urbit/urbit/releases">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Urbit Binaries</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/getting-started/planet/#hosting-providers">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">
|
||||
Hosting Providers
|
||||
</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="w-1/2 md:w-1/3 flex flex-col flex-shrink">
|
||||
<h4 className="mt-16 mb-8">About</h4>
|
||||
<Link href="https://urbit.org/understanding-urbit">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">What's Urbit?</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/understanding-urbit/urbit-id">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Urbit ID</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/understanding-urbit/urbit-os">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Urbit OS</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/faq">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">FAQ</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="w-1/2 md:w-1/3 flex flex-col flex-shrink">
|
||||
<h4 className="mt-16 mb-8">News</h4>
|
||||
<Link href="https://urbit.org/blog">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Blog</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/events">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Events</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/updates">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Updates</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="w-1/2 md:w-1/3 flex flex-col">
|
||||
<h4 className="mt-16 mb-8">Develop</h4>
|
||||
<Link href="https://urbit.org/docs">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Documentation</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://github.com/urbit">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Github</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://github.com/urbit/awesome-urbit#http-apis-airlock">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Airlock APIs</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="w-1/2 md:w-1/3 flex flex-col">
|
||||
<h4 className="mt-16 mb-8">Contribute</h4>
|
||||
<Link href="https://github.com/urbit/urbit/issues">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Issue Tracker</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://urbit.org/grants">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Urbit Grants</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="w-1/2 md:w-1/3 flex flex-col">
|
||||
<h4 className="mt-16 mb-8">Community</h4>
|
||||
<Link href="https://groups.google.com/a/urbit.org/g/dev?pli=1">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Dev Mailing List</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://github.com/urbit/azimuth">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Governance</a>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="https://twitter.com/urbit">
|
||||
<div>
|
||||
<a className="mt-2 type-bold text-wall-500">Twitter</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</Section>
|
||||
<Section className="flex flex-col md:flex-row">
|
||||
<div className="md:w-1/3">
|
||||
<Link href="https://urbit.org/privacy">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Privacy Policy</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="md:w-1/3">
|
||||
<Link href="https://urbit.org/terms-of-service">
|
||||
<div>
|
||||
<a className="type-bold text-wall-500">Terms of Service</a>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="md:w-1/3">
|
||||
<div>
|
||||
<a
|
||||
href={"mailto:support@urbit.org"}
|
||||
className="type-bold text-wall-500"
|
||||
>
|
||||
support@urbit.org
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
</footer>
|
||||
);
|
||||
return <FooterComponent data={footerData} />;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import SingleColumn from "./SingleColumn";
|
||||
import { useRouter } from "next/router";
|
||||
import { useState } from "react";
|
||||
import classnames from "classnames";
|
||||
import MenuTray from "../components/MenuTray";
|
||||
import { capitalize } from "../lib/lib";
|
||||
import { IntraNav } from "foundation-design-system";
|
||||
|
||||
function ActiveLink({ children, href, className, currentPath }) {
|
||||
const firstCrumb = currentPath.split("/")[1];
|
||||
|
|
@ -13,54 +15,139 @@ function ActiveLink({ children, href, className, currentPath }) {
|
|||
});
|
||||
|
||||
return (
|
||||
<Link href={href}>
|
||||
<Link href={href} passHref>
|
||||
<a className={`${className} ${activeClassName}`}>{children}</a>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
export default function Header(props) {
|
||||
const currentPath = useRouter().asPath;
|
||||
return (
|
||||
<div className="flex flex-col w-full items-center">
|
||||
<SingleColumn>
|
||||
<header className=" layout px-4 md:px-8 flex justify-between items-center pt-8 md:pt-10 lg:pt-12 pb-10 md:pb-12 lg:pb-24">
|
||||
<Link href="/">
|
||||
<a className="type-ui">Urbit Developers</a>
|
||||
</Link>
|
||||
const [isOpen, setTray] = useState(false);
|
||||
|
||||
<nav className="items-center hidden md:flex">
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/learn"
|
||||
>
|
||||
Learn
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/community"
|
||||
>
|
||||
Community
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/opportunities"
|
||||
>
|
||||
Opportunities
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="text-green-400 type-ui button-text"
|
||||
href="/why"
|
||||
>
|
||||
Why Urbit?
|
||||
</ActiveLink>
|
||||
</nav>
|
||||
</header>
|
||||
</SingleColumn>
|
||||
</div>
|
||||
const currentPath = useRouter().asPath;
|
||||
|
||||
const routeDepth = currentPath.split("/").length;
|
||||
|
||||
const firstCrumb = currentPath.split("/")[1];
|
||||
|
||||
return (
|
||||
<>
|
||||
{" "}
|
||||
<IntraNav ourSite="https://developers.urbit.org" search={() => null} />
|
||||
<header className="layout max-w-screen-lg px-4 md:px-8 flex justify-between items-center pt-8 md:pt-10 lg:pt-12 pb-10 md:pb-12 lg:pb-24">
|
||||
<div>
|
||||
<Link href="/" passHref>
|
||||
<a className="text-lg font-semibold">
|
||||
<span className="hidden xl:inline">Urbit </span>Developers
|
||||
</a>
|
||||
</Link>
|
||||
{routeDepth > 2 ? (
|
||||
<Link href={`/${firstCrumb}`} passHref>
|
||||
<a className="inline md:hidden type-ui text-wall-500 ml-2">
|
||||
{capitalize(firstCrumb)}
|
||||
</a>
|
||||
</Link>
|
||||
) : null}
|
||||
</div>
|
||||
{
|
||||
// Large screen header
|
||||
}
|
||||
<nav className="items-center hidden md:flex">
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/overview"
|
||||
>
|
||||
Overview
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/guides"
|
||||
>
|
||||
Guides
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/reference"
|
||||
>
|
||||
Reference
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui button-text"
|
||||
href="/courses"
|
||||
>
|
||||
Courses
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/community"
|
||||
>
|
||||
Community
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/blog"
|
||||
>
|
||||
Blog
|
||||
</ActiveLink>
|
||||
</nav>
|
||||
|
||||
{
|
||||
// Small screen header
|
||||
}
|
||||
<MenuTray isOpen={isOpen} setTray={setTray} search={() => null}>
|
||||
<Link href="/" passHref>
|
||||
<a className="type-ui mb-12">Urbit</a>
|
||||
</Link>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 mb-3 type-ui"
|
||||
href="/overview"
|
||||
>
|
||||
Overview
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 mb-3 type-ui"
|
||||
href="/guides"
|
||||
>
|
||||
Guides
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 mb-3 type-ui"
|
||||
href="/reference"
|
||||
>
|
||||
Reference
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 mb-3 type-ui button-text"
|
||||
href="/courses"
|
||||
>
|
||||
Courses
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 mb-3 type-ui"
|
||||
href="/community"
|
||||
>
|
||||
Community
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
currentPath={currentPath}
|
||||
className="mr-5 type-ui"
|
||||
href="/blog"
|
||||
>
|
||||
Blog
|
||||
</ActiveLink>
|
||||
</MenuTray>
|
||||
</header>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
import React from "react";
|
||||
import Meta from "./Meta";
|
||||
import Header from "./Header";
|
||||
import Footer from "./Footer";
|
||||
|
||||
export default function Layout({ children }) {
|
||||
return (
|
||||
<>
|
||||
<Meta />
|
||||
<Header />
|
||||
<div className="">{children}</div>
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
import remark from "remark";
|
||||
import gfm from "remark-gfm";
|
||||
import slug from "remark-slug";
|
||||
import remarkParse from "remark-parse";
|
||||
import remarkRehype from "remark-rehype";
|
||||
import rehypeStringify from "rehype-stringify";
|
||||
import rehypeRaw from "rehype-raw";
|
||||
|
||||
const options = {
|
||||
handlers: {},
|
||||
};
|
||||
|
||||
export default async function Markdown(content) {
|
||||
const result = await remark()
|
||||
.use(remarkParse, options)
|
||||
.use(gfm)
|
||||
.use(slug)
|
||||
.use(remarkRehype, { allowDangerousHtml: true })
|
||||
.use(rehypeRaw)
|
||||
.use(rehypeStringify)
|
||||
.process(content);
|
||||
|
||||
return result.toString();
|
||||
}
|
||||
104
components/MenuTray.js
Normal file
104
components/MenuTray.js
Normal file
|
|
@ -0,0 +1,104 @@
|
|||
import classnames from "classnames";
|
||||
import { useSwipeable } from "react-swipeable";
|
||||
|
||||
export default function MenuTray({ isOpen, setTray, search, children }) {
|
||||
// Locks document scrolling when menu is open
|
||||
if (typeof document !== "undefined") {
|
||||
if (isOpen) {
|
||||
document.body.style.overflow = "hidden";
|
||||
} else {
|
||||
document.body.style.overflow = "visible";
|
||||
}
|
||||
}
|
||||
|
||||
const handlers = useSwipeable({
|
||||
onSwipedLeft: (e) => setTray(false),
|
||||
});
|
||||
|
||||
// Slides the tray in or out from the left
|
||||
const trayClasses = classnames({
|
||||
"tray-menu-open": isOpen,
|
||||
"tray-menu-closed": !isOpen,
|
||||
});
|
||||
|
||||
// Fades the background overlay in or out
|
||||
const overlayClasses = classnames({
|
||||
"tray-overlay-open": isOpen,
|
||||
"tray-overlay-closed": !isOpen,
|
||||
});
|
||||
|
||||
// Hides or shows the menu
|
||||
const menuClasses = classnames({
|
||||
"menu-open": isOpen,
|
||||
"menu-closed": !isOpen,
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<nav
|
||||
{...handlers}
|
||||
className={`z-10 w-screen h-screen top-0 left-0 fixed block md:hidden ${menuClasses}`}
|
||||
>
|
||||
<div
|
||||
onClick={() => setTray(!isOpen)}
|
||||
className={`bg-washedWhite w-screen h-screen ${overlayClasses}`}
|
||||
/>
|
||||
<div
|
||||
className={`absolute bg-wall-100 h-screen top-0 left-0 tray-menu-width overflow-y-scroll mb-24 ${trayClasses}`}
|
||||
>
|
||||
<div
|
||||
{...handlers}
|
||||
className="flex flex-col px-4 md:px-8 pt-8 md:pt-10 lg:pt-12"
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
search.toggleSearch(e);
|
||||
}}
|
||||
className={`z-10 fixed px-4 items-center justify-center type-ui rounded-xl h-16 bg-white text-wall-500 left-4 right-4 bottom-4 mobile-search-button-width ${
|
||||
isOpen ? "flex" : "hidden"
|
||||
}`}
|
||||
>
|
||||
Search
|
||||
</button>
|
||||
</nav>
|
||||
<button
|
||||
onClick={() => setTray(!isOpen)}
|
||||
className="z-10 fixed bottom-4 right-4 w-16 h-16 bg-wall-600 flex items-center justify-center rounded-full md:hidden"
|
||||
>
|
||||
{isOpen ? (
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M0.39382 13.7045C-0.131273 14.2296 -0.131274 15.081 0.39382 15.6061C0.918913 16.1312 1.77026 16.1312 2.29535 15.6061L7.99999 9.90142L13.7047 15.6061C14.2297 16.1312 15.0811 16.1312 15.6062 15.6061C16.1313 15.081 16.1313 14.2296 15.6062 13.7046L9.90152 7.99989L15.6061 2.29535C16.1312 1.77026 16.1312 0.918913 15.6061 0.39382C15.081 -0.131273 14.2296 -0.131273 13.7045 0.39382L7.99999 6.09836L2.29548 0.393844C1.77038 -0.131249 0.919038 -0.13125 0.393945 0.393844C-0.131148 0.918937 -0.131148 1.77028 0.393945 2.29537L6.09846 7.99989L0.39382 13.7045Z"
|
||||
fill="white"
|
||||
/>
|
||||
</svg>
|
||||
) : (
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 17"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect width="16" height="3" rx="1.5" fill="white" />
|
||||
<rect y="7" width="16" height="3" rx="1.5" fill="white" />
|
||||
<rect y="14" width="16" height="3" rx="1.5" fill="white" />
|
||||
</svg>
|
||||
)}
|
||||
</button>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
import React from "react";
|
||||
import Head from "next/head";
|
||||
|
||||
export default function Meta() {
|
||||
const author = "Urbit";
|
||||
const description =
|
||||
"Urbit is a general-purpose platform for building decentralized, peer-to-peer applications.";
|
||||
const image = "https://media.urbit.org/logo/urbit-logo-card.png";
|
||||
return (
|
||||
<Head>
|
||||
<link rel="icon" type="image/png" href="/images/favicon.ico" />
|
||||
<meta
|
||||
name="twitter:card"
|
||||
content="summary_large_image"
|
||||
key="twitter-card"
|
||||
/>
|
||||
<meta name="twitter:site" content="@urbit" key="twitter-site" />
|
||||
<meta name="twitter:creator" content="@urbit" key="twitter-creator" />
|
||||
<meta name="og:title" content="Urbit Developers" key="title" />
|
||||
<meta name="og:description" content={description} key="description" />
|
||||
<meta name="description" content={description} />
|
||||
<meta name="author" content={author} key="author" />
|
||||
<meta name="twitter:image" content={image} key="image" />
|
||||
</Head>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
import React from "react";
|
||||
import classnames from "classnames";
|
||||
|
||||
// Provides a flexible layout building block
|
||||
export default function Section({
|
||||
children,
|
||||
className = "",
|
||||
short = false,
|
||||
narrow = false,
|
||||
}) {
|
||||
const spacing = classnames({
|
||||
"py-8": short,
|
||||
"py-20": !short,
|
||||
"layout-narrow": narrow,
|
||||
layout: !narrow,
|
||||
});
|
||||
return (
|
||||
<section className={`w-full px-4 md:px-8 ${spacing} ${className}`}>
|
||||
{children}
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import React from "react";
|
||||
import { sigil, reactRenderer } from "@tlon/sigil-js";
|
||||
|
||||
export default function Sigil(props) {
|
||||
return (
|
||||
<div className="p-4 bg-black inline-block rounded-lg">
|
||||
{sigil({
|
||||
patp: props.patp,
|
||||
renderer: reactRenderer,
|
||||
size: 32,
|
||||
margin: false,
|
||||
colors: ["black", "white"],
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
import React from "react";
|
||||
|
||||
export default function SingleColumn({ children }) {
|
||||
return (
|
||||
<div className="flex flex-col w-full items-center max-w-screen-2xl">
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
41
components/TallCard.js
Normal file
41
components/TallCard.js
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
import Link from "next/link";
|
||||
|
||||
export default function TallCard({
|
||||
image,
|
||||
title,
|
||||
description,
|
||||
callout,
|
||||
href,
|
||||
className = "",
|
||||
}) {
|
||||
return (
|
||||
<div
|
||||
className={`cursor-pointer lg:aspect-w-10 lg:aspect-h-6 xl:aspect-w-16 xl:aspect-h-8 ${className}`}
|
||||
>
|
||||
<div key={title} className={`bg-wall-100 rounded-xl min-h-0 `}>
|
||||
<Link href={href}>
|
||||
<div className="flex flex-col space-y-4 p-6 justify-center items-center h-full relative">
|
||||
<img
|
||||
className="rounded-lg self-center overflow-hidden border-transparent border w-full shrink-0"
|
||||
src={image}
|
||||
/>
|
||||
<div className={`grow-1 flex flex-col h-full w-full`}>
|
||||
<h3 className="mb-2">{title}</h3>
|
||||
<p className="text-sm">{description}</p>
|
||||
</div>
|
||||
<div className="self-start">
|
||||
<Link href={href} passHref>
|
||||
<a
|
||||
className="button-sm bg-green-400 text-white w-fit"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
{callout}
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
21
components/icons/comms.js
Normal file
21
components/icons/comms.js
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
export default function Comms({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="81"
|
||||
height="80"
|
||||
viewBox="0 0 81 80"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect x="0.490967" width="80" height="80" rx="10" fill="#208DF2" />
|
||||
<path
|
||||
d="M57.0526 32.9366H38.6793C36.4472 32.9366 34.7418 34.6421 34.7418 36.8741V47.375C34.7418 49.4741 36.4472 51.3125 38.6793 51.3125H51.8035L57.0526 56.5616V51.3125C59.2847 51.3125 60.9901 49.4741 60.9901 47.375V36.8741C60.9901 34.6445 59.2847 32.9366 57.0526 32.9366Z"
|
||||
fill="white"
|
||||
/>
|
||||
<path
|
||||
d="M41.3026 23.75H22.9293C20.6972 23.75 18.9918 25.4554 18.9918 27.6875V38.1883C18.9918 40.2875 20.6972 42.1258 22.9293 42.1258V47.375L28.1785 42.1258H32.116V36.8767C32.116 33.2025 35.0026 30.3133 38.6793 30.3133H45.2427V27.6875C45.2402 25.4554 43.5348 23.75 41.3027 23.75H41.3026Z"
|
||||
fill="white"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
31
components/icons/database.js
Normal file
31
components/icons/database.js
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
export default function Database({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="64"
|
||||
height="65"
|
||||
viewBox="0 0 64 65"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
>
|
||||
<line x1="3" y1="36.4545" x2="61" y2="36.4545" stroke="#BCBCBC" />
|
||||
<line x1="3" y1="16.6816" x2="61" y2="16.6816" stroke="#BCBCBC" />
|
||||
<line x1="3" y1="43.0454" x2="61" y2="43.0454" stroke="#BCBCBC" />
|
||||
<line x1="3" y1="29.8634" x2="61" y2="29.8634" stroke="#BCBCBC" />
|
||||
<line
|
||||
x1="3.8573"
|
||||
y1="56.2788"
|
||||
x2="59.5778"
|
||||
y2="56.2788"
|
||||
stroke="#BCBCBC"
|
||||
/>
|
||||
<line x1="3" y1="23.2727" x2="61" y2="23.2727" stroke="#BCBCBC" />
|
||||
<line x1="3" y1="49.6366" x2="61" y2="49.6366" stroke="#BCBCBC" />
|
||||
<path d="M11.0184 4.45313L11.0184 62" stroke="#2A2A2A" />
|
||||
<line x1="24.178" y1="4" x2="24.178" y2="62" stroke="#BCBCBC" />
|
||||
<line x1="37.291" y1="4" x2="37.291" y2="62" stroke="#BCBCBC" />
|
||||
<path d="M3.8573 10.2487L60.0938 10.2487" stroke="#2A2A2A" />
|
||||
<rect x="3.5" y="4.5" width="57" height="57" rx="9.5" stroke="#2B2B2B" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
49
components/icons/distribution.js
Normal file
49
components/icons/distribution.js
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
export default function Distribution({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="64"
|
||||
height="65"
|
||||
viewBox="0 0 64 65"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
>
|
||||
<g clipPath="url(#clip0_663_420)">
|
||||
<rect
|
||||
x="23.7222"
|
||||
y="24.3007"
|
||||
width="16.3986"
|
||||
height="16.3986"
|
||||
rx="4.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M31.9215 3.13989L32.2818 2.7932C32.1875 2.69525 32.0575 2.63989 31.9215 2.63989C31.7856 2.63989 31.6555 2.69525 31.5612 2.7932L31.9215 3.13989ZM38.9845 10.4799L38.9845 10.9799C39.1849 10.9799 39.366 10.8602 39.4445 10.6757C39.523 10.4912 39.4838 10.2777 39.3447 10.1332L38.9845 10.4799ZM24.8586 10.4799L24.4983 10.1332C24.3593 10.2777 24.32 10.4912 24.3985 10.6757C24.477 10.8602 24.6581 10.9799 24.8586 10.9799L24.8586 10.4799ZM29.203 10.4799H29.703C29.703 10.3473 29.6503 10.2201 29.5565 10.1264C29.4628 10.0326 29.3356 9.97992 29.203 9.97992V10.4799ZM29.203 21.6259H28.703C28.703 21.902 28.9268 22.1259 29.203 22.1259V21.6259ZM34.64 21.6259V22.1259C34.7726 22.1259 34.8998 22.0732 34.9936 21.9794C35.0874 21.8857 35.14 21.7585 35.14 21.6259H34.64ZM34.64 10.4799V9.97992C34.3639 9.97992 34.14 10.2038 34.14 10.4799H34.64ZM31.5612 3.48658L38.6242 10.8266L39.3447 10.1332L32.2818 2.7932L31.5612 3.48658ZM25.2188 10.8266L32.2818 3.48658L31.5612 2.7932L24.4983 10.1332L25.2188 10.8266ZM29.203 9.97992L24.8586 9.97992L24.8586 10.9799L29.203 10.9799V9.97992ZM29.703 21.6259L29.703 10.4799H28.703L28.703 21.6259H29.703ZM34.64 21.1259L29.203 21.1259V22.1259L34.64 22.1259V21.1259ZM34.14 10.4799L34.14 21.6259H35.14L35.14 10.4799H34.14ZM38.9845 9.97992L34.64 9.97992V10.9799L38.9845 10.9799L38.9845 9.97992Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M31.9215 61.8601L31.5612 62.2068C31.6555 62.3048 31.7856 62.3601 31.9215 62.3601C32.0575 62.3601 32.1875 62.3048 32.2818 62.2068L31.9215 61.8601ZM24.8586 54.5201L24.8586 54.0201C24.6581 54.0201 24.477 54.1398 24.3985 54.3243C24.32 54.5088 24.3593 54.7223 24.4983 54.8668L24.8586 54.5201ZM38.9845 54.5201L39.3447 54.8668C39.4838 54.7223 39.523 54.5088 39.4445 54.3243C39.366 54.1398 39.1849 54.0201 38.9845 54.0201L38.9845 54.5201ZM34.64 54.5201L34.14 54.5201C34.14 54.7962 34.3639 55.0201 34.64 55.0201L34.64 54.5201ZM34.64 43.3741L35.14 43.3741C35.14 43.098 34.9162 42.8741 34.64 42.8741L34.64 43.3741ZM29.203 43.3741L29.203 42.8741C29.0704 42.8741 28.9432 42.9268 28.8494 43.0206C28.7557 43.1143 28.703 43.2415 28.703 43.3741L29.203 43.3741ZM29.203 54.5201L29.203 55.0201C29.3356 55.0201 29.4628 54.9674 29.5565 54.8736C29.6503 54.7799 29.703 54.6527 29.703 54.5201L29.203 54.5201ZM32.2818 61.5134L25.2188 54.1734L24.4983 54.8668L31.5612 62.2068L32.2818 61.5134ZM38.6242 54.1734L31.5612 61.5134L32.2818 62.2068L39.3447 54.8668L38.6242 54.1734ZM34.64 55.0201L38.9845 55.0201L38.9845 54.0201L34.64 54.0201L34.64 55.0201ZM34.14 43.3741L34.14 54.5201L35.14 54.5201L35.14 43.3741L34.14 43.3741ZM29.203 43.8741L34.64 43.8741L34.64 42.8741L29.203 42.8741L29.203 43.8741ZM29.703 54.5201L29.703 43.3741L28.703 43.3741L28.703 54.5201L29.703 54.5201ZM24.8586 55.0201L29.203 55.0201L29.203 54.0201L24.8586 54.0201L24.8586 55.0201Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M61.2816 32.7719L61.6283 33.1321C61.7263 33.0379 61.7816 32.9078 61.7816 32.7719C61.7816 32.6359 61.7263 32.5058 61.6283 32.4116L61.2816 32.7719ZM53.9416 39.8348L53.4416 39.8348C53.4416 40.0353 53.5613 40.2164 53.7458 40.2949C53.9303 40.3734 54.1438 40.3341 54.2883 40.1951L53.9416 39.8348ZM53.9416 25.7089L54.2883 25.3486C54.1438 25.2096 53.9303 25.1703 53.7458 25.2488C53.5613 25.3273 53.4416 25.5084 53.4416 25.7089L53.9416 25.7089ZM53.9416 30.0533V30.5533C54.0742 30.5533 54.2014 30.5006 54.2951 30.4069C54.3889 30.3131 54.4416 30.1859 54.4416 30.0533H53.9416ZM42.7956 30.0533V29.5533C42.5195 29.5533 42.2956 29.7772 42.2956 30.0533H42.7956ZM42.7956 35.4904H42.2956C42.2956 35.623 42.3483 35.7502 42.4421 35.8439C42.5358 35.9377 42.663 35.9904 42.7956 35.9904V35.4904ZM53.9416 35.4904H54.4416C54.4416 35.3578 54.3889 35.2306 54.2951 35.1368C54.2014 35.0431 54.0742 34.9904 53.9416 34.9904V35.4904ZM60.9349 32.4116L53.5949 39.4745L54.2883 40.1951L61.6283 33.1321L60.9349 32.4116ZM53.5949 26.0692L60.9349 33.1321L61.6283 32.4116L54.2883 25.3486L53.5949 26.0692ZM54.4416 30.0533L54.4416 25.7089L53.4416 25.7089L53.4416 30.0533H54.4416ZM42.7956 30.5533L53.9416 30.5533V29.5533L42.7956 29.5533V30.5533ZM43.2956 35.4904V30.0533H42.2956V35.4904H43.2956ZM53.9416 34.9904H42.7956V35.9904L53.9416 35.9904V34.9904ZM54.4416 39.8348L54.4416 35.4904H53.4416L53.4416 39.8348L54.4416 39.8348Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M2.5614 32.7719L2.21471 32.4116C2.11676 32.5058 2.0614 32.6359 2.0614 32.7719C2.0614 32.9078 2.11676 33.0379 2.21471 33.1321L2.5614 32.7719ZM9.90143 25.7089L10.4014 25.7089C10.4014 25.5084 10.2817 25.3273 10.0972 25.2488C9.91273 25.1703 9.6992 25.2096 9.55474 25.3486L9.90143 25.7089ZM9.90143 39.8348L9.55474 40.1951C9.69921 40.3341 9.91273 40.3734 10.0972 40.2949C10.2817 40.2164 10.4014 40.0353 10.4014 39.8348L9.90143 39.8348ZM9.90143 35.4904L9.90143 34.9904C9.62529 34.9904 9.40143 35.2142 9.40143 35.4904L9.90143 35.4904ZM21.0474 35.4904L21.0474 35.9904C21.3235 35.9904 21.5474 35.7665 21.5474 35.4904L21.0474 35.4904ZM21.0474 30.0533L21.5474 30.0533C21.5474 29.9207 21.4947 29.7935 21.401 29.6998C21.3072 29.606 21.18 29.5533 21.0474 29.5533L21.0474 30.0533ZM9.90143 30.0533L9.40143 30.0533C9.40143 30.1859 9.45411 30.3131 9.54788 30.4069C9.64165 30.5006 9.76882 30.5533 9.90143 30.5533L9.90143 30.0533ZM2.90809 33.1321L10.2481 26.0692L9.55474 25.3486L2.21471 32.4116L2.90809 33.1321ZM10.2481 39.4745L2.90809 32.4116L2.21471 33.1321L9.55474 40.1951L10.2481 39.4745ZM9.40143 35.4904L9.40143 39.8348L10.4014 39.8348L10.4014 35.4904L9.40143 35.4904ZM21.0474 34.9904L9.90143 34.9904L9.90143 35.9904L21.0474 35.9904L21.0474 34.9904ZM20.5474 30.0533L20.5474 35.4904L21.5474 35.4904L21.5474 30.0533L20.5474 30.0533ZM9.90143 30.5533L21.0474 30.5533L21.0474 29.5533L9.90143 29.5533L9.90143 30.5533ZM9.40143 25.7089L9.40143 30.0533L10.4014 30.0533L10.4014 25.7089L9.40143 25.7089Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_663_420">
|
||||
<rect
|
||||
width="45.2548"
|
||||
height="45.2548"
|
||||
fill="white"
|
||||
transform="translate(32.0001 0.5) rotate(45)"
|
||||
/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
94
components/icons/identity.js
Normal file
94
components/icons/identity.js
Normal file
|
|
@ -0,0 +1,94 @@
|
|||
export default function Identity({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="64"
|
||||
height="65"
|
||||
viewBox="0 0 64 65"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
>
|
||||
<rect
|
||||
x="7"
|
||||
y="8.5"
|
||||
width="49.2268"
|
||||
height="49.2268"
|
||||
rx="5.5"
|
||||
fill="white"
|
||||
stroke="#363636"
|
||||
/>
|
||||
<g clipPath="url(#clip0_662_1567)">
|
||||
<path
|
||||
d="M48.5432 33.8682C48.2453 33.8682 48.0041 33.6269 48.0041 33.329C48.0162 29.7314 46.8179 26.2338 44.6019 23.4005C44.4186 23.1646 44.4604 22.8263 44.6963 22.643C44.9322 22.4596 45.2705 22.5014 45.4538 22.7373C47.8181 25.7607 49.096 29.4916 49.0825 33.329C49.0825 33.4719 49.0259 33.6094 48.9248 33.7105C48.8237 33.8116 48.6862 33.8682 48.5433 33.8682L48.5432 33.8682Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M41.0972 19.9578C40.9907 19.9578 40.8869 19.9255 40.7979 19.8662C38.1493 18.1018 35.0395 17.1569 31.8573 17.1515C28.6736 17.1448 25.5613 18.0789 22.906 19.8338C22.6594 19.9834 22.3372 19.912 22.1768 19.6707C22.0178 19.4294 22.0757 19.1059 22.3103 18.9361C25.1422 17.0639 28.4634 16.0678 31.8589 16.0745C35.2542 16.0799 38.5714 17.0881 41.3967 18.9711C41.5935 19.1032 41.6812 19.3486 41.6124 19.575C41.5437 19.8014 41.3347 19.9578 41.0975 19.9578L41.0972 19.9578Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M15.1151 33.8681C14.8172 33.8681 14.5759 33.6268 14.5759 33.3289C14.5611 28.6613 16.4522 24.1903 19.8112 20.9498C20.0282 20.7422 20.3733 20.7503 20.5809 20.9673C20.7884 21.1843 20.7803 21.5294 20.5633 21.737C17.4173 24.7711 15.6448 28.9578 15.6541 33.329C15.6541 33.4719 15.5975 33.6094 15.4964 33.7105C15.3953 33.8116 15.2578 33.8682 15.1149 33.8682L15.1151 33.8681Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M41.5043 47.5037C41.2953 47.5037 41.1039 47.3837 41.015 47.1937C40.926 47.0036 40.9557 46.7799 41.0891 46.6194C42.3858 45.064 43.332 42.7941 43.9008 39.88C43.9588 39.5875 44.2418 39.3961 44.5343 39.4541C44.8268 39.512 45.0182 39.7951 44.9603 40.0876C44.3564 43.1905 43.3428 45.622 41.9194 47.3177C41.8156 47.4377 41.6633 47.5064 41.5042 47.5037L41.5043 47.5037Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M44.9711 35.9954H44.9415C44.6449 35.9792 44.4171 35.7258 44.4319 35.4293C44.4832 34.4534 44.4832 33.7147 44.4832 33.3589C44.4832 30.934 43.7876 28.559 42.4829 26.5156C41.1767 24.4721 39.3139 22.8451 37.113 21.8262C36.9768 21.7709 36.869 21.6617 36.8137 21.5256C36.7598 21.3881 36.7639 21.2344 36.8259 21.101C36.8865 20.9675 37.0011 20.8651 37.1399 20.8166C37.2801 20.7681 37.4324 20.7802 37.5632 20.8476C39.9476 21.9502 41.9669 23.7105 43.3848 25.921C44.8014 28.133 45.5576 30.7019 45.5643 33.3292C45.5643 33.7147 45.5643 34.4749 45.5104 35.4859C45.4942 35.7716 45.2583 35.9954 44.9712 35.9954L44.9711 35.9954Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M16.7002 39.5889C16.4616 39.5889 16.2527 39.4326 16.184 39.2048C16.1152 38.977 16.2055 38.7303 16.4037 38.5996C17.9052 37.6102 18.0966 35.2648 18.0966 33.3318C18.1007 29.691 19.5483 26.2 22.1228 23.6241C24.6973 21.0497 28.1883 19.6007 31.8291 19.5966C32.127 19.5966 32.3683 19.8378 32.3683 20.1357C32.3683 20.4336 32.127 20.6749 31.8291 20.6749C28.4742 20.6789 25.2567 22.0133 22.8844 24.3843C20.5121 26.7566 19.1763 29.974 19.1722 33.3291C19.1722 35.5315 18.9242 38.2248 16.994 39.4971C16.9064 39.555 16.8053 39.5874 16.7001 39.5887L16.7002 39.5889Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M36.2852 49.7952C36.0696 49.7938 35.8741 49.6644 35.7906 49.4649C35.707 49.2668 35.7501 49.0363 35.8997 48.8813C40.3072 44.3468 40.9653 37.195 40.9653 33.3293C40.9639 31.1753 40.2037 29.0915 38.8154 27.4442C37.4284 25.7971 35.5035 24.6931 33.382 24.3265C31.2591 23.9599 29.0766 24.3548 27.2167 25.4412C26.9633 25.5625 26.6587 25.4695 26.5172 25.2256C26.3757 24.9816 26.4458 24.6716 26.6776 24.5112C28.756 23.2981 31.1959 22.8586 33.5682 23.2684C35.9391 23.6782 38.0902 24.9128 39.6406 26.7528C41.1907 28.5941 42.0425 30.9233 42.0439 33.3294C42.0439 37.3515 41.3457 44.8217 36.6713 49.6281C36.5702 49.7333 36.4313 49.7939 36.2857 49.7953L36.2852 49.7952Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M22.1538 33.8681C21.8559 33.8681 21.6146 33.6268 21.6146 33.3289C21.6173 30.958 22.4422 28.6626 23.9492 26.8321C24.1419 26.6124 24.4735 26.5854 24.6986 26.7714C24.9237 26.9574 24.9601 27.289 24.7795 27.5195C23.433 29.1559 22.6956 31.21 22.6929 33.329C22.6929 33.4719 22.6363 33.6094 22.5352 33.7105C22.4341 33.8116 22.2967 33.8682 22.1538 33.8682L22.1538 33.8681Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M17.9591 43.2039C17.6882 43.2079 17.4564 43.0084 17.4186 42.7388C17.3809 42.4706 17.5493 42.2158 17.8108 42.1444C20.0942 41.5163 20.9973 38.2517 21.3315 36.3618C21.3571 36.2216 21.4367 36.0963 21.5539 36.014C21.6712 35.9318 21.8168 35.8995 21.957 35.9251C22.2508 35.9776 22.4463 36.2567 22.3937 36.5505C22.0135 38.691 20.9514 42.3976 18.0966 43.185C18.0521 43.1972 18.0049 43.2039 17.9591 43.2039L17.9591 43.2039Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M31.2605 50.5822C31.0273 50.5822 30.8211 50.4326 30.7469 50.2116C30.6741 49.9905 30.7523 49.7479 30.9397 49.6091C35.6035 46.1529 36.9997 40.4055 37.3447 36.1947C37.3569 36.0518 37.4243 35.9197 37.5334 35.8267C37.644 35.7337 37.7855 35.6879 37.9284 35.7C38.2262 35.7243 38.4473 35.9858 38.423 36.2837C38.0564 40.7157 36.5764 46.7812 31.5811 50.4772C31.4881 50.5459 31.3762 50.5823 31.2603 50.5823L31.2605 50.5822Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M20.1887 45.8728C19.8908 45.8998 19.6279 45.6801 19.601 45.3822C19.574 45.0843 19.7937 44.8214 20.0916 44.7945C24.8873 43.9129 25.1303 35.0896 25.1303 33.3266C25.1289 31.2819 26.0603 29.3491 27.6616 28.0779C29.2629 26.8067 31.3562 26.335 33.3472 26.8001C35.3381 27.2638 37.008 28.613 37.8817 30.4609C38.0017 30.7277 37.8857 31.0418 37.6216 31.1672C37.3574 31.2939 37.0406 31.186 36.9085 30.9245C36.1753 29.3745 34.7748 28.2436 33.1049 27.854C31.4348 27.4658 29.6785 27.8608 28.3361 28.927C26.9936 29.9931 26.2104 31.6147 26.2118 33.3293C26.2118 36.0251 25.7859 44.8485 20.2809 45.8568C20.2512 45.8649 20.2202 45.8703 20.1892 45.873L20.1887 45.8728Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M26.5075 49.7252C26.2514 49.7265 26.029 49.5459 25.9778 49.2952C25.9265 49.0432 26.0586 48.7911 26.2945 48.69C28.2274 47.8786 29.8166 46.4188 30.7883 44.5627C30.9312 44.3012 31.2587 44.2055 31.5202 44.3484C31.7817 44.4913 31.8774 44.8188 31.7345 45.0803C30.6454 47.1534 28.8675 48.7804 26.7069 49.6821C26.6436 49.709 26.5762 49.7239 26.5074 49.7252L26.5075 49.7252Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M32.592 42.4519C32.4073 42.4533 32.2348 42.3603 32.1351 42.2053C32.0353 42.0489 32.0205 41.8535 32.0987 41.6863C33.2673 39.0525 33.89 36.2098 33.9264 33.3292C33.9264 32.17 32.9856 31.2292 31.8264 31.2292C30.6672 31.2292 29.7264 32.1701 29.7264 33.3292C29.7264 33.6271 29.4851 33.8684 29.1872 33.8684C28.8893 33.8684 28.6481 33.6271 28.6481 33.3292C28.6481 31.5743 30.0715 30.1509 31.8264 30.1509C33.5814 30.1509 35.0048 31.5743 35.0048 33.3292C34.9657 36.3634 34.3106 39.3571 33.08 42.1311C32.9937 42.3239 32.8036 42.4506 32.592 42.4519L32.592 42.4519Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M22.6094 47.819C22.3115 47.8271 22.0648 47.5912 22.0567 47.2934C22.0486 46.9955 22.2845 46.7488 22.5824 46.7407C26.1893 46.5655 27.6614 41.9557 28.2597 38.0979C28.3055 37.8 28.5846 37.5965 28.8825 37.6423C29.1803 37.6881 29.3839 37.9672 29.338 38.265C28.3918 44.3495 26.0788 47.6546 22.6497 47.8216L22.6094 47.819Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<path
|
||||
d="M47.4108 39.9312C47.2329 39.9312 47.0658 39.8423 46.966 39.6953C46.8649 39.5484 46.8447 39.3611 46.9094 39.1953C47.6359 37.3257 48.0079 35.3361 48.0039 33.3292C48.0039 33.0313 48.2452 32.79 48.5431 32.79C48.8409 32.79 49.0822 33.0313 49.0822 33.3292C49.0849 35.467 48.69 37.5873 47.9149 39.5807C47.8368 39.791 47.6359 39.9312 47.4108 39.9312L47.4108 39.9312Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_662_1567">
|
||||
<rect
|
||||
width="34.5064"
|
||||
height="34.5064"
|
||||
fill="white"
|
||||
transform="translate(14.5759 16.0759)"
|
||||
/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
8
components/icons/index.js
Normal file
8
components/icons/index.js
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
export { default as Comms } from "./comms";
|
||||
export { default as Database } from "./database";
|
||||
export { default as Distribution } from "./distribution";
|
||||
export { default as Identity } from "./identity";
|
||||
export { default as Interface } from "./interface";
|
||||
export { default as MintFiller } from "./mintfiller";
|
||||
export { default as Peer } from "./peer";
|
||||
export { default as State } from "./state";
|
||||
91
components/icons/interface.js
Normal file
91
components/icons/interface.js
Normal file
|
|
@ -0,0 +1,91 @@
|
|||
export default function Interface({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="64"
|
||||
height="65"
|
||||
viewBox="0 0 64 65"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
>
|
||||
<rect x="0.5" y="1" width="63" height="63" rx="9.5" stroke="#24221E" />
|
||||
<rect x="14.5" y="17" width="35" height="7" rx="3.5" stroke="#24221E" />
|
||||
<line
|
||||
x1="14.5"
|
||||
y1="31"
|
||||
x2="46.5"
|
||||
y2="31"
|
||||
stroke="black"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<line
|
||||
x1="14.5"
|
||||
y1="41"
|
||||
x2="46.5"
|
||||
y2="41"
|
||||
stroke="black"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<line
|
||||
x1="14.5"
|
||||
y1="51"
|
||||
x2="46.5"
|
||||
y2="51"
|
||||
stroke="black"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<line
|
||||
x1="14.5"
|
||||
y1="46"
|
||||
x2="41.5"
|
||||
y2="46"
|
||||
stroke="black"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<line
|
||||
x1="14.5"
|
||||
y1="36"
|
||||
x2="33.5"
|
||||
y2="36"
|
||||
stroke="black"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<line
|
||||
x1="14.5"
|
||||
y1="56"
|
||||
x2="33.5"
|
||||
y2="56"
|
||||
stroke="black"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<line
|
||||
x1="0.666504"
|
||||
y1="9.12134"
|
||||
x2="63.3332"
|
||||
y2="9.12134"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<ellipse
|
||||
cx="7.99984"
|
||||
cy="5.0606"
|
||||
rx="1.33333"
|
||||
ry="1.30303"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<ellipse
|
||||
cx="12.6666"
|
||||
cy="5.0606"
|
||||
rx="1.33333"
|
||||
ry="1.30303"
|
||||
fill="#24221E"
|
||||
/>
|
||||
<ellipse
|
||||
cx="17.3332"
|
||||
cy="5.0606"
|
||||
rx="1.33333"
|
||||
ry="1.30303"
|
||||
fill="#24221E"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
13
components/icons/mintfiller.js
Normal file
13
components/icons/mintfiller.js
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
export default function MintFiller({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="83"
|
||||
height="80"
|
||||
viewBox="0 0 83 80"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect x="0.314575" width="81.7853" height="80" rx="10" fill="#A4D9BF" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
77
components/icons/peer.js
Normal file
77
components/icons/peer.js
Normal file
|
|
@ -0,0 +1,77 @@
|
|||
export default function Peer({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="64"
|
||||
height="65"
|
||||
viewBox="0 0 64 65"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
>
|
||||
<rect
|
||||
x="6"
|
||||
y="6.5"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="6"
|
||||
y="25.1923"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="6"
|
||||
y="43.8846"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="24.6923"
|
||||
y="6.5"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="24.6923"
|
||||
y="25.1923"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="24.6923"
|
||||
y="43.8846"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="43.3846"
|
||||
y="6.5"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
<rect
|
||||
x="43.3846"
|
||||
y="25.1923"
|
||||
width="15.6154"
|
||||
height="15.6154"
|
||||
rx="3.5"
|
||||
stroke="#24221E"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
53
components/icons/state.js
Normal file
53
components/icons/state.js
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
export default function State({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="64"
|
||||
height="65"
|
||||
viewBox="0 0 64 65"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
>
|
||||
<rect
|
||||
x="13.5"
|
||||
y="28.5"
|
||||
width="37"
|
||||
height="29"
|
||||
rx="2.5"
|
||||
fill="white"
|
||||
stroke="#363636"
|
||||
/>
|
||||
<rect
|
||||
x="10.5"
|
||||
y="21.5"
|
||||
width="43"
|
||||
height="33"
|
||||
rx="2.5"
|
||||
fill="white"
|
||||
stroke="#363636"
|
||||
/>
|
||||
<rect
|
||||
x="7.5"
|
||||
y="14.5"
|
||||
width="49"
|
||||
height="37"
|
||||
rx="2.5"
|
||||
fill="white"
|
||||
stroke="#363636"
|
||||
/>
|
||||
<rect
|
||||
x="5.5"
|
||||
y="7.06824"
|
||||
width="53"
|
||||
height="40.7272"
|
||||
rx="2.5"
|
||||
fill="white"
|
||||
stroke="#363636"
|
||||
/>
|
||||
<path
|
||||
d="M10.071 15.1932C10.0618 14.6823 10.1449 14.2714 10.3203 13.9606C10.4957 13.6497 10.7235 13.4235 11.0036 13.282C11.2867 13.1404 11.5852 13.0696 11.8991 13.0696C12.2131 13.0696 12.4993 13.1388 12.7578 13.2773C13.0194 13.4128 13.3179 13.6267 13.6534 13.919C13.8812 14.116 14.0627 14.2545 14.1982 14.3345C14.3366 14.4145 14.4875 14.4545 14.6506 14.4545C14.9152 14.4545 15.1245 14.3591 15.2784 14.1683C15.4323 13.9744 15.5062 13.6944 15.5 13.3281H16.4972C16.5064 13.839 16.4233 14.2499 16.2479 14.5607C16.0755 14.8716 15.8478 15.0978 15.5646 15.2393C15.2815 15.3809 14.983 15.4517 14.669 15.4517C14.3551 15.4517 14.0689 15.384 13.8104 15.2486C13.5518 15.1101 13.2533 14.8946 12.9148 14.6023C12.6901 14.4053 12.5085 14.2668 12.37 14.1868C12.2315 14.1068 12.0807 14.0668 11.9176 14.0668C11.6683 14.0668 11.4621 14.1545 11.299 14.3299C11.139 14.5022 11.062 14.79 11.0682 15.1932H10.071Z"
|
||||
fill="#24221E"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
---
|
||||
title: Community
|
||||
directory:
|
||||
- patp: ~wolref-podlex
|
||||
job: Executive Director, Urbit Foundation
|
||||
roles: Partnerships, grants, employment opportunities, technical projects, Urbit Foundation
|
||||
- patp: ~ravmel-ropdyl
|
||||
job: CEO, Tlon
|
||||
roles: Partnerships, employment opportunities, geodesic domes, future of Urbit
|
||||
- patp: ~timluc-miptev
|
||||
job: Technical Director, Urbit Foundation
|
||||
roles: Userspace development, grants
|
||||
- patp: ~lagrev-nocfep
|
||||
job: Technical Director, Urbit Foundation
|
||||
roles: Urbit education
|
||||
- patp: ~poldec-tonteg
|
||||
job: Program Manager, The Combine
|
||||
roles: Urbit entrepreneurship, organizational grants
|
||||
- patp: ~tirwyd-sarmes
|
||||
job: Content Manager, Urbit Foundation
|
||||
roles: Content grants, newsletter, blog
|
||||
- patp: ~taller-ravnut
|
||||
job: Developer Relations, Urbit Foundation
|
||||
roles: Grants, meetups, gifts, Developer Calls
|
||||
- patp: ~tinnus-napbus
|
||||
job: Technical writer and mentor, Urbit Foundation
|
||||
roles: Developer documentation, developer support
|
||||
- patp: ~wicdev-wisryt
|
||||
job: CTO, Tlon
|
||||
roles: Infrastructure development, Arvo, apprenticeships
|
||||
- patp: ~master-morzod
|
||||
job: Senior infrastructure engineer, Tlon
|
||||
roles: Infrastructure development, Vere, Arvo
|
||||
- patp: ~rovnys-ricfer
|
||||
job: Senior infrastructure engineer, Tlon
|
||||
roles: Infrastructure development, Arvo, software distribution
|
||||
---
|
||||
|
||||
The developer community is a combination of top-down stewardship from the Urbit Foundation and Tlon, as well as organic, bottom-up coordination from unaffiliated enthusiasts.
|
||||
|
||||
The Forge is a community-run Landscape group (`~middev/the-forge`) focused on all things related to Urbit development. Its members consist of enthusiasts, Tlon and Foundation developers, and grant workers. It’s also a great repository of community-compiled knowledge of common issues and development techniques.
|
||||
|
||||
The Urbit Foundation makes direct investments of address space into the community as a means of improving the network. The Foundation also maintains developer documentation, runs Developer Calls, and acts as the hub of the Urbit ecosystem. You can find us hanging around in the Foundation group in Landscape (`~wolref-podlex/foundation`).
|
||||
|
||||
Tlon is the primary developer of Urbit itself and the foremost product developer within the Urbit ecosystem. They’ve been developing Urbit since 2013 and are naturally a great source of information. They maintain the most popular Landscape groups, Urbit Community (`~bitbet-bolbel/urbit-community`) and Urbit Index (`~bollug-worlus/urbit-index`).
|
||||
|
||||
## Directory
|
||||
|
||||
Our community is comprised of individuals, all of whom happen to be pretty friendly. Here’s a list of prominent figures you’ll likely encounter that are open to being contacted:
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
---
|
||||
title: Learn
|
||||
courses:
|
||||
- title: 1. Environment Setup Guide
|
||||
duration: 1 hour
|
||||
course: Urbit 101
|
||||
link: https://urbit.org/docs/development/environment
|
||||
description: This guide contains the best practices for configuring your environment for Urbit development, like setting up your text editor and working with “fakeships”. This guide also serves as a reference for environment-related issues.
|
||||
- title: 2. Hoon Tutorial
|
||||
duration: 1-2 weeks
|
||||
course: Urbit 101
|
||||
link: https://urbit.org/docs/hoon/hoon-school/intro
|
||||
description: This is the recommended starting point for anyone that wants to learn full stack Urbit development. It walks you through the Hoon programming language, generators, and the basics of Urbit programming.
|
||||
- title: 3. Gall Tutorial
|
||||
duration: 1-2 weeks
|
||||
course: Urbit 101
|
||||
link: https://urbit.org/docs/userspace/gall-guide/intro
|
||||
description: This course picks up where Hoon School left off by teaching you how to use the language to build a real-world application using a gall agent. This covers the entirety of the gall API, best practices for developing agents over time, and exercises to push your knowledge.
|
||||
- title: 4. Client-side Integration Guide
|
||||
duration: 1 day
|
||||
course: Urbit 101
|
||||
link: https://urbit.org/docs/arvo/eyre/guide
|
||||
description: The vane eyre allows clients to interact with Urbit over an HTTP interface. Urbit’s architecture is organized around command query responsibility segregation (CQRS), which makes heavy use of pub/sub patterns. Working with this API is different than more typical request/response architecture, and this guide gives you a comprehensive overview of how to do so.
|
||||
- title: Guide to Working with JSON
|
||||
course: Urbit 201
|
||||
link: https://urbit.org/docs/hoon/guides/json-guide
|
||||
description: JSON is a dynamically-defined datastructure, and Hoon is a statically-typed language, which means that the two don’t play together really well. This guide gives a comprehensive overview of how to parse and serialize JSON from Hoon.
|
||||
- title: HTTP-API Guide
|
||||
course: Urbit 201
|
||||
link: https://urbit.org/docs/userspace/http-api-guide
|
||||
description: The @urbit/http-api NPM module makes it easy to talk to a ship from a Javascript front-end. This guide and reference goes over how to use it.
|
||||
- title: Software Distribution Guide
|
||||
course: Urbit 201
|
||||
link: https://urbit.org/docs/userspace/dist/guide
|
||||
description: After you’ve created something on Urbit you’ll probably want to share it with other people. This guide walks you through the mechanisms for distributing software over the network.
|
||||
- title: Fullstack Development Walkthrough
|
||||
course: Urbit 201
|
||||
link: https://urbit.org/docs/userspace/full-stack/1-intro
|
||||
description: This tutorial walks though everthing you’ve learned to date -- writing a gall agent in Hoon from scratch, writing a React front-end that talks to the agent through Eyre, and then packaging up the entire application for distribution over the network.
|
||||
- title: Graph Store Tutorial
|
||||
course: Urbit 201
|
||||
link: https://urbit.org/docs/userspace/graph-store/overview
|
||||
description: Graph store is a gall agent that’s designed to be a general-purpose database for storing graph-like data. Comprising the bulk of the backend for Tlon’s Landscape applciation, it’s battle tested and optimized for real-world use. This guide walks you through its architecture and implementation, and then shows you how to use it as a data store for your own application.
|
||||
- title: Guide to Threads
|
||||
course: Urbit 201
|
||||
link: https://urbit.org/docs/userspace/threads/basics/fundamentals
|
||||
description: Threads are monadic functions primarily used to spin out complex IO operations from Gall agents. If you're writing an app that must make a series of external API calls where the next call depends on the result of the last, threads are the proper solution. This guide walks through the basics of writing threads, and the Gall section beneath it demonstrates how to work with threads from Gall agents.
|
||||
---
|
||||
|
||||
We’ve made several self-guided tutorials and guides available to get your started on your journey, which should be read in order. All-in-all, a programmer with some experience should be able to work through this material and become proficient at Urbit programming in under a month of regular study.
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
---
|
||||
title: Opportunities
|
||||
---
|
||||
|
||||
## Grants
|
||||
|
||||
Urbit is a community project. While anyone can contribute, we help focus development and reward exceptional contribution through our grants program.
|
||||
|
||||
Contributors of all types have access to a wide variety of resources while working on projects, including a supportive team at urbit.org, Tlon developers, and community mentors.
|
||||
|
||||
<a href="https://urbit.org/grants#find-a-grant" className="button-lg bg-green-400 text-white text-ui inline-flex">See Current Grants</a>
|
||||
|
||||
## Jobs
|
||||
|
||||
Many companies in the Urbit ecosystem hire from the community. Core contributors are often considered first when making a decision to hire. Here are a few companies that may be hiring:
|
||||
|
||||
- [dcSpark](https://careers.dcspark.io/)
|
||||
- [Tlon Corporation](https://tlon.io/careers/)
|
||||
- [Tirrel Corporation](https://tirrel.io/)
|
||||
|
||||
## The Combine
|
||||
|
||||
The Combine invests in teams and individuals who are working on Urbit projects and are in the fundraising stage. Learn more at [The Combine](https://www.the-combine.org/)
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
---
|
||||
title: Primer
|
||||
---
|
||||
|
||||
Urbit development involves a fairly typical client/server/database stack. Urbit is both a server, database, and an entire operating system—this means exposes a filesystem, HTTP server, timer, and much more to the programmer (these different parts of the operating system are called **vanes**).
|
||||
|
||||
Clients that interact with Urbit can be web browsers, mobile or desktop applications, command lines, or anything else that presents a user interface. At time of writing, most clients communicate with Urbit over HTTP by sending JSON back and forth, primarily via pub/sub APIs.
|
||||
|
||||
Where Urbit differs from other client/server stacks is that all users run their own servers (**urbits**), and those servers talk directly to one another. Because those servers are also databases, all users store their own data, which they exchange with one another based on application-level logic.
|
||||
|
||||
Urbit allows programmers to create what are called **agents**, which can be thought of as individual microservices—each one contains its own logic, defines its own API, can be started and stopped, can interact with the rest of the operating system and other agents, and is responsible for storing its own data. The lifecycle of agents is managed by the part of the operating system called **gall**.
|
||||
|
||||
Since Urbit is actually an operating system, not just a server, when we talk about an Urbit “application” we could mean any of several things:
|
||||
|
||||
- A web or mobile interface that interacts with one or more agents to define something that looks a lot like an “app”
|
||||
- A single agent that runs in the background
|
||||
- A script called a **generator** that’s executed from Urbit’s own command-line shell (called the **dojo**)
|
||||
|
||||
Generators, agents and supporting code are packaged up into **desks**. These provide a mechanism for packaging up related code, and can be shared directly with other users over the network—this is how software distribution works on Urbit.
|
||||
|
||||
All Urbit-side code is written in a purely functional and statically typed language called **Hoon**. Hoon looks kind of strange compared to most other programming languages, primarily because it’s based on **runes** rather than keywords. This strangeness is due to unfamiliarity rather than any form of essential complexity, in much the same way as Chinese appears more complex to an English-speaker than, say, Spanish.
|
||||
|
||||
It’s possible to develop for Urbit without learning Hoon by learning its client-side HTTP interface; however, investing the time to learn Hoon will make you a far more capable Urbit developer, so we definitely recommend it.
|
||||
|
||||
Ready to get started? [Begin with our Urbit 101 course](/learn#urbit-101).
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
---
|
||||
title: A testing page
|
||||
---
|
||||
|
||||
```js
|
||||
function foo = () => {
|
||||
return "bar"
|
||||
}
|
||||
```
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
---
|
||||
title: Why become an Urbit developer?
|
||||
---
|
||||
|
||||
by `~wolref-podlex`<br />
|
||||
Executive Director, Urbit Foundation
|
||||
|
||||
Urbit is a novel general-purpose computer that’s captivated thousands, and it’s no wonder why—truly novel computing architectures are few and far between, and they tend to be highly transformative. For recent examples, consider iOS and Ethereum. We think Urbit is at least as big of a deal<sup>1</sup>.
|
||||
|
||||
Most developers are drawn to Urbit because they’re fascinated by it—this author being no exception. The artful elegance of Nock, Hoon, and Arvo are reason enough for many, but are by no means the only reasons to bother learning Urbit.
|
||||
|
||||
For one, Urbit is useful. There are real applications built on it that have properties you simply can’t find elsewhere. Its promise to developers is that distributed peer-to-peer applications, traditionally some of the hardest to build, can be built with ease and simple, understandable architectures. Urbit as a stack stands in stark contrast to the bloated tarpit of complexity that is modern networked software development.
|
||||
|
||||
Aside from the lofty philosophical ideals that are at arguable stages of progress, Urbit has a thriving, friendly, helpful community of developers that cooperate out of a shared desire to make programming better and more fun. You’ll find gray-haired industry veterans, new students, beginners to programming, IoT enthusiasts, and degens, running a wide gamut of hackers.
|
||||
|
||||
Being in its early stages of development, Urbit is also an exciting space to develop within—pretty much everything is greenfield, leaving a new future to be invented.
|
||||
|
||||
---
|
||||
|
||||
[1] But we would, wouldn’t we?
|
||||
11
lib/api.js
11
lib/api.js
|
|
@ -1,11 +0,0 @@
|
|||
import fs from "fs";
|
||||
import path from "path";
|
||||
|
||||
export const CONTENT_PATH = path.join(process.cwd(), "content");
|
||||
|
||||
export const contentFilePaths = fs
|
||||
.readdirSync(CONTENT_PATH)
|
||||
// Only include md files...
|
||||
.filter((path) => /\.md$/.test(path))
|
||||
// ...without the .page.md suffix
|
||||
.filter((path) => /^((?!.*page.md*).)*$/.test(path));
|
||||
43
lib/constants.js
Normal file
43
lib/constants.js
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
export const footerData = [
|
||||
[
|
||||
{
|
||||
title: "~<br/>Urbit Developers",
|
||||
links: [
|
||||
{ title: "Home", href: "/" },
|
||||
{ title: "Overview", href: "/overview" },
|
||||
{ title: "Guides", href: "/guides" },
|
||||
{ title: "Courses", href: "/courses" },
|
||||
{ title: "Community", href: "/community" },
|
||||
{ title: "Blog", href: "/blog" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: " ",
|
||||
links: [
|
||||
{
|
||||
title: "GitHub",
|
||||
href: "https://github.com/urbit",
|
||||
},
|
||||
{
|
||||
title: "Airlock APIs",
|
||||
href: "https://github.com/urbit/awesome-urbit#http-apis-airlock",
|
||||
},
|
||||
{
|
||||
title: "Urbit Binaries",
|
||||
href: "https://github.com/urbit/urbit/releases",
|
||||
},
|
||||
{ title: "Urbit Client", href: "https://github.com/urbit/port" },
|
||||
{
|
||||
title: "Issue Tracker",
|
||||
href: "https://github.com/urbit/urbit/issues",
|
||||
},
|
||||
{ title: "Security Audits", href: "https://urbit.org/audits" },
|
||||
],
|
||||
},
|
||||
],
|
||||
[
|
||||
{ title: "Privacy Policy", href: "https://urbit.org/privacy" },
|
||||
{ title: "Terms of Service", href: "https://urbit.org/terms-of-service" },
|
||||
{ title: "support@urbit.org", href: "mailto:support@urbit.org" },
|
||||
],
|
||||
];
|
||||
3
lib/lib.js
Normal file
3
lib/lib.js
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
export function capitalize(str) {
|
||||
return str.charAt(0).toUpperCase() + str.slice(1);
|
||||
}
|
||||
|
|
@ -1,12 +1,6 @@
|
|||
module.exports = {
|
||||
webpack5: true,
|
||||
webpack: (config) => {
|
||||
config.resolve.fallback = { fs: false, path: false };
|
||||
config.module.rules.push({
|
||||
test: /\.md$/,
|
||||
use: "raw-loader",
|
||||
});
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
reactStrictMode: true,
|
||||
}
|
||||
|
||||
return config;
|
||||
},
|
||||
};
|
||||
module.exports = nextConfig
|
||||
|
|
|
|||
16253
package-lock.json
generated
16253
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
41
package.json
41
package.json
|
|
@ -1,42 +1,23 @@
|
|||
{
|
||||
"name": "developers.urbit.org",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start"
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@socialgouv/matomo-next": "^1.2.2",
|
||||
"@tailwindcss/typography": "^0.4.1",
|
||||
"@tlon/sigil-js": "^1.4.4",
|
||||
"classnames": "^2.3.1",
|
||||
"deepmerge": "^4.2.2",
|
||||
"gray-matter": "^4.0.3",
|
||||
"html-entities": "^2.3.2",
|
||||
"next": "latest",
|
||||
"raw-loader": "^4.0.2",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"rehype-raw": "^6.1.0",
|
||||
"rehype-stringify": "^9.0.2",
|
||||
"remark": "13",
|
||||
"remark-gfm": "^3.0.0",
|
||||
"remark-html": "13.0.1",
|
||||
"remark-parse": "^10.0.0",
|
||||
"remark-prism": "^1.3.6",
|
||||
"remark-rehype": "^10.0.0",
|
||||
"remark-slug": "^7.0.0"
|
||||
"foundation-design-system": "github:urbit/foundation-design-system#01f35f1ff8775b300508fe334e44d473e4201ba1",
|
||||
"next": "12.1.6",
|
||||
"react": "^17",
|
||||
"react-dom": "^17",
|
||||
"react-swipeable": "^7.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^10.3.6",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-config-prettier": "^8.3.0",
|
||||
"eslint-config-standard": "^16.0.3",
|
||||
"eslint-plugin-import": "^2.24.2",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-promise": "^5.1.0",
|
||||
"eslint-plugin-react": "^7.26.1",
|
||||
"postcss": "^8.3.8",
|
||||
"tailwindcss": "^2.2.16"
|
||||
"eslint": "8.18.0",
|
||||
"eslint-config-next": "12.1.6"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,59 +0,0 @@
|
|||
import React from "react";
|
||||
import fs from "fs";
|
||||
import path from "path";
|
||||
import Head from "next/head";
|
||||
import matter from "gray-matter";
|
||||
import { decode } from "html-entities";
|
||||
import { contentFilePaths, CONTENT_PATH } from "../lib/api";
|
||||
import Markdown from "../components/Markdown";
|
||||
import Container from "../components/Container";
|
||||
import Layout from "../components/Layout";
|
||||
import Section from "../components/Section";
|
||||
import SingleColumn from "../components/SingleColumn";
|
||||
|
||||
export default function DynamicPage({ markdown, data }) {
|
||||
return (
|
||||
<Layout>
|
||||
<Head>
|
||||
<title>{data.title} • Urbit Developers</title>
|
||||
</Head>
|
||||
<Container>
|
||||
<SingleColumn>
|
||||
<Section>
|
||||
<h1>{data.title}</h1>
|
||||
</Section>
|
||||
<Section>
|
||||
<div className="prose lg:prose-lg">
|
||||
<div dangerouslySetInnerHTML={{ __html: decode(markdown) }} />
|
||||
</div>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
</Container>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
export const getStaticProps = async ({ params }) => {
|
||||
const pagePath = path.join(CONTENT_PATH, `${params.slug}.md`);
|
||||
const source = fs.readFileSync(pagePath);
|
||||
const { content, data } = matter(source);
|
||||
const markdown = await Markdown(content);
|
||||
|
||||
return {
|
||||
props: {
|
||||
markdown,
|
||||
data,
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
export const getStaticPaths = async () => {
|
||||
const paths = contentFilePaths
|
||||
.map((path) => path.replace(/\.md?$/, ""))
|
||||
.map((slug) => ({ params: { slug } }));
|
||||
|
||||
return {
|
||||
paths,
|
||||
fallback: false,
|
||||
};
|
||||
};
|
||||
|
|
@ -1,21 +1,9 @@
|
|||
import React, { useEffect } from "react";
|
||||
import { init } from "@socialgouv/matomo-next";
|
||||
|
||||
import "../styles/globals.css";
|
||||
import "../styles/prism.css";
|
||||
|
||||
const MATOMO_URL = process.env.NEXT_PUBLIC_MATOMO_URL;
|
||||
const MATOMO_SITE_ID = process.env.NEXT_PUBLIC_MATOMO_SITE_ID;
|
||||
import "foundation-design-system/styles/globals.css";
|
||||
import "foundation-design-system/styles/markdown.css";
|
||||
import "foundation-design-system/styles/prism.css";
|
||||
import "../styles/developers.css";
|
||||
|
||||
function MyApp({ Component, pageProps }) {
|
||||
|
||||
useEffect(() => {
|
||||
init({
|
||||
url: MATOMO_URL,
|
||||
siteId: MATOMO_SITE_ID,
|
||||
});
|
||||
});
|
||||
|
||||
return <Component {...pageProps} />;
|
||||
}
|
||||
|
||||
|
|
|
|||
5
pages/api/hello.js
Normal file
5
pages/api/hello.js
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
|
||||
export default function handler(req, res) {
|
||||
res.status(200).json({ name: 'John Doe' })
|
||||
}
|
||||
|
|
@ -1,71 +0,0 @@
|
|||
import React from "react";
|
||||
import Head from "next/head";
|
||||
import matter from "gray-matter";
|
||||
import { decode } from "html-entities";
|
||||
import Layout from "../components/Layout";
|
||||
import Container from "../components/Container";
|
||||
import Section from "../components/Section";
|
||||
import SingleColumn from "../components/SingleColumn";
|
||||
import Markdown from "../components/Markdown";
|
||||
import Sigil from "../components/Sigil";
|
||||
|
||||
export default function DynamicPage({ parsed, data }) {
|
||||
return (
|
||||
<Layout>
|
||||
<Head>
|
||||
<title>{data.title} • Urbit Developers</title>
|
||||
</Head>
|
||||
<Container>
|
||||
<SingleColumn>
|
||||
<Section>
|
||||
<h1>{data.title}</h1>
|
||||
</Section>
|
||||
<Section>
|
||||
<div
|
||||
className="prose lg:prose-lg"
|
||||
dangerouslySetInnerHTML={{ __html: decode(parsed) }}
|
||||
/>
|
||||
<div className="prose lg:prose-lg">
|
||||
<div className="py-8 grid gap-8 xl:grid-cols-2">
|
||||
{data.directory.map((person, i) => (
|
||||
<div className="p-8 rounded-xl bg-wall-100" key={person.patp}>
|
||||
<div className="flex">
|
||||
<div className="mr-4">
|
||||
<Sigil patp={person.patp} />
|
||||
</div>
|
||||
<div>
|
||||
<div className="font-mono font-semibold">
|
||||
{person.patp}
|
||||
</div>
|
||||
<div className="text-sm">{person.job}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-4">{person.roles}</div>
|
||||
</div>
|
||||
))}
|
||||
<div>
|
||||
Others: <code>~palfun-foslup</code>,{" "}
|
||||
<code>~littel-wolfur</code>, <code>~lavlyn-litmeg</code>,
|
||||
<code>~mocrux-nomdep</code>, <code>~sicdev-pilnup</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
</Container>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
export const getServerSideProps = async ({ context }) => {
|
||||
const source = require(`../content/community.page.md`);
|
||||
const { content, data } = matter(source.default);
|
||||
const parsed = await Markdown(content);
|
||||
|
||||
return {
|
||||
props: {
|
||||
parsed,
|
||||
data,
|
||||
},
|
||||
};
|
||||
};
|
||||
302
pages/index.js
302
pages/index.js
|
|
@ -1,133 +1,209 @@
|
|||
import React from "react";
|
||||
import Head from "next/head";
|
||||
import Header from "../components/Header";
|
||||
import Footer from "../components/Footer";
|
||||
import { Container, SingleColumn, Section } from "foundation-design-system";
|
||||
import Link from "next/link";
|
||||
import Container from "../components/Container";
|
||||
import Layout from "../components/Layout";
|
||||
import Section from "../components/Section";
|
||||
import SingleColumn from "../components/SingleColumn";
|
||||
import {
|
||||
Comms,
|
||||
Database,
|
||||
Distribution,
|
||||
Identity,
|
||||
Interface,
|
||||
MintFiller,
|
||||
Peer,
|
||||
State,
|
||||
} from "../components/icons";
|
||||
import Card from "../components/Card";
|
||||
import TallCard from "../components/TallCard";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<Layout>
|
||||
<div>
|
||||
<Head>
|
||||
<title>Urbit Developers</title>
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
</Head>
|
||||
<Container>
|
||||
<Header />
|
||||
<SingleColumn>
|
||||
<Section className="pb-72">
|
||||
{/* Hero statement */}
|
||||
<div className="flex flex-col space-y-4">
|
||||
<h1 className="max-w-prose">
|
||||
Discover the creative possibility of a unified operating system
|
||||
</h1>
|
||||
<div className="flex flex-col md:flex-row space-y-4 md:space-y-0 md:space-x-4">
|
||||
<Link href="/overview" passHref>
|
||||
<a className="button-lg bg-white border-wall-500 border-2">
|
||||
Read the Overview
|
||||
</a>
|
||||
</Link>
|
||||
<Link href="/reference" passHref>
|
||||
<a className="button-lg bg-blue-400 text-white">
|
||||
Learn the Stack
|
||||
</a>
|
||||
</Link>
|
||||
<Link href="/guides" passHref>
|
||||
<a className="button-lg bg-green-400 text-white">
|
||||
Quickstart
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</Section>
|
||||
<Section short>
|
||||
<h2>
|
||||
Urbit provides foundational primitives at the operating system
|
||||
layer, serving as a better platform for building networked,
|
||||
decentralized applications.
|
||||
</h2>
|
||||
<div className="flex flex-wrap pt-12">
|
||||
{pitch.map((each) => {
|
||||
return (
|
||||
<div
|
||||
key={each.title}
|
||||
className="basis-1/2 xl:basis-1/3 flex space-x-2 justify-start items-start my-8 pr-8"
|
||||
>
|
||||
{each.icon}
|
||||
<div className="flex flex-col">
|
||||
<p className="font-bold text-sm">{each.title}</p>
|
||||
<p className="text-sm">{each.content}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<div className="pt-12">
|
||||
<p>
|
||||
Thanks to this architecture, you can take software into
|
||||
production within weeks rather than months. Check out our
|
||||
Lightning Tutorials below to jump right in and build an app in
|
||||
15 minutes.
|
||||
</p>
|
||||
</div>
|
||||
</Section>
|
||||
<Section>
|
||||
<h1 className="pb-12">
|
||||
Urbit is a general-purpose platform for building decentralized,
|
||||
peer-to-peer applications.
|
||||
</h1>
|
||||
<Link href="/primer">
|
||||
<button className="button-lg bg-green-400 text-white text-ui">
|
||||
Learn More
|
||||
</button>
|
||||
<h2 className="pt-12">Quickstart: Lightning Tutorials</h2>
|
||||
<div className="flex space-x-4 pt-12">
|
||||
<Card
|
||||
icon={<Comms />}
|
||||
title="Encrypted Chat Application"
|
||||
text="Build your own secure comms tool"
|
||||
className="basis-1/2"
|
||||
/>
|
||||
<Card
|
||||
icon={<MintFiller />}
|
||||
title="Lorem Ipsum Dolorem"
|
||||
text="Roll your own encrypted chat application in minutes"
|
||||
className="basis-1/2"
|
||||
/>
|
||||
</div>
|
||||
</Section>
|
||||
<Section className="flex flex-col space-y-12">
|
||||
<h2>Guides</h2>
|
||||
<p className="text-lg">
|
||||
Learn the foundations of software development on Urbit with our
|
||||
core curriculum of guides.
|
||||
</p>
|
||||
<div className="flex flex-col space-y-4 lg:space-y-0 lg:flex-row lg:space-x-4">
|
||||
<TallCard
|
||||
title="Hoon School"
|
||||
description="Learn the fundamentals of the Hoon programming language"
|
||||
callout="View Guide"
|
||||
href="/guides/hoon-school"
|
||||
image="/images/hoon.svg"
|
||||
className="basis-1/2"
|
||||
/>
|
||||
<TallCard
|
||||
title="App School"
|
||||
description="Learn how to build Urbit userspace applications by writing your own Gall agents"
|
||||
callout="View Guide"
|
||||
href="/guides/app-school"
|
||||
image="/images/app.svg"
|
||||
className="basis-1/2"
|
||||
/>
|
||||
</div>
|
||||
<Link href="/guides" passHref>
|
||||
<a className="button-lg bg-wall-600 text-white w-fit">
|
||||
View All Guides
|
||||
</a>
|
||||
</Link>
|
||||
</Section>
|
||||
<Section short>
|
||||
<div className="p-12 bg-green-100 rounded-3xl prose lg:prose-lg">
|
||||
<Link href="/learn">
|
||||
<h2 className="cursor-pointer hover:opacity-80">
|
||||
Learn{" "}
|
||||
<span className="block mt-2 text-base text-green-400">
|
||||
Become an Urbit developer
|
||||
</span>
|
||||
</h2>
|
||||
</Link>
|
||||
|
||||
<p>
|
||||
Urbit is an entirely new computer and novel programming
|
||||
environment. Start with our series of self-guided courses.{" "}
|
||||
</p>
|
||||
|
||||
<p>
|
||||
You can get a high level overview with the primer, or jump into
|
||||
learning with a series of self-led courses designed to teach you
|
||||
the basics called Urbit 101. If you’re already familiar with the
|
||||
basics, consult the series of standalone guides called Urbit
|
||||
201.
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/primer">Stack Overview</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/learn#urbit-101">Urbit 101</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/learn#urbit-201">Urbit 201</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<Section className="flex flex-col space-y-12">
|
||||
<h2>Courses</h2>
|
||||
<p className="text-lg">
|
||||
Want an interactive experience to truly learn software development
|
||||
on Urbit? Join the next cohort for Hoon or App School Live and
|
||||
learn with a group.
|
||||
</p>
|
||||
<Link href="/courses" passHref>
|
||||
<a className="button-lg bg-green-400 text-white w-fit">
|
||||
View Courses
|
||||
</a>
|
||||
</Link>
|
||||
</Section>
|
||||
<Section className="flex flex-col space-y-8">
|
||||
<h2>Community</h2>
|
||||
<p className="text-lg">
|
||||
The developer community is friendly, helpful, and organized from
|
||||
within Urbit itself.
|
||||
</p>
|
||||
<div className="flex space-x-4">
|
||||
<Card
|
||||
title="Developer Calls"
|
||||
text="We regularly host livestreams, meetups, and hackathons"
|
||||
href="/events"
|
||||
callout="View Events"
|
||||
className="basis-1/2"
|
||||
/>
|
||||
<Card
|
||||
title="Opportunities"
|
||||
text="Urbit is growing and there are many opportunities to find a job, grant, or funding for your great idea"
|
||||
href="/community/opportunities"
|
||||
callout="Explore Opportunities"
|
||||
className="basis-1/2"
|
||||
/>
|
||||
</div>
|
||||
</Section>
|
||||
<Section short>
|
||||
<div className="p-12 bg-blue-100 rounded-3xl prose lg:prose-lg">
|
||||
<Link href="/community">
|
||||
<h2 className="cursor-pointer hover:opacity-80">
|
||||
Community{" "}
|
||||
<span className="block mt-2 text-base text-green-400">
|
||||
Join the community{" "}
|
||||
</span>
|
||||
</h2>
|
||||
</Link>
|
||||
|
||||
<p>
|
||||
The developer community is friendly, helpful, and organized from
|
||||
within Urbit itself—but you don’t have to take our word for it!
|
||||
Join our public groups on the network, or tune into a Developer
|
||||
Call to join the community.{" "}
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/community">Get Involved</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="https://urbit.org/events">Developer Calls</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="https://groups.google.com/a/urbit.org/g/dev?pli=1">
|
||||
Join the Mailing List
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</Section>
|
||||
<Section short>
|
||||
<div className="p-12 bg-yellow-100 rounded-3xl prose lg:prose-lg">
|
||||
<Link href="/opportunities">
|
||||
<h2 className="cursor-pointer hover:opacity-80">
|
||||
Opportunities{" "}
|
||||
<span className="block mt-2 text-base text-green-400">
|
||||
Apply your skills
|
||||
</span>
|
||||
</h2>
|
||||
</Link>
|
||||
<p>
|
||||
The Urbit ecosystem is growing rapidly, which presents many
|
||||
opportunities to enterprising developers. Address space grants
|
||||
through the Urbit Foundation are a great way to take your skills
|
||||
to the next level. Companies like Tlon are regularly hiring
|
||||
developers, and The Combine is funding startups that build on
|
||||
Urbit.{" "}
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/opportunities#grants">Grants</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/opportunities#jobs">Jobs</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/opportunities#the-combine">The Combine</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<Section className="flex flex-col space-y-8">
|
||||
<h2>What's New</h2>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
<Footer />
|
||||
</Container>
|
||||
</Layout>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const pitch = [
|
||||
{
|
||||
icon: <Identity className="shrink-0" />,
|
||||
title: "Identity",
|
||||
content: "Urbit ID works for individuals and organizations alike",
|
||||
},
|
||||
{
|
||||
icon: <State className="shrink-0" />,
|
||||
title: "State",
|
||||
content:
|
||||
"Every action is cryptographically secured and tied to an identity",
|
||||
},
|
||||
{
|
||||
icon: <Database className="shrink-0" />,
|
||||
title: "Persistent Database",
|
||||
content: "Lorem ipsum dolorem sin atmet ad piscing",
|
||||
},
|
||||
{
|
||||
icon: <Peer className="shrink-0" />,
|
||||
title: "Peer-to-Peer Applications",
|
||||
content: "Urbit is end-to-end encrypted and multiplayer by default",
|
||||
},
|
||||
{
|
||||
icon: <Distribution className="shrink-0" />,
|
||||
title: "Open Distribution",
|
||||
content: "Distribute software without corporate oversight",
|
||||
},
|
||||
{
|
||||
icon: <Interface className="shrink-0" />,
|
||||
title: "Web Interfaces",
|
||||
content: "Natural integration with front-end web frameworks",
|
||||
},
|
||||
];
|
||||
|
|
|
|||
100
pages/learn.js
100
pages/learn.js
|
|
@ -1,100 +0,0 @@
|
|||
import React from 'react'
|
||||
import Head from 'next/head'
|
||||
import matter from 'gray-matter'
|
||||
import { decode } from 'html-entities'
|
||||
import Layout from '../components/Layout'
|
||||
import Container from '../components/Container'
|
||||
import Section from '../components/Section'
|
||||
import SingleColumn from '../components/SingleColumn'
|
||||
import Markdown from '../components/Markdown'
|
||||
|
||||
export default function DynamicPage ({ parsed, data }) {
|
||||
return (
|
||||
<Layout>
|
||||
<Head>
|
||||
<title>{data.title} • Urbit Developers</title>
|
||||
</Head>
|
||||
<Container>
|
||||
<SingleColumn>
|
||||
<Section>
|
||||
<h1>{data.title}</h1>
|
||||
</Section>
|
||||
<Section>
|
||||
<div
|
||||
className="prose lg:prose-lg"
|
||||
dangerouslySetInnerHTML={{ __html: decode(parsed) }}
|
||||
/>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
<SingleColumn>
|
||||
<Section>
|
||||
<div className="prose lg:prose-lg">
|
||||
<h2 id="urbit-101">Urbit 101</h2>
|
||||
</div>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
<div className="px-8 lg:px-16 grid gap-8 lg:grid-cols-2 2xl:grid-cols-4 prose">
|
||||
{data.courses.map((course, i) => {
|
||||
if (course.course === 'Urbit 101') {
|
||||
return (
|
||||
<div className="px-8 rounded-xl bg-wall-100" key={course.link}>
|
||||
<h3>
|
||||
<a href={course.link}>{course.title}</a>
|
||||
</h3>
|
||||
<p>{course.description}</p>
|
||||
<p className="text-sm uppercase tracking-wide">
|
||||
{course.duration}
|
||||
</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return false
|
||||
})}
|
||||
</div>
|
||||
<SingleColumn>
|
||||
<Section>
|
||||
<div className="prose lg:prose-lg">
|
||||
<h2 id="urbit-201">Urbit 201</h2>
|
||||
<p>
|
||||
Equipped with knowledge of the basics of all parts of the stack,
|
||||
there are a number of additional supplementary tutorials and
|
||||
guides to deepen your knowledge:
|
||||
</p>
|
||||
</div>
|
||||
</Section>
|
||||
</SingleColumn>
|
||||
<div className="px-8 lg:px-16 grid gap-8 lg:grid-cols-2 2xl:grid-cols-4 prose pb-16">
|
||||
{data.courses.map((course, i) => {
|
||||
if (course.course === 'Urbit 201') {
|
||||
return (
|
||||
<div className="px-8 rounded-xl bg-wall-100" key={course.link}>
|
||||
<h3>
|
||||
<a href={course.link}>{course.title}</a>
|
||||
</h3>
|
||||
<p>{course.description}</p>
|
||||
<p className="text-sm uppercase tracking-wide">
|
||||
{course.duration}
|
||||
</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return false
|
||||
})}
|
||||
</div>
|
||||
</Container>
|
||||
</Layout>
|
||||
)
|
||||
}
|
||||
|
||||
export const getServerSideProps = async ({ context }) => {
|
||||
const source = require('../content/learn.page.md')
|
||||
const { content, data } = matter(source.default)
|
||||
const parsed = await Markdown(content)
|
||||
|
||||
return {
|
||||
props: {
|
||||
parsed,
|
||||
data
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +1,6 @@
|
|||
// If you want to use other PostCSS plugins, see the following:
|
||||
// https://tailwindcss.com/docs/using-with-preprocessors
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 5.3 KiB |
10
public/images/app.svg
Normal file
10
public/images/app.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
<svg width="408" height="230" viewBox="0 0 408 230" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="408" height="230" fill="#92ABD0"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M203.16 56.075C198.878 56.075 195.4 59.5522 195.4 63.8343C195.4 67.7841 198.339 71.04 202.148 71.5346V163.583C198.671 164.351 196.072 167.452 196.072 171.165C196.072 175.447 199.55 178.925 203.839 178.925C208.121 178.925 211.598 175.448 211.598 171.165C211.598 167.216 208.66 163.96 204.851 163.465V71.4165C208.328 70.6486 210.927 67.5478 210.927 63.8343C210.927 59.5524 207.449 56.075 203.16 56.075ZM198.103 63.8343C198.103 61.0436 200.369 58.7771 203.16 58.7771C205.958 58.7771 208.224 61.0436 208.224 63.8343C208.224 66.6325 205.958 68.899 203.16 68.899C200.369 68.899 198.103 66.6325 198.103 63.8343ZM198.774 171.166C198.774 168.367 201.041 166.101 203.839 166.101C206.63 166.101 208.896 168.367 208.896 171.166C208.896 173.956 206.63 176.223 203.839 176.223C201.041 176.223 198.774 173.956 198.774 171.166Z" fill="white"/>
|
||||
<path d="M195.401 82.7333C195.401 81.9877 194.796 81.3896 194.05 81.3896C193.305 81.3896 192.699 81.9877 192.699 82.7333V158.001C192.699 158.746 193.305 159.352 194.05 159.352C194.796 159.352 195.401 158.746 195.401 158.001V82.7333Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M167.051 92.1835C167.051 96.0151 169.82 99.1897 173.459 99.8321V124.587C173.459 125.333 174.065 125.938 174.811 125.938H183.249V164.75C183.249 165.495 183.854 166.101 184.6 166.101C185.346 166.101 185.951 165.495 185.951 164.75V124.587C185.951 123.841 185.346 123.236 184.6 123.236H176.162V99.8321C179.809 99.1898 182.577 96.0153 182.577 92.1835C182.577 87.9015 179.1 84.4241 174.81 84.4241C170.528 84.4241 167.051 87.9013 167.051 92.1835H167.051ZM174.811 87.1262C172.02 87.1262 169.753 89.3927 169.753 92.1835C169.753 94.9816 172.02 97.2481 174.811 97.2481C177.609 97.2481 179.875 94.9816 179.875 92.1835C179.875 89.3927 177.609 87.1262 174.811 87.1262Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M162.207 139.433C161.565 143.08 158.39 145.849 154.559 145.849C150.277 145.849 146.799 142.372 146.799 138.09C146.799 133.8 150.276 130.323 154.559 130.323C158.39 130.323 161.565 133.091 162.207 136.738H175.149C175.895 136.738 176.5 137.344 176.5 138.089V164.748C176.5 165.494 175.895 166.099 175.149 166.099C174.404 166.099 173.798 165.494 173.798 164.748V139.431L162.207 139.433ZM149.501 138.09C149.501 135.291 151.768 133.025 154.559 133.025C157.357 133.025 159.623 135.291 159.623 138.09C159.623 140.88 157.357 143.147 154.559 143.147C151.768 143.147 149.501 140.88 149.501 138.09Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M215.653 83.4138C215.653 87.3562 218.591 90.6121 222.4 91.1067V107.378H212.95C212.205 107.378 211.599 107.976 211.599 108.722V158.002C211.599 158.748 212.205 159.353 212.95 159.353C213.696 159.353 214.301 158.748 214.301 158.002V110.074H223.751C224.497 110.074 225.103 109.468 225.103 108.722V90.989C228.572 90.2212 231.178 87.1203 231.178 83.4142C231.178 79.1249 227.701 75.6475 223.412 75.6475C219.122 75.6475 215.652 79.1247 215.652 83.4142L215.653 83.4138ZM223.412 78.3492C220.614 78.3492 218.347 80.6157 218.347 83.4138C218.347 86.212 220.614 88.4785 223.412 88.4785C226.21 88.4785 228.477 86.212 228.477 83.4138C228.477 80.6157 226.21 78.3492 223.412 78.3492Z" fill="white"/>
|
||||
<path d="M233.872 104.336C233.872 103.59 233.267 102.985 232.521 102.985C231.776 102.985 231.178 103.59 231.178 104.336V120.874H221.728C220.982 120.874 220.376 121.479 220.376 122.225V164.75C220.376 165.495 220.982 166.101 221.728 166.101C222.473 166.101 223.071 165.495 223.071 164.75V123.576H232.521C233.267 123.576 233.872 122.971 233.872 122.225V104.336Z" fill="white"/>
|
||||
<path d="M241.971 124.588C242.717 124.588 243.322 125.193 243.322 125.939V143.827C243.322 144.573 242.717 145.178 241.971 145.178H232.521V164.749C232.521 165.495 231.923 166.1 231.177 166.1C230.432 166.1 229.826 165.495 229.826 164.749V143.827C229.826 143.081 230.432 142.476 231.177 142.476H240.627V125.938C240.627 125.193 241.225 124.587 241.971 124.587V124.588Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
3
public/images/chevron.svg
Normal file
3
public/images/chevron.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="37" height="35" viewBox="0 0 37 35" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M24.6933 17.4563C24.6851 17.109 24.5498 16.7782 24.3105 16.5266L15.9105 7.77663C15.3732 7.2202 14.4859 7.20515 13.9281 7.74108C13.3717 8.2784 13.3525 9.16432 13.8871 9.72352L21.3575 17.5002L13.8871 25.2768C13.3525 25.836 13.3716 26.7219 13.9281 27.2593C14.4859 27.7952 15.3732 27.7802 15.9105 27.2237L24.3105 18.4737C24.5703 18.2003 24.7084 17.8339 24.6933 17.4565L24.6933 17.4563Z" fill="#918C84" fill-opacity="0.6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 531 B |
16
public/images/hoon.svg
Normal file
16
public/images/hoon.svg
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
<svg width="408" height="230" viewBox="0 0 408 230" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="408" height="230" fill="#A4D9BF"/>
|
||||
<path d="M129.949 65.8403C129.921 64.2003 130.189 62.8811 130.753 61.8826C131.316 60.8842 132.047 60.1572 132.946 59.7017C133.854 59.2462 134.811 59.0179 135.818 59.0167C136.824 59.0156 137.741 59.2368 138.57 59.6805C139.408 60.1142 140.364 60.7997 141.438 61.737C142.168 62.3685 142.749 62.8124 143.183 63.0688C143.627 63.3251 144.11 63.453 144.633 63.4524C145.482 63.4514 146.153 63.1444 146.647 62.5313C147.141 61.9084 147.379 61.009 147.36 59.8334L150.557 59.8298C150.585 61.4697 150.317 62.7889 149.753 63.7874C149.2 64.7859 148.469 65.5128 147.561 65.9683C146.652 66.4238 145.695 66.6522 144.689 66.6533C143.682 66.6545 142.765 66.4382 141.937 66.0044C141.108 65.5608 140.152 64.8703 139.068 63.933C138.348 63.3015 137.767 62.8576 137.323 62.6013C136.879 62.3449 136.396 62.217 135.873 62.2176C135.074 62.2185 134.413 62.5009 133.889 63.0646C133.375 63.6184 133.128 64.5424 133.146 65.8366L129.949 65.8403Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.171 66.8691L170.795 66.9793L170.798 64.3711L267.174 64.2609L267.171 66.8691Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.072 152.939L129.021 153.097L129.024 150.489L267.075 150.331L267.072 152.939Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.111 119.033L170.735 119.143L170.738 116.535L267.114 116.424L267.111 119.033Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M228.079 85.171L129.098 85.2842L129.101 82.676L228.082 82.5628L228.079 85.171Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.15 85.1261L233.288 85.1648L233.291 82.5566L267.153 82.5179L267.15 85.1261Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M228.019 137.335L129.039 137.448L129.042 134.84L228.022 134.727L228.019 137.335Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M191.594 100.862L129.08 100.933L129.083 98.3252L191.597 98.2537L191.594 100.862Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M191.514 171.283L129 171.355L129.003 168.746L191.517 168.675L191.514 171.283Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M165.526 119.149L129.059 119.191L129.062 116.583L165.529 116.541L165.526 119.149Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.09 137.29L233.228 137.329L233.231 134.72L267.093 134.682L267.09 137.29Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.132 100.775L199.408 100.853L199.411 98.2446L267.135 98.1672L267.132 100.775Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M267.052 171.196L199.328 171.274L199.331 168.666L267.054 168.588L267.052 171.196Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
9
styles/developers.css
Normal file
9
styles/developers.css
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
#card::after {
|
||||
content: "";
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
background-image: url('/images/chevron.svg');
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
}
|
||||
|
|
@ -1,159 +0,0 @@
|
|||
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Source+Code+Pro:wght@400;500;600;700;800&display=swap");
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
:root {
|
||||
--tray-time: 0ms;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
/* Make all text wall-600 by default */
|
||||
@apply text-wall-600;
|
||||
}
|
||||
|
||||
/* Reset a tags */
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Links in p tags should be green */
|
||||
p a,
|
||||
.prose a {
|
||||
@apply text-green-400 font-semibold no-underline;
|
||||
}
|
||||
|
||||
/* Reduce b and strong tag weight default */
|
||||
b,
|
||||
strong {
|
||||
@apply font-semibold;
|
||||
}
|
||||
|
||||
/* Typography */
|
||||
|
||||
h1,
|
||||
.type-h1 {
|
||||
@apply text-4xl lg:text-5xl font-extrabold leading-tight text-wall-600;
|
||||
}
|
||||
/*
|
||||
h2,
|
||||
.type-h2 {
|
||||
@apply text-3xl lg:text-4xl font-bold leading-tight;
|
||||
}
|
||||
|
||||
h3,
|
||||
.type-h3 {
|
||||
@apply text-xl font-semibold;
|
||||
}
|
||||
|
||||
|
||||
h5,
|
||||
.type-h5,
|
||||
.type-bold {
|
||||
@apply text-base font-semibold leading-relaxed;
|
||||
} */
|
||||
|
||||
/* p,
|
||||
.type-p {
|
||||
@apply text-base leading-relaxed;
|
||||
} */
|
||||
|
||||
.type-ui {
|
||||
@apply text-lg font-semibold;
|
||||
}
|
||||
|
||||
.type-sub {
|
||||
@apply text-sm;
|
||||
}
|
||||
|
||||
.type-sub-bold {
|
||||
@apply text-sm font-semibold;
|
||||
}
|
||||
|
||||
code .type-code {
|
||||
@apply bg-wall-100 p-4 font-mono;
|
||||
}
|
||||
|
||||
/* Utils */
|
||||
|
||||
.layout-narrow {
|
||||
@apply w-full md:w-8/12 lg:w-6/12;
|
||||
}
|
||||
|
||||
.layout {
|
||||
@apply w-full md:w-10/12 lg:w-8/12;
|
||||
}
|
||||
|
||||
.measure {
|
||||
max-width: 34em;
|
||||
}
|
||||
|
||||
.flex-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.bg-img {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
@apply bg-wall-100;
|
||||
}
|
||||
|
||||
.button-sm {
|
||||
@apply flex-center px-3 h-10 rounded-lg type-ui;
|
||||
}
|
||||
|
||||
.button-lg {
|
||||
@apply flex-center px-6 py-1 rounded-xl h-14 type-ui;
|
||||
}
|
||||
|
||||
/* Buttons in p tags should have white text */
|
||||
p .button-lg,
|
||||
.prose .button-lg {
|
||||
@apply inline-flex text-white;
|
||||
}
|
||||
|
||||
.badge-sm {
|
||||
@apply flex-center text-base font-medium px-3 h-8 rounded-full;
|
||||
}
|
||||
|
||||
.badge-lg {
|
||||
@apply flex-center type-ui px-5 h-12 rounded-full;
|
||||
}
|
||||
|
||||
.button-sm:hover,
|
||||
.button-text:hover,
|
||||
.button-lg:hover,
|
||||
a:hover {
|
||||
opacity: 0.66;
|
||||
}
|
||||
|
||||
.prose pre,
|
||||
.prose pre[class*="language-"] {
|
||||
}
|
||||
|
||||
.prose code,
|
||||
.prose code[class*="language-"] {
|
||||
@apply px-2 py-0.5 bg-wall-100 rounded-md;
|
||||
}
|
||||
|
||||
.prose a code,
|
||||
.prose a code[class*="language-"] {
|
||||
@apply bg-green-100 text-green-400;
|
||||
}
|
||||
|
||||
.prose pre {
|
||||
@apply block p-0 bg-wall-100 rounded-md overflow-x-auto;
|
||||
}
|
||||
|
||||
.prose pre > code,
|
||||
.prose pre[class*="language-"] > code {
|
||||
@apply p-4;
|
||||
}
|
||||
170
styles/prism.css
170
styles/prism.css
|
|
@ -1,170 +0,0 @@
|
|||
/* PrismJS 1.24.0
|
||||
https://prismjs.com/download.html#themes=prism-coy&languages=markup+css+clike+javascript */
|
||||
/**
|
||||
* prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
|
||||
* Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
|
||||
* @author Tim Shedor
|
||||
*/
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
@apply text-wall-600;
|
||||
background: none;
|
||||
font-family: "Source Code Pro", monospace;
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
code[class*="language-"] {
|
||||
max-height: inherit;
|
||||
height: inherit;
|
||||
display: block;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
position: relative;
|
||||
border-radius: 0.3em;
|
||||
color: #c92c2c;
|
||||
display: inline;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.block-comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #7d8b99;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #5f6364;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
@apply text-red;
|
||||
}
|
||||
|
||||
.token.function-name,
|
||||
.token.function {
|
||||
@apply text-wall-600;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
@apply text-green-400;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.token.variable {
|
||||
@apply text-wall-500;
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.class-name {
|
||||
@apply text-blue-400;
|
||||
}
|
||||
|
||||
.token.keyword {
|
||||
@apply text-purple;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.important {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
pre[class*="language-"]:before,
|
||||
pre[class*="language-"]:after {
|
||||
bottom: 14px;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Numbers */
|
||||
pre[class*="language-"].line-numbers.line-numbers {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers.line-numbers code {
|
||||
padding-left: 3.8em;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers.line-numbers .line-numbers-rows {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Highlight */
|
||||
pre[class*="language-"][data-line] {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
pre[data-line] code {
|
||||
position: relative;
|
||||
padding-left: 4em;
|
||||
}
|
||||
pre .line-highlight {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
|
@ -1,93 +1,8 @@
|
|||
module.exports = {
|
||||
purge: [
|
||||
presets: [require("foundation-design-system/tailwind.config")],
|
||||
content: [
|
||||
"./node_modules/foundation-design-system/**/*.js",
|
||||
"./pages/**/*.{js,ts,jsx,tsx}",
|
||||
"./components/**/*.{js,ts,jsx,tsx}",
|
||||
"./content/**/*.{md,mdx}",
|
||||
],
|
||||
darkMode: false, // or 'media' or 'class'
|
||||
theme: {
|
||||
colors: {
|
||||
// Wall
|
||||
"wall-100": "#F3F2F0", // Primary
|
||||
"wall-200": "#E3E0DB",
|
||||
"wall-300": "#C8C4BD",
|
||||
"wall-400": "#918C84",
|
||||
"wall-500": "#5A564F",
|
||||
"wall-600": "#24221E",
|
||||
washedWall: "rgba(240, 239, 236, .8)", // for overlays
|
||||
// Greens (Theme Primary Color)
|
||||
"green-100": "#E5F7F1",
|
||||
"green-200": "#BFEBDB",
|
||||
"green-300": "#80D8B8",
|
||||
"green-400": "#00B171", // Primary
|
||||
"green-500": "#006842",
|
||||
"green-600": "#001F13",
|
||||
// Yellows
|
||||
"yellow-100": "#FFFCF1",
|
||||
"yellow-200": "#FEEBAA",
|
||||
"yellow-300": "#FCDB63", // Primary
|
||||
"yellow-400": "#CE9645",
|
||||
"yellow-500": "#A15A2D",
|
||||
"yellow-600": "#602010",
|
||||
// Blues
|
||||
"blue-100": "#F1F9FF",
|
||||
"blue-200": "#BAE9FF",
|
||||
"blue-300": "#7ED8FF",
|
||||
"blue-400": "#219DFF", // Primary
|
||||
"blue-500": "#193C90",
|
||||
"blue-600": "#070821",
|
||||
// Util
|
||||
black: "#000",
|
||||
white: "#FFF",
|
||||
transparent: "rgba(0,0,0,0)",
|
||||
// Syntax highlighting
|
||||
purple: "rgba(157,82,255,0.8)",
|
||||
red: "#ff4136",
|
||||
// White semi-opaques
|
||||
washedWhite: "rgba(255,255,255, 0.5)",
|
||||
midWhite: "rgba(255,255,255, 0.8)",
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ["Inter", "-apple-system", "sans-serif"],
|
||||
mono: ["Source Code Pro", "monospace"],
|
||||
},
|
||||
extend: {
|
||||
typography: {
|
||||
DEFAULT: {
|
||||
css: [
|
||||
{
|
||||
color: "#24221E",
|
||||
maxWidth: "none",
|
||||
"p:nth-child(1)": { marginTop: "none" },
|
||||
code: {
|
||||
background: "#F3F2F0",
|
||||
},
|
||||
"code::before": {
|
||||
content: "none",
|
||||
},
|
||||
"code::after": {
|
||||
content: "none",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
fontSize: {
|
||||
xs: "0.75rem",
|
||||
sm: "0.875rem",
|
||||
base: "1rem",
|
||||
lg: "1.125rem",
|
||||
xl: "1.25rem",
|
||||
"2xl": "1.5rem",
|
||||
"3xl": "1.875rem",
|
||||
"4xl": "2.25rem",
|
||||
"5xl": "3rem",
|
||||
"6xl": "4rem",
|
||||
},
|
||||
},
|
||||
},
|
||||
variants: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [require("@tailwindcss/typography")],
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user