How to manage light and dark mode together. (Issue with text directly on the Background level)

[The-Lum]

Hi @bschwarz,

FYI, from an issue reported by Boshka:

• https://forum.plantuml.net/17781/bug-in-some-themes-color-scheme

Some themes fail to correctly display the following pattern:

@startuml
!theme cerulean
:action text}
@enduml

The "action text" is invisible. Please, see:

Could this be fixed in all failing themes?

[Another wanted feature will be perhaps to manage also light and dark mode together, with (why not...):

@media (prefers-color-scheme:dark) {
...
}

See: plantuml/plantuml#882
Or another solutions...
]

Regards.
[FYI @arnaudroques]

[bschwarz]

I will look into that bug...

For dark vs light mode. For the aws-orange theme, there is somewhat builtin support for dark mode. You can set a variable to enable dark mode, and it will use a different color scheme.

!$PUML_MODE="dark"
!theme aws-orange

However, this is not automatic based on system/application setting. This probably is easy to add, especially for aws-orange. However, is the @media (prefers-color-scheme:dark) {} fully working in plantuml now? Last I saw it will still being worked on

[bschwarz]

So for this particular problem, and I suspect it is the same for the other problems, is that the styling for that particular syntax uses the same styling as other actions. For example, the below snippet has "First" and "Second". I believe both of these use the same styling. If I am incorrect, then please let me know how to differentiate.

I think the only way around this is to use inline coloring as shown for Second below. I tried to use custom styling, but I was getting an error when used with !theme cerulean

@startuml
!theme cerulean

  :First;

:<color:black>Second}
@enduml

See here for example: http://www.plantuml.com/plantuml/umla/SoWkIImgAStDuL8ioKZDJLL8JYqgpKbDpEFYKb2mSiiiAYwnvkAoiadEpyaliahAIKpEjWjEJSxFIwdbSaZDIm7g1000

[The-Lum]

Hi @bschwarz, and all,

Then please let me know how to differentiate.

After style enhancement (from V1.2023.7beta4) with:

• Activity: Allow to style SDL stereotype  plantuml/plantuml#1423

Here is a proposal to manage continuous shape text (on light and dark mode together):
⚠️ Restriction: It works only on new :xxx; <<continuous>> format, not on old :xxx}. ⚠️

@startuml
'!$BGCOLOR = black
!$BGCOLOR = white
!theme cerulean
<style>
.continuous {
  FontColor $PRIMARY_DARK
}
</style>
title Stylish continuous
:a;
:action text 1; <<continuous>>
:action text 2}
@enduml

---

[We might perhaps have to do the same for (all elements directly on the Background level):

• header
• footer
• map
• json
• timing
• ...]

Thanks to PlantUML team and @arnaudroques. 👍
Enjoy.
Regards.

[bschwarz]

Are you suggesting that the themes themselves would define the .continuous style? Or each user would have to do that?

[The-Lum]

Are you suggesting that the themes themselves would define the .continuous style?

• Yes, of course: If the cerulean theme manages also light and dark mode together, we must to seach a good color for text directly on the Background level, and you must define .continuous on the theme (himself).
• No: If the cerulean theme manages only dark mode (and not light, together), the users can add this snippedd of code to avoid white on white of .continuous text (with Light background)...

The main question are:

• Is your theme specific for light and dark mode?
• Is your theme manage light and dark mode together?

And point of attention:
[We might perhaps have to do the same for (all elements directly on the Background level):

• header
• footer
• map
• json
• timing
• ...]

Regards,
Th.