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

Feature Request - Children #8

Open
simeydotme opened this issue Jan 12, 2016 · 6 comments
Open

Feature Request - Children #8

simeydotme opened this issue Jan 12, 2016 · 6 comments

Comments

@simeydotme
Copy link

I was most perplexed when I wrote:

ul > li:exactly( 3 ) img { opacity: 0.5; }

And found it didn't work... I would expect the result to be:

ul > li:nth-last-child(4):first-child, 
ul > li:nth-last-child(4):first-child ~ li img {
    opacity: 0.5;
}

Is there any intent to implement this? are you accepting PRs ? :)

@pascalduez
Copy link
Owner

Hi,

that seems like a reasonable addition, would you mind providing a quick demo of the use case ? A Codepen or the like.

I'll implement it as soon as I have a free slot, but anyway yes, PRs are welcome :)

@simeydotme
Copy link
Author

here's a decent_(ish)_ use-case scenario.
http://codepen.io/simeydotme/pen/b962499b3ed71e09ac3db0b9f33b52b4/

Actually. when I ran in to the issue using it at work; it was to do with squishing images in a list based on the amount of items in the list (ul > li > img). However; I was able to constrain the images with max-width: 100% but this seems like only possible with my specific case, and with others (as demonstrated) you'd not get away so lightly. 😄

As you can see, it's feasible with the sass version, and also it's possible just by using the http://www.quantityqueries.com/ builder and writing your sub-tag afterwards. Although; ugly as sin. haha.


As for the PR, I forked it out and took a look, but honestly with my limited understanding of babel / es6, and getting lost while trying to install a make runner on my windows machine.. I wouldn't feasibly be able to contribute without significant investment 😞

@dikmax
Copy link

dikmax commented Mar 1, 2016

I have same problem. But I want to apply additional pseudo-selectors like this:

a:at-most(5):nth-child(n+4) {
  display:none;
}

Use case: items table 2 rows x 3 cols, and second row can't be incomplete.

@wc-matteo

This comment was marked as off-topic.

@pascalduez
Copy link
Owner

WIP, will try to finish it soonish.

@WebMechanic

This comment was marked as off-topic.

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

No branches or pull requests

5 participants