Convert to card structure

[adamltyson]

This PR converts the projects page to a series of cards (representing individual projects) within project theme headings. This means the projects page has more information on it, and not just a list of links. The cards on the front page now link to the relevant section of projects.

After this conversion, the existing text seemed a bit strange. It was very detailed in places and made some cards very large. I've taken the liberty of making these descriptions more high-level and concise. This also means we can make large changes to the design of these individual projects without changing the NIU website. @niksirbi & @JoeZiminski you may want to check the sections for movement and SpikeWrap as I've slightly taken a hatchet to these!

This PR also converts the Resources page to this same card structure.

There's one thing I don't like about this, and it's that to link to the sections within projects, I've had to use projects.html#electrophysiology. It didn't seem to work without the .html. Any ideas @niksirbi?

Closes #75
#70 should be merged first

[niksirbi]

There's one thing I don't like about this, and it's that to link to the sections within projects, I've had to use projects.html#electrophysiology. It didn't seem to work without the .html. Any ideas @niksirbi?

There is an alternative (though not sure if it's necessarily better:

We can define explicit Sphinx reference targets, for example

(projects-neuroanatomy)=
## Neuroanatomy

Then the link within the card would change to:

:::{grid-item-card} {fas}`brain;sd-text-primary` Neuroanatomy
:img-top: _static/neuroanatomy_card.png
:link: projects-neuroanatomy
:link-type: ref
:::

I can go ahead and add those if you like.

[adamltyson]

I forgot about this. It seems better, and it's certainly neater, but I wonder if the .html way is just simpler? Happy with whatever you think.

I think I'll add the explicit ref tags. The 'html` way is simpler, but is a bit of a hack, and I am worried it might break in some cases.

[niksirbi]

It's good to go for tomorrow, though there are two things I am not fully satisfied with.

1. The projects page looks quite dull without any images. I guess we can add images to those cards once all projects have a logo? Perhaps (wild idea) auto-magically fetch the "social-preview" image from the corresponding GitHub repo? This way we don't have to remember to update the images on the main website.
2. It's a bit annoying that you cannot add more hyperlinks within a card, if the whole card is clickable. This is the same problem that constrained us to linking only our GitHube profile on the "People" page. But I haven't got a better idea. On some level it's good to be constrained to only one link per person/project (less things to keep track of).

See also my other comment regarding linking specific sections in the TOC.

[niksirbi]

@adamltyson sorry I overwrote your comment, Github changes sth in the comment interface and this keeps happening to me (and others)

[adamltyson]

@adamltyson sorry I overwrote your comment, Github changes sth in the comment interface and this keeps happening to me (and others)

Very weird!

The projects page looks quite dull without any images. I guess we can add images to those cards once all projects have a logo? Perhaps (wild idea) auto-magically fetch the "social-preview" image from the corresponding GitHub repo? This way we don't have to remember to update the images on the main website.

Yeah it does look a bit dull, I've opened #82 to track this.