-
Notifications
You must be signed in to change notification settings - Fork 7
This issue was moved to a discussion.
You can continue the conversation there. Go to discussion →
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
Idea: Assembler Functions #18
Comments
Looks similar to Mixins, except, we don't need to use this special char |
How about this example? box-shadow: 0 0 4px $alpha($darken(rgba(255, 100, 5, var(--alpha, 1)), 20), 80),
0 0 8px var(--color, $darken($alpha(hsla(100, 100%, 50%, var(--alpha, 1)), 80), 20)); Not only that you need to evaluate We already had this discussion and made some tests with @sorinsarca months ago, and this kind of functionality would have a tremendous impact on the performance. However, for the simple usage example you are presenting here, using a mixin can be enough. registerMixin('darken', color, value, property) {
property = property || 'color';
return `${property}: ${darken(color, value)}`;
}
function darken(color, value) {
// ...
} Usage ^darken: #ff0fab, 20; ^darken: #ff00ff, 30, background-color; |
It's a bit counter intuitive TBH, but you're right, it does work.
There are two solutions (ish) to all the pre-evaluating, 1, providing the arguments like this: [{
type: 'color',
value: '#00BBBB',
raw: 'rgb(0, 187, 187)',
}, {
type: 'measurement',
value: '16px',
raw: '1rem',
}] and two, just providing the raw string split by commas
This method would make a lot more sense from a performance standpoint, and it would also allow functions without huge performance impact. (Theoretically this would be the same as mixin performance) Also note that with this method variables and colors and such would be left to the function, not assembler, this could be added separately with something like Note: The only thing Assembler would eval before passing the args to the function would be nested functions. Everything else would be passed as it appears in the css.
TBH if the people designing their websites with assembler are super concerned about the performance impact, they could just not use the functions, right? |
And mixins can't be nested, and if I came across this code I wouldn't know what's going on: ^darken: #ff00ff, 30, background-color; but this on the other hand: background-color: $darken(#ff00ff, 30); makes a lot more sense. Basically it's an issue of syntax, not necessarily performance, as the performance could be solved by just passing raw parameters to the assembler. |
For me, Functions looks more intuitive and flexible than Mixins. |
This issue was moved to a discussion.
You can continue the conversation there. Go to discussion →
Okok, here's the idea: Functions, these would work similarly to built in CSS functions, like
calc()
,var()
and more. So here's how this work work:Now it would be used like this:
Sound cool yet? (not really)
So here's how it gets super cool:
Nowwww, look what we could do (!!!)
which turns into...
There are endless possibilities with this! Please consider adding it! 😃
The text was updated successfully, but these errors were encountered: