Too limited selector support

[jslegers]

When I look at the first level, each of the following would be valid selectors :

• plate
• .table *
• .table plate
• .table > *
• .table > plate
• div *
• div plate
• div > *
• div > plate
• div.table *
• div.table plate
• div.table > *
• div.table > plate
• :root plate
• :root .table *
• :root .table plate
• :root .table > *
• :root .table > plate
• :root div *
• :root div plate
• :root div > *
• :root div > plate
• :root div.table *
• :root div.table plate
• :root div.table > *
• :root div.table > plate
• plate:empty

And that's just some of the many valid selector options. Yet, plate and plate:empty are the only two selectors in this list that actually work. I noticed the problem persists in other levels as well.

While I really love what you're trying to do and I believe this could be a very useful tool to teach even elementary school kids how to code in CSS, I believe the CSS selector support is still much too limited to be useful for that purpose.

Nevertheless, lots of kudos for this amazing idea and this project as an early prototype ! !

[flukeout]

Hey, thanks for the feedback! I scoped all of the selectors the user types in to already look inside the .table div, which is why none of the ones you listed work. It's an easy change to make all of the selectors you listed work, so I'll put that on my to-do list. Thanks again, man!

[barnettjw]

Related to issue #20