[react] Greetings message does not display

Describe the bug The greetings message (Hello, $USERNAME) does not display.

To Reproduce Go to the greetings documentation example, and see no message: https://docs.amplify.aws/ui/auth/authenticator/q/framework/react#greetings

If you right click and inspect the greetings element in Firefox, you’ll be able to see a span element containing the text Hello, Test Username in the DOM. It is not showing in the page, though.

This issue also affects any attempt I’ve made to use the greeter.

Expected behavior Message Hello, Test Username is visible

Screenshots

Additional context

This issue is visible for me in both Firefox 75.0 (64-bit), and Chrome Version 81.0.4044.122 (Official Build) (64-bit). I’m using Windows Server 2019.

[jordanranz]

@mtliendo the color and styling should be done using CSS rather than adding to the prop api. Could you try adding the following to your App.css or similar file:

amplify-greetings {
	--background-color: black;
	--border-color: black;
	color: white;
}

If this doesn’t work for you please feel free to open a new feature request with your asks

[github-actions[bot]]

This issue has been automatically locked since there hasn’t been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.