# Feature BNE-52 - Style the rich-link workpackage macro (dark theme)

Project: Stream BlockNote extensions
Status: closed
URL: https://community.openproject.org/work_packages/BNE-52

## Planning

| Attribute | Value |
| --- | --- |
| Date |  |
| Priority | Medium |
| Target versions | 17.0.0 |
| Sprint |  |
| Backlog bucket |  |
| Votes |  |
| List |  |
| Roadmap |  |
| Relevance |  |

## OPEN POINTS / FEEDBACK

_No work packages_

## Features and Chunks

_No work packages_

## Bugs and other work packages

_No work packages_

## Technical Details

| Attribute | Value |
| --- | --- |
| Module |  |
| Feature Flag |  |
| Requires doc change | No |
| Enterprise plan |  |

## Details

| Attribute | Value |
| --- | --- |
| Pull preview |  |
| Mockups |  |
| Accessibility | No |

## People

| Attribute | Value |
| --- | --- |
| Assignee |  |
| Accountable |  |
| Product manager |  |
| Developers | Judith Roth |
| Designer |  |
| Ordered by |  |
| Signed off by |  |
| Interest by |  |

## Estimates and progress

| Attribute | Value |
| --- | --- |
| PD (min) |  |
| PD (max) |  |
| Work |  |
| Labor costs |  |

## Description

As a user using the dark theme of OpenProject (or BlockNote in another website)  
I want the workpackage rich links to be styled in dark mode as well.

**Acceptance Criteria**

  - The block and dialogs for it look good in dark mode

  - The colors for dark mode are taken from BlockNote, so the Block also looks good in other contexts (e.g. not OpenProject).

  - The colors for WP Type and Status are user-defined, and the frontend does complex calculations for the dark mode for them (and probably add borders, shadows, ...). Henriette and Oliver know more about this. This code should be copied over to op-blocknote-extensions for 17.0 and a code maintenance ticket created to extract this to a separate npm package.

**Not in Scope**

  - high contrast colors =\> <mention class="mention" data-id="69224" data-type="work_package" data-text="#69224">\#69224</mention> 

**Technical Notes**

  - <https://www.blocknotejs.org/docs/react/styling-theming/themes>