Browse Source

多行文本框样式,修改按钮偏移,键盘出现搜索字样

luyanan 8 years ago
parent
commit
8c5505d027
5 changed files with 33 additions and 13 deletions
  1. 26 6
      app/css/app.css
  2. 2 2
      app/html/chats.html
  3. 1 1
      app/html/consultapply.html
  4. 2 2
      app/html/search-home.html
  5. 2 2
      app/html/search.html

+ 26 - 6
app/css/app.css

@ -32,6 +32,9 @@ img{color:transparent;font-size:0;vertical-align:middle;-ms-interpolation-mode:b
32 32
.mui-popup-button:hover{background: #FF9900;color:#FFFFFF;}
33 33

34 34
a{text-decoration:none;color:#007aff}a:active{color:#0062cc}
35
.mui-btn{font-size: 14px;
36
    font-weight: 400;
37
    line-height: 1.2;}
35 38
.mui-btn.mui-active:enabled,.mui-btn:enabled:active,button.mui-active:enabled,button:enabled:active,input[type=button].mui-active:enabled,input[type=button]:enabled:active,input[type=reset].mui-active:enabled,input[type=reset]:enabled:active,input[type=submit].mui-active:enabled,input[type=submit]:enabled:active{color:#fff;background-color:#FF9900;border:1px solid #ff9900;}
36 39
/*///////////////common公共样式///////////////////////*/
37 40
body{ color: #666666; font-size:14px;line-height:20px;}
@ -51,9 +54,9 @@ body{ color: #666666; font-size:14px;line-height:20px;}
51 54
.mainbox{width: 96%; margin:2% auto;}
52 55
.mainbox:before{ position:static;}
53 56
/*div模拟textarea多行文本框*/
54
div.textareabox{font-size:13px;padding:2px;-webkit-user-select:text;border-bottom: 1px solid #F0F0F0;-webkit-user-modify: read-write-plaintext-only;}
55
div.textareabox:empty:before {content: attr(placeholder);display: block;color: #AAAAAA;}
56
.borderarea{/*border-bottom: 1px solid #F0F0F0;*/}
57
div.textareabox{font-size:13px;padding:2px;-webkit-user-select:text;-webkit-user-modify: read-write-plaintext-only;}
58
div.textareaboxEmp:empty:before {content: attr(placeholder);display: block;color: #AAAAAA;}
59
.borderarea{border-bottom: 1px solid #F0F0F0;}
57 60

58 61
/*必填项样式*/
59 62
.requiredcon{ position: absolute; top:0; margin-left:4px; width: 8px; height:8px; background: url(../images/requiredicon.png) center center no-repeat; background-size: 100% 100%;}
@ -124,6 +127,7 @@ em.icon-renzheng{position:absolute;float:left;font-size: 0;width:48px;height:16p
124 127

125 128
/*****表单公共样式********/
126 129
/*input输入相关*/
130
button:disabled,input.frmtype[type='button']:disabled{ opacity: 1;}
127 131
.frmbox{ width: 100%; margin:2% auto; border-radius: 6px; }
128 132
.frmtype{ width: 100%; margin: auto;line-height: 30px;padding: 1% 2%;font-size: 14px;line-height:20px;vertical-align: middle;}
129 133
.frmbtn{margin:4% auto;font-size: 14px;line-height: 24px;padding: 1% 2%;border:1px solid #FF9900; border-radius: 6px; color:#FF9900 ;vertical-align: middle;}
@ -379,11 +383,11 @@ ul.boxnav li.set span:before{
379 383
.updatebox{ position: absolute; right:1%;font-size: 13px; line-height:16px;color: #FF9900;}
380 384
.updatebox2{right:7%; top:20px; }
381 385
.updatebox:hover,.updatebox:active,.updatebox:link{ color: #FF9900;}
382
.updatebox .updatebtn{font-size:20px;margin-top:-4px;}
386
.updatebox .updatebtn{font-size:20px; position: absolute;top:50%; margin-top:-11px;left:-18px; /*margin-top:-4px;*/}
383 387

384 388
.addinfobox{ position: absolute;right: 10px;/* top: 0; */ font-size: 13px; line-height:16px;color: #FF9900;}
385 389
.addinfobox:hover,.addinfobox:active,.addinfobox:link{ color: #FF9900;}
386
.addinfobox .addinfobtn{font-size:16px;}
390
.addinfobox .addinfobtn{font-size:16px;position: absolute;top:50%; margin-top:-9px;left:-16px;}
387 391

388 392
.addlabel .frmtype{border:1px solid #CCCCCC; border-radius: 6px; margin-right:2%; width: 78%; height: 30px;}
389 393
.addlabel .addlabelbtn{ border-color:#FF9900; color: #FF9900; border-radius: 6px;  width: 18%; height: 30px;/*padding-left:20px; padding-right:20px;*/}
@ -485,7 +489,7 @@ ul.boxnav li.set span:before{
485 489
.themespan{ width: 54%;}
486 490
.operatebtnbox{width:44%;position:absolute; top:50%; right:1%;margin-top:-13px;}
487 491
/*已评价*/.operated{width:30%; margin-top:-18px;}
488
.operatebtn{padding:2% 4%; margin: 0; position: absolute;right:0; font-size: 13px; line-height: 20px;}
492
.operatebtn{padding:2px 6px 0 6px; margin: 0; position: absolute;right:0; font-size: 13px; line-height: 25px;}
489 493

490 494

491 495
.filterbox2{ position: fixed; z-index:2; width: 100%;}
@ -525,6 +529,22 @@ ul.boxnav li.set span:before{
525 529
.popoverbox .mui-table-view-cell>a:not(.mui-btn){ margin-right:-12%;position: relative;}
526 530
.popoverbox .mui-table-view-cell .mui-navigate-right:after { position:absolute;right: 0; color:#FF9900;font-size: 24px;}
527 531
.mui-popover4{ width: 130px;  }
532
/*chat对话块*/
533
footer.chatFooter {position: fixed;width: 100%;height: 50px;min-height: 50px;border-top: solid 1px #bbb;left: 0px;bottom: 0px;overflow: hidden;padding: 0px 50px;background-color: #fafafa;padding-left: 5px;}
534
.footer-left {position: absolute;width: 50px;height: 50px;left: 0px;bottom: 0px;text-align: center;vertical-align: middle;line-height: 100%;padding: 12px 4px;}
535
.footer-right {position: absolute;width: 50px;height: 50px;right: 0px;bottom: 0px;text-align: center;vertical-align: middle;line-height: 100%;padding: 12px 5px;display: inline-block;}
536
.footer-center {height: 100%;padding: 5px 0px;}
537
.footer-center [class*=input] {width: 100%;height: 100%;border-radius: 5px;}
538
.footer-center .input-text {background: #fff;border: solid 1px #ddd;padding: 10px !important;font-size: 16px !important;line-height: 18px !important;font-family: verdana !important;overflow: hidden;}
539
.footer-center .input-sound {background-color: #eee;}
540
footer.chatFooter .mui-icon {color: #999999;}
541
footer.chatFooter .mui-icon:active {color: #FF9900 !important;}
542
footer.chatFooter .mui-icon-paperplane:before {content: "发送";color:lightgray;}
543
footer.chatFooter .mui-icon-paperplane.addColor:before {content: "发送";color:#ff9900;}
544
footer.chatFooter .mui-icon-paperplane {font-size: 16px;word-break: keep-all;line-height: 100%;padding-top: 6px;color: rgba(0, 135, 250, 1);}
545
.protable .mui-table-view-cell.mui-active{background: none;}
546
.timenow.thistime{right: 3%;}
547

528 548
/*********************** 咨询*******************/
529 549

530 550
/*********************** 资源信息浏览*******************/

+ 2 - 2
app/html/chats.html

@ -309,7 +309,7 @@
309 309
 				display: none;
310 310
 			}
311 311
 			#consultCon {
312
 				margin: -11px 15px -11px;
312
 				margin: -10px 6px;
313 313
 			}
314 314
 			#lookConBtn {
315 315
 				text-align: center;
@ -389,7 +389,7 @@
389 389
				</div>
390 390
				<!--我的需求,未评价-->
391 391
				<div class="operatebtnbox mui-pull-right displayNone" id="assessBtn">
392
					<button class="mui-btn mui-btn-block mui-btn-outlined frmbtn1 operatebtn"  style="width:80px;">去评价</button>
392
					<button class="mui-btn mui-btn-block mui-btn-outlined frmbtn1 operatebtn" style="width:80px;">去评价</button>
393 393
				</div>
394 394
				<!--我的需求,已评价-->
395 395
				<div class="operatebtnbox mui-pull-right operated displayNone" id="assessed">

+ 1 - 1
app/html/consultapply.html

@ -103,7 +103,7 @@
103 103
							<li class="basicfrm"><input type="text" name="comname" placeholder="请用一句话概括您的需求" class="mui-input-clear frmtype" id="consulttitle"></li>
104 104
							<li><label>咨询内容<em class="requiredcon" ></em></label></li>
105 105
							<li style="height:auto">
106
								<div class="textareabox content" id="consultcon" contenteditable="true" placeholder="请详细描述您遇到的问题"></div>
106
								<div class="textareabox textareaboxEmp content" id="consultcon" contenteditable="true" placeholder="请详细描述您遇到的问题"></div>
107 107
								<div id="count">300</div>
108 108
							</li>
109 109
						</ul>

+ 2 - 2
app/html/search-home.html

@ -13,7 +13,7 @@
13 13
	<!-- 主页面标题 -->
14 14
    <header class="mui-bar mui-bar-nav toptitbox">
15 15
    	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
16
        <div class="searchbox2 mui-pull-right">
16
        <form action="" class="searchbox2 mui-pull-right">
17 17
        	<div class="mui-pull-left searchselect">
18 18
	        	<div class="simuselect">
19 19
                	<div class="ulbox lookwho" id="div_select">专家</div> 
@ -25,7 +25,7 @@
25 25
	        	<em class="mui-icon mui-icon-arrowdown"></em>
26 26
		    </div>
27 27
		    <input type="search" class="mui-input-clear mui-pull-left searchtxt2" placeholder="输入专家姓名、研究方向等关键字" id="searchval">
28
        </div>
28
        </form>
29 29
	</header>
30 30
	
31 31
    <!-- 主页面内容容器 -->

+ 2 - 2
app/html/search.html

@ -16,7 +16,7 @@
16 16
		<!-- 主页面标题 -->
17 17
		<header class="mui-bar mui-bar-nav toptitbox">
18 18
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
19
			<div class="searchbox2 mui-pull-right">
19
			<form action="" class="searchbox2 mui-pull-right">
20 20
				<div class="mui-pull-left searchselect">
21 21
					<div class="simuselect">
22 22
						<div class="ulbox lookwho" id="div_select">专家</div>
@ -28,7 +28,7 @@
28 28
					<em class="mui-icon mui-icon-arrowdown"></em>
29 29
				</div>
30 30
				<input type="search" class="mui-input-clear mui-pull-left searchtxt2" placeholder="搜索专家、设备资源" id="searchval">
31
			</div>
31
			</form>
32 32
		</header>
33 33
		<div class="filterbox" style=" position: fixed; z-index:1; top:45px; width:100%">
34 34
			<ul class="filterblock" style="width:100%">