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.

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

[Style] Update modals to increase readability on High-Contrast Theme #1402

Merged
merged 4 commits into from Mar 29, 2019

Conversation

Aliandi
Copy link
Contributor

@Aliandi Aliandi commented Mar 28, 2019

Fixes issue #1312

Changes made

  • Update .dialog color and bg-color of the high-contrast theme to match the theme's palette.

imagen

imagen

imagen

Copy link
Contributor

@tonyanziano tonyanziano left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR!

Left some comments for some minor improvements. Otherwise, great work!

packages/app/client/src/ui/styles/themes/high-contrast.css Outdated Show resolved Hide resolved
@@ -218,8 +218,12 @@ html {
}

.dialog {
--dialog-bg: var(--neutral-1);
--dialog-bg: var(--neutral-16);
color: var(--neutral-4) !important;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Try a similar approach to what I wrote below for the --error-text variable. It would be great to have a --dialog-color variable or something similar that each theme could control without having to use `!important.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We've been trying this approach with no luck yet, but we'll keep looking into it!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've added a commit that's working on my end. Please try it locally and see if that works! 😃

@tonyanziano
Copy link
Contributor

Also, it would be great if you could add an entry to the change log.

Under Unreleased and above v4.3.3 you can add a new section for Fixed and put your entry under that.

@coveralls
Copy link

coveralls commented Mar 28, 2019

Pull Request Test Coverage Report for Build 2255

  • 0 of 0 changed or added relevant lines in 0 files are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage remained the same at 55.177%

Totals Coverage Status
Change from base Build 2242: 0.0%
Covered Lines: 4883
Relevant Lines: 8319

💛 - Coveralls

@cleemullins
Copy link
Contributor

Also, it would be great if you could add an entry to the change log.

Under Unreleased and above v4.3.3 you can add a new section for Fixed and put your entry under that.

Over in the BotBuilder SDK, we have a script that pulls the PR comments for all PRs in a given date range. We use that to create the release notes & changelog at the end of each cycle. You guys are more than welcome to share that!

@justinwilaby
Copy link
Contributor

This PR is at odds with the original requirements for modals in the Emulator. Before this is merged, it should go through a design review and get sign off:

image

Copy link
Contributor

@justinwilaby justinwilaby left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hold until design review is performed.

@cleemullins
Copy link
Contributor

@justinwilaby What's the process for a design review?

@cwhitten
Copy link
Member

@cleemullins it's as simple as assigning a Bot Framework Designer! I'll go ahead and do this. @mewa1024 can you revisit the direction to override the theme variables in all modals? I'm wondering if this break accessibility requirements in High Contrast mode. Justin tells me the VSCode does something similar. This is odd to me.

@justinwilaby justinwilaby dismissed their stale review March 29, 2019 21:19

Design review completed

@mewa1024
Copy link

Yes, the black background for High Contrast mode is fine.

@mewa1024 mewa1024 removed their assignment Mar 29, 2019
@tonyanziano tonyanziano merged commit 63bcaca into master Mar 29, 2019
@tonyanziano tonyanziano deleted the issue/modals-high-contrast branch March 29, 2019 21:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

8 participants