A module for Element to provide openDesk specific functionality.
It uses the Module API to add the openDesk navbar.
Features:
- Add a navigation bar to Element.
- Customize the theme colors of Element.
The minimal Element version to use this module is 1.11.50
.
Checkout Element and setup the development environment according to their documentation.
Go into the element-web
folder and create a build_config.yaml
file with the following content:
modules:
- '@nordeck/element-web-opendesk-module@^0.0.1'
Build Element and deploy your custom version as described by the original documentation. In case you want to create a docker-based build process, you might find inspiration in the setup we use for our e2e tests.
The module provides the following optional configuration options:
banner
- Enable the banner component.ics_navigation_json_url
- The URL of thenavigation.json
file that contains the navigation structure for the user.ics_silent_url
- The URL of the silent endpoint that is used via inline frame to log in the user.portal_logo_svg_url
- The URL of the portallogo.svg
file.portal_url
- The URL of the portal.
custom_css_variables
- a configuration of--cpd-color-*
css variables to override selected colors in the Element theme. The Element Compound documentation has a list of all available options.
For the navigation bar and launcher, the following variables are relevant:
--cpd-color-text-action-accent
sets the background of the launcher icon when expanded and the top border of the menu--cpd-color-icon-on-solid-primary
sets the color of the launcher icon when expanded- `
Example configuration:
{
"net.nordeck.element_web.module.opendesk": {
"config": {
"banner": {
"ics_navigation_json_url": "https://example.com/navigation.json",
"ics_silent_url": "https://example.com/silent",
"portal_logo_svg_url": "https://example.com/logo.svg",
"portal_url": "https://example.com"
},
// ... add more optional configurations
"custom_css_variables": {
"--cpd-color-text-action-accent": "#dadada",
"--cpd-color-icon-on-solid-primary": "#aa0000"
}
}
}
}
-
Run
yarn build
in this repository. -
Checkout Element and setup the development environment according to their documentation.
-
(In the
element-web
folder) Create abuild_config.yaml
with the following content:# Directory structure: # <your projects folder>/ # ├─ element-web/ # │ ├─ ... # │ ├─ build_config.yaml # │ ├─ package.json # ├─ matrix-react-sdk/ # │ ├─ ... # ├─ matrix-js-sdk/ # │ ├─ ... # ├─ element-web-modules/ # │ ├─ packages # │ │ ├─ element-web-opendesk-module # │ │ │ ├─ build/ # │ │ │ │ ├─ ... # │ │ │ ├─ package.json # │ │ │ ├─ ... # │ ├─ package.json modules: - 'file:../element-web-modules/packages/element-web-opendesk-module'
-
(In the
element-web
folder) Runyarn start
and access it athttp://localhost:8080
Important: You must run
yarn build
in this repo and restart Element after each change in the module.