Improve default colors for text_input widgets

[alice-i-cecile]

Objective

• Text input is one of the headline feature in Bevy 0.19.
• Our defaults are currently very ugly, and shown across our user-facing text examples.
• Good default matter for user perception of quality, and to make quick prototyping easier.
• Additionally, the layout in the text_input example is erratic in a way that looks poorly made.

Fixes #23955.

Solution

1. Clean up the default colors for text input by picking boring, uncontroversial tailwind colors.
2. Change the css::YELLOW borders in our text input examples to something neutral that looks nice with our background.
3. Fix up the layout for the text_input example so it's both simpler and looks much better.

Testing

cargo run --example text_input

Showcase

Before:

After:

[Zeophlite]

One "nice to have" would be to highlight the border color of the focused text input

[viridia]

One "nice to have" would be to highlight the border color of the focused text input

Unfortunately, that's not something that is the hands of EditableText. While it would be possible to modify the example to do this, it would complicated the example unnecessarily.

Feathers, by contrast, uses the outline on the parent entity to indicate input focus, because the feathers text input has an outer frame which holds both the actual text input entity and the adornments.

[Zeophlite]

One more bit of followup, in #23947 crates/bevy_feathers/src/dark_theme.rs , we have

            (tokens::TEXT_INPUT_SELECTION, palette::ACCENT),
            (
                tokens::TEXT_INPUT_SELECTION_UNFOCUSED,
                palette::ACCENT.lighter(0.2),
            ),

This looks like

Someone with a design eye should say if this is distinct enough

[viridia]

My personal preference would be:

• don't show selection rect for non-focused fields (make it completely transparent)
• for focused fields, let the selection be relatively understated - I'd go with a slightly dimmer version of accent color

[alice-i-cecile]

[viridia]

OK let me be clear: when I was speaking of having the unfocused selection rect be fully transparent, I was only speaking in the context of feathers. For the non-feathers example, I can see how we would want to display the full capabilities of the EditableText component.

More specifically, feathers needs to be judicious in its use of color: the idea is that the widgets should be readable, but should not distract from the star of the show - the media or game scene being edited. It should not call attention to itself - except for cases like primary buttons, where it is intentionally calling attention to itself.

The non-feathers example, OTOH, just has to look pretty.

[jordanhalase]

LGTM