Merge branch 'v4.x' of gitlab.com:allianceauth/allianceauth into v4.x

docs/development/custom/css-framework.md

@@ -0,0 +1,42 @@
+# CSS Framework
+
+To establish a unified style language throughout Alliance Auth and Community Apps,
+Alliance Auth is providing its own CSS framework with a couple of CSS classes.
+
+## Callout-Boxes
+
+These are similar to the Bootstrap alert/notification boxes, but not as "loud".
+
+Callout-boxes need a base-class (`.aa-callout`) and a modifier-class (e.g.:
+`.aa-callout-info` for an info-box). Modifier classes are available for the usual
+Bootstrap alert levels "Success",  "Info", "Warning" and "Danger".
+
+![Alliance Auth Framework: Callout Boxes](/_static/images/development/css-framework/callout-boxes.png "Alliance Auth Framework: Callout Boxes")
+
+### HTML
+
+```html
+<div class="aa-callout aa-callout-success">
+    <p>
+        This is a success callout-box.
+    </p>
+</div>
+
+<div class="aa-callout aa-callout-info">
+    <p>
+        This is an info callout-box.
+    </p>
+</div>
+
+<div class="aa-callout aa-callout-warning">
+    <p>
+        This is a warning callout-box.
+    </p>
+</div>
+
+<div class="aa-callout aa-callout-danger">
+    <p>
+        This is a danger callout-box.
+    </p>
+</div>
+```

docs/development/custom/index.md

@@ -11,4 +11,5 @@ This section describes how to extend **Alliance Auth** with custom apps, service
     menu-hooks
     url-hooks
     logging
+    css-framework
 ```