preview.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. import React from "react"
  2. import Avatar from "misago/components/avatar"
  3. import * as random from "misago/utils/random"
  4. export default function () {
  5. return (
  6. <ul className="posts-list post-feed ui-preview">
  7. <li className="post">
  8. <div className="panel panel-default panel-post">
  9. <div className="panel-body">
  10. <div className="panel-content">
  11. <div className="post-side post-side-anonymous">
  12. <div className="media">
  13. <div className="media-left">
  14. <span>
  15. <Avatar className="poster-avatar" size={50} />
  16. </span>
  17. </div>
  18. <div className="media-body">
  19. <div className="media-heading">
  20. <span className="item-title">
  21. <span
  22. className="ui-preview-text"
  23. style={{ width: random.int(30, 200) + "px" }}
  24. >
  25. &nbsp;
  26. </span>
  27. </span>
  28. </div>
  29. <span className="user-title user-title-anonymous">
  30. <span
  31. className="ui-preview-text"
  32. style={{ width: random.int(30, 200) + "px" }}
  33. >
  34. &nbsp;
  35. </span>
  36. </span>
  37. </div>
  38. </div>
  39. </div>
  40. <div className="post-heading">
  41. <span
  42. className="ui-preview-text"
  43. style={{ width: random.int(30, 200) + "px" }}
  44. >
  45. &nbsp;
  46. </span>
  47. </div>
  48. <div className="post-body">
  49. <article className="misago-markup">
  50. <p>
  51. <span
  52. className="ui-preview-text"
  53. style={{ width: random.int(30, 200) + "px" }}
  54. >
  55. &nbsp;
  56. </span>
  57. &nbsp;
  58. <span
  59. className="ui-preview-text"
  60. style={{ width: random.int(30, 200) + "px" }}
  61. >
  62. &nbsp;
  63. </span>
  64. &nbsp;
  65. <span
  66. className="ui-preview-text"
  67. style={{ width: random.int(30, 200) + "px" }}
  68. >
  69. &nbsp;
  70. </span>
  71. </p>
  72. </article>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. </li>
  78. </ul>
  79. )
  80. }