homepage.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <div class="row row-deck row-cards">
  2. <div class="col-sm-6 col-lg-3">
  3. {% include cards/charts/sales.html %}
  4. </div>
  5. <div class="col-sm-6 col-lg-3">
  6. {% include cards/charts/revenue.html %}
  7. </div>
  8. <div class="col-sm-6 col-lg-3">
  9. {% include cards/charts/new-clients.html %}
  10. </div>
  11. <div class="col-sm-6 col-lg-3">
  12. {% include cards/charts/active-users.html %}
  13. </div>
  14. <div class="col-12">
  15. <div class="row row-cards">
  16. <div class="col-sm-6 col-lg-3">
  17. {% include cards/small-stats.html color="primary" icon="currency-dollar" title="132 Sales" description="12 waiting payments" %}
  18. </div>
  19. <div class="col-sm-6 col-lg-3">
  20. {% include cards/small-stats.html color="green" icon="shopping-cart" title="78 Orders" description="32 shipped" %}
  21. </div>
  22. <div class="col-sm-6 col-lg-3">
  23. {% include cards/small-stats.html icon="brand-twitter" color="twitter" title="623 Shares" description="16 today" %}
  24. </div>
  25. <div class="col-sm-6 col-lg-3">
  26. {% include cards/small-stats.html icon="brand-facebook" color="facebook" title="132 Likes" description="21 today" %}
  27. </div>
  28. </div>
  29. </div>
  30. <div class="col-lg-6">
  31. <div class="card">
  32. <div class="card-body">
  33. <h3 class="card-title">Traffic summary</h3>
  34. {% include ui/chart.html chart-id="mentions" size="lg" legend=true %}
  35. </div>
  36. </div>
  37. </div>
  38. <div class="col-lg-6">
  39. {% include cards/map-vector.html title="Locations" %}
  40. </div>
  41. {% comment %}
  42. <div class="col-lg-6">
  43. <div class="row row-cards">
  44. <div class="col-12">
  45. </div>
  46. <div class="col-sm-4">
  47. {% include cards/small-stats-3.html number=43 title="New Tickets" percentage=6 %}
  48. </div>
  49. <div class="col-sm-4">
  50. {% include cards/small-stats-3.html number=95 number-prefix="$" title="Daily Earnings" percentage=-2 %}
  51. </div>
  52. <div class="col-sm-4">
  53. {% include cards/small-stats-3.html number=7 title="New Replies" percentage=9 %}
  54. </div>
  55. </div>
  56. </div>
  57. {% endcomment %}
  58. <div class="col-lg-6">
  59. <div class="row row-cards">
  60. <div class="col-12">
  61. <div class="card">
  62. <div class="card-body">
  63. <p class="mb-3">Using Storage <strong>6854.45 MB </strong>of 8 GB</p>
  64. <div class="progress progress-separated mb-3">
  65. <div class="progress-bar bg-primary" role="progressbar" style="width: 44%" aria-label="Regular"></div>
  66. <div class="progress-bar bg-info" role="progressbar" style="width: 19%" aria-label="System"></div>
  67. <div class="progress-bar bg-success" role="progressbar" style="width: 9%" aria-label="Shared"></div>
  68. </div>
  69. <div class="row">
  70. <div class="col-auto d-flex align-items-center pe-2">
  71. <span class="legend me-2 bg-primary"></span>
  72. <span>Regular</span>
  73. <span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">915MB</span>
  74. </div>
  75. <div class="col-auto d-flex align-items-center px-2">
  76. <span class="legend me-2 bg-info"></span>
  77. <span>System</span>
  78. <span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">415MB</span>
  79. </div>
  80. <div class="col-auto d-flex align-items-center px-2">
  81. <span class="legend me-2 bg-success"></span>
  82. <span>Shared</span>
  83. <span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">201MB</span>
  84. </div>
  85. <div class="col-auto d-flex align-items-center ps-2">
  86. <span class="legend me-2"></span>
  87. <span>Free</span>
  88. <span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">612MB</span>
  89. </div>
  90. </div>
  91. </div>
  92. </div>
  93. </div>
  94. <div class="col-12">
  95. {% include cards/activity.html %}
  96. </div>
  97. </div>
  98. </div>
  99. <div class="col-lg-6">
  100. {% include cards/development-activity.html %}
  101. </div>
  102. <div class="col-12">
  103. {% include cards/icons-banner.html %}
  104. </div>
  105. <div class="col-md-12 col-lg-8">
  106. {% include cards/most-visited-pages.html %}
  107. </div>
  108. <div class="col-md-6 col-lg-4">
  109. {% include cards/sponsor.html %}
  110. </div>
  111. <div class="col-md-6 col-lg-4">
  112. {% include cards/social-traffic.html %}
  113. </div>
  114. <div class="col-md-12 col-lg-8">
  115. {% include cards/tasks.html %}
  116. </div>
  117. <div class="col-12">
  118. {% include cards/invoices.html %}
  119. </div>
  120. </div>