design and implement website describing capa and showing the available rules

[williballenthin]

We'd like to have a homepage for capa that describes the tool, exposes the current rule set, and provides other features. We can deploy the website via Github Actions to Github Pages, which would result in the url: https://mandiant.github.io/capa

related/duplicate of: mandiant/capa-rules#664

Tasks

Beta Give feedback

1. website: mockup layout #1551
   rule website +1
2. website: pick tech stack #1552
   rule website +1
3. website: configure GH Actions to build and deploy website #1553
   rule website +1
   
4. website: implement home page #1554
   rule website +1
   
5. website: implement rule view page #1555
   rule website +1
6. website: implement rule list page #1556
   rule website +1
7. website: implement search rules functionality #1557
   rule website +1
8. website: demonstrate capa output via xterm.js
9. website: use pyodide to run capa in the browser
10. website: show example results for each rule

The objective of this project is to develop a website for the Capa project, which will serve as the official online platform for Capa users and contributors. The website will be hosted on GitHub Pages as static content but will incorporate interactive JavaScript features. The key features of the website include a homepage for the Capa project, a rule browsing section with canonical URLs for referencing rules, and the ability to search rules by metadata and features. Additionally, there will be optional features to demonstrate the output of Capa via xterm.js and enable running Capa in the browser using Pyodide.

[ghost]

Specifications by @DeeyaSingh:

Homepage:

The homepage features a clean and modern design with the capa project logo and a brief introduction to Capa's capabilities.
It includes a prominent call-to-action button inviting users to explore the rule library.

Rule Browsing:

The rule browsing section provides a grid or list view of available rules.
Each rule card displays the rule's name, a short description, and metadata such as author and date of creation.
Users can click on a rule card to view the rule details.

Rule Details:

The rule details page presents comprehensive information about a specific rule.
The top section includes the rule's name, description, and metadata.
The middle section provides a more detailed explanation of the rule's purpose, behavior, and detection logic.
The bottom section may include example code snippets or screenshots illustrating the rule's application.

Search and Filter:

The website includes a search bar at the top for users to search for rules by keywords or metadata.
Users can also use filters to narrow down the rule list based on specific criteria such as rule type or category (If necessary)

Interactive Demo:

The website offers an interactive demo where users can upload a file or paste its content for analysis.
Upon analysis, the demo displays the matched rules and their results in a user-friendly format.

Navigation and Layout:

The website has a fixed navigation bar at the top, allowing easy access to different sections of the site.
The layout is responsive, ensuring the website adapts to different screen sizes and devices.
Consistent styling, typography, and color schemes are used throughout the website for a cohesive and professional look.