timeline.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>H+ 后台主题UI框架 - 时间轴</title>
  7. <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
  8. <meta name="description" content="H+是一个完全响应式,基于Bootstrap3最新版本开发的扁平化主题,她采用了主流的左右两栏式布局,使用了Html5+CSS3等现代技术">
  9. <link rel="shortcut icon" href="favicon.ico"> <link href="../css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
  10. <link href="../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
  11. <link href="../css/plugins/iCheck/custom.css" rel="stylesheet">
  12. <link href="../css/animate.min.css" rel="stylesheet">
  13. <link href="../css/style.min.css?v=4.1.0" rel="stylesheet">
  14. </head>
  15. <body class="gray-bg">
  16. <div class="wrapper wrapper-content">
  17. <div class="row animated fadeInRight">
  18. <div class="col-sm-12">
  19. <div class="ibox float-e-margins">
  20. <div class="ibox-title">
  21. <h5>基本</h5>
  22. <div class="ibox-tools">
  23. <a class="collapse-link">
  24. <i class="fa fa-chevron-up"></i>
  25. </a>
  26. <a class="dropdown-toggle" data-toggle="dropdown" href="timeline.html#">
  27. <i class="fa fa-wrench"></i>
  28. </a>
  29. <ul class="dropdown-menu dropdown-user">
  30. <li><a href="timeline.html#">选项1</a>
  31. </li>
  32. <li><a href="timeline.html#">选项2</a>
  33. </li>
  34. </ul>
  35. <a class="close-link">
  36. <i class="fa fa-times"></i>
  37. </a>
  38. </div>
  39. </div>
  40. <div class="ibox-content timeline">
  41. <div class="timeline-item">
  42. <div class="row">
  43. <div class="col-xs-3 date">
  44. <i class="fa fa-briefcase"></i> 6:00
  45. <br>
  46. <small class="text-navy">2 小时前</small>
  47. </div>
  48. <div class="col-xs-7 content no-top-border">
  49. <p class="m-b-xs"><strong>服务器已彻底崩溃</strong>
  50. </p>
  51. <p>还未检查出错误</p>
  52. <p><span data-diameter="40" class="updating-chart" style="display: none;">3,9,6,5,9,4,7,3,2,9,8,7,4,5,1,2,9,5,4,7,2,7,7,3,5,2,3,3,2,1,6,9,8,8,3,7,4</span>
  53. <svg class="peity" height="16" width="64">
  54. <polygon fill="#1ab394" points="0 15 0 10.5 1.7777777777777777 0.5 3.5555555555555554 5.5 5.333333333333333 7.166666666666666 7.111111111111111 0.5 8.88888888888889 8.833333333333332 10.666666666666666 3.833333333333332 12.444444444444443 10.5 14.222222222222221 12.166666666666666 16 0.5 17.77777777777778 2.166666666666666 19.555555555555554 3.833333333333332 21.333333333333332 8.833333333333332 23.11111111111111 7.166666666666666 24.888888888888886 13.833333333333334 26.666666666666664 12.166666666666666 28.444444444444443 0.5 30.22222222222222 7.166666666666666 32 8.833333333333332 33.77777777777778 3.833333333333332 35.55555555555556 12.166666666666666 37.33333333333333 3.833333333333332 39.11111111111111 3.833333333333332 40.888888888888886 10.5 42.666666666666664 7.166666666666666 44.44444444444444 12.166666666666666 46.22222222222222 10.5 48 10.5 49.77777777777777 12.166666666666666 51.55555555555555 13.833333333333334 53.33333333333333 5.5 55.11111111111111 0.5 56.888888888888886 2.166666666666666 58.666666666666664 2.166666666666666 60.44444444444444 10.5 62.22222222222222 3.833333333333332 64 8.833333333333332 64 15"></polygon>
  55. <polyline fill="transparent" points="0 10.5 1.7777777777777777 0.5 3.5555555555555554 5.5 5.333333333333333 7.166666666666666 7.111111111111111 0.5 8.88888888888889 8.833333333333332 10.666666666666666 3.833333333333332 12.444444444444443 10.5 14.222222222222221 12.166666666666666 16 0.5 17.77777777777778 2.166666666666666 19.555555555555554 3.833333333333332 21.333333333333332 8.833333333333332 23.11111111111111 7.166666666666666 24.888888888888886 13.833333333333334 26.666666666666664 12.166666666666666 28.444444444444443 0.5 30.22222222222222 7.166666666666666 32 8.833333333333332 33.77777777777778 3.833333333333332 35.55555555555556 12.166666666666666 37.33333333333333 3.833333333333332 39.11111111111111 3.833333333333332 40.888888888888886 10.5 42.666666666666664 7.166666666666666 44.44444444444444 12.166666666666666 46.22222222222222 10.5 48 10.5 49.77777777777777 12.166666666666666 51.55555555555555 13.833333333333334 53.33333333333333 5.5 55.11111111111111 0.5 56.888888888888886 2.166666666666666 58.666666666666664 2.166666666666666 60.44444444444444 10.5 62.22222222222222 3.833333333333332 64 8.833333333333332" stroke="#169c81" stroke-width="1" stroke-linecap="square"></polyline>
  56. </svg>
  57. </p>
  58. </div>
  59. </div>
  60. </div>
  61. <div class="timeline-item">
  62. <div class="row">
  63. <div class="col-xs-3 date">
  64. <i class="fa fa-file-text"></i> 7:00
  65. <br>
  66. <small class="text-navy">3小时前</small>
  67. </div>
  68. <div class="col-xs-7 content">
  69. <p class="m-b-xs"><strong>修复了0.5个bug</strong>
  70. </p>
  71. <p>重启服务</p>
  72. </div>
  73. </div>
  74. </div>
  75. <div class="timeline-item">
  76. <div class="row">
  77. <div class="col-xs-3 date">
  78. <i class="fa fa-coffee"></i> 8:00
  79. <br>
  80. </div>
  81. <div class="col-xs-7 content">
  82. <p class="m-b-xs"><strong>喝水、上厕所、做测试</strong>
  83. </p>
  84. <p>
  85. 喝了4杯水,上了3次厕所,控制台输出出2324个错误,神啊,带我走吧
  86. </p>
  87. </div>
  88. </div>
  89. </div>
  90. <div class="timeline-item">
  91. <div class="row">
  92. <div class="col-xs-3 date">
  93. <i class="fa fa-phone"></i> 11:00
  94. <br>
  95. <small class="text-navy">21小时前</small>
  96. </div>
  97. <div class="col-xs-7 content">
  98. <p class="m-b-xs"><strong>项目经理打电话来了</strong>
  99. </p>
  100. <p>
  101. TMD,项目经理居然还没有起床!!!
  102. </p>
  103. </div>
  104. </div>
  105. </div>
  106. <div class="timeline-item">
  107. <div class="row">
  108. <div class="col-xs-3 date">
  109. <i class="fa fa-user-md"></i> 09:00
  110. <br>
  111. <small>21小时前</small>
  112. </div>
  113. <div class="col-xs-7 content">
  114. <p class="m-b-xs"><strong>开会</strong>
  115. </p>
  116. <p>
  117. 开你妹的会,老子还有897894个bug没有修复
  118. </p>
  119. </div>
  120. </div>
  121. </div>
  122. <div class="timeline-item">
  123. <div class="row">
  124. <div class="col-xs-3 date">
  125. <i class="fa fa-comments"></i> 12:50
  126. <br>
  127. <small class="text-navy">讨论</small>
  128. </div>
  129. <div class="col-xs-7 content">
  130. <p class="m-b-xs"><strong>…………</strong>
  131. </p>
  132. <p>
  133. 又是操蛋的一天
  134. </p>
  135. </div>
  136. </div>
  137. </div>
  138. </div>
  139. </div>
  140. </div>
  141. </div>
  142. </div>
  143. <script src="../js/jquery.min.js?v=2.1.4"></script>
  144. <script src="../js/bootstrap.min.js?v=3.3.6"></script>
  145. <script src="../js/plugins/peity/jquery.peity.min.js"></script>
  146. <script src="../js/content.min.js?v=1.0.0"></script>
  147. <script src="../js/demo/peity-demo.min.js"></script>
  148. </body>
  149. </html>