Lungo.Attributes.Data.js 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. /**
  2. * Object with data-attributes (HTML5) with a special <markup>
  3. *
  4. * @namespace LUNGO.Attributes
  5. * @class Data
  6. *
  7. * @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
  8. * @author Guillermo Pascual <pasku@tapquo.com> || @pasku1
  9. */
  10. LUNGO.Attributes.Data = {
  11. Search: {
  12. tag: 'search',
  13. selector: '.list',
  14. html: '<li class="search {{value}}"><input type="search" placeholder="Search..."><a href="#" class="button" data-icon="search"></a></li>'
  15. },
  16. Count: {
  17. tag: 'count',
  18. selector: '*',
  19. html: '<span class="bubble count">{{value}}</span>'
  20. },
  21. Search: {
  22. tag: 'search',
  23. selector: '*',
  24. html: '<input type="search" placeholder="{{value}}"/><a href="#" class="button" data-icon="search"></a>'
  25. },
  26. Progress: {
  27. tag: 'progress',
  28. selector: '*',
  29. html: '<div class="progress" id="yeal">\
  30. <span class="labels"><span></span><span></span></span>\
  31. <span class="bar"><span class="value" style="width:{{value}};"><span class="glow"></span></span></span>\
  32. </div>'
  33. },
  34. Label: {
  35. tag: 'label',
  36. selector: 'a',
  37. html: '<abbr>{{value}}</abbr>'
  38. },
  39. Icon: {
  40. tag: 'icon',
  41. selector: '*',
  42. html: '<span class="icon {{value}}"></span>'
  43. },
  44. Image: {
  45. tag: 'image',
  46. selector: '*',
  47. html: '<img src="{{value}}" class="icon" />'
  48. },
  49. Title: {
  50. tag: 'title',
  51. selector: 'header, footer, article',
  52. html: '<span class="title">{{value}}</span>'
  53. },
  54. Back: {
  55. tag: 'back',
  56. selector: 'header, footer',
  57. html: '<a href="#back" data-target="section" class="onleft button default"><span class="icon {{value}}"></span></a>'
  58. }
  59. };