Doco Site Update (#100)

package.json

@@ -15,7 +15,7 @@
   },
   "dependencies": {
     "@astrojs/netlify": "^3.0.0",
-    "@astrojs/starlight": "^0.25.5",
+    "@astrojs/starlight": "^0.28.2",
     "astro": "^4.13.3",
     "sharp": "^0.32.3",
     "starlight": "^0.3.9",

src/content/docs/products/products.mdx

@@ -8,7 +8,7 @@ import { Card, LinkCard, CardGrid } from "@astrojs/starlight/components";
 <div class="splashkit">
   <LinkCard
     title="SplashKit"
-    description="a C++ Software Development Kit. It is
+    description="A C++ Software Development Kit. It is
     beginner-friendly to assist in introductory
     programming education, and can be used
     to create 2D games."

src/content/docs/products/splashkit/SplashKit Tutorials/Documentation/4-adding-oop.mdx → src/content/docs/products/splashkit/splashkit-tutorials/Documentation/adding-oop.mdx

@@ -1,7 +1,7 @@
 ---
 title: Guide to adding OOP to SplashKit tutorials
 sidebar:
-  label: 4. Adding OOP to Guides
+  label: Adding OOP to Guides
   order: 4
 ---
 

src/content/docs/products/splashkit/SplashKit Tutorials/Documentation/1-Tutorial-Proposal-Template.md → src/content/docs/products/splashkit/splashkit-tutorials/Documentation/tutorial-proposal-template.md

@@ -2,7 +2,7 @@
 title: Tutorial Proposal Template
 description: Use this template to create a proposal for a new SplashKit tutorial.
 sidebar:
-  label: 1. Tutorial Proposal Template
+  label: Tutorial Proposal Template
   order: 1
 ---
 

src/content/docs/products/splashkit/SplashKit Tutorials/Documentation/3-Tutorial-Reviews.md → src/content/docs/products/splashkit/splashkit-tutorials/Documentation/tutorial-reviews.md

@@ -1,7 +1,7 @@
 ---
 title: Tutorial Reviews
 sidebar:
-  label: 3. Tutorial Reviews
+  label: Tutorial Reviews
   order: 3
 ---
 

src/content/docs/products/splashkit/SplashKit Tutorials/Documentation/2-Tutorial-Style-Guide.mdx → src/content/docs/products/splashkit/splashkit-tutorials/Documentation/tutorial-styling-guide.mdx

@@ -1,7 +1,7 @@
 ---
 title: Tutorial Style Guide
 sidebar:
-  label: 2. Tutorial Style Guide
+  label: Tutorial Style Guide
   order: 2
 ---
 

src/content/docs/products/splashkit/SplashKit Tutorials/Onboarding/05-peer-review.md → src/content/docs/products/splashkit/splashkit-tutorials/Onboarding/peer-review-guide.md

@@ -2,8 +2,8 @@
 title: A Guide to Doing Peer Reviews
 description: A guide on how to do a peer review within the SplashKit tutorials team.
 sidebar:
-  label: 5. Peer Review Guide
-  order: 5
+  label: Peer Review Guide
+  order: 1
 ---
 
 This guide will help you through the process of performing a peer review for SplashKit tutorials.

src/content/docs/products/splashkit/SplashKit Tutorials/Onboarding/03-pull-request.md → src/content/docs/products/splashkit/splashkit-tutorials/Onboarding/pull-request-guide.md

@@ -2,7 +2,7 @@
 title: How to Create a Pull Request
 description: This is a step-by-step guide on how to create a pull request for SplashKit tutorials.
 sidebar:
-  label: 3. Pull Request Guide
+  label: Pull Request Guide
   order: 3
 ---
 

src/content/docs/products/splashkit/SplashKit Tutorials/Onboarding/04-pull-request-template.md → src/content/docs/products/splashkit/splashkit-tutorials/Onboarding/pull-request-template.md

@@ -2,8 +2,8 @@
 title: Pull Request Template
 description: This is a template for creating a pull request for SplashKit tutorials.
 sidebar:
-  label: 4. Pull Request Template
-  order: 4
+  label: Pull Request Template
+  order: 2
 ---
 
 ## Template for making a pull request

src/content/docs/products/splashkit/SplashKit Tutorials/0-overview.mdx → src/content/docs/products/splashkit/splashkit-tutorials/overview.mdx

@@ -58,20 +58,20 @@ follows:
 
 ## Tutorials Information
 
-1. [Tutorial Proposal Template](/products/splashkit/splashkit-tutorials/documentation/1-tutorial-proposal-template)
+1. [Tutorial Proposal Template](/products/splashkit/splashkit-tutorials/documentation/tutorial-proposal-template)
    The template for creating a tutorial proposal.
-2. [Tutorial Style Guide](/products/splashkit/splashkit-tutorials/documentation/2-tutorial-style-guide)
+2. [Tutorial Style Guide](/products/splashkit/splashkit-tutorials/documentation/tutorial-style-guide)
    The style guide for creating tutorials.
-3. [Tutorial Reviews](/products/splashkit/splashkit-tutorials/documentation/3-tutorial-reviews) The
+3. [Tutorial Reviews](/products/splashkit/splashkit-tutorials/documentation/tutorial-reviews) The
    current tutorials that need to be reviewed.
-4. [Adding OOP to Guides](/products/splashkit/splashkit-tutorials/documentation/4-adding-oop) The
+4. [Adding OOP to Guides](/products/splashkit/splashkit-tutorials/documentation/adding-oop) The
    guide on how to add OOP to C# on SplashKit tutorials.
 
 ## GitHub Guides for Tutorials Team
 
-1. [How to Create a Pull Reuest](/products/splashkit/splashkit-tutorials/onboarding/03-pull-request)
+1. [How to Create a Pull Reuest](/products/splashkit/splashkit-tutorials/onboarding/pull-request-guide)
    The guide on how to create a pull request for SplashKit tutorials.
-2. [Pull Request Template](/products/splashkit/splashkit-tutorials/onboarding/04-pull-request-template)
+2. [Pull Request Template](/products/splashkit/splashkit-tutorials/onboarding/pull-request-template)
    The template for creating a pull request for SplashKit tutorials.
-3. [Peer Review Guide](/products/splashkit/splashkit-tutorials/onboarding/05-peer-review) The guide
-   on how to do a peer review within the SplashKit tutorials team.
+3. [Peer Review Guide](/products/splashkit/splashkit-tutorials/onboarding/peer-review-guide) The
+   guide on how to do a peer review within the SplashKit tutorials team.

src/content/docs/products/splashkit/splashkit-website/peer-review-guide.mdx

@@ -0,0 +1,153 @@
+---
+title: Peer Review Guide
+sidebar:
+  label: Peer Review Guide
+  order: 2
+---
+
+import { Aside } from "@astrojs/starlight/components";
+
+## Introduction
+
+<Aside type="tip" title="TL;DR">
+
+- Peer reviews are essential for maintaining high-quality code in the SplashKit website project.
+- The Peer-Review Checklist is **required** for every review to ensure consistency.
+- Peer-Review Prompts are **optional** but serve as a resource to guide discussions.
+- The goal is to verify code quality while fostering collaboration and improvement.
+
+</Aside>
+
+In SplashKit, peer reviews are a vital process to ensure code quality, maintainability, and
+consistency across the website development project. Every pull request (PR) must follow the
+Peer-Review Checklist, which checks for key factors like functionality, code readability, and
+documentation.
+
+Additionally, the Peer-Review Prompts serve as a conversation starter for reviewers, encouraging
+collaboration while allowing for a thorough and constructive review process.
+
+<Aside type="caution" title="Card Movement in Planner">
+  As a reviewer, it is your responsibility to move the Planner Card to the next column once the
+  approval has been given.
+</Aside>
+
+### SplashKit Peer-Review Checklist
+
+The following checklist is required to be completed for every review to ensure high-quality
+contributions.
+
+```plaintext
+## General Information
+
+- [ ] Type of Change: Clearly indicate the type of change (choose one):
+  - [ ] Bug fix
+  - [ ] New feature
+  - [ ] Breaking change
+  - [ ] Documentation update
+
+## Code Quality
+
+- [ ] Repository: Ensure the PR is made to the correct repository.
+- [ ] Readability: Is the code easy to read and follow? Are comments included where necessary?
+- [ ] Maintainability: Can this code be maintained or extended easily in the future?
+
+## Functionality
+
+- [ ] Correctness: Does the code meet the task requirements?
+- [ ] Existing Functionality: Has the impact on existing functionality been considered and tested?
+
+## Testing
+
+- [ ] Test Coverage: Are unit tests provided for new or modified code?
+- [ ] Test Results: Have all tests passed successfully?
+
+## Documentation
+
+- [ ] Documentation: Is the inline and external documentation updated and clear?
+
+## Pull Request Details
+
+- [ ] PR Description: Is the problem being solved clearly described?
+- [ ] Checklist Completion: Have all relevant checklist items been reviewed and completed?
+```
+
+### SplashKit Peer-Review Prompts
+
+These prompts can help guide discussions during the review process and ensure that the code meets
+high standards.
+
+- **Type of Change**: Is the PR correctly identifying the type of change (bug fix, new feature,
+  etc.)?
+- **Code Readability**: Is the code well-structured and easy to follow? Could better comments,
+  names, or organisation improve it?
+- **Maintainability**: Is the code modular and easy to maintain? Does it introduce any technical
+  debt?
+- **Code Simplicity**: Are there redundant or overly complex parts of the code that could be
+  simplified?
+- **Edge Cases**: Does the code account for edge cases? What scenarios might cause it to break?
+- **Test Thoroughness**: Does the testing cover all edge cases and failure paths? Are there enough
+  tests to ensure code reliability?
+- **Backward Compatibility**: Does the change break any existing functionality? If so, is backward
+  compatibility handled or documented?
+- **Performance Considerations**: Could this code impact performance negatively? Can it be optimised
+  while maintaining readability?
+- **Security Concerns**: Does this change introduce any security risks? Is input validation handled
+  properly?
+- **Dependencies**: Are new dependencies necessary? Could they conflict with existing libraries?
+  Could this functionality be achieved without new dependencies?
+- **Documentation**: Is the documentation clear and thorough enough for new developers to
+  understand? Does it cover API or external interface changes?
+
+---
+
+## Review Guidelines for Specific File Types
+
+Different file types require different levels of attention during the review process. Here's what to
+look for when reviewing each type of file:
+
+### `.mdx` Files
+
+- **Content Accuracy**: Ensure that the content is clear and accurate. Double-check for any errors
+  in the documentation or guides.
+- **Frontmatter**: Ensure the frontmatter (`title`, `description`, etc.) is correctly filled out.
+- **Component Usage**: Verify that components such as `LinkCard`, `CardGrid`, or others are being
+  used appropriately within the `.mdx` files.
+
+### `.css` Files
+
+- **Consistency**: Check that the styles align with the **Styling Guide** and maintain a consistent
+  use of variables (e.g., colours, fonts, spacing).
+- **Accessibility**: Review for accessibility considerations, such as whether animations are
+  disabled for users who prefer reduced motion, and whether contrast ratios meet **WCAG 2.1 AA**
+  standards.
+- **Naming Conventions**: Ensure that CSS class names follow a consistent naming pattern.
+
+### `.jsx`/`.tsx` Files
+
+- **Functionality**: Make sure the interactive components (e.g., sliders, forms) work as expected
+  and meet the requirements of the task.
+- **Performance**: Look for unnecessary re-renders or other performance concerns.
+- **Code Style**: Ensure the code follows **React/JSX** best practices and any project-specific
+  linting rules.
+
+### `.astro` Files
+
+- **Structure**: Ensure the page or component is well-structured and follows the **Astro standards**
+  for component and page creation.
+- **Reusability**: Look for opportunities to refactor repetitive code into reusable components.
+
+---
+
+## Useful Resources for Reviewers
+
+- **Starlight Documentation**: [Starlight Docs](https://starlight.astro.build/getting-started/)
+- **Astro Documentation**: [Astro Docs](https://docs.astro.build/en/getting-started/)
+- **WCAG 2.1 AA Guidelines**: [W3C Accessibility Standards](https://www.w3.org/WAI/WCAG21/quickref/)
+- **MDN CSS Documentation**: [MDN CSS Guide](https://developer.mozilla.org/en-US/docs/Web/CSS)
+- **React Documentation**: [React Official Docs](https://reactjs.org/docs/getting-started.html)
+
+---
+
+By following these guidelines, you'll ensure that the SplashKit website project maintains high
+standards of code quality, performance, and accessibility. Remember, peer reviews are not only about
+verifying the code but also about learning and improving together as a team.

src/content/docs/products/splashkit/splashkit-website/splashkit-website-overview.mdx

@@ -0,0 +1,87 @@
+---
+title: SplashKit Website Team Overview
+sidebar:
+  label: Overview
+  order: 1
+---
+
+## **Welcome to the SplashKit Website Development Team!**
+
+## Introduction
+
+The SplashKit website is the gateway to empowering learners and developers with the tools they need
+as they begin their journey in programming and game development. Having a well-designed, accessible,
+and user-friendly website is important for new learners, as it ensures that resources, tutorials,
+and documentation are easily accessible to everyone, regardless of their level of experience or any
+accessibility challenges they may face.
+
+As a team, we’re focused on creating a site that reflects the inclusivity and innovation of the
+SplashKit SDK, making sure everyone can get the most out of what we offer.
+
+---
+
+## What We're Working Towards
+
+As part of the SplashKit Website Development Team, you’ll be helping us build, refine, and enhance
+the user experience on the site. Some of the broader goals we’re working towards include:
+
+- **Enhancing the Onboarding Experience**: We aim to simplify the onboarding process for new users
+  and contributors, making it easy for them to find the resources they need.
+- **Fixing and Expanding Accessibility of Tutorials**: We are always improving our tutorials and
+  guides, ensuring they’re up-to-date and accessible to learners.
+- **Showcasing Community Contributions**: We want to highlight the incredible projects created using
+  SplashKit by building a dedicated showcase section.
+- **Upholding Accessibility Standards**: Ensuring our site meets and exceeds accessibility standards
+  so that it’s usable by everyone, including those with disabilities.
+- **Integrating SplashKit Online**: Integrating the SplashKit Online tool will significantly enhance
+  the accessibility and effectiveness of the SplashKit resources, enabling learners to preview
+  SplashKit functions directly within the website.
+
+These goals are collaborative efforts, and your contributions will help turn them into real features
+that impact the SplashKit community directly.
+
+---
+
+## What You Can Expect
+
+By joining the SplashKit Website Development Team, you’ll be stepping into a collaborative,
+open-source environment where everyone’s contributions are valued, with your contributions being
+experienced by users today. Here’s what you can expect from working with us:
+
+- **Collaboration and Support**: You’ll work with a team of dedicated contributors who will support
+  you while you learn how to contribute to an exciting tool. We believe in sharing knowledge and
+  improving together.
+- **Learning Opportunities**: Whether you're new to web development or an experienced contributor,
+  you'll gain hands-on experience with modern tools like Astro, Starlight, and web frameworks.
+  You’ll also learn about accessibility best practices, design principles, and performance
+  optimisation.
+- **Creative Freedom**: We encourage creative solutions and welcome new ideas. As a contributor,
+  you'll have the opportunity to shape the direction of the website, suggest improvements, and see
+  your work in action.
+- **Peer Feedback and Reviews**: You’ll receive valuable feedback on your code through peer reviews,
+  helping you grow as a developer while maintaining the quality of the website.
+
+---
+
+## What You’ll Gain
+
+As part of the team, you’ll gain practical experience working on a large-scale, open-source project,
+giving you insights into web development, accessibility, and content management. Here’s what else
+you can expect:
+
+- **Experience in Open-Source Development**: By contributing to a real-world project, you'll improve
+  your coding skills, learn best practices, and collaborate with others, which is a valuable
+  experience for your personal and professional development.
+- **Portfolio Building**: Your work on the SplashKit website will be visible to the public, giving
+  you tangible examples to include in your portfolio or showcase in job interviews.
+- **Contribution to the Community**: You’ll be making a direct impact the learning journey of
+  stduents (and even more experienced developers) who rely on SplashKit to build their skills and
+  projects.
+
+---
+
+## Ready to Get Started?
+
+Check out the support documentation to get familiar with the project structure and how to best
+contribute to the team. We’re excited to have you on the team, and we look forward to building
+something amazing together!