Updated: Bricks CSS Studio for TW 5.1.22

[Thomas Elmiger]

Hi folks,

A first solution of mine is updated to TW 5.1.22: https://tid.li/tw5/apps/bricks.html – an attempt to help designers as well as amateurs like me to re-style TiddlyWiki based on measures borrowed from Tachyons (only the measures, not the classes though). If you are a designer and have a lot of time, take a look ;–)

Besides taking into account a few CSS additions and improvements form TW Vanilla CSS, not much happend. What I remember:

* Bricks was often called a plugin but it is not a plugin. So I removed the misleading word from all tiddler names and call it an app now.

* It is published under /apps now instead of /test, the old address is redirected. It is still an ongoing experiment.

Let me know if you find any bugs and I will try to fix them.

All the best,

Thomas

[Tony K]

Thanks Tomas looking great ☺

[Joshua Fontany]

I have had investigating TW CSS Bricks on my todo for quite a while. Thank for the timely bump. :)

Best,
Joshua Fontany

[JWHoneycutt]

Hi Thomas, 

Do you know of a very simple example / use case / generator output of Bricks I can see to emulate?

[Thomas Elmiger]

Good question!

Do you know of a very simple example / use case / generator output of Bricks I can see to emulate?

My own use cases and results are the two themes I published on https://tid.li/tw5/themes.html (not yet updated).  

Another good starting exercise could be to save your own copy of Bricks, deactivate/delete unwanted plugins and try to remove/de as many stylesheets as possible so you can actually see what you really need for your wiki. Hint: You might want to try other colour palettes too.

Last suggestion: set ALL stylesheets to inactive and re-activate one by one to see what they do. Warning: I would not say this is a simple example of usage, you can spend hours and days with Bricks.

Does that answer the question?

Cheers,

Thomas

[Thomas Elmiger]

Hi folks,

After a bit of housekeeping, https://tid.li/tw5/apps/bricks.html now looks more like the original TiddlyWiki – I hope, that makes it easier to relate to for starters.

I also added a bit to the how-to documentation.

The other version which is the foundation of my Navigator theme ist still around and available as https://tid.li/tw5/apps/bricks-005.html

All the best,

Thomas

[Petruschka]

Thank you for this great css construction set for TW!

[TiddlyTweeter]

Ciao Tutti & Thomas

As a long term user of Bricks I want to comment thus ...

CLEAR UPSIDES

1 - It gives insight into TW CSS by providing a way to "chunk" the style-sheet semantically that becomes very useful.

2 - It provides a clear, logical, method for completely replacing "Vanilla"...... This is easier in the end than partial rewrites to take visual control of TW.

3 - It is not particularly important it is inspired by the Tachyons framework. That is a conceptual aid only.

  

SEMI-DOWNSIDES

 

Documentation of TW dynamic assignment of CSS might need better documentation.

OVERALL

Thomas' approach is radical and very useful IF you want to have optimal CSS understanding for TW.

Through it you can both Make & Learn. 

Best wishes

TT 

[Thomas Elmiger]

Thank you, TT!

3 - It is not particularly important it is inspired by the Tachyons framework. That is a conceptual aid only.

It is important to mention, because it adds an additional layer of complexity until you understand, what the many variables do.

On the other hand it reduces complexity: If you always use the same variables adhering to a design system, you can be pretty sure that you use consistent spacing, sizes etc. And if you want to change e.g. font sizes you will have do do that in one single place/tiddler only, where the variables are defined.

Happy styling,

Thomas