Twitter Bootstrap

Transcript

1. Bootstrap, from Twitter Simple and flexible HTML, CSS, and Javascript

   for popular user interface components and interactions. http://twitter.github.com/bootstrap/ @mdo & @fat

2. Boots what? It’s a trap bino! • Front-end Toolkit !

   • Criadores: @mdo, @fat [at] @twitter ! • Desenvolvimento rápido ! • Componentes “ready to use” ! • LESS

3. Features • Scaffolding ! • Base CSS ! • Components

   ! • Javascript plugins ! • Using LESS

4. Features/ Scaffolding Default grid system Fixed layout Fluid layout Responsive

   design 12 columns

5. Features/ Base CSS Typography Tables Forms Buttons & Icons

6. features/ Components Buttons, Navigation, Labels, Badges, Typography, Thumbnails, Alerts, Progress

   bars, Miscellaneous

7. Components/ Button groups

8. Components/ Navigation

9. Components/ Labels, Badges, Alerts Badges Labels Alerts

10. Components/ Typography, Thumbnails, Progress Bars

11. features/Javascript Plugins Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button,

    Collapse, Carousel, Typehead

12. Javascript Plugins/ Live =) http://twitter.github.com/bootstrap/javascript.html it moves like jagger!

13. LESS http://twitter.github.com/bootstrap/less.html

14. Gem’s, Plugins, Snippets, themes.. • https://github.com/seyhunak/twitter-bootstrap-rails ! • http://addyosmani.com/blog/jquery-ui-bootstrap/ !

    • http://wrapbootstrap.com/ ! • http://www.eyecon.ro/bootstrap-datepicker/ ! • http://bootswatch.com/ ! • LESS

15. Apps + Bootstrap http://builtwithbootstrap.com/

16. thanks! se vira nos 15min! http://github.com/djalmaaraujo @djalmaaraujo pianolab.com.br