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

Provide a theme component for setting the color and scale #63

Merged
merged 6 commits into from
Jun 19, 2019

Conversation

cuberoot
Copy link
Collaborator

Description

This PR introduces theme components that let us set the color and scale for all children.

Related Issue

#62

Motivation and Context

This PR solves two problems:

  1. Lightroom Web is a dark application, but we have a WYSIWYG editor for share content that has to support the light theme. So, we need to nest light content inside of dark.
  2. Edge doesn't respect the CSS custom properties that are injected into :root. These theme component, however, do work properly in Edge

How Has This Been Tested?

I have added Storybook stories for the various embedding scenarios.

Screenshots (if appropriate):

Screen Shot 2019-06-19 at 8 29 30 AM

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

  • I have signed the Adobe Open Source CLA.
  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.
  • I have read the CONTRIBUTING document.
  • I have added tests to cover my changes.
  • All new and existing tests passed.

@cuberoot cuberoot requested a review from benjamind June 18, 2019 20:30
Copy link
Contributor

@benjamind benjamind left a comment

Choose a reason for hiding this comment

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

Couple of minor changes but overall an excellent addition and will make solving #56 much easier in the future.

documentation/components/theme.md Outdated Show resolved Hide resolved
src/themes/index.ts Show resolved Hide resolved
if (!customElements.get(`sp-theme-${this.color}`)) {
console.warn(
`Theme component sp-theme-${this.color} has not been registered`
);
Copy link
Contributor

Choose a reason for hiding this comment

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

Nice!

@cuberoot
Copy link
Collaborator Author

@benjamind I pushed fixes for your two comments. Thanks!

@cuberoot cuberoot merged commit 458a137 into master Jun 19, 2019
@Westbrook Westbrook deleted the cuberoot/theme-components branch November 2, 2019 16:55
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.

2 participants