Skip to content

Conversation

dleroux
Copy link
Contributor

@dleroux dleroux commented Feb 27, 2020

WHY are these changes introduced?

Fixes minor issues with Popover, Card
Applies high contrast to the indicator, checkable button, option list

Bulk actions and checkable button
Screen Shot 2020-02-27 at 4 08 21 PM

indicator
Screen Shot 2020-02-27 at 3 39 53 PM

popover
Screen Shot 2020-02-27 at 2 51 57 PM

card
Screen Shot 2020-02-27 at 2 50 53 PM

option list
Screen Shot 2020-02-27 at 2 47 18 PM

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:
import React from 'react';
import {Page} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
    </Page>
  );
}

🎩 checklist

  • Tested on mobile
  • Tested on multiple browsers
  • Tested for accessibility
  • Updated the component's README.md with documentation changes
  • Tophatted documentation changes in the style guide
  • For visual design changes, pinged one of @ HYPD, @ mirualves, @ sarahill, or @ ry5n to update the Polaris UI kit

@include control-backdrop(active, $global-theming: true);
}
~ .Icon {
transition-timing-function: var(--p-ease-in);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

this was an oversight.

@media (-ms-high-contrast: active) {
box-shadow: inset 0 0 0 border-width(base) ms-high-contrast-color('text');
}
outline: 1px solid transparent;
Copy link
Contributor Author

Choose a reason for hiding this comment

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

simplified with this. box-shadow had no effect.

@github-actions
Copy link
Contributor

github-actions bot commented Feb 27, 2020

🟡 This pull request modifies 7 files and might impact 65 other files. This is an average splash zone for a change, remember to tophat areas that could be affected.

Details:
All files potentially affected (total: 65)
📄 UNRELEASED.md (total: 0)

Files potentially affected (total: 0)

🎨 src/components/Card/Card.scss (total: 4)

Files potentially affected (total: 4)

🎨 src/components/Indicator/Indicator.scss (total: 4)

Files potentially affected (total: 4)

🎨 src/components/OptionList/components/Checkbox/Checkbox.scss (total: 5)

Files potentially affected (total: 5)

🎨 src/components/OptionList/components/Option/Option.scss (total: 4)

Files potentially affected (total: 4)

🎨 src/components/Popover/Popover.scss (total: 58)

Files potentially affected (total: 58)

🎨 src/components/ResourceList/components/CheckableButton/CheckableButton.scss (total: 3)

Files potentially affected (total: 3)

overflow: var(--p-override-visible, hidden);
background-color: var(--p-surface, color('white'));
box-shadow: var(--p-card-shadow, shadow());
outline: border-width(base) solid transparent;
Copy link
Contributor Author

Choose a reason for hiding this comment

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

box-shadow had no effect. Could be a chromium edge update

@dleroux dleroux changed the title [WIP][Various component] Add high contrast to design language [Various component] Add high contrast to design language Feb 28, 2020
@dleroux dleroux requested review from alex-page and chloerice March 2, 2020 18:09
@alex-page alex-page requested review from AndrewMusgrave and removed request for alex-page March 2, 2020 18:22
@chloerice chloerice requested review from danrosenthal and tmlayton and removed request for chloerice March 2, 2020 19:21
@chloerice
Copy link
Member

(Removed myself as I still need to set up a virtual machine)

Copy link

@danrosenthal danrosenthal left a comment

Choose a reason for hiding this comment

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

Did not 🎩, but code changes and screenshots LGTM

@dleroux dleroux merged commit 2ea3623 into master Mar 2, 2020
@dleroux dleroux deleted the various-high-contrast-components branch March 2, 2020 20:09
@tmlayton tmlayton temporarily deployed to production March 7, 2020 05:24 Inactive
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.

4 participants