Using TiddlyWiki to automate design or support learning CSS
I have often felt if I had access to a list or data of CSS properties matched with their property values it would be possible to make a predictive css text tool to assist in designing tiddlywikis, writing CSS, and html.
The same idea could be applied to many cases where there are a discrete set of terms and related terms or subterms.
To start this experiment I have being looking for a comprehensive list of CSS properties, their shorthand and the possible values for each ,for example see this on the CSS background. Notice how it would be time consuming to extract this otherwise public information?
That is it is difficult to find this information in a format that it can easily be imported to tiddlywiki and capture the relationships between properties and property values.
Do you know a source that may lend itself for extraction and import, such as a csv or other format?
Or feel free to Join this discussion on using TiddlyWiki to
automate design or support learning css deeply.
Imagine if, as you went to design a stylesheet or add css in html you could start typing a property and the match ones were listed, you could then select that property then see a list of possible “property values” for that “property” and insert the ones you need. This will support using CSS before you are fluent in CSS, but “with use” help you become fluent.
Then the solution is to wait for the new table or create your something similar.
The pages in MDN are created from a markdown files with frontmater format (you can see them in their github), maybe you can use it for extract the info.
Thanks @Alvaro I may just do that. I would like to find a resource that is closer to what I need if possible, as I can’t currently put too much time into it. Personally when I see three or more platforms or languages/markup that I do not already know in the path to a desired outcome, I see a long journey ahead.
To be honest I expected such info to already be arranged in a “database normal form” somewhere, otherwise it suggests those who have published the details or built into their tables/browsers or educational material, have being doing this in a manual way. I find that hard to believe.
@telumire thanks for that lead, it may “bare fruit” however there is only minimal information available especially to my skills and experience with Github and the codemirror framework. I have not seen any mention of CSS attributes and values specifically, however I will raise the idea there to forearm the project team.
Thanks @CodaCoder these examples illustrate the problem, its easy to get lists of properties, but then the values are usually listed in separate table in a different page eg; border-right-color
I would like to find a single list of properties with 0-N possible values on each line (ideally csv)
This would allow me to import into tiddlywiki with the JSON mangler to create a plugin of all properties and all the values for each property.
@telumire “Almost perfect”, thank you. Yes I came across the last one, and I was not sure how easy it would be to extract and normalise the data (achievable but fiddly) but the JSON is possibly the best yet, it appears to contain the properties/and possible “values”.
I will need to have a go in JSON mangler to see, but failing that I think can make my own “parser” to extract the info.
Perhaps the best way is to import each property as a tiddler, all info, including some fields containing multiple values - one of which is “syntax” that seems to contain the “property values”, and perhaps making groups into tags (or not).
Unless there is another rout like import JSON to excel and export as CSV?