[REQUEST] CSS styling support

[USLTD]

Is your feature request related to a problem? Please describe. No.

Describe the solution you'd like Add converter function which will take CSS-like rules and converts them to styling features which are supported on terminal.

Describe alternatives you've considered ...

Is this feature present in other TUI products? Yes. In Textual

Additional context I know it's hard to implement it. In fact even Textual only supports some rules but it is enough. Even basic rules with suffice.

[bczsalba]

Hey! Currently this is only supported in a YAML or JSON format, but the parsing system is really open so adding a new one shouldn't be that hard. It is something I plan on working on. Thanks for the issue!

[USLTD]

Why don't we add XML or HTML formats too?

[bczsalba]

It's mostly a case of me not really needing that feature so I didn't implement it. I am planning on making a CSS file loader specifically for the config category, and possibly an HTML/generic XML for the others.

[bczsalba]

I thought about this some more since then, and I'm not quite sure it's very needed. The CSS work done over at Textual is very impressive, but from what I can see also required them to implement their own CSS parser and some new syntax specific to the project. Since I'm still but one university student working on this I'm not sure if putting something that high on effort would be useful at this stage.

If others are open to coming up with something I'm happy to accept PRs about it, but IMO the current YAML system, along with improvements to recent and upcoming improvements to the styling system should be enough to do the job. I would rather not imitate the web with these things anyways, as it will probably introduce limitations around how we can build the library.

[bczsalba]

I'll close this issue as CSS-based styling is no longer something I think is needed. In some upcoming version we will introduce a syntax similar to that of YAML which can be used to configure applications.

Something like:

markup:
  alias1: 141 bold
  alias2: 157 italic

rules:
  Container, Window:
     box: SINGLE

  Container, Window is_modal?:
     box: DOUBLE
     border_style, corner_style = "red"

This would then transpile into some JSON, like:

{
  "markup": {
    "alias1": "141 bold",
    "alias2": "157 italic"
  },
  "rules": [
    {
      "types": ["Container", "Window"],
      "attrs": [],
      "rules": [
        {
          "key": "box",
          "value": "SINGLE"
        }
      ]
    },
    {
      "types": ["Container", "Window"],
      "attrs": [
        {
          "key": "is_modal",
          "value": true
        }
      ],
      "rules": [
        {
          "key": "box",
          "value": "DOUBLE"
        },
        {
          "key": "border_style",
          "value": "red"
        },
        {
          "key": "corner_style",
          "value": "red"
        }
      ]
    }
  ]
}

From there, some widget-tree hierarchy object would take over and apply the configuration. Much of it is CSS/Web influenced, but IMO it is a cleaner (and more original) way to do things.