The website consists of mostly 3 types of content, provided via the directory content:

The website and repo is designed to make it as easy as possible to make changes without having to edit any source files, code or markup outside of the Markdown pages. All relevant metadata is organized in JSON files (with JSON schemas attached so your editor can highlight mistakes). If you want to edit content, the only relevant directories should be content and public (images and PDF templates).

📂 feminist-ai.party
┣━━ 📂 content
┃   ┣━━ 📂 kits             # different event kits as *.mdx
┃   ┃   ┗━━ 📄 {kit}.mdx    # kit content and metadata
┃   ┣━━ 📂 events           # different event pages as *.mdx
┃   ┃   ┗━━ 📄 {event}.mdx  # event content and metadata
┃   ┣━━ 📄 events.json      # list of future and past events to display
┃   ┗━━ 📄 meta.json        # website meta information
┣━━ 📂 pages                # source of pages
┣━━ 📂 public
┃   ┣━━ 📂 images           # images used by kits and events
┃   ┣━━ 📂 templates        # downloadable and printable PDF templates
┃   ┗━━ 📂 videos           # videos used by kits and events
┗━━ 📂 src                  # website source and components

The website supports regular Markdown, as well as several custom elements and enhanced syntax. Custom MDX elements can be used like regular HTML / JSX elements and their names are capitalized.

Markdown headlines can specify the attribute id in curly braces, which is used as the anchor link. The anchor link can also be referenced in the table of contents of a page.

## This is a headline {id="headline"}

### This is a sub-headline {id="sub-headline"}

### This is a sub-headline with an icon {id="sub-headline-icon", icon="heart"}

Code blocks can specify the language to use for syntax highlighting and an optional title, prefixed by ### in the first line.

```python
### This is a title
import spacy
```

To highlight specific lines of code, you can set the attribute highlight in curly braces in the title (with or without a title text). Line numbers are 1-indexed and comma-separated.

```python
### This is code with line highlights {highlight="2,3"}
import spacy
nlp = spacy.load("en_core_web_sm")
doc = nlp("Hello world!")
```

To make it easy to update details like our Bluesky profile or email and only define it in one place, you can include it as a variable. Variables can be used within Markdown in text content or links, e.g. [[BLUESKY]]. Note that at the moment, variables only work in regular Markdown, not in custom component attributes like title="...".

Please [reach out via email](mailto:[[EMAIL]]) or on [Bluesky]([[BLUESKY]]).

This is <Mark>highlighted</Mark>. To copy, press <Kbd>ctrl</Kbd>+<Kbd>c</Kbd>.

<Infobox title="Important note" icon="warning">

This is an infobox with text, a title and an icon.

</Infobox>

<Grid>
<Card title="This is a resource" url="https://explosion.ai" image="/images/image.jpg" icon="book">Some text about the resource here.</Card>
<Card title="This is a resource" url="https://explosion.ai" image="/images/image.jpg" icon="book">Some text about the resource here.</Card>
</Grid>

<Gallery images={[
  ["/images/photo1.jpg", "Alt text", "This is a caption"],
  ["/images/photo2.jpg", "Alt text"],
  "/images/photo3.jpg"
]} />

<Video src="/videos/data_prodigy-annotation.mp4" width={838} height={524} caption="This is a caption" />
<YouTube id="jpWqz85F_4Y" start={372} />

At the top of a page, e.g. kits/data.mdx, YAML-formatted meta data is provided in the so-called frontmatter block, wrapped in ---. This includes the page title and description, as well as a theme color and icon, and an optional table of contents and author information. The anchor links in the table of contents can be defined as IDs of the respective headlines.

---
title: This is a page title
description: "This is a description shown in the overview and site meta."
color: '#bc85ff'
icon: data
toc:
  - ['This is a section', '#anchor']
  - ['This is another section', '#another-anchor']
authors:
  - ['Author with link', 'https://author-url.com']
  - Author without link
---

Event pages can optionally specify a date and location, as well as the IDs of related kits, which are then shown in the sidebar and at the bottom of the page.

date: 2024-09-28
location: Berlin, Germany
kits: ['hacking-llms', 'data']

Make sure you've installed Node 20 or above with nvm. Then clone the repo and install the dependencies:

nvm use
npm install

To serve the website locally on localhost:3000, run:

npm run dev

The validate command runs linting on the website source and also checks all metadata files against their JSON schemas to make sure they follow the correct format. Validation also runs automatically on all PRs.

npm run validate

The website is hosted by Netlify and all pull requests targeting the main branch will automatically build a deploy preview. You can access it by clicking the links in the completed checks at the bottom of the PR.