How Can I Overwrite the Basic Theme: Vanilla?

Your post was interesting, and indicative, I think.

Trying to convert a vast system is likely prone to failure unless you are vast enough you can do it.

IMO the TW base CSS is good.

Regarding your “3 or 4 groups”, well sure so long as you have the hours to reorganise the Base, go for it …

TT

1 Like

Yes, we have a functional CSS but it is labyrinthine.

Yes, it is the reason for that I call it “top hardway”. But it will be more easy if we can do it in steps because there are many parts in each group, for example we have several templates (pagetemplate, viewtemplate, …) will be part of the layot.

If I may put this in a simple way, CSS is cascading, Overwriting a theme is what CSS does, piece by piece. Whilst we can and should answer the OT I do want understand the WHY?

  • It’s a bit like someone saying they want to Replace a big part of the genome of a species.
1 Like

The answer is: Absolutely I am not better! :sweat_smile:

I think that a very good question!

It is obvious from this thread, and other recent threads, there is dissatisfaction about “Vanilla Base”.

I, myself, in past, thought it rather monolithic too.

But I never felt it inadequate. More, a brilliant piece of work of huge complexity that works out-of-the-box.

IMO it is merely needing some help to understand it IF you need leverage it!


This thread has been interesting!

WHY is @Mohammad asking for a “wipe-down method” (a phrasal verb meaning “get rid of it”)?

Rather than “How can we help users make the best use of Vanilla?

A comment
TT

I’m glad you created this thread!

I do think it will help clarify what exactly the issue with “Vanilla” is that some users find difficult!

Best wishes
TT

Something that I think would be very helpful to keep css organized when creating a new theme :

It’s a pretty new feature but it is supported on all browsers.

any styles declared outside of a layer will override styles declared in a layer, regardless of specificity.

The default theme should be declared inside a named layer in order to easily override it.

2 Likes

Hi :slight_smile:

Although it is not a plugin :wink: it might offer some hints on how to handle CSS better than in endless stylesheets like the vanilla base. On the other hand it is not very useful anymore because the CSS is not up to date. While the TW core team is very careful regarding backwards compatibility of functionality, new versions sometimes come with new versions of styles and the underlying structure of HTML sometimes changes. So backwards compatibility for styles is not guaranteed and updates would be needed for new versions of TW. (A good reason to build your own layout and logic from scratch.)

In order to hack some design aspects without touching the core, I resorted to rather complicated CSS sometimes. Example: Apply this style to a button inside a div inside a span in the last div in the sidebar Open tab. – When the span was changed to a div in the core, that broke my CSS. (I am not sure it really happend this way, but I hope you will get the idea.)

So the principles from Bricks I still think would be useful for future TW versions and themes:

  • use lots of CSS tiddlers
    • almost every aspect of every element should get its own (everything is a tiddler)
    • performance should not suffer from many CSS tiddlers as far as I know
  • use tiddler titles and CSS comments instead of separate documentation
  • use CSS to show/hide elements wherever this seems reasonable
    • especially for development it can be useful to find stuff still in the code even if it is not visible
    • I think many reveal widgets in templates could be omitted this way – and sometimes reveal widgets lead to effects that make styling complicated
  • use the tag $:/tags/Stylesheet to let users apply CSS in a config interface (e.g. tiddler shadow)
    • this has a disadvantage: tiddlers might be changed and not updated when a plugin/theme is updated
  • a stylesheet manager – like Bricks has it – would be great to manage plenty of style tiddlers

Examples can be found in my Tix plugin that creates a new story river with a new tiddler layout:
https://tid.li/tw5/plugins.html#%24%3A%2Fplugins%2Ftelmiger%2FTix

My intention was to embed Tix in my own page layout and theme “Lox” later – but that project is on hold at the moment. I am afraid that it would consume too much time to implement a reasonable amount of TWs many features and options.

Cheers and good luck!
Thomas

6 Likes

Reading your “principles” amplifies the resonance that I perceived when I first encountered TIX. This is particularly true in conjunction with recent learning from incorporating Mohammad’s “SmartTabs” concepts from his “Thinkup” and “Mehregan” editions.

As a minimalist, I see these ideas as efforts to focus on designs that apply at the sub-tiddler level; something I think should be encouraged.

I just thought I would let you know of my interest, since I am finally approaching the peak/end of the four year work cycle that dominates my professional. Perhaps the extensive work needed for TIX can be spread across a pool of interested participants?

It’s finally time for me to become more involved in TiddlyWiki.

Best,
Hans

5 Likes

Thank you, Hans!

For myself I have other priorities at the moment, so if you or @Mohammad or someone else find time to lead a project for an alternative TW layout, feel free to steal, copy and adapt from Tix or any other development I have made for TiddlyWiki.

The first draft of the Lox page structure can be found here:
Lox v0.01 — Lay-out experience (version 0.01) – it’s not much, really.

Kind regards and all the best,
Thomas

2 Likes