From f1582165bc4c3823199ce9ad768d2c92ca83437b Mon Sep 17 00:00:00 2001 From: Peter Pfeufer Date: Wed, 13 Aug 2025 09:12:38 +0200 Subject: [PATCH] [ADD] SVG sprite to the Alliance Auth framework --- .../templates/framework/svg/sprite.svg | 23 +++++++ .../static/allianceauth/images/auth-logo.png | Bin 10836 -> 0 bytes .../static/allianceauth/images/auth-logo.svg | 56 ------------------ .../templates/allianceauth/base-bs5.html | 2 + .../templates/bundles/image-auth-logo.html | 6 +- docs/development/custom/aa-framework.md | 1 + .../custom/framework/svg-sprite.md | 50 ++++++++++++++++ 7 files changed, 79 insertions(+), 59 deletions(-) create mode 100644 allianceauth/framework/templates/framework/svg/sprite.svg delete mode 100644 allianceauth/static/allianceauth/images/auth-logo.png delete mode 100644 allianceauth/static/allianceauth/images/auth-logo.svg create mode 100644 docs/development/custom/framework/svg-sprite.md diff --git a/allianceauth/framework/templates/framework/svg/sprite.svg b/allianceauth/framework/templates/framework/svg/sprite.svg new file mode 100644 index 00000000..f9ab2f65 --- /dev/null +++ b/allianceauth/framework/templates/framework/svg/sprite.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + diff --git a/allianceauth/static/allianceauth/images/auth-logo.png b/allianceauth/static/allianceauth/images/auth-logo.png deleted file mode 100644 index b45de9c8e157f514a74e6d3d88a79151a58c5bc9..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 10836 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 JMBd`n{{a$DmplLf diff --git a/allianceauth/static/allianceauth/images/auth-logo.svg b/allianceauth/static/allianceauth/images/auth-logo.svg deleted file mode 100644 index 9d0c92e2..00000000 --- a/allianceauth/static/allianceauth/images/auth-logo.svg +++ /dev/null @@ -1,56 +0,0 @@ - - - - - - - - - - - - - diff --git a/allianceauth/templates/allianceauth/base-bs5.html b/allianceauth/templates/allianceauth/base-bs5.html index d96049f1..6066ce5e 100644 --- a/allianceauth/templates/allianceauth/base-bs5.html +++ b/allianceauth/templates/allianceauth/base-bs5.html @@ -159,5 +159,7 @@ {% block extra_script %} {% endblock extra_script %} + + {% include "framework/svg/sprite.svg" %} diff --git a/allianceauth/templates/bundles/image-auth-logo.html b/allianceauth/templates/bundles/image-auth-logo.html index 47281028..be25d833 100644 --- a/allianceauth/templates/bundles/image-auth-logo.html +++ b/allianceauth/templates/bundles/image-auth-logo.html @@ -1,3 +1,3 @@ -{% load static %} - -{{ SITE_NAME }} + diff --git a/docs/development/custom/aa-framework.md b/docs/development/custom/aa-framework.md index 12084d2b..92e55de7 100644 --- a/docs/development/custom/aa-framework.md +++ b/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 ::: diff --git a/docs/development/custom/framework/svg-sprite.md b/docs/development/custom/framework/svg-sprite.md new file mode 100644 index 00000000..81ca95fa --- /dev/null +++ b/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 + + + +``` + +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 + + + +``` + +## 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 + + + +``` + +### Loading Spinner + +The loading spinner can be used with the following code: + +```html + + + +```