rx.button color disapper when page reload

Open
#140 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
38/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
python
Domain
frontend

Research direction

Start by running the example app and reproducing the color loss after an F5 reload and after returning from the result page. Inspect the index() entry point, especially the rx.button and rx.alert_dialog in the rx.box; done means the Submit button retains its lightblue background in both navigation paths.

Written by the indexing model from the issue text.

Description

[Status]
the example code - 'quiz'
In 'index' class, there's a declaration of a 'box' used to place the 'Submit' button,
I've assigned a color "lightblue" to this button and add a alertdialog on it.

However,

  1. when the page is reloaded (F5), the "lightblue" is displayed briefly and then disappears
  2. returned back to this page from result page , button not display "lightblue".
    But other buttons in the alertdialog displayed color correctly.

Please let me know where I might have gone wrong?

[Code]
below is the code of index():

def index():
    """The main view."""
    return rx.center(
        rx.vstack(
            header(),
            question1(),
            question2(),
            question3(),
            rx.box(
                rx.button(
                    "Submit",
                    bg="lightblue",
                    color="black",
                    width="6em",
                    padding="1em",                    
                    on_click=State.alertdialogchange,
                ),
                rx.alert_dialog(
               #setting of alert_dialog 
                ),
            ),          
            spacing="1em",
        ),
        padding_y="2em",
        height="100vh",
        align_items="top",
        bg="#ededed",
        overflow="auto",
    )
  
Dominant language
Python
Stars
576
Forks
362
PR merge metrics
No merged PRs in 30d

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from reflex-dev/reflex-examples

All issues in reflex-dev/reflex-examples

Similar issues

More Python issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.