Nebula Docs is an Open-Sourced Documentation Project ive made, it started as the internal documentation website i use for @invomagic which i've now tidied up, added a few extra classes, and then templatized in a way! My hope is that someone finds a use for it :) its very easy to put behind Cloudflare ZT Access
Setup is fairly easy :)
Fork this Repository, and, ideally in an IDE, such as VSC start editing the files, its very lightweight as its pure HTML & CSS If you need another page, i'd suggest duplicating a page, so you get its base look instantly and dont need to resetup the inial HTML
You can create as many pages as you want :) Mostly you only need to know HTML and how to assign classes to tags (you put class="class name" in the tag to do so) to build your documentation
"page-title" - Large, centered primary heading.
"section-divider" - Indented sub-heading for separating content sections.
"content-text" - Standard paragraph text with a slight left margin.
"text-center" - Utility class for center-aligning text.
"navbar" - Main navigation bar with custom font and background image.
"main-content" - Flex container for centering and stacking the primary page content.
"content-body" - Large, bold text container for main body blocks.
"text-info" - Light blue text for informational messages.
"text-warning" - Orange text for warnings or alerts.
"text-danger" - Red text for errors or critical warnings.
"text-success" - Green text for success messages.
"video-container" - Responsive, centered container with a shadow for embedding 16:9 videos.
"an-image" - Responsive, centered image with rounded corners (max width 600px)
After Forking the Repository you can deploy it on well, pertty much anything that'll support a static site, but i'd Reccomend Cloudflare Pages, GitHub Pages, Vercel, or Netlify
- Head to https://dash.cloudflare.com
- Go over to "Compute" expand it
- Click on "Workers & Pages"
- Click on "Create Application"
- Click on the 'Get Started' in the phrase you see below "Looking to deploy Pages? Get started"
- Click "Import an existing Git repository"
- Select (or connect) a your GitHub account, then select the repo you want to deploy
- Click Begin Setup, then Click Save and Deploy
- Head to https://vercel.com
- Click "Add New..." in the top right, then select "Project"
- Under "Import Git Repository", select (or connect) your GitHub account
- Find and click "Import" on the repository you want to deploy
- Configure your Project Name (or leave it as the repo name)
- Click "Deploy" and wait for it to build your site
- Head to https://app.netlify.com
- Click on "Add new site" in the top-right dropdown
- Click "Import an existing project"
- Choose GitHub as your Git provider
- Authorize Netlify to access your GitHub account (if prompted)
- Select the repo you want to deploy from the list
- Leave the "Build command" field empty
- Leave the "Publish directory" field empty (or put
.if it complains) - Click "Deploy site"
- Visit your repository page
- Go to Repo settings
- Under 'Code and automation' click "Pages"
- Set source to "Deploy from a branch"
- Set Branch to main
- Set the thing text to it "/ (root)"
- Click Save
This is my first Open Source project, and im quite new to building websites in all honesty :p so i hope this is of use to anyone
Best,
~ Magic ^^