update contact page with calendar booking & added presentations
This commit is contained in:
parent
ef0ec789ab
commit
e2cec8a04a
|
|
@ -6,6 +6,7 @@ import { BrowserRouter, Route, Routes } from "react-router-dom"
|
|||
import { Contact } from "@/routes/Contact"
|
||||
import { Board } from "./routes/Board"
|
||||
import { Inbox } from "./routes/Inbox"
|
||||
import { Presentations } from "./routes/Presentations"
|
||||
import { createRoot } from "react-dom/client"
|
||||
import { DailyProvider } from "@daily-co/daily-react"
|
||||
import Daily from "@daily-co/daily-js"
|
||||
|
|
@ -23,6 +24,7 @@ function App() {
|
|||
<Route path="/contact" element={<Contact />} />
|
||||
<Route path="/board/:slug" element={<Board />} />
|
||||
<Route path="/inbox" element={<Inbox />} />
|
||||
<Route path="/presentations" element={<Presentations />} />
|
||||
</Routes>
|
||||
</BrowserRouter>
|
||||
</DailyProvider>
|
||||
|
|
|
|||
|
|
@ -46,12 +46,35 @@ h6 {
|
|||
}
|
||||
|
||||
header {
|
||||
margin-bottom: 2em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 1.5rem;
|
||||
font-variation-settings: "MONO" 1;
|
||||
font-variation-settings: "CASL" 1;
|
||||
}
|
||||
|
||||
.main-nav {
|
||||
margin-bottom: 2em;
|
||||
display: flex;
|
||||
gap: 2em;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
color: #0366d6;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
padding: 0.5em 1em;
|
||||
border-radius: 6px;
|
||||
transition: all 0.2s ease;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.nav-link:hover {
|
||||
background-color: #f6f8fa;
|
||||
border-color: #e1e4e8;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
i {
|
||||
font-variation-settings: "slnt" -15;
|
||||
}
|
||||
|
|
@ -396,4 +419,124 @@ p:has(+ ol) {
|
|||
.lock-indicator:hover {
|
||||
transform: scale(1.1) !important;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
/* Presentations Page Styles */
|
||||
.presentations-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 3em;
|
||||
margin: 2em 0;
|
||||
}
|
||||
|
||||
.presentation-card {
|
||||
border: 1px solid #e1e4e8;
|
||||
border-radius: 8px;
|
||||
padding: 1.5em;
|
||||
background-color: #fafbfc;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.presentation-card:hover {
|
||||
border-color: #0366d6;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.presentation-card h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5em;
|
||||
color: #24292e;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.presentation-card p {
|
||||
margin-bottom: 1em;
|
||||
color: #586069;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.presentation-embed {
|
||||
margin: 1.5em 0;
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.presentation-embed iframe {
|
||||
display: block;
|
||||
border: none;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.presentation-meta {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 1em;
|
||||
padding-top: 1em;
|
||||
border-top: 1px solid #e1e4e8;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.presentation-meta span {
|
||||
color: #586069;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.presentation-meta a {
|
||||
color: #0366d6;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.presentation-meta a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.presentations-info {
|
||||
margin-top: 3em;
|
||||
padding: 2em;
|
||||
background-color: #f6f8fa;
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid #0366d6;
|
||||
}
|
||||
|
||||
.presentations-info h3 {
|
||||
margin-top: 0;
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.presentations-info p {
|
||||
margin-bottom: 1em;
|
||||
color: #586069;
|
||||
}
|
||||
|
||||
.presentations-info a {
|
||||
color: #0366d6;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.presentations-info a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Responsive design for presentations */
|
||||
@media (max-width: 768px) {
|
||||
.presentations-grid {
|
||||
gap: 2em;
|
||||
}
|
||||
|
||||
.presentation-card {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.presentation-meta {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.5em;
|
||||
}
|
||||
|
||||
.presentation-embed iframe {
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
|
|
@ -5,25 +5,57 @@ export function Contact() {
|
|||
<a href="/">Jeff Emmett</a>
|
||||
</header>
|
||||
<h1>Contact</h1>
|
||||
<p>
|
||||
Twitter: <a href="https://twitter.com/jeffemmett">@jeffemmett</a>
|
||||
</p>
|
||||
<p>
|
||||
BlueSky:{" "}
|
||||
<a href="https://bsky.app/profile/jeffemmett.bsky.social">
|
||||
@jeffemnmett.bsky.social
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
Mastodon:{" "}
|
||||
<a href="https://social.coop/@jeffemmett">@jeffemmett@social.coop</a>
|
||||
</p>
|
||||
<p>
|
||||
Email: <a href="mailto:jeffemmett@gmail.com">jeffemmett@gmail.com</a>
|
||||
</p>
|
||||
<p>
|
||||
GitHub: <a href="https://github.com/Jeff-Emmett">Jeff-Emmett</a>
|
||||
</p>
|
||||
|
||||
<div style={{ marginBottom: '2rem' }}>
|
||||
<h2>Schedule a Meeting</h2>
|
||||
<p>Book a 30-minute meeting with me:</p>
|
||||
<iframe
|
||||
src="https://zcal.co/i/wvI6_DQG?embed=1&embedType=iframe"
|
||||
loading="lazy"
|
||||
style={{
|
||||
border: 'none',
|
||||
minWidth: '320px',
|
||||
minHeight: '544px',
|
||||
height: '731px',
|
||||
width: '1096px'
|
||||
}}
|
||||
id="zcal-invite"
|
||||
scrolling="no"
|
||||
title="Schedule a meeting with Jeff Emmett"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: '2rem' }}>
|
||||
<h2>Blog</h2>
|
||||
<p>
|
||||
<a href="https://allthingsdecent.substack.com/" target="_blank" rel="noopener noreferrer">
|
||||
All Things Decent
|
||||
</a> - Researching the biggest ideas that could make the world a more decent place
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2>Connect & Follow</h2>
|
||||
<p>
|
||||
Twitter: <a href="https://twitter.com/jeffemmett">@jeffemmett</a>
|
||||
</p>
|
||||
<p>
|
||||
BlueSky:{" "}
|
||||
<a href="https://bsky.app/profile/jeffemmett.bsky.social">
|
||||
@jeffemnmett.bsky.social
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
Mastodon:{" "}
|
||||
<a href="https://social.coop/@jeffemmett">@jeffemmett@social.coop</a>
|
||||
</p>
|
||||
<p>
|
||||
Email: <a href="mailto:jeffemmett (at) gmail.com">jeffemmett (at)gmail.com</a>
|
||||
</p>
|
||||
<p>
|
||||
GitHub: <a href="https://github.com/Jeff-Emmett">Jeff-Emmett</a>
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,6 +2,10 @@ export function Default() {
|
|||
return (
|
||||
<main>
|
||||
<header>Jeff Emmett</header>
|
||||
<nav className="main-nav">
|
||||
<a href="/presentations" className="nav-link">Presentations</a>
|
||||
<a href="/contact" className="nav-link">Contact</a>
|
||||
</nav>
|
||||
<h2>Hello! 👋🍄</h2>
|
||||
<p>
|
||||
My research investigates the intersection of mycelium and emancipatory
|
||||
|
|
@ -38,6 +42,10 @@ export function Default() {
|
|||
<span className="dinkus">***</span>
|
||||
|
||||
<h2>Talks</h2>
|
||||
<p>
|
||||
You can find my presentations and slides on the{" "}
|
||||
<a href="/presentations">presentations page</a>.
|
||||
</p>
|
||||
<ol reversed>
|
||||
<li>
|
||||
<a href="https://www.teamhuman.fm/episodes/238-jeff-emmett">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,267 @@
|
|||
export function Presentations() {
|
||||
return (
|
||||
<main>
|
||||
<header>Jeff's Presentations</header>
|
||||
|
||||
<div className="presentations-info">
|
||||
<h3>About These Presentations</h3>
|
||||
<p>
|
||||
These presentations represent my ongoing research into the intersection of
|
||||
mycelium networks, emancipatory technologies, and convivial tooling. Each
|
||||
presentation explores different aspects of how we can design systems that
|
||||
support collective action and community self-organization.
|
||||
</p>
|
||||
<p>
|
||||
For more of my work, check out my <a href="/">main page</a> or
|
||||
<a href="/contact">get in touch</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="presentations-grid">
|
||||
<div className="presentation-card">
|
||||
<h3>Osmotic Governance</h3>
|
||||
<p>Exploring the intersection of mycelium and emancipatory technologies</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/xfym/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Osmotic Governance Presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Team Human with Douglas Rushkoff</span>
|
||||
<a href="https://www.teamhuman.fm/episodes/238-jeff-emmett" target="_blank" rel="noopener noreferrer">
|
||||
Listen to the full episode →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>Exploring MycoFi</h3>
|
||||
<p>Mycelial design patterns for Web3 and beyond</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/bqra/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Exploring MycoFi Presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Greenpill Network with Kevin Owocki</span>
|
||||
<a href="https://www.youtube.com/watch?v=0A4jXL5eBaI" target="_blank" rel="noopener noreferrer">
|
||||
Watch the full talk →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>MycoFi talk at CoFi gathering</h3>
|
||||
<p>Mycelial design patterns for Web3 and beyond</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/vwmt/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="MycoFi CoFi Gathering Presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Exploring MycoFi on the Greenpill Network</span>
|
||||
<a href="https://www.youtube.com/watch?v=AFJFDajuCSg" target="_blank" rel="noopener noreferrer">
|
||||
Watch the full talk →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>Myco-Mutualism</h3>
|
||||
<p>Exploring mutualistic relationships in mycelial networks and their applications to human systems</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/caal/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Myco-Mutualism Presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Presentation with Sara Horowitz</span>
|
||||
<span>TBD: Find video from Sara Horowitz</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>Psilocybernetics: The Emergence of Institutional Neuroplasticity</h3>
|
||||
<p>Exploring the intersection of psychedelics, cybernetics, and institutional design</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/pnlz/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Psilocybernetics Presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Presentation with Christy PDX</span>
|
||||
<span>TBD: Find video from Christy PDX</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>Move Slow & Fix Things: The Commons Stack Design Pattern</h3>
|
||||
<p>Design patterns for sustainable commons infrastructure</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/bnnf/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Move Slow & Fix Things: Commons Stack Design Pattern"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>ReFi Unconf @ the Commons Hub Austria</span>
|
||||
<a href="https://www.youtube.com/live/i8qcg7FfpLM?si=onLcl8q5rz7cMViO&t=1362" target="_blank" rel="noopener noreferrer">
|
||||
Watch the full talk →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>Commons Stack Launch & Open Sourcing cadCAD</h3>
|
||||
<p>The launch of Commons Stack and the open sourcing of cadCAD for token engineering</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/hxac/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Commons Stack Launch & Open Sourcing cadCAD"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Token Engineering Global Gathering (TEGG)</span>
|
||||
<a href="https://youtu.be/qjdjX2m_p0Q?si=r2AXVnVyzCIxIOSc&t=20" target="_blank" rel="noopener noreferrer">
|
||||
Watch the full talk →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>New Tools for Dynamic Collective Intelligence: Conviction Voting & Variations</h3>
|
||||
<p>Exploring innovative voting mechanisms for collective decision-making in decentralized systems</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/fhos/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="New Tools for Dynamic Collective Intelligence"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Presentation on Conviction Voting</span>
|
||||
<span>TBD: Add video link when available</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>Exploring Polycentric Governance in Web3 Ecosystems</h3>
|
||||
<p>Understanding multi-level governance structures in decentralized networks</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/zzoy/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="Exploring Polycentric Governance in Web3 Ecosystems"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>OpenWeb Hackathon</span>
|
||||
<a href="https://youtu.be/ZIWskNogafg?si=DmUbOQJaSRE1rdzq" target="_blank" rel="noopener noreferrer">
|
||||
Watch the full talk →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="presentation-card">
|
||||
<h3>MycoFi for Myco-munnities</h3>
|
||||
<p>Exploring mycelial financial systems for community-based organizations</p>
|
||||
<div className="presentation-embed">
|
||||
<div style={{position: "relative", paddingTop: "max(60%, 324px)", width: "100%", height: 0}}>
|
||||
<iframe
|
||||
style={{position: "absolute", border: "none", width: "100%", height: "100%", left: 0, top: 0}}
|
||||
src="https://online.fliphtml5.com/phqos/xoea/"
|
||||
seamless={true}
|
||||
scrolling="no"
|
||||
frameBorder="0"
|
||||
allowTransparency={true}
|
||||
allowFullScreen={true}
|
||||
title="MycoFi for Myco-munnities"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="presentation-meta">
|
||||
<span>Presentation in Liege</span>
|
||||
<span>TBD: Follow up with Nicholas for video from Liege</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
Loading…
Reference in New Issue