design.tpl 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. <style scoped>
  2. .cards {
  3. margin: 30px 0 70px;
  4. }
  5. .card {
  6. background: #fbfcfd;
  7. height: 204px;
  8. text-align: center;
  9. img {
  10. margin: 40px auto 25px;
  11. width: 80px;
  12. height: 80px;
  13. }
  14. h4 {
  15. font-size: 18px;
  16. color: #1f2d3d;
  17. font-weight: normal;
  18. margin: 0;
  19. }
  20. span {
  21. font-size: 14px;
  22. color: #99a9bf;
  23. }
  24. }
  25. </style>
  26. <template>
  27. <div>
  28. <h2><%= 1 ></h2>
  29. <el-row :gutter="14" class="cards">
  30. <el-col :span="6">
  31. <div class="card">
  32. <img src="~examples/assets/images/consistency.png" alt="Consistency">
  33. <h4><%= 2 ></h4>
  34. <span><%= 3 ></span>
  35. </div>
  36. </el-col>
  37. <el-col :span="6">
  38. <div class="card">
  39. <img src="~examples/assets/images/feedback.png" alt="Feedback">
  40. <h4><%= 4 ></h4>
  41. <span><%= 5 ></span>
  42. </div>
  43. </el-col>
  44. <el-col :span="6">
  45. <div class="card">
  46. <img src="~examples/assets/images/efficiency.png" alt="Efficiency">
  47. <h4><%= 6 ></h4>
  48. <span><%= 7 ></span>
  49. </div>
  50. </el-col>
  51. <el-col :span="6">
  52. <div class="card">
  53. <img src="~examples/assets/images/controllability.png" alt="Controllability">
  54. <h4><%= 8 ></h4>
  55. <span><%= 9 ></span>
  56. </ul>
  57. </el-col>
  58. </el-row>
  59. <h3><%= 10 ></h3>
  60. <ul>
  61. <li><strong><%= 11 ></strong><%= 12 ></li>
  62. <li><strong><%= 13 ></strong><%= 14 ></li>
  63. </ul>
  64. <h3><%= 15 ></h3>
  65. <ul>
  66. <li><strong><%= 16 ></strong><%= 17 ></li>
  67. <li><strong><%= 18 ></strong><%= 19 ></li>
  68. </ul>
  69. <h3><%= 20 ></h3>
  70. <ul>
  71. <li><strong><%= 21 ></strong><%= 22 ></li>
  72. <li><strong><%= 23 ></strong><%= 24 ></li>
  73. <li><strong><%= 25 ></strong><%= 26 ></li>
  74. </ul>
  75. <h3><%= 27 ></h3>
  76. <ul>
  77. <li><strong><%= 28 ></strong><%= 29 ></li>
  78. <li><strong><%= 30 ></strong><%= 31 ></li>
  79. </ul>
  80. </div>
  81. </template>