Lungo.Attributes.coffee 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. ###
  2. Object with data-attributes (HTML5) with a special <markup>
  3. @namespace Lungo
  4. @class Attributes
  5. @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
  6. @author Guillermo Pascual <pasku@tapquo.com> || @pasku1
  7. ###
  8. Lungo.Attributes =
  9. count:
  10. selector: "*"
  11. html: "<span class=\"tag theme count\">{{value}}</span>"
  12. pull:
  13. selector: "section"
  14. html: """
  15. <div class=\"{{value}}\" data-control=\"pull\" data-icon=\"down\" data-loading=\"black\">
  16. <strong>title</strong>
  17. </div>"""
  18. progress:
  19. selector: "*"
  20. html: """
  21. <div class=\"progress\">
  22. <span class=\"bar\"><span class=\"value\" style=\"width:{{value}};\"></span></span>
  23. </div>"""
  24. label:
  25. selector: "*"
  26. html: "<abbr>{{value}}</abbr>"
  27. icon:
  28. selector: "*"
  29. html: "<span class=\"icon {{value}}\"></span>"
  30. image:
  31. selector: "*"
  32. html: "<img src=\"{{value}}\" class=\"icon\" />"
  33. title:
  34. selector: "header"
  35. html: "<span class=\"title centered\">{{value}}</span>"
  36. loading:
  37. selector: "*"
  38. html: """
  39. <div class=\"loading {{value}}\">
  40. <span class=\"top\"></span>
  41. <span class=\"right\"></span>
  42. <span class=\"bottom\"></span>
  43. <span class=\"left\"></span>
  44. </div>"""
  45. back:
  46. selector: "header"
  47. html: "<nav class=\"left\"><a href=\"#back\" data-router=\"section\" class=\"left\"><span class=\"icon {{value}}\"></span></a></nav>"