reflex Drawer content has a blue ring by default

Drawer content has a blue ring by default

Open Alek99 opened this issue 11 months ago • 8 comments

Describe the bug A clear and concise description of what the bug is.

By default the drawer has a blue ring.

To Reproduce Steps to reproduce the behavior:

Code/Link to Repo:

def sidebar(trigger) -> rx.Component:
   """The sidebar component."""
   return rx.drawer.root(
       rx.drawer.trigger(trigger),
       rx.drawer.overlay(),
       rx.drawer.portal(
           rx.drawer.content(
               rx.vstack(
                   rx.heading("Chats", color=rx.color("mauve", 11)),
                   rx.divider(),
                   rx.foreach(State.chat_titles, lambda chat: sidebar_chat(chat)),
                   align_items="stretch",
                   width="100%",
               ),
               top="auto",
               right="auto",
               height="100%",
               width="20em",
               padding="2em",
               background_color=rx.color("mauve", 2),
           )
       ),
       direction="left",
   )

Expected behavior

By default the drawer should not have a blue ring. Additional context Add any other context about the problem here.

To fix in the rx.drawer.content set the prop outline="none"