# Launch of Issue Context Module **URL:** \ **Category:** Announcements\ **Tags:** new-issue-view, jira-cloud\ **Created:** [March 29, 2023, 7:14am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969 "2023-03-29T07:14:38Z")\ **Posts on this page:** 11\ **Page:** 3
**Author:** ![Archer](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/archer/32/45626_2.png) [@Archer](https://community.developer.atlassian.com/u/Archer)\ **Post date:** [November 23, 2023, 10:40pm UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/43 "2023-11-23T22:40:03Z")
@tbinna We managed a workaround for our plugin using `inherit` as value for our outer-most HTML background instead of using the surface detection of `background: var-(--ds-elevation-surface-current)`. It is a workaround that worked for us in both issue panel, dialog, and page display. Not ideal, but gets the job done. I hope this discrepancy in background color gets fixed. ---
**Author:** ![tbinna](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/tbinna/32/35870_2.png) [@tbinna](https://community.developer.atlassian.com/u/tbinna)\ **Post date:** [December 15, 2023, 6:14am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/44 "2023-12-15T06:14:19Z")
@DanielDelCore @MitchGavan, I’m trying my luck here one more time. Surface detection has been working and then broke again. It’s now broken for at least the past month. This is a production issue. I expect more urgency in fixing this or at least some comms if we have to resort to workarounds. ---
**Author:** ![DanielDelCore](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/danieldelcore/32/39871_2.png) [@DanielDelCore](https://community.developer.atlassian.com/u/DanielDelCore)\ **Post date:** [December 17, 2023, 10:51pm UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/45 "2023-12-17T22:51:39Z")
Hey @tbinna, sorry for the delay! I suspect this may be a CSP issue, could you check the console of your app and let me know if there are any errors relating to surface detection? Also, could you verify if updating your CSP config to include the following resolves the issue? ```auto Content-Security-Policy: style-src connect-cdn.atl-paas.net ``` Cheers. ---
**Author:** ![tbinna](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/tbinna/32/35870_2.png) [@tbinna](https://community.developer.atlassian.com/u/tbinna)\ **Post date:** [December 19, 2023, 4:30am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/46 "2023-12-19T04:30:14Z")
Thanks for your reply @DanielDelCore. I believe you are correct that this is a CSP issue. Have been fiddling with our CSP policy, but the suggested CSP does not work (we have a **Connect app** ). I am still trying to figure out how the CSPs apply here. We get the error below: ```auto Refused to load the stylesheet 'https://connect-cdn.atl-paas.net/surfaces.css' because it violates the following Content Security Policy directive: "style-src 'self' 'unsafe-inline'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback. ``` Interestingly, the CSP violation error message in the browser console does not show the `style-src` CSP that we have configured (missing [connect-cdn.atl-paas.net](http://connect-cdn.atl-paas.net)). I do not understand yet why that is. I have tried both with and without `style-src-elem` (without, it should fallback to `style-src`), but neither works. Update: After some more research, I am unsure if the current approach is workable. [This question](https://stackoverflow.com/questions/52268244/content-security-policy-trust-child-scripts-styles) seems to refer to a similar setup, and the answer is generally that this does not work. Does Atlassian have a Connect example that demonstrates that this approach is working including a CSP that’s compliant with the [Connect security requirements](https://developer.atlassian.com/platform/marketplace/security-requirements/#connect-apps)? ---
**Author:** ![marc](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/marc/32/39047_2.png) [@marc](https://community.developer.atlassian.com/u/marc)\ **Post date:** [December 19, 2023, 10:19am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/47 "2023-12-19T10:19:57Z")
Hi @tbinna , A CSP policy for connect that works for us is: ```auto "style-src": ["'self'", "'unsafe-inline'", "https://*.atl-paas.net"], ``` Unfortunately the unsafe-inline is needed, because all.js inlines the css for theming etc. dynamically. ---
**Author:** ![tbinna](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/tbinna/32/35870_2.png) [@tbinna](https://community.developer.atlassian.com/u/tbinna)\ **Post date:** [December 20, 2023, 3:07am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/48 "2023-12-20T03:07:17Z")
It seems I got sidetracked and took the CSP error failing to load surfaces.css from an Atlassian background script for our own 🤦‍♂️ So, back to square one. The issue seems to be with the surface detection itself. Below is the screenshot from Automation for Jira. They are using [the approach suggested by](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/30) @MitchGavan, which we are using too, but that does not work anymore and does not resolve to the correct background color. ![image](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/5/c/5c430a428b77a4f417921c9b133d0c9fce775714.jpeg) As @Archer [suggested](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/43), using `background-color: inherit` seems to work though. ![image](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/5/d/5d6320210ea37ed4e7f3ec02a8b217348df66f81.jpeg) @DanielDelCore is `inherit` the way to go? I believe the issue is not yet resolved. **Update:** I just noticed this again and wanted to highlight that this **issue only exists if you view an issue on the board** (clicking an issue opens a modal). It works correctly on `/browser/`. The general assumption seems to be that modal dialogs always have a darker background color shade. However, this should not be the case if you view an issue in the context of a dialog. ---
**Author:** ![system](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/7/8/78672baa5ba80cd9164376457051d0eec038b082.png) [@system](https://community.developer.atlassian.com/u/system)\ **Post date:** [January 19, 2024, 3:07am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/49 "2024-01-19T03:07:32Z")
Closed on January 19, 2024, 3:07am UTC This topic was automatically closed 30 days after the last reply. New replies are no longer allowed. ---
**Author:** ![DanielDelCore](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/danieldelcore/32/39871_2.png) [@DanielDelCore](https://community.developer.atlassian.com/u/DanielDelCore)\ **Post date:** [February 1, 2024, 3:01am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/50 "2024-02-01T03:01:11Z")
@tbinna `background: inherit;`, surprisingly works! TIL. I’ve verified that on my side as well. If that’s the case, we can probably make that recommendation moving forward. Are there any known edge-cases between browsers for example that we should be aware of? ---
**Author:** ![DanielDelCore](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/danieldelcore/32/39871_2.png) [@DanielDelCore](https://community.developer.atlassian.com/u/DanielDelCore)\ **Post date:** [February 8, 2024, 11:20pm UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/51 "2024-02-08T23:20:09Z")
Opened on February 8, 2024, 11:20pm UTC ---
**Author:** ![maxkuerschner](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/maxkuerschner/32/50072_2.png) [@maxkuerschner](https://community.developer.atlassian.com/u/maxkuerschner)\ **Post date:** [February 9, 2024, 11:10am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/52 "2024-02-09T11:10:51Z")
Hello, We fixed the dark mode problems by overwriting the elevation-surface tokens based on the elevation inside our css reset files and then using these tokens when styling our components: ```auto html { --ds-elevation-surface-current: var(--ds-surface) !important; --ds-elevation-surface-hovered: var(--ds-surface-hovered) !important; --ds-elevation-surface-pressed: var(--ds-surface-pressed) !important; } html[data-surface="overlay"] { --ds-elevation-surface-current: var(--ds-surface-overlay) !important; --ds-elevation-surface-hovered: var(--ds-surface-overlay-hovered) !important; --ds-elevation-surface-pressed: var(--ds-surface-overlay-pressed) !important; } html[data-surface="raised"] { --ds-elevation-surface-current: var(--ds-surface-raised) !important; --ds-elevation-surface-hovered: var(--ds-surface-raised-hovered) !important; --ds-elevation-surface-pressed: var(--ds-surface-raised-pressed) !important; } html[data-surface="sunken"] { --ds-elevation-surface-current: var(--ds-surface-sunken) !important; --ds-elevation-surface-hovered: var(--ds-surface-sunken-hovered) !important; --ds-elevation-surface-pressed: var(--ds-surface-sunken-pressed) !important; } ``` Greetings Max ---
**Author:** ![david.pinn](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/david.pinn/32/36134_2.png) [@david.pinn](https://community.developer.atlassian.com/u/david.pinn)\ **Post date:** [February 26, 2024, 5:56am UTC](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969/54 "2024-02-26T05:56:34Z")
It might be worth updating the documentation at [https://atlassian.design/components/tokens/code#get-the-current-suface-color](https://atlassian.design/components/tokens/code#get-the-current-suface-color). [Previous page](https://community.developer.atlassian.com/t/launch-of-issue-context-module/67969.md?page=2)