Setup branding page (#18)

* Setup branding page
That way we have a central place with all reusable logos and guidelines

Author: sebastienvermeille

docs/branding/logo-guidelines.md

@@ -0,0 +1,41 @@
+---
+title: Logo guidelines
+sidebar_position: 1
+---
+import CenteredImage from '@site/src/components/CenteredImage';
+
+
+# Logo guidelines
+
+## Introduction
+
+These logos represent NSPanel Manager project's identity. To ensure consistency, please follow these guidelines 
+when using our logos.
+
+We provide both rectangular and square variants to suit various contexts.
+Whenever possible, use the vectorized (SVG) versions for optimal quality.
+
+## Usage Guidelines
+
+* Always prioritize the vectorized (SVG) versions for scalability and resolution independence.
+* Ensure the logo is not stretched, cropped or altered in color.
+* Maintain the logo's safe space: leave a margin equal to 25% of the logo's height when possible.
+* Use rectangular logos whenever possible. Square logos should be used only when space constraints 
+  apply (e.g., social media avatars).
+
+## Rectangular Logos (Preferred)
+
+| Logo                                                                                                                | Permalink                                                                       | Vectorized | Format | Background  | Size |
+|---------------------------------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------|------------|--------|-------------|------|
+| <CenteredImage src="/images/branding/logos/nspm-logo-black-no-bg.svg" alt="Black logo transparent" />               | `https://nspanelmanager.com/images/branding/logos/nspm-logo-black-no-bg.svg`    | Yes        | svg    | Transparent | -    |
+| <CenteredImage src="/images/branding/logos/nspm-logo-white-no-bg.svg" alt="White logo transparent" />               | `https://nspanelmanager.com/images/branding/logos/nspm-logo-white-no-bg.svg`    | Yes        | svg    | Transparent | -    |
+| <CenteredImage src="/images/branding/logos/nspm-logo-white-black-bg.svg" alt="White logo with black background" />  | `https://nspanelmanager.com/images/branding/logos/nspm-logo-white-black-bg.svg` | Yes        | svg    | Solid       | -    |
+| <CenteredImage src="/images/branding/logos/nspm-logo-black-white-bg.svg" alt="Black logo whith white background" /> | `https://nspanelmanager.com/images/nspm-logo-black-white-bg.svg`                | Yes        | svg    | Solid       | -    |
+
+## Square Logos
+
+| Logo                                                                                           | Permalink                                                          | Vectorized | Format | Background | Size       |
+|------------------------------------------------------------------------------------------------|--------------------------------------------------------------------|------------|--------|------------|------------|
+| <CenteredImage src="/images/branding/logos/nspm-icon.svg" alt="Vectorized square icon" />      | `https://nspanelmanager.com/images/branding/nspm-icon.svg`         | Yes        | svg    | Solid      | -          |
+| <CenteredImage src="/images/branding/logos/nspm-icon-128x128.png" alt="Icon 128x128 pixels" /> | `https://nspanelmanager.com/images/branding/nspm-icon-128x128.png` | No         | png    | Solid      | 128x128 px |
+| <CenteredImage src="/images/branding/logos/nspm-icon-32x32.ico" alt="Icon 32x32 pixels" />     | `https://nspanelmanager.com/images/branding/nspm-icon-32x32.ico`   | No         | ico    | Solid      | 32x32 px   |

sidebars.ts

@@ -46,6 +46,16 @@ const sidebars: SidebarsConfig = {
         },
       ]
     },
+    {
+      type: 'category',
+      label: 'Branding',
+      items: [
+          {
+            type: 'autogenerated',
+            dirName: 'branding',
+          },
+      ]
+    },
     {
       type: 'category',
       label: 'Contribute',