Code Block Theme Issue

[LineIndent]

Describe the bug Setting the rx.code_block background color works when the page loads. However, toggling between the light/dark theme resets the background color.

To Reproduce Steps to reproduce the behavior:

import reflex as rx

@rx.page("/test")
def test_code_block_theme():
    return rx.center(
        rx.vstack(
            rx.color_mode.switch(),
            rx.code_block(
                "test code block theme color",
                width="100%",
                font_size="13px",
                language="markup",
                wrap_long_lines=True,
                scrollbar_width="none",
                code_tag_props={"pre": "transparent"},
                custom_style={
                    "backgroundColor": "blue",
                    "color": rx.color("gray", 12),
                },
            ),
            max_width="30em",
            align="center",
            justify="center",
        ),
        width="100%",
        height="100vh",
    )

[adhami3310]

the background color of a codeblock is part of its theme, so i'm not very surprised this happens, you could also set the theme to theme=rx.code_block.themes.[whatever]

[LineIndent]

I just tested with the theme and it seems that the custom_style prop still does not stay intact - meaning that whatever theme is set PLUS a custom background, the custom background reverts to the default.

Strictly from a UI perspective the code_block can be altered to look good, but I thought I'd bring it up here in case others come across it

[adhami3310]

you can add !important and use style prop for this to work