Welcome

This page will cover how to setup this documentation site, both in case I need to do so in the future, or in case you would like to use setup for your own notes.

The template that this site was originally based off of is CelestialDocs, which is under an MIT license. The framework used is Astro

License

These notes are licensed under creative commons zero (CC0). You may reuse these notes for anything you wish. The svg image on the homepage is not included in the creative commons zero license, but can be obtained through the noun project under a creative commons by 3.0 license.

Clone the repository

The code for this documentation can be found at https://codeberg.org/mark-pitblado/notes. You can clone the repository over https via the following commands. Change my-notes to whatever you would like to call the repository.


Made with Codeberg badge
git clone https://codeberg.org/mark-pitblado/notes my-notes
cd my-notes

Delete the .git repository to remove all my previous git history (I am guessing you will want to start fresh).

rm -rf .git

Modifying the documentation content

All of the documentation is stored in /src/content and is in .mdx format. There are a few fancy features that can be added to these files such as callouts and tables, which are outlined below.

Callouts

To use a callout, you must first import the callout component into the mdx file you are writing

import Callout from '@/components/Callout.astro';

Then you can use any of the following examples

Info example

<Callout>
This is an example
</Callout>
<Callout variant="warning" title="Custom Warning Title">
  This is a warning message with a custom title.
</Callout>
<Callout variant="danger">
  This is a danger message
</Callout>
<Callout variant="success" title="Custom Success Title">
  This is a success message
</Callout>

Cards

Similar to the callouts, you can use cards by importing the components into the mdx file you are writing.

import Card from '@/components/Card.astro';

Then you can use any of the following cards

Default Card

This is a card with default settings.

Card with Custom Icon

This is a card with a custom icon.

Card with Custom Icon and Color

This is a card with a custom icon and color.

Card with Custom Color

This is a card with a custom color.


<Card title="Default Card">
  This is a card with default settings.
</Card>

<Card title="Card with Custom Icon" icon = {Github}>
  This is a card with a custom icon.
</Card>

<Card title="Card with Custom Icon and Color" color="Red">
  This is a card with a custom icon and color.
</Card>

<Card title="Card with Custom Color" color="Green">
  This is a card with a custom color.
</Card>