Tiddlywiki5: [IDEA] Split the vanilla theme into a base + vanilla theme

[NicolasPetton]

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

I'm quite new to Tiddlywiki, so I might be getting this wrong.

I've built my first theme, and by doing so I quickly realized that starting from scratch would require a huge amount of effort, so I did the natural thing and inherited my theme from vanilla.

Then problems and inconsistencies quickly arised, as many of the "Theme tweaks" and settings of Vanilla did not apply to my theme. Since it inherited it, those settings for Vanilla are still rendered in the control panel.

Describe the solution you'd like

It would be great to have a middle ground: A bare bones theme that Vanilla could inherit from, so that theme authors could start from a working minimal theme that is functional but doesn't have all the bells and whistles of Vanilla.

[Jermolene]

Hi @NicolasPetton that makes sense. I've been thinking about something similar for the new work with switchable layouts: to separate out the parts concerned with the page layout from the parts concerned with specific UI components. They'd both stay in the same plugin, but the layout styles would be scoped to a class on the body element.

In your case, we'd need a slightly different approach. Conceivably Vanilla could respect a global variable that disables the layout styles, and then your theme plugin could include that variable.

[pmario]

Did you have a look at the stylesheet order. It may be possible that your stylesheet is "higher" in the list, than it should be.

see: https://tiddlywiki.com/#%24%3A%2FControlPanel Info : Advanced : Stylesheets.

The lower in the list it is, the higher the priority. .. You can drag and drop the elements to sort them.

[NicolasPetton]

Mario Pietsch [e-mail] writes:

Did you have a look at the stylesheet order. It may be possible that
your stylesheet is "higher" in the list, than it should be.

Yes, I've seen that, it's really handy, but unfortunately it doesn't
solve the inconsistencies in the UI (I'm referring to the theme tweaks
tab in the control panel).

Nico

[pmario]

Hi Nico,
I think I don't understand your problem right. Vanilla is the basic theme. In TW the stylesheets are dynamically created.

eg: FontSize, which is part of the ControlPanel ThemeTweaks. is a tiddler named: $:/themes/tiddlywiki/vanilla/metrics/fontsize

You can use it in your CSS exactly in the way TW does it.

body.tc-body {
    font-size: {{$:/themes/tiddlywiki/vanilla/metrics/fontsize}};
    line-height: {{$:/themes/tiddlywiki/vanilla/metrics/lineheight}};
    word-wrap: break-word;
    <<custom-background-datauri>>
    color: <<colour foreground>>;
    background-color: <<colour page-background>>;
    fill: <<colour foreground>>;
}

The <<colour ...>> macros do a similar thing. They use the color palette setting. ... And so on.

If you open the "base" theme tiddler you'll see its huge.

snowwhite base is tiny, because it only redefines the differences. ...

[NicolasPetton]

@pmario I'm talking about the sidebar width, sidebar layout (fixed, fluid), sticky titles options that any theme based on Vanilla will inherit.

Also having a "base" theme that is just functional would make customizing much easier, instead of having to override all the styling in Vanilla.

[NicolasPetton]

snowwhite base is tiny, because it only redefines the differences. ...

But snowwhite is basically Vanilla with some tweaks, to that makes sense. If one wanted to make a theme radically different from Vanilla today, there are lots of overrides to do.

[pmario]

...If one wanted to make a theme radically different from Vanilla today, there are lots of overrides to do.

OK ... That's right

[pmario]

:) The basic problem here is, that the TW themes have grown over time and got more and more sophisticated (complicated). But without the theme as it is atm, we wouldn't be able to see the problems.

Now that we know, what we need and know the problems, imo it's possible to work out a new system with the big picture mind.

The TW core js creates a lot of "internal classes" eg: tc-reveal, which imo is completely useless for styling, since they are scattered all over the places.

There are several more classes like this one, which only make the DOM heavier and can't be used for themes. ...

In the early days imo they have been vital for debugging, since having a look at the DOM one can see, how the underlying UI code looks like.

As you wrote,

I've built my first theme, and by doing so I quickly realized that starting from scratch would require a huge amount of effort, so I did the natural thing and inherited my theme from vanilla.

I think splitting it up and simplify the base theme, will also need to adjust the core js code. ... So it will be a huge amount of effort. .. I do think we can't avoid it.