[ADD] SVG sprite to the Alliance Auth framework

docs/development/custom/aa-framework.md

@@ -14,4 +14,5 @@ The Alliance Auth framework is split into several submodules, each of which is d
 framework/api
 framework/css
 framework/templates
+framework/svg-sprite
 :::

docs/development/custom/framework/svg-sprite.md

@@ -0,0 +1,50 @@
+# SVG Sprite
+
+An SVG sprite is a collection of SVG images combined into a single SVG file. This allows for efficient loading and management of icons in web applications.
+
+The Alliance Auth framework provides a built-in SVG sprite that contains a selection of icons used in Alliance Auth. This sprite is automatically included in the base template, so you don't need to do anything special to use it.
+
+## Using the SVG Sprite
+
+To use an icon from the SVG sprite, you can use the following HTML syntax:
+
+```html
+<svg>
+    <use href="#[icon-name]"></use>
+</svg>
+```
+
+Replace `[icon-name]` with the name of the icon you want to use. For example, to use the Alliance Auth logo, you would write:
+
+```html
+<svg>
+    <use href="#aa-logo"></use>
+</svg>
+```
+
+## Available Icons
+
+The following icons are available in the Alliance Auth SVG sprite:
+
+- `aa-logo`: The Alliance Auth logo
+- `aa-loading-spinner`: A loading spinner icon
+
+### Alliance Auth Logo
+
+The Alliance Auth logo can be used with the following code:
+
+```html
+<svg>
+    <use href="#aa-logo"></use>
+</svg>
+```
+
+### Loading Spinner
+
+The loading spinner can be used with the following code:
+
+```html
+<svg>
+    <use href="#aa-loading-spinner"></use>
+</svg>
+```