Commit 7c4d9a09 authored by Matthieu Fesselier's avatar Matthieu Fesselier

Add theme support

parent 29726ce2
......@@ -19,4 +19,12 @@ In your template, insert the following line where you want to display the compon
If you want to use the `bind-user` attribute, do not forget to use `sib-oidc` for authentication.
### Design
To customize your component, you can set the css variable `--sib-notifications-theme` anywhere in your stylesheet to the color you want.
For example:
```css
:root{
--sib-notifications-theme: #ffd759;
}
```
\ No newline at end of file
......@@ -13,7 +13,7 @@
width: 20px;
height: 20px;
line-height: 20px;
background-color: #ffd759;
background-color: var(--sib-notifications-theme, gray);
border-radius: 50%;
font-size: 12px;
}
......
......@@ -9,13 +9,19 @@
<script src="https://cdn.happy-dev.fr/oidc-client/oidc-client.min.js"></script>
<script src="https://cdn.happy-dev.fr/sib-oidc/sib-oidc.js"
data-authority="http://127.0.0.1:8000/openid/"
data-client_id="782322"
data-client_id="464079"
data-redirect_uri="http://127.0.0.1:8001"
data-response_type="id_token token"
data-scope="openid profile email"
data-automaticSilentRenew="true"
data-loadUserInfo="true"
></script>
<style>
:root{
--sib-notifications-theme: #ffd759;
}
</style>
</head>
<h1>SIB Notifications - Demo</h1>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment