TW and W3.CSS Framework

[Mohammad]

Announcement

I have added the w3.css framework to TW 5.1.18-prerelease to see how a css framework can be used inside TW.

A demo has been uploaded to tiddlyspot at

 http://w3css.tiddlyspot.com/

This is a proof of concept and the aim is to use elements inside Tiddlers not for making a new theme!

I appreciate to have your comments, opinion here on this!

Note: More than 160 examples has been provided. Most of them use the html tags but can be modified to use the TW markup as much as possible.

Best

Mohammad

[Pit.W.]

Mohammad,

this is a highly valuable resource, especially for people not so familiar with CSS, who learn through reverse engineering.

Much appreciated!

Pit.W

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/e27b6e52-eabf-47db-aef3-ac4113520307%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

_________________________________________________________________
________________________________________________________
Ihre E-Mail-Postfächer sicher & zentral an einem Ort. Jetzt wechseln und alte E-Mail-Adresse mitnehmen! https://www.eclipso.de

[JD]

Nice proof of concept! 

Though I haven't read much of W3.CSS framework itself, maybe you can experiment with applying the classes and id's to PageTemplate tiddlers? Although I imagine there'd be a lot of adjustments needed (regarding the state of the sidebar and how the story river would react to it, etc.)

-JD

edit: readability

[Julio Peña]

Hello Mohammad and all,

I was just researching that this morning. 

All I have to say is wow!

Good job Mohammad.

Best regards,

Julio

[Mohammad]

Dear Pit.W, JD, Julio,

 Thank you for your feedback. The purpose here to use ready-to-apply stylesheets without much digging into CSS.

As I said the purpose is to use these styles inside tiddlers like 

• ready to use colors (foreground / background)
• Google API fonts
• cards
• panels
• tags and badges
• note boxes
• colorful buttons
• customized lists
• ....

but as JD said, it is possible to use this framework through page template but it needs more works.

I appreciate to test and let me know your feedback.

/Mohammad

[HansWobbe]

Mohammad:

Quite impressive !!

Thank you very much for sharing this !

Regards,

Hans

[TonyM]

Mohammad

Thanks for promoting this, I have played with w3css in the past. It is a simple matter of creating a tiddler containing the w3css and tagging it as a stylesheet.

I have not yet implemented it too much but already I see macros as helpful

eg

\define signage(incontent) 
<div class="w3-tag w3-round w3-green" style="padding:3px">
 <div class="w3-tag w3-round w3-green w3-border w3-border-white"> 
    $incontent$ 
  </div> 
</div> 
\end

Usage

<<signage "Welcome to my world">>


<<signage "The end<br>is<br>near">>

I know as a community, we are perhaps not ready for it but It would be nice to build a set of macros  we can import to do "useful" things with w3css that also inspire.

Regards

Tony

[Mohammad]

Hans, Tony,

 Thank you for your feedback.

That is quite true! For end user it is much better to have some macros!

I hope I could have free time to wrap interesting and most common elements into macros.

Mohammad