This repository has been archived on 2024-05-31. You can view files and clone it, but cannot push or open issues or pull requests.
authentik/website/docs/interfaces/_global/customcss.mdx
Jens L 5732fc0c2e
website/docs: prepare 2023.3 release notes (#4889)
* website/docs: prepare 2023.3 release notes

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* Apply suggestions from code review

Co-authored-by: Tana M Berry <tanamarieberry@yahoo.com>
Signed-off-by: Jens L. <jens@beryju.org>

* add better docs for custom css

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

---------

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
Signed-off-by: Jens L. <jens@beryju.org>
Co-authored-by: Tana M Berry <tanamarieberry@yahoo.com>
2023-03-10 17:33:59 +01:00

60 lines
1.3 KiB
Plaintext

### Custom CSS
To further modify the look of authentik, a custom CSS file can be created. Creating such a file is outside the scope of this document.
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
<Tabs
defaultValue="docker-compose"
values={[
{label: 'docker-compose', value: 'docker-compose'},
{label: 'Kubernetes', value: 'kubernetes'},
]}>
<TabItem value="docker-compose">
Create a `docker-compose.override.yml` file and add this block to mount the custom CSS file:
```yaml
version: "3.2"
services:
server:
volumes:
- ./my-css-file.css:/web/dist/custom.css
```
Afterwards, run the upgrade commands from the latest release notes.
</TabItem>
<TabItem value="kubernetes">
Create a ConfigMap with your css file:
```yaml
apiVersion: v1
kind: ConfigMap
metadata:
name: authentik-custom-css
namespace: authentik
data:
custom.css: |
...
```
Then, in the helm chart add this to your `values.yaml` file:
```yaml
volumes:
- name: custom-css
configMap:
name: authentik-custom-css
volumeMounts:
- name: custom-css
mountPath: /web/dist/custom.css
subPath: custom.css
```
Afterwards, run the upgrade commands from the latest release notes.
</TabItem>
</Tabs>