Theming with css

[rdbende]

Theming with css in Tukaan

app.theme = CssTheme(Path("./themes/sun-valley.css"))

sun-valley.css :

@source('./images/light');  /* Specify the image resource path */
@parent('clam');  /* Set parent theme (default is clam) */


$bg-color: #fafafa;
$fg-color: #202020;
$disabled-color: #a0a0a0;
$select-color: #ffffff;
$select-bg-color: #2f60d8;


* {
    /* Global settings */
    font-family: 'Segoe UI', sans;
    font-size: 10px;
    background: $bg-color;
    color: $fg-color;
    field-background: $bg-color;
}

*:focus {
    color: $select-bg-color;
}

*:disabled {
    color: $disabled-color;
}

*::caret {
    /* Global caret-styling */
    width: 1px;
    color: $fg-color;
}

*::selection {
    /* Global selection colors */
    background: $select-bg-color;
    color: $select-color;
}

button,
button:selected {
    image: $button-rest;  /* Use a loaded image for the widget */
    border: 4px;  /* How much to crop them image when stretching */
    padding: 8px 4px;  /* Padding inside the widget */
    anchor: center;
    sticky: nsew;
}

button:hover {
    image: $button-hover;
    color: #1a1a1a;
}

button:pressed {
    image: $button-pressed;
    color: #636363;
}

button:disabled,
button:selected:disabled {
    image: $button-disabled;
    color: #a2a2a2;
}

[sumeshir26]

Maybe add this to the docs?

[rdbende]

Maybe add this to the docs?

Yeah, I'll add it as soon as this feature is finished (currently it only parses the css file, but doesn't generate a Tcl theme script from it).
Actually I started writing the theming section in the docs several times, but haven't finished it yet.

[Moosems]

We want to add this?

[rdbende]

Will add it! I'm in the process of writing a comprehensive tutorial on theming, and that will include CSS stuff.

[Moosems]

Sounds great!

[athrvvvv]

looks good

[rdbende]

No it doesn't

[rdbende]

It's at most a tenth of what it should be.

[athrvvvv]

bruhhh

[rdbende]

This isn't even a complete CSS parser.