app.wxss 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423
  1. /**app.wxss**/
  2. @import './common/style/weui.wxss';
  3. @import './common/style/lib.wxss';
  4. /* 主色系:#E02F2F */
  5. html, body, page {
  6. min-height: 100%;
  7. display: flex;
  8. flex-direction: column;
  9. /* background: #eee; */
  10. font-size: 30rpx;
  11. }
  12. .container {
  13. font-size: 30rpx;
  14. background: #fff;
  15. box-sizing: border-box;
  16. min-height: 100%;
  17. flex: 1;
  18. padding: 20rpx 44rpx 72rpx 44rpx; /* 其实是用了order-container的样式, 可能有必要全部配置, 所以使用这个样式 *//* background: #eee; */
  19. }
  20. .yuezhan-navigator{
  21. margin-top: 44rpx;
  22. }
  23. .fdkz-card {
  24. position: relative;
  25. width: 100%;
  26. overflow: hidden;
  27. margin-bottom: 74rpx;
  28. }
  29. .fdkz-card-img {
  30. height: 388rpx;
  31. border-radius: 15rpx;
  32. overflow: hidden;
  33. }
  34. .fdkz-card-info {
  35. background: #fff;
  36. }
  37. .fdkz-card-info-title {
  38. display: flex;
  39. align-items: center;
  40. margin-top: 40rpx;
  41. font-size: 36rpx;
  42. font-weight: bold;
  43. }
  44. .fdkz-card-info-date {
  45. display: flex;
  46. margin-top: 23rpx;
  47. color: #646464;
  48. font-size: 24rpx;
  49. }
  50. .fdkz-card-tag {
  51. line-height: 36rpx;
  52. position: absolute;
  53. height: 36rpx;
  54. /* background: rgba(244, 47, 47, 0.65); */
  55. background: #e02f2f;
  56. text-align: center;
  57. top: 24rpx;
  58. right: 24rpx;
  59. font-size: 20rpx;
  60. border-radius: 8rpx;
  61. font-weight: bold;
  62. padding: 0 16rpx;
  63. }
  64. .fdkz-card-tag-start{
  65. background: #3199ce;
  66. }
  67. .fdkz-card-tag-end{
  68. background: #666666;
  69. }
  70. .fdkz-card-tag_offline{
  71. background: #E02F2F;
  72. }
  73. .fdkz-card-tag_coming{
  74. background: #3199ce;
  75. }
  76. .fdkz-card-tag_finish{
  77. background: #E02F2F;
  78. }
  79. .fdkz-card-tag_offline .fdkz-card-tag-txt{
  80. color: #fff;
  81. }
  82. .fdkz-card-tag-txt {
  83. color: #fff;
  84. }
  85. .new-fdkz-card-tag{
  86. line-height: 36rpx;
  87. position: absolute;
  88. height: 36rpx;
  89. /* background: rgba(244, 47, 47, 0.65); */
  90. background: #e02f2f;
  91. text-align: center;
  92. top: 25rpx;
  93. right: 0rpx;
  94. font-size: 20rpx;
  95. border-radius: 18rpx 0 0 18rpx;
  96. font-weight: bold;
  97. padding: 0 16rpx;
  98. }
  99. .no-border {
  100. border: none;
  101. }
  102. .btn-primary {
  103. background: #e02f2f;
  104. width: 152rpx;
  105. height: 60rpx;
  106. line-height: 60rpx;
  107. color: #fff;
  108. text-align: center;
  109. }
  110. .btn-done {
  111. background: #d7d7d7;
  112. width: 152rpx;
  113. height: 60rpx;
  114. line-height: 60rpx;
  115. color: #999;
  116. text-align: center;
  117. }
  118. .search-bar {
  119. margin: 0 auto;
  120. position: relative;
  121. width: 100%;
  122. height: 130rpx;
  123. box-sizing: border-box;
  124. padding: 30rpx 0;
  125. }
  126. .search-input {
  127. flex: 1;
  128. border-radius: 4rpx;
  129. height: 70rpx;
  130. font-size: 24rpx;
  131. color: #000;
  132. }
  133. .search-input::-webkit-input-placeholder{
  134. color: #707070;
  135. }
  136. .fix-icon-search {
  137. color: #999;
  138. margin-right: 15rpx;
  139. }
  140. .icon-sousuo {
  141. font-size: 30rpx;
  142. color: #707070;
  143. }
  144. .navbar__slider {
  145. position: absolute;
  146. left: 0;
  147. bottom: 5rpx;
  148. text-align: center;
  149. transition: all 0.3s;
  150. display: block;
  151. }
  152. .navbar_slider-item {
  153. background-color: #e02f2f;
  154. height: 8rpx;
  155. width: 70%;
  156. margin: 0 auto;
  157. border-radius: 3px;
  158. }
  159. .nav-item_on {
  160. color: #e02f2f;
  161. transition: all 0.3s;
  162. border-radius: 3rpx;
  163. }
  164. .bottom-container {
  165. /* display: flex;
  166. flex-direction: column;
  167. flex: 1; */
  168. padding-bottom: 110rpx;
  169. }
  170. .bottom-area {
  171. /*
  172. flex: 1;
  173. margin: 20rpx -20rpx -20rpx; */
  174. display: flex;
  175. position: fixed;
  176. z-index: 9999;
  177. width: 100%;
  178. left: 0;
  179. bottom: 0;
  180. }
  181. .bottom-area__info {
  182. flex: 1;
  183. background: #e6e5e5;
  184. /* padding: 0 48rpx; */
  185. height: 100rpx;
  186. line-height: 100rpx;
  187. text-align: center;
  188. }
  189. .bottom-area__btn {
  190. flex: 1;
  191. color: #fff;
  192. background: #d22d2e;
  193. height: 100rpx;
  194. line-height: 100rpx;
  195. text-align: center;
  196. }
  197. .bottom-area__btn_default {
  198. background: #666;
  199. }
  200. .bottom-area__btn[disabled] {
  201. background: #8d8d8d;
  202. }
  203. .bottom-area__flex2 {
  204. flex: 2;
  205. }
  206. .bottom-area__btn + .bottom-area__btn {
  207. border-left: 1px solid #fff;
  208. }
  209. .weui-cell__ft_in-access_active:after {
  210. transform: rotate(135deg);
  211. transition: all 0.3s;
  212. }
  213. .weui-cell__ft_in-access:after {
  214. transition: transform 0.3s;
  215. }
  216. .icon-jiantou:before {
  217. transition: all 0.3s;
  218. }
  219. .icon-jiantou_active:before {
  220. transform: rotate(180deg);
  221. transition: transform 0.3s;
  222. }
  223. .noDataClass {
  224. text-align: center;
  225. margin-top: 30rpx;
  226. }
  227. .tips {
  228. color: #999;
  229. font-size: 32rpx;
  230. position: relative;
  231. }
  232. .fdkzImg {
  233. margin-left: 20rpx;
  234. width: 130rpx;
  235. display: inline-block;
  236. }
  237. .title-txt {
  238. overflow: hidden;
  239. text-overflow: ellipsis;
  240. white-space: nowrap;
  241. width: 100%;
  242. display: inline-block;
  243. }
  244. .comfirmDialog {
  245. position: fixed;
  246. width: 70%;
  247. height: 25%;
  248. top: 35%;
  249. margin: 0 15%;
  250. background: #fff;
  251. z-index: 99;
  252. border-radius: 10rpx;
  253. }
  254. .comfirmDialog_content {
  255. height: 100%;
  256. width: 100%;
  257. align-items: flex-end;
  258. font-size: 30rpx;
  259. text-align: center;
  260. }
  261. .comfirmDialog_content_tip {
  262. display: table;
  263. width: 100%;
  264. height: 70%;
  265. margin: auto 0;
  266. transition: all 0.3s linear;
  267. }
  268. .comfirmDialog_content_tip text {
  269. display: table-cell;
  270. vertical-align: middle;
  271. color: #999;
  272. padding: 0 40rpx;
  273. }
  274. .comfirm_btn {
  275. border: none;
  276. background: #fff;
  277. }
  278. .no_exhibitionImg {
  279. /* width: 300rpx; */
  280. height: 340rpx;
  281. width: 340rpx;
  282. margin: 60rpx 0;
  283. }
  284. .no_pavilionImg{
  285. height: 450rpx;
  286. width: 450rpx;
  287. }
  288. .locationBtn {
  289. display: inline-block;
  290. width: auto;
  291. margin-top: 20rpx;
  292. position: relative;
  293. left: -16rpx;
  294. }
  295. .exhibitionDetailName {
  296. font-size: 40rpx;
  297. width: 468rpx;
  298. overflow: hidden;
  299. text-overflow: ellipsis;
  300. /* white-space: nowrap; */
  301. }
  302. .date-txt {
  303. overflow: hidden;
  304. text-overflow: ellipsis;
  305. white-space: nowrap;
  306. flex: 1;
  307. display: block;
  308. }
  309. .nav_bar{
  310. display: flex;
  311. justify-content: space-between;
  312. align-items: center;
  313. border-bottom: 2rpx solid #eee;
  314. background: #fff;
  315. padding:0 30rpx;
  316. }
  317. .nav_bar_txt{
  318. border-left: 6rpx solid #000;
  319. padding-left:14rpx;
  320. display: inline-block;
  321. font-weight: bold;
  322. height: 34rpx;
  323. line-height:34rpx;
  324. /* font-size: 32rpx; */
  325. }
  326. .nav_bar_icon > .icon-search{
  327. font-size: 50rpx;
  328. opacity: 0;
  329. }
  330. .comment_style {
  331. width: 180rpx;
  332. height: 180rpx;
  333. text-align: center;
  334. justify-content: center;
  335. display: flex;
  336. flex-direction: column;
  337. background: #fff;
  338. box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.2);
  339. position: absolute;
  340. right: 30rpx;
  341. top: 360rpx;
  342. }
  343. .comment-img__item {
  344. width: 30rpx;
  345. height: 30rpx;
  346. }
  347. .comment-dec {
  348. color: #999;
  349. font-size: 24rpx;
  350. }
  351. .icon-zan_active{
  352. color: #e02f2f
  353. }
  354. component-search{
  355. width: 100%;
  356. }
  357. .componentList .wrapper{
  358. margin-bottom: 72rpx;
  359. }
  360. .componentList > component-list:last-child .wrapper{
  361. margin-bottom: 0;
  362. }