health-record-info.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. #wrapper{padding-top: 70px;}
  2. .h-tab{display: -webkit-flex; display: flex; flex-flow: row; position: absolute;left: 0;top: 0;right: 0;padding: 16px 10px;background: #f3f3f3;z-index: 10;}
  3. .h-tab li{height: 36px;line-height: 36px; flex: 1;text-align: center;font-size: 16px;background: #fff;overflow: hidden;border:1px solid #dcdcdc}
  4. .h-tab li:first-child{border-radius:6px 0 0 6px;border-right: none;}
  5. .h-tab li:last-child{border-radius:0 6px 6px 0;border-left: none;}
  6. .h-tab li.active{background: #75bf00;}
  7. .h-tab li.active a{color: #fff;}
  8. .h-tab li a{color: #323232;}
  9. /*.h-tab-con{background: #fff;border-top:1px solid #dcdcdc}*/
  10. .h-sel:nth-child(2n){border-top:1px solid #dcdcdc}
  11. .h-sel{padding-left: 10px;}
  12. .h-sel li{display: inline-block;width: 62px;margin: 10px 10px 10px 0;font-size: 14px;color: #909090;padding: 3px 0;text-align: center;}
  13. .h-sel li.active{background: #e3f2cc;border:1px solid #75bf00;-webkit-border-radius: 50px;border-radius: 50px;}
  14. .h-sta{display: -webkit-flex;display: flex;}
  15. .h-sta li{flex: 1;display:inline-block;font-size: 12px;text-align: center;padding: 20px 0;}
  16. .h-sta-normal{}
  17. .h-sta-hei{color: #ff6a56;}
  18. .h-sta-low{color: #47a8ef;}
  19. .h-sta-normal label,.h-sta-hei label,.h-sta-low label{position: relative;padding-left: 10px;}
  20. .h-sta-normal label:before,.h-sta-hei label:before,.h-sta-low label:before{content: ' ';display: block;width: 5px;height: 5px;background: #323232;position: absolute;left: 0;top:5px;-webkit-border-radius: 50%;border-radius: 50%;}
  21. .h-sta-normal label{}
  22. .h-sta-hei label:before{background: #ff6a56;}
  23. .h-sta-low label:before{background: #47a8ef;}
  24. .h-time{padding: 10px 0;text-align: center;font-size: 12px;}
  25. .h-list-info{background: #fff;}
  26. .h-list-info li{height:40px;line-height:40px;font-size: 14px;color: #323232;padding: 0 16px 0 10px;border-bottom:1px solid #dcdcdc;}
  27. .h-list-info li:first-child{border-top:1px solid #dcdcdc}
  28. .h-list-info li:last-child{border-bottom:none}
  29. .h-list-info:last-child{border-bottom:1px solid #dcdcdc}
  30. .icon-calendar{display: inline-block;width: 14px;height: 15px;background: url(../images/icon_shijian.png) center no-repeat;background-size: cover; vertical-align: middle;margin-right: 10px;}
  31. .h-l-t-time{vertical-align: middle;}
  32. .h-l-tit{font-size: 14px;color: #909090;}
  33. .h-l-time{width: 105px;font-size: 14px;float: left;}
  34. .h-l-meal{float: left;}
  35. .h-l-num{float: right;}
  36. .h-l-num.num-hei{color: #ff6a56;}
  37. .h-l-num.num-low{color: #47a8ef;}
  38. .l-edit-icon{display:none;width:21px;height:40px;float: left;background: url(../images/icon-shanchu-4.png) center no-repeat;background-size: contain;margin-right: 10px;}
  39. .l-edit-icon.active{display: block;}
  40. .xy-list{font-size: 14px;}
  41. .xy-list li{
  42. height: 40px;
  43. line-height: 40px;
  44. /*display: -webkit-flex;
  45. display: flex;
  46. flex-flow: row;*/
  47. display: box; /* OLD - Android 4.4- */
  48. display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  49. display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  50. display: -ms-flexbox; /* TWEENER - IE 10 */
  51. display: -webkit-flex; /* NEW - Chrome */
  52. display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
  53. /* 09版 */
  54. -webkit-box-orient: horizontal;
  55. /* 12版 */
  56. -webkit-flex-direction: row;
  57. -moz-flex-direction: row;
  58. -ms-flex-direction: row;
  59. -o-flex-direction: row;
  60. flex-direction: row;
  61. padding-left: 10px;
  62. }
  63. .xy-list-tit{font-size: 12px;}
  64. .xy-item{background: #fff;border-top: 1px solid #dcdcdc;}
  65. .xy-time{
  66. flex: 2;
  67. }
  68. .xy-ssy{
  69. /*flex: 1;*/
  70. -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */
  71. -moz-box-flex: 1; /* OLD - Firefox 19- */
  72. /*width: 20%; /* For old syntax, otherwise collapses. */
  73. -webkit-flex: 1; /* Chrome */
  74. -ms-flex: 1; /* IE 10 */
  75. flex: 1;
  76. text-align: center;
  77. }
  78. .xy-szy{
  79. /*flex: 1;*/
  80. -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */
  81. -moz-box-flex: 1; /* OLD - Firefox 19- */
  82. /*width: 20%; /* For old syntax, otherwise collapses. */
  83. -webkit-flex: 1; /* Chrome */
  84. -ms-flex: 1; /* IE 10 */
  85. flex: 1;
  86. text-align: center;
  87. }
  88. .xy-tit-time{padding-left: 20px;}
  89. .xy-ssy-hei{position:relative;color: #ff6a56;padding-right: 10px;}
  90. .xy-ssy-low{position:relative;color: #47a8ef;padding-right: 10px;}
  91. .xy-ssy-hei:after{content: ' ';display: block;width: 7px;height: 12px;position: absolute;right: 0px;top: 5px;background: url(../images/zhibiao_gao_icon.png) center no-repeat;background-size: cover;}
  92. .xy-ssy-low:after{content: ' ';display: block;width: 7px;height: 12px;position: absolute;right: 0px;top: 5px;background: url(../images/zhibiao_di_icon.png) center no-repeat;background-size: cover;}
  93. .btns{position: fixed;width: 100%;left: 0;bottom: 0;background: #f3f3f3;padding: 15px 0;overflow: hidden;z-index: 20;}
  94. .btns a{width:49%;display: block;padding: 5px 0;text-align: center;font-size: 16px;-webkit-border-radius:4px;border-radius: 4px;}
  95. .cancel-btn{background: #ff6a56;color: #fff;float: left;}
  96. .ok-btn{background: #75BF00;color: #fff;float: right;}
  97. body{
  98. padding-bottom: 60px;
  99. }