This is a HA inheritance example http://oop.tiddlyspot.com/#Simple%20Inheritance:%5B%5BSimple%20Inheritance%5D%5D%20%5B%5BAn%20Instance%20Inherits%20from%20btn-base%5D%5D
Simple Inheritance <http://oop.tiddlyspot.com/#>14th December 2019 at 10:58pm basic This example shows how simple a tiddler can inherits from another tiddler. Description A base object here is called btn-base <http://oop.tiddlyspot.com/#btn-base> implements css for a button. This tiddler is called the base class. btn-base <http://oop.tiddlyspot.com/#btn-base> .{{!!btn-class}} { background-color: {{!!btn-background}}; color: {{!!btn-color}}; text-align: center; text-decoration: none; display: inline-block; border: none; padding: 15px 32px; font-size: 16px; } It contains below fields btn-base <http://oop.tiddlyspot.com/#btn-base> btn-colorwhitebtn-classbtn-basebtn-background#4CAF50 Example Lets create a button using the button class implemented in btn-base <http://oop.tiddlyspot.com/#btn-base> copy to clipboard <$button class="btn-base" > Press me! </$button> That renders as: Press me! Refhttps://www.w3schools.com/css/css3_buttons.asp https://tiddlywiki.com/prerelease/#ButtonWidget An Instance Inherits from btn-base <http://oop.tiddlyspot.com/#>14th December 2019 at 11:15pm basic Here two new objects called btn-red <http://oop.tiddlyspot.com/#btn-red> and btn-blue <http://oop.tiddlyspot.com/#btn-blue> are created as bellow btn-red <http://oop.tiddlyspot.com/#btn-red> {{||btn-base}} It contains the below fields btn-red <http://oop.tiddlyspot.com/#btn-red> btn-colorwhitebtn-classbtn-redbtn-backgroundred As it is seen btn-red <http://oop.tiddlyspot.com/#btn-red> uses simple transclusion to inherit the CSS defined in the btn-base <http://oop.tiddlyspot.com/#btn-base> - it creates a new class (btn-red) - it uses its own new values for the same fields as defined in the base tiddler. Examples Use the new CSS class (objects) for styling new buttons. copy to clipboard <$button class="btn-red" > Press me! </$button> <$button class="btn-blue" > Press me! </$button> That renders as: Press me! Press me! Remarksall settings for new buttons are from btn-base <http://oop.tiddlyspot.com/#btn-base> - new object has its own class name - new object has its own properties value Refhttps://www.w3schools.com/css/css3_buttons.asp https://tiddlywiki.com/prerelease/#ButtonWidget -- 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/50d6cf3c-2646-4fc9-936e-d801b800a5e7%40googlegroups.com.
