11–20 of 31 posts
The project pyastgrep https://pyastgrep.readthedocs.io/en/latest/ can use CSS selectors as a query language for Python syntax (default is XPath). e.g.: pyastgrep --css 'Call > func > Name#main'
Not sure I follow the scenario this would solve. For instance, currently you can conditionally change a parent based on its children. For example, this `pre` could either have 16px or 0px of padding. Zero when its direct child is a `code` element. pre { padding: 16px; &:has(> code) { padding: 0; } }
I think the conclusion (which I may not have made clear enough) is less like "These are limitations of modern CSS which ought to be fixed" and more "Maybe a CSS-like syntax could be added to a Datalog-like system and that would be helpful for making it more accessible to more engineers, navigating tree-shaped data, etc"
thanks for the feedback, anyway!
Reminds me of seeing this presented at a conference years ago https://github.com/braposo/graphql-css It was a joke but I really like the way it pointed out how we copy and reapply patterns in different contexts and that might enable unexpected things.
> we copy and reapply patterns in different contexts and that might enable unexpected things
yeah, that's exactly what I am trying to do here. Mostly it doesn't go anywhere, but it's interesting for the hacker spirit within me :)
It's not that I don't understand the rationale - any programming language offers more power than a non-programming language. But I'd rather think here that something else could instead replace all of HTML, CSS and JavaScript, rather than constantly wanting to make everything more complex. I don't use most of the new elements in HTML5, largely because I don't see the point in using specialized tags for micro-describing a webpage. I succumbed to the "it is a div-HTML tag and it has a unique ID"; that's what I think mots of those containers actually really are. I even wanted to have aliases to such IDs, simply to use as navigational href intralink.
[data-theme="dark"] [data-theme="light"] :focus {
outline-color: black;
}
On the other hand:
h2 {
color: red;
}
So ancestor(X, Y) :- parent(X, Y). means: “For all possible values of X and Y, X
is an ancestor of Y, if X is a parent of Y.”
@container style(--theme: dark) {
.card { background: royalblue; color: white; }
}
I think this is a problem with CSS - too many people are ruining it. It is strange to see how standards that used to work, are degraded over time.
Hmmm. I kind of like CSS but I hate the creep-up of complexity. It's not that I don't understand the rationale - any programming language offers more power than a non-programming language. But I'd rather think here that something else could instead replace all of HTML, CSS and JavaScript, rather than constantly wanting to make everything more complex. I don't use most of the new elements in HTML5, largely because I d…
eg this example:
[data-theme="dark"] [data-theme="light"] :focus {
outline-color: black;
}
so we could write this also as, e.g.:
outline-color(Y, black) if
data-theme(X, "dark") and
parent(X, Y) and
data-theme(Y, "light") and
focused(Y)
if we want even more syntax sugar, we could do:
Y.outline_color := black if
X.data-theme == dark and
Y.parent == X and
Y.data-theme == dark and
Y.focused
the declaration and scope of these variables is implicit here; if you want something even more ALGOL-family, we could write
forall Y {
Y.outline_color := black if
Y.data_theme == "dark" and
Y.focused and
Y.parent.data_theme == "light"
}
Hmmm. I kind of like CSS but I hate the creep-up of complexity. It's not that I don't understand the rationale - any programming language offers more power than a non-programming language. But I'd rather think here that something else could instead replace all of HTML, CSS and JavaScript, rather than constantly wanting to make everything more complex. I don't use most of the new elements in HTML5, largely because I d…
yeah I mean, to be clear, I'm less proposing "What if we add even more syntax and semantics to CSS" and more "what if we steal ideas from CSS, notice their similarity to logic / relational query languages, and use them to build something new". I probably could have articulated some of this better. eg this example: [data-theme="dark"] [data-theme="light"] :focus { outline-color: black; } means, in English/pseudocode,…
SELECT 'black' AS outline_color
FROM elements parent
JOIN elements child ON parent.id = child.parent_id
WHERE parent.data_theme = 'light'
AND child.data_theme = 'dark'
AND child.focused = true