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

Etch-a-sketch theme #454

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Etch-a-sketch theme #454

wants to merge 3 commits into from

Conversation

heff
Copy link
Collaborator

@heff heff commented Jan 27, 2023

Pretty simple implementation.

+Had to fix the media-controller attribute in chrome-button so it can work inside a shadow dom. Should be applied (in a followup) to other components.

Goals for a more advanced one (later PRs):

  • Make the knobs actually work
    • Left knob seeks
    • Right knob increases volume
  • Add shine to the corners to make it look more real-ish
  • On mobile, shake the device to start over (@dylanjha 's idea 😆)

image

@heff heff requested a review from a team as a code owner January 27, 2023 00:03
@vercel
Copy link

vercel bot commented Jan 27, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
media-chrome ✅ Ready (Inspect) Visit Preview Jan 27, 2023 at 0:03AM (UTC)
media-chrome-docs ✅ Ready (Inspect) Visit Preview Jan 27, 2023 at 0:03AM (UTC)

if (mediaControllerId) {
const mediaControllerEl = document.getElementById(mediaControllerId);
mediaControllerEl?.associateElement?.(this);
const rootNode = this.getRootNode();
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

Trying to remember if there's any specific downsides to getRootNode. The TS parser at least doesn't like it when trying to use properties on it, so it needs to be ignored.

Copy link
Contributor

Choose a reason for hiding this comment

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

we'll need to replace document.getElementById with this.getRootNode().getElementById for themes to work nicely with a decoupled media controller

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

2 participants