h5.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. .tui-contact-info-h5 {
  2. padding: 0;
  3. overflow: hidden;
  4. &-header {
  5. background-color: #fff;
  6. padding: 10px !important;
  7. display: flex;
  8. flex-direction: row;
  9. &-title {
  10. flex: 1;
  11. text-align: center;
  12. font-weight: 500;
  13. font-size: 14px;
  14. margin-right: 30px;
  15. }
  16. }
  17. &-basic {
  18. padding: 10px !important;
  19. background: #fff;
  20. margin-top: 10px !important;
  21. display: flex;
  22. flex-direction: row-reverse;
  23. justify-content: left;
  24. border-bottom: none;
  25. &-text {
  26. &-name {
  27. font-size: 20px;
  28. padding-bottom: 1px;
  29. }
  30. &-other {
  31. font-size: 14px;
  32. padding: 3px 0;
  33. }
  34. }
  35. &-avatar {
  36. border-radius: 10px;
  37. margin-right: 10px;
  38. }
  39. }
  40. &-more {
  41. background: #fff;
  42. margin-top: 10px !important;
  43. overflow: hidden;
  44. padding: 0;
  45. &-item {
  46. width: 100%;
  47. box-sizing: border-box;
  48. overflow: hidden;
  49. padding: 10px !important;
  50. border-bottom: 1px solid #eee;
  51. &-label {
  52. color: #000;
  53. }
  54. &-content {
  55. overflow: hidden;
  56. color: #979797;
  57. display: flex;
  58. flex-direction: row;
  59. justify-content: flex-end;
  60. &-text {
  61. overflow: hidden;
  62. display: flex;
  63. flex-direction: row;
  64. &-data {
  65. flex: 1;
  66. overflow: hidden;
  67. text-overflow: ellipsis;
  68. white-space: nowrap;
  69. }
  70. }
  71. }
  72. }
  73. &-item:last-child {
  74. border-bottom: none;
  75. }
  76. }
  77. &-button {
  78. margin-top: 10px !important;
  79. display: flex;
  80. flex-direction: column;
  81. padding: 0;
  82. background-color: #fff;
  83. &-item {
  84. width: 100%;
  85. margin: 0;
  86. border: none;
  87. padding: 16px !important;
  88. font-size: 16px;
  89. border-bottom: 1px solid #eee;
  90. height: fit-content;
  91. &::after {
  92. border: none;
  93. }
  94. &-textarea {
  95. background-color: #f8f8f8;
  96. }
  97. }
  98. &-item:last-child {
  99. border-bottom: none;
  100. }
  101. .tui-contact-info-button-item-cancel {
  102. background-color: #fff;
  103. color: #e54545;
  104. }
  105. .tui-contact-info-button-item-submit {
  106. background-color: #fff;
  107. color: #006eff;
  108. }
  109. }
  110. }