index.less 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. .indexPage{
  2. position: relative;
  3. z-index: 1;
  4. background: #F5F5F5;
  5. min-height: calc(100vh - 52px);
  6. .list{
  7. padding: 20px 23px 52px 23px;
  8. .item{
  9. border-radius: 6px;
  10. padding: 31px;
  11. background: #FFFFFF;
  12. display: flex;
  13. flex-flow: row nowrap;
  14. margin-bottom: 17px;
  15. .infor{
  16. width: 100%;
  17. position: relative;
  18. .title{
  19. display: flex;
  20. flex-flow: row nowrap;
  21. justify-content: space-between;
  22. align-items: center;
  23. padding-bottom: 20px;
  24. .aname{
  25. flex: 1;
  26. padding-right: 20px;
  27. font-weight: bolder;
  28. }
  29. .createTimes{
  30. font-size: 20px;
  31. color: #999999;
  32. white-space: nowrap;
  33. }
  34. }
  35. .userName{
  36. font-size: 25px;
  37. color: #999999;
  38. padding-bottom: 15px;
  39. }
  40. .releaseStarts{
  41. font-size: 25px;
  42. color: #999999;
  43. padding-bottom: 15px;
  44. display: flex;
  45. flex-flow: row nowrap;
  46. align-items: center;
  47. justify-content: space-between;
  48. position: relative;
  49. .punchClock{
  50. position: absolute;
  51. border-bottom-left-radius: 100px;
  52. border-top-left-radius: 100px;
  53. padding: 20px 30px;
  54. background: #f1662f;
  55. color: white;
  56. display: flex;
  57. justify-content: center;
  58. align-items: center;
  59. right: -31px;
  60. top: -10px;
  61. }
  62. }
  63. .releaseEnds{
  64. font-size: 25px;
  65. color: #999999;
  66. display: flex;
  67. flex-flow: row nowrap;
  68. align-items: center;
  69. justify-content: space-between;
  70. padding-bottom: 25px;
  71. }
  72. .bottomContent{
  73. display: flex;
  74. flex-flow: row nowrap;
  75. justify-content: space-between;
  76. align-items: center;
  77. .status{
  78. font-size: 28px;
  79. }
  80. .clockIn{
  81. padding: 3px 8px;
  82. font-size: 28px;
  83. border-radius: 6px;
  84. }
  85. }
  86. }
  87. }
  88. }
  89. .skeleton {
  90. border-radius: 11px;
  91. margin-bottom: 20px;
  92. }
  93. }