Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Avatar component embedded in profile prop of Shellbar component does not change it's color when "sap_fiori_3_dark" theme is applied to the app #1944

Closed
juanfelipe82193 opened this issue Jul 10, 2020 · 0 comments · Fixed by #1945
Closed

Avatar component embedded in profile prop of Shellbar component does not change it's color when "sap_fiori_3_dark" theme is applied to the app #1944

juanfelipe82193 opened this issue Jul 10, 2020 · 0 comments · Fixed by #1945
Assignees
@ilhan007
Labels
bug This issue is a bug in the code

Comments

@juanfelipe82193
Copy link

Describe the bug
ShellBar component allows users to embed an Avatar component to it's profile property. When we want to change the fiori theme to "sap_fiori_3_dark" to the whole app it seems that the embedded Avatar component is not in scope.

To reproduce
Steps to reproduce the behavior:

  1. Add a ShellBar component to the index.js file of your React app
  2. Add an embedded Avatar component to the profile property as follow:

profile = { <Avatar icon = 'person-placeholder' size = "XS" shape = 'Circle' /> }

  1. Apply the "sap_fiori_3_dark" theme from the index.html file and run the app

Expected behavior
We would expect that the component borders be white.

Screenshots
image

Context

  • UI5 Web components for React
    Affected components Avatar component
@ilhan007 ilhan007 mentioned this issue Jul 10, 2020
Merged
@ilhan007 ilhan007 self-assigned this Jul 10, 2020
@ilhan007 ilhan007 added the bug This issue is a bug in the code label Jul 10, 2020
ilhan007 added a commit that referenced this issue Jul 13, 2020
@ilhan007
fix(ui5-shellbar): Fix profile bg-color (#1945)
a3207e5 
We used to force background-color: transparent to the ui5-avatar, when used as profile. But, it turns out that this is not needed, in classic UI5, the Avatar is displayed with its default AccentBGColor6 and we align to this with the change.
Moreover, in Fiori3 Dark, the transparent Avatar leads to missing color contrast as shown in the issue.

FIXES: #1944
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ilhan007 ilhan007

Labels
bug This issue is a bug in the code
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(ui5-shellbar): Fix profile bg-color SAP/ui5-webcomponents
2 participants
@ilhan007 @juanfelipe82193