Introduction to Bootstrap: Difference between revisions
| Line 10: | Line 10: | ||
=== Badges === | === Badges === | ||
Most controls support Badges, which are a label with some additional information. Here is a Button with a Badge: | |||
[[File:Bsbadge.png|thumbnail]] | |||
Values of Badges can be set at design time or runtime: | |||
<pre> | |||
Button1.badge = "Best Choice!" | |||
</pre> | |||
To delete a badge, set its value to an empty string: | |||
<pre> | |||
Button1.badge = "" | |||
</pre> | |||
=== Children === | === Children === | ||
Revision as of 20:38, 30 May 2016
Bootstrap describes itself as "the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.'
It is a free and open-source front-end library for creating websites and web applications. It contains HTML- and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. It aims to ease the development of dynamic websites and web applications. Originally developed at Twitter as an internal tool, it was released as an open source project in August, 2011. Bootstrap is the second most-starred project on GitHub, with over 95 thousand stars and more than 40 thousand forks.
Installation
No installation is required. AppStudio installs everything needed, both for development and at deploy time.
Features
Badges
Most controls support Badges, which are a label with some additional information. Here is a Button with a Badge:
Values of Badges can be set at design time or runtime:
Button1.badge = "Best Choice!"
To delete a badge, set its value to an empty string:
Button1.badge = ""
Children
Popovers
Themes
Bootstrap comes with 17 themes built into AppStudio. There is one theme per app: all controls use that theme. The BootstrapTheme is set in Project Properties.
If you change the theme of a project, the change will go into effect in the Design Screen next time it is reloaded.
Visual Effects
Collapse
Each Bootstrap control has a collapse function. This toggles the control between visible and invisible. The position of other controls is automatically adjusted.
Panel1.collapse()