circle.css 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289
  1. .liked{
  2. /* display: inline-block; */
  3. position: relative;
  4. margin-right: 10upx;
  5. width: 34upx;
  6. height: 34upx;
  7. }
  8. .post-username{
  9. font-size:32upx;
  10. font-weight: 600;
  11. color: #36648B;
  12. }
  13. .gallery_img {
  14. width: 100%;
  15. height: 100%
  16. }
  17. .header {
  18. width: 250upx;
  19. height: 250upx;
  20. z-index: 10;
  21. border-radius: 40upx;
  22. }
  23. .publish {
  24. position: absolute;
  25. top: 20upx;
  26. right: 20upx;
  27. /* z-index: 9999; */
  28. }
  29. .post_header {
  30. width: 85upx !important;
  31. height: 85upx !important;
  32. border-radius: 10upx;
  33. margin-top: 8upx;
  34. }
  35. .uni-loadmore{
  36. display: block;
  37. width: 100vw;
  38. text-align: center;
  39. font-size: 24upx;
  40. line-height: 40upx;
  41. margin-top: 10upx;
  42. }
  43. #moments {
  44. background: #fff;
  45. }
  46. #moments .home-pic {
  47. width: 100%;
  48. /* margin-top: -150upx; */
  49. position: relative;
  50. height: 500upx;
  51. z-index: 5;
  52. margin-bottom: 50upx
  53. }
  54. #moments .home-pic-base {
  55. position: absolute;
  56. left: -60upx;
  57. bottom: -60upx;
  58. width: 100%;
  59. height: 160upx;
  60. padding: 0 15upx;
  61. }
  62. #moments .home-pic-base .top-pic {
  63. width: 250upx;
  64. height:250upx;
  65. border-radius: 40upx;
  66. -webkit-transform: scale(0.5);
  67. -ms-transform: scale(0.5);
  68. transform: scale(0.5);
  69. -webkit-transform-origin: 100% 0%;
  70. -ms-transform-origin: 100% 0%;
  71. transform-origin: 100% 0%;
  72. background-color: #ffffff;
  73. float: right
  74. }
  75. #moments .home-pic-base .top-name {
  76. position: absolute;
  77. /* left: 20px; */
  78. right: 160upx;
  79. top: 30upx;
  80. font-size: 32upx;
  81. font-weight: 600;
  82. text-align: right;
  83. color: #ffffff;
  84. overflow: hidden
  85. }
  86. #moments .moments__post1{
  87. border-bottom: 1px solid #f2eeee;
  88. padding: 0px;
  89. position: relative;
  90. }
  91. #moments .moments__post {
  92. background: #fff;
  93. display: block;
  94. padding: 10upx 20upx;
  95. position: relative;
  96. display: -webkit-box;
  97. display: -webkit-flex;
  98. display: flex;
  99. clear:both
  100. }
  101. .loadmore{
  102. height: 40px;
  103. line-height: 40px;
  104. text-align: center;
  105. color: #666;
  106. font-size: 14px;
  107. }
  108. #moments .moments__post1 .post-info{
  109. position: absolute;
  110. right:15upx;
  111. top:20upx;
  112. width: 140upx;
  113. height: 140upx;
  114. background-color: #EEEEEE;
  115. border-radius: 10upx;
  116. display: table;
  117. font-size: 20upx;
  118. vertical-align: middle;
  119. line-height: 120upx;
  120. text-align: center;
  121. }
  122. #moments .moments__post1 .post-info .text{
  123. display: inline-block;
  124. width: 120upx;
  125. max-height: 120upx;
  126. line-height: 32upx;
  127. padding: 10upx 10upx;vertical-align: middle;text-align: center;
  128. text-overflow: -o-ellipsis-lastline;
  129. overflow: hidden;
  130. text-overflow: ellipsis;
  131. -webkit-line-clamp: 4;
  132. line-clamp: 4;
  133. -webkit-box-orient: vertical;
  134. }
  135. #moments .moments__post::before {
  136. content: none
  137. }
  138. #moments .moments__post .post_right {
  139. font-size: 32upx;
  140. display: table-cell;
  141. padding-left: 20upx;
  142. width: 100%;
  143. }
  144. /* #moments .moments__post .post_right .paragraphExtender {
  145. margin: 5px auto;
  146. display: -webkit-box;
  147. display: -webkit-flex;
  148. display: -ms-flexbox;
  149. display: flex
  150. } */
  151. #moments .moments__post .title {
  152. color: #094dcc
  153. }
  154. #moments .moments__post .thumbnails {
  155. width: 100%;
  156. display: flex;
  157. flex-wrap: wrap;
  158. /* display: -webkit-box;
  159. display: -webkit-flex;
  160. display: -ms-flexbox; */
  161. /* -webkit-flex-wrap: wrap;
  162. -ms-flex-wrap: wrap; */
  163. }
  164. #moments .moments__post .thumbnails .thumbnail {
  165. width: 30%;
  166. height: 180upx;
  167. margin: 4upx;
  168. background: #757575;
  169. overflow: hidden;
  170. }
  171. .my-gallery{
  172. width: 250upx;
  173. height: 250upx;
  174. margin: 4upx;
  175. background: #757575;
  176. overflow: hidden
  177. }
  178. #moments .moments__post .toolbar {
  179. position: relative;
  180. top: 10upx;
  181. display: -webkit-box;
  182. display: -webkit-flex;
  183. display: -ms-flexbox;
  184. display: flex;
  185. -webkit-box-align: center;
  186. -webkit-align-items: center;
  187. -ms-flex-align: center;
  188. align-items: center
  189. }
  190. #moments .moments__post .toolbar .timestamp {
  191. color: #757575;
  192. font-size: 22upx;
  193. }
  194. #moments .moments__post .like {
  195. width: auto;
  196. height: auto;
  197. position: absolute;
  198. right: 70upx;
  199. display: flex;
  200. align-items: center;
  201. }
  202. #moments .moments__post .comment {
  203. width: auto;
  204. height: auto;
  205. position: absolute;
  206. right: 10upx;
  207. display: flex;
  208. align-items: center;
  209. }
  210. #moments .moments__post .toolbar image{
  211. padding-left: 20upx;
  212. width: 30upx;
  213. height: 30upx;
  214. }
  215. .post-footer{
  216. margin-top: 30upx;
  217. background-color: #f3f3f5;
  218. width: 100%;
  219. }
  220. #moments .moments__post .footer_content {
  221. padding-left: 10upx;
  222. position: relative;
  223. display: -webkit-box;
  224. display: -webkit-flex;
  225. display: -ms-flexbox;
  226. display: flex;
  227. -webkit-box-align: center;
  228. -webkit-align-items: center;
  229. -ms-flex-align: center;
  230. align-items: center;
  231. -webkit-flex-wrap: wrap;
  232. -ms-flex-wrap: wrap;
  233. flex-wrap: wrap
  234. }
  235. #moments .moments__post .footer_content .nickname {
  236. color: #36648B;
  237. font-size: 24upx
  238. }
  239. #moments .moments__post .footer_content .comment-nickname {
  240. color: #36648B;
  241. font-size: 24upx
  242. }
  243. #moments .moments__post .footer_content .comment-content {
  244. color: #000000;
  245. font-size: 24upx
  246. }
  247. .foot {
  248. position: fixed;
  249. width: 100%;
  250. height: 90upx;
  251. min-height: 90upx;
  252. left: 0upx;
  253. bottom: 0upx;
  254. overflow: hidden;
  255. }