.container { padding-bottom: 1rem; } .tabs{ display: flex; font-size:1.125rem; position:fixed; top:6rem; width: 100%; z-index:999; } .tab{ flex-grow:1; height:2.5rem; display:flex; align-items:center; justify-content:center; background:#f2f2f2; } .tab.active{ background:#ffffff; } .content-container { position: relative; overflow-y: scroll; } #problem-panel { display: none; } .fix-top { /* top: 5.34rem; */ width: 100%; background: white; position: absolute; /* z-index: 100; */ padding: 2rem; box-sizing: border-box; border-bottom:1px solid #d9d9d9 } .search-line { display: flex; justify-content: space-between; width: 100%; padding: 0 0.83rem; box-sizing: border-box; align-items: center; } .stackpanel-vertical { display: flex; flex-direction: column; overflow: scroll; } .pr-num-box { padding: 0.6rem 2rem; border-bottom: 1px solid #d9d9d9; text-align: center; } .pr-num-box .btn-normal { vertical-align: middle; } .pr-num { color: red; } .search-criteria { border: 1px solid #d9d9d9; border-radius: 0.25rem; height: 2.5rem; width: 23%; } .datetime-line { width: 70%; display: flex; justify-content: space-between; align-items: center; } .datetime { height: 2.5rem; line-height: 2.5rem; text-align: center; width: 6rem; } .center { display: flex; align-items: center; } .datetime { line-height: 2.5rem; text-align: center; } .underline-yellow { border-bottom: 1px solid #e9be2b } .img-drop-down { height: 1.2rem; width: 1.2rem; margin: 0 0.625rem 0 0; } .iptime-group { position: relative; } .iptime { position: absolute; top: 0; left: 0; width: 7.825rem; height: 2.5rem; opacity: 0; } .pr{ display:flex; padding:0.58rem; border-bottom: 1px solid #dad9da; flex-wrap:nowrap; font-size:1rem; } .pr .left{ display:flex; flex-grow:1; width:0; align-items: center; } .pr .left .content{ flex-grow:1; width: 80%; } .pr .pr-name-con{ display:flex; align-items:center; } .pr .pr-name-con img{ height:1.2rem; } .pr .pr-name{ font-size : 1.16rem; } .pr .icon-con{ flex-shrink:0; width:3rem; height:3rem; display:flex; border-radius:50%; justify-content:center; align-items:center; margin-right:1rem; font-size:1.25rem; background:#E9BE2B; } .pr .right{ display: flex; align-items: center; text-align: right; } .text-gray { color:#6d6d6d; } .text-red { color:#ff0000; } .text-yellow { color:#ff9c00; } .text-green { color:#03b679; } .icon-con img{ width:2rem; } body { overflow: auto; } #start-inspect-btn, #finish-inspect-btn { position: fixed; bottom: 0; width: 100%; height: 3rem; line-height: 3rem; font-size: 1.3rem; text-align: center; background-color: #e9be2b; display: none; } .inspect-type { color: #e9be2b; } .start-btn { width: 4rem; height: 2rem; line-height: 2rem; text-align: center; background-color: #E9BE2B; border-radius: 1rem; } .empty-tips { display: none; margin: 2rem 0 0 0; } #problem-panel { overflow: scroll; } .problem-list-container { padding: 0 1rem; padding-top: 4.6rem; } .problem-item { padding: 0.8rem 0; border-top: 1px solid #e9be2b; border-bottom: 1px solid #e9be2b; } .problem-index, .problem-desc, .problem-pic { margin-top: 0.3rem; } .problem-index { display: flex; align-items: center; justify-content: space-between; height: 2.6rem; line-height: 2.6rem; } .problem-item-title { height: 3rem; line-height: 3rem; font-size: 1.25rem; } .problem-desc textarea { width: 100%; height: 100%; padding: 0.3rem; border: 1px solid #e5e5e5; box-sizing: border-box; } .problem-pic img, .problem-audio img { width: 4rem; height: 4rem; } .problem-item-content { padding: 0 1rem; width: 100%; box-sizing: border-box; display: flex; flex-wrap: wrap; } .desc { width: 100%; padding-left: 1rem; box-sizing: border-box; white-space: normal; word-break: break-all; } .text-red { color:#ff0000; } .text-yellow { color:#ff9c00; } .pic-item, .audio-item { display: inline-block; width: 4rem; height: 4rem; border: 1px solid #e5e5e5; box-sizing: border-box; margin: 0 1rem 1rem 0; position: relative; } .pic-item i, .audio-item i { position: absolute; right: -0.8rem; top: -0.8rem; display: inline-block; width: 1.6rem; height: 1.6rem; border-radius: 50%; background-image: url('../../image/close.png'); background-size: contain; background-color: #fff; } .pic-item img { width: 100%; } #pic-review { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background-color: black; display: none; } #pic-review img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 100%; } #problem-status-btns { padding: 1rem 0; border-bottom: 1px solid #d9d9d9; position: fixed; z-index: 999; width: 100%; /* height: 2rem; */ background-color: white; } .search-line { display: flex; width: 100%; justify-content: space-between; padding: 0 0.83rem; box-sizing: border-box; align-items: center; } .search-criteria { border: 1px solid #d9d9d9; border-radius: 0.25rem; height: 2.5rem; width: 23%; }