# EleutherAI Website 2021

The site is built using [Hugo](https://gohugo.io) - a static site generator. We are currently using Netlify for build and hosting.

While the blog and main site are visually integrated, the blog is served on a separate domain blog.eleuther.ai, with a corresponding config-blog.toml.

## Development Process Overview
1. [Install Hugo](https://gohugo.io/getting-started/installing/)
2. Clone this repository.
3. Create a new branch for your work.
4. Use the Hugo dev server locally to test your changes.
5. Commit your branch with changes.
6. Create a PR to merge your branch into master and discuss on Discord. 
7. When the branch is merged, a Netlify build will be triggered for both the blog and main site.

## Dev Environment

To run the development server on localhost for the main site:

`hugo server -D`

To load the blog instead:

`hugo server -D --config config-blog.toml`

To bind on another IP apart from localhost and change the baseURL (ensuring the links work):

`hugo server --bind=BIND-IP --baseUrl=IP-OR-DOMAIN -D`

## Project Layout

| Directory      | Description |
| -----------: | ----------- |
| `content` | Underyling content for the main site|
| `content-blog` | Underyling content for the blog |
| `static/images` | Images for both sites. |
| `themes/eai-theme` | We use a single theme for both the main site and the blog. | 


## How to display 2 containers that are horizontally aligned?

1. add an empty header markdown with the class `content-block` -> `## {class="content-block"}`
2. after that line, add 2 containers as 2 elements of the list. In CSS it is defined that first list `<ul>` below content-block header will display items horizontally. (only the first one, any other list elements will be displayed as expected)