Browse Source

新版搜索以及文章相关样式

luyanan 8 years ago
parent
commit
7f6f12af99
3 changed files with 203 additions and 9 deletions
  1. 4 4
      css/common.css
  2. 196 2
      css/genindex.css
  3. 3 3
      js/scrollfix.js

+ 4 - 4
css/common.css

@ -45,10 +45,10 @@ a,a:active,a:hover{outline:0;text-decoration:none;}
45 45
.clearfix:before,.clearfix:after{display:table;content:" "}
46 46
.clearfix:after{clear:both}
47 47
/*更改placeholder的颜色*/
48
:-moz-placeholder {color: #c0c0c6;}
49
::-moz-placeholder {color: #c0c0c6;}
50
input:-ms-input-placeholder,textarea:-ms-input-placeholder {color: #c0c0c6;}
51
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {color: #c0c0c6;}
48
:-moz-placeholder {color: #999999;}
49
::-moz-placeholder {color: #999999;}
50
input:-ms-input-placeholder,textarea:-ms-input-placeholder {color: #999999;}
51
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {color: #999999;}
52 52
/* 显示和隐藏样式 */
53 53
.inline {display:inline-block;}
54 54
.displayNone{display:none;}

+ 196 - 2
css/genindex.css

@ -2,15 +2,37 @@
2 2
/* CSS Document */
3 3
html,body{background: #f4f6f8;}
4 4
.userRadius{ border-radius: 50%;border:1px solid #E5E5E5;}
5
.otherRadius{ border-radius:0;border:1px solid #E5E5E5;}
5 6
.cmpRadius{border-radius:4px;border:1px solid #E5E5E5;}
6 7
.con-center{padding:20px 10px 40px; margin:10px auto;}
8
/*弹出模态框*/
9
.blackcover{display:none;overflow-x: hidden;overflow-y:auto;position:fixed;top:0;right:0;bottom:0;left:0; background:rgba(0,0,0,.6);z-index: 1050;}
10
.modelContain{display:none;position:relative;clear:both;margin:40px auto;z-index:1056; 
11
 		 box-shadow: 2px 4px 10px 4px #555;
12
  -webkit-box-shadow: 2px 4px 10px 4px #555;}
13
.modelContain:before,.modelContain:after{display:table;content:" "}
14
.modelContain:after{clear: both;}
15
.modelContain2{width:1120px;background:#f4f6f8;}
16
.modelClosebtn{position:absolute; top:0; right:-50px; display:block; width:20px; height:20px; background:url(../images/workclose.png) center center no-repeat; padding:20px;cursor:pointer; z-index:1055;}  
17
.modelOpen{overflow: hidden;}
7 18
/*/////////////////////表单样式/////////////////////// */
19
/*div模拟textarea多行文本框*/
20
div.textareaboxEmp{min-height:40px;height:auto;-webkit-user-select:text;-webkit-user-modify: read-write-plaintext-only;cursor: text;}
21
div.textareaboxEmp:empty:before {content: attr(placeholder);font-size:16px;display: block;color: #AAAAAA;}
22
/*div.textareaboxEmp:focus{content:none;}
23
div.textareaboxEmp:focus:before{content:none;}*/
24
/*登录注册外部表单样式*/
8 25
.frmtype{border:none;height:36px;background:#edeff4;font-size:14px;outline: none; padding:6px 20px 6px 10px;border-radius: 6px;}
9 26
.frmtype:focus{box-shadow: none;outline:none; border:1px solid #ff8500;}
10 27
.frmtypeW{width:98%;margin: auto;}
11 28
textarea.frmtype{height:100px;}
12 29
input.frmtype[readonly]{background:#EFEFEF;color:#AAAAAA;}
13 30
input.frmtype[readonly]:focus{border:1px transparent solid;}
31
/*网站内部表单样式*/
32
.frmcontype{border:1px solid #E5E5E5;height:40px;background:#FFFFFF;font-size:16px;color:#666;line-height:28px;outline: none; padding:6px 12px;border-radius:0;}
33
.frmcontype:focus{border-color:#ff9900;}
34
.frmconbtn{width:100%;height:40px;background:#ff9900;font-size:16px;color:#666;line-height:28px;outline:none;border:none;padding:6px 12px;border-radius:0;}
35
.frmconmsg{color:#fd5f39;margin-left:12px;font-size: 14px;}
14 36
/*小按钮*/
15 37
.btnModel{display:inline-block;color:#FFFFFF;border:none;background: #FFFFFF; padding:6px 20px;background:#ff9900;}
16 38
.btnModel:hover{background:#ff8f00;}
@ -122,8 +144,8 @@ ul.loginWaySort li.liactive{border-bottom: 2px solid #ff9900;}
122 144
.contentCon{padding-top:80px;}
123 145
.leftconBox{width:820px;padding-bottom:20px;margin-bottom:20px;background: #FFFFFF;}
124 146
.table-item{/*padding:10px;*/}
125
.table-item li{position:relative;padding:25px 20px;}
126
.table-item li:after{content:"";position:absolute; left:0; right:0; bottom:0;height: 2px;background: #f7f7f8;}
147
.table-item>li{position:relative;padding:25px 20px;}
148
.table-item>li:after{content:"";position:absolute; left:0; right:0; bottom:0;height: 2px;background: #f7f7f8;}
127 149
.table-item-media{height: 40px;margin-bottom:20px;}
128 150
.table-item-media .table-item-logo{position:absolute;border:1px solid #f2f3f4;display: inline-block;width: 40px; height:40px;z-index:4;}
129 151
.table-item-media .table-item-name{position:relative;width:90%;padding-left:50px;}
@ -199,3 +221,175 @@ ul.listitemdiv.listmorediv .centercon{padding-left:184px;padding-right: 10px;mar
199 221
ul.listitemdiv.listmorediv .ellipsisSty-2{height:50px;}
200 222
201 223
ul.listitemdiv.listmorediv .articalhead{width: 164px;height: 110px;margin-top:-55px;background-image: url(../images/default-artical.jpg);}
224
225
/*--------------新版文章--------------*/
226
/*文章发布*/
227
.conBlock .leftconBox{width:764px;padding:30px;}
228
.conBlock .rightconBox{width: 315px;}
229
.conBlock .rightconBox .conItem{padding:30px;background: #FFFFFF;margin-bottom: 20px;}
230
.conBlock .rightconBox .conItem:first-child{padding:30px 10px;border-top:4px #ff9900 solid;}
231
ul.artAbout>li{overflow: hidden;}
232
ul.artAbout .uploadFile{line-height:28px;text-align: center;font-size: 16px;color:#666666;}
233
ul.artAbout .uploadFile .uploadblock{position:relative;width:100%;height:190px;padding:30px;border:1px solid #E5E5E5; border-radius: 0;
234
	background-position:center;background-size:cover;background-repeat:no-repeat;}
235
ul.artAbout .uploadFile .upFront{position:relative;}
236
ul.artAbout .uploadFile input.upInp[type="file"]{position:absolute;height: 46px;width:60%;bottom:30px;left:50%;margin-left:-30%;outline: none;opacity: 0;cursor: pointer;z-index:20;}
237
ul.artAbout .uploadFile .upbtn{display:inline-block;padding:7px 23px;background: #E5E5E5;color:#333333;margin-top:30px;}
238
ul.artAbout .uploadFile .uploadblock .upBackbtn{position:absolute;bottom:30px;left:50%;margin-left:-55px;background:rgba(0,0,0,.5);color:#FFFFFF;z-index:10;display: none;}
239
.conBlock .aboutTit{font-size:16px;line-height:40px;color:#666666;margin-top:18px;}
240
ul.artAbout .editBlock{height:320px;border:1px solid #E5E5E5;}
241
ul.artAbout .frmadd{display:none;position:absolute;right:0;background: #ff9900;color:#fff;border:none;padding:6px 25px;}
242
243
.conItem ul.operateBlock{overflow: hidden;margin-top:-20px;}
244
.conItem ul.operateBlock>li{font-size:16px; color:#666666;float:left;width:33.333%;margin-top:20px;text-align: center;cursor: pointer;}
245
.conItem ul.operateBlock>li p{margin-top:6px;}
246
.operateicon{display:inline-block;width:22px;height:22px;background-position: center;background-repeat: no-repeat;}
247
.operateicon.icon-issue{background-image:url(../images/g_article_icon_fabu_hig.png);}
248
.operateicon.icon-timeissue{background-image:url(../images/g_article_icon_dingshi_nor.png);}
249
.operateicon.icon-preview{background-image:url(../images/g_article_icon_yulan_nor.png);}
250
.operateicon.icon-draft{background-image:url(../images/g_article_icon_caogao_nor.png);}
251
.operateicon.icon-delete{background-image:url(../images/g_article_icon_shanchu_nor.png);}
252
253
.conItem ul.operateBlock>li:hover{color:#ff9900;}
254
.conItem ul.operateBlock>li.goFabu{color:#ff9900;opacity:0.8;}
255
.conItem ul.operateBlock>li.goFabu:hover{opacity:1;}
256
.conItem ul.operateBlock>li:hover .operateicon.icon-timeissue{background-image:url(../images/g_article_icon_dingshi_hig.png);}
257
.conItem ul.operateBlock>li:hover .operateicon.icon-preview{background-image:url(../images/g_article_icon_yulan_hig.png);}
258
.conItem ul.operateBlock>li:hover .operateicon.icon-draft{background-image:url(../images/g_article_icon_caogao_hig.png);}
259
.conItem ul.operateBlock>li:hover .operateicon.icon-delete{background-image:url(../images/g_article_icon_shanchu_hig.png);}
260
.conItem .aboutTit{margin-top:-10px;}
261
.conItem .otherBlock{padding-bottom: 30px;border-bottom:1px dashed #E5E5E5;margin-bottom: 30px;}
262
.conItem .otherBlock:last-child{padding:0;margin:0;border: 0;}
263
264
.form-item{}
265
.form-drop{position:relative;top:0;border:1px solid #E5E5E5;border-top:none;width: 100%;}
266
.form-item .madiaHead{position:absolute;border:1px solid #E5E5E5;width: 50px;height:50px;background-position: center;background-size: cover;}
267
.form-item .madiaHead.useHead{background-image: url(../images/default-photo.jpg);border-radius: 50%;}
268
.form-item .madiaHead.resouseHead{background-image: url(../images/default-resource.jpg);border-radius:0;}
269
.form-item .madiaHead.artHead{background-image: url(../images/default-artical.jpg);border-radius:0;}
270
.form-item .madiaInfo{padding-left:62px;margin:2px 0;}
271
.form-item ul .h1Font{font-size:16px;color:#333;line-height: 24px;}
272
.form-item ul .h2Font{font-size:14px;color:#666;line-height: 24px;}
273
.form-drop>ul>li{position:relative;min-height: 50px;padding:12px;cursor:pointer;}
274
.form-drop>ul>li:hover{background: #EEEEEE;}
275
.form-drop>ul>li:active{background: #ff9900;color:#fff;}
276
.form-drop>ul>li:active .h1Font,.form-drop>ul>li:active .h2Font{color:#fff;}
277
278
.form-result{margin:18px -30px 0 -30px;}
279
.form-result>ul>li{position:relative;padding:12px 30px;}
280
.form-result>ul>li .deleteThis{display:none;position:absolute;top:50%;margin-top:-20px;right:28px;width:40px;height:40px;background:url(../images/g_article_button_shanchu_hig.png);background-size:cover;cursor:pointer;}
281
.form-result>ul>li:hover{background: #EEEEEE;}
282
.form-result>ul>li:hover .deleteThis{display:block;}
283
284
.form-drop.keydrop>ul>li{min-height:auto;padding:8px 12px;}
285
.form-result.keyResult{margin:18px 0 0;margin-right: -20px;}
286
.keyResult>ul{margin-bottom:-10px;}
287
.keyResult>ul>li{float: left;margin-right:20px;margin-bottom:10px;padding:2px 12px;color: #999;border: 1px solid #E5E5E5;border-radius: 20px;}
288
.keyResult>ul>li .closeThis{display:none;position:absolute;top:-8px;right:-12px;width:28px;height:28px;background:url(../images/g_article_button_guanbi_hig.png);background-size:cover;cursor:pointer;}
289
.keyResult>ul>li:hover{background: #E5E5E5;}
290
.keyResult>ul>li:hover .closeThis{display:block;}
291
/*文章浏览*/
292
.showDetail .h1Font{font-size: 20px;line-height:32px;color:#000;}
293
.showDetail .h2Font{font-size:14px;color:#999;}
294
.showDetail .readNum{margin-left: 20px;}
295
.showDetail .showBigOpen{width:100%;height:190px;margin:24px 0;background-position:center;background-size:cover;background-repeat:no-repeat;}
296
.showDetail .showMain{font-size:16px;color:#333;line-height: 30px;text-indent: 2em;}
297
.showDetail .showMain img{max-width: 100%;margin-left:-32px;}
298
.showDetail .showMain p{margin-bottom:10px;}
299
ul.tagList{margin:20px 0 -10px;overflow: hidden;}
300
ul.tagList>li{float: left;margin-right:10px;margin-bottom:10px;padding:0 12px;color: #999;border: 1px solid #E5E5E5;border-radius: 20px;}
301
ul.tagList>li .h2Font{color:#666}
302
.otherShow{}
303
.otherShow.otherShowFirst{padding-bottom:12px;border-bottom:2px dashed #E5E5E5;}
304
.otherShow .aboutTit{font-size:18px;color:#666;}
305
.otherShow .form-result{margin:0 -30px;}
306
.form-item.otherShow .madiaHead{width: 80px;height: 80px;}
307
.form-item.otherShow .madiaInfo{padding-left:92px;margin:4px 0;}
308
.otherShow .form-result>ul>li{min-height:104px;}
309
.form-item.otherShow .aboutRes .madiaHead{width:118px;height: 80px;}
310
.form-item.otherShow .aboutRes .madiaInfo{padding-left:130px;margin:4px 0;}
311
.form-item.otherShow .aboutRes .ellipsisSty-2{height:48px;}
312
/*点赞模块*/
313
.thumbBlock{text-align: center;margin:30px 0;}
314
.thumbBlock .thumbBtn{display:inline-block;position:relative;padding:10px 24px;padding-left:44px;font-size:16px;color:#fff;background:#ff9900;border-radius:30px;
315
      box-shadow: 1px 2px 13px 0px rgba(255, 153, 0, 0.6);
316
    -webkit-box-shadow: 1px 2px 13px 0px rgba(255, 153, 0, 0.6);cursor: pointer;}
317
.thumbBlock .thumbBtn:before{position:absolute;content:url(../images/g_article_icon_dianzan_nor.png);top:50%;left:24px;margin-top:-9px;}
318
.thumbBlock .thumbBtn:hover{background: #ff9000;}
319
/*分享操作栏*/
320
.shareBlock{background:rgba(60,62,81,.5);margin:0 -30px;padding:26px 30px;}
321
.shareInfo .madiaInfo{margin-top:12px;}
322
.shareInfo .madiaInfo .h1Font{display:inline-block;max-width: 200px;padding-right:14px;font-size: 16px;color:#fff;}
323
.shareInfo .madiaInfo .authiconNew{top:-8px;}
324
.shareBlock>ul.shareWays{width:50%;cursor: pointer;text-align:right;}
325
.shareBlock>ul.shareWays>li{float:left;padding:16px 0 10px;width:16%;color:#fff;}
326
.shareBlock>ul.shareWays>li .message{position:relative;top:-5px;left:6px;}
327
.operateicon.icon-message{background-image:url(../images/g_article_button_liuyan_nor.png);}
328
.operateicon.icon-collect{background-image:url(../images/g_article_button_shoucang_nor.png);}
329
.operateicon.icon-wechat{width:24px;background-image:url(../images/g_article_button_weixin_nor.png);}
330
.operateicon.icon-sina{background-image:url(../images/g_article_button_liuyan_nor.png);}
331
.operateicon.icon-qq{background-image:url(../images/g_article_button_liuyan_nor.png);}
332
.operateicon.icon-totop{background-image:url(../images/g_article_button_dingbu_nor.png);}
333
.operateicon.icon-message:hover{background-image:url(../images/g_article_button_liuyan_hig.png);}
334
.operateicon.icon-collect:hover{background-image:url(../images/g_article_button_shoucang_hig.png);}
335
.operateicon.icon-wechat:hover{background-image:url(../images/g_article_button_weixin_hig.png);}
336
.operateicon.icon-sina:hover{background-image:url(../images/g_article_button_liuyan_hig.png);}
337
.operateicon.icon-qq:hover{background-image:url(../images/g_article_button_liuyan_hig.png);}
338
.operateicon.icon-totop:hover{background-image:url(../images/g_article_button_dingbu_hig.png);}
339
.shareWeixin{font-style: normal;position: relative;}
340
.shareWeixin .shareCode{display:none;position: absolute;bottom: 40px;left:-24px;background:rgba(0,0,0,.6);padding: 8px;width: 260px;}
341
.shareWeixin .shareCode:after{display: block;width: 0;height: 0;border:12px solid transparent;border-top-color:rgba(0,0,0,.6);
342
position: absolute;bottom:-24px;left:22px;}
343
.shareWeixin .shareCode .shareWord {width: 126px;margin: 10px;color: #FFF;text-align: left;font-size: 14px;line-height: 20px;}
344
.shareWeixin .shareCode img {width: 80px;height: 80px;}
345
346
.ifLogin{margin:30px 0;}
347
.ifLogin .ifLoginUn{background: #fff7e7;border:1px solid #E5E5E5;line-height:18px;padding:25px;color:#7b4b2b;font-size:14px;}
348
.ifLogin .ifLoginUn>ul>li{float: right;padding:0 6px;}
349
.ifLogin .ifLoginUn a{color:#666;}
350
.ifLogin .ifLoginOn .btnModel{margin:12px 0;padding:4px 12px;width: 80px;border-radius:0;}
351
.ifLogin .ifLoginOn .msgContbox{border: 1px solid #E5E5E5;height:120px;position: relative;}
352
.ifLogin .ifLoginOn textarea{background:none;border:none;color: #55636D;outline: none;padding:12px;
353
   width: 100%;font-size: 14px;resize: none;margin-bottom: 15px;height:92px;}
354
.ifLogin .ifLoginOn .msgconNum{position:absolute;bottom:2px;right:10px;color:#999;font-size:14px;}
355
.commentsArea .btnCancel{height:auto;border-radius:0;color: #ff9900;}
356
.commentsArea ul.commentList{margin-top:-20px;}
357
.commentsArea ul.commentList>li{padding:10px 0 20px;}
358
.commentsArea ul.commentList>li .h2Font{font-size: 16px;color: #666;line-height: 26px;}
359
.commentsArea ul.commentList>li .commenttime{font-size: 14px;color: #999;margin-left:18px;}
360
.commentsArea ul.commentList>li .operateSpan{margin:10px 0 0;color:#9d9ea8;font-size:14px;cursor: pointer;}
361
.commentsArea ul.commentList>li .operateSpan .callBack{position:relative;padding-left:20px;margin-right:40px;}
362
.commentsArea ul.commentList>li .operateSpan .callBack:before{position:absolute;content:url(../images/g_article_button_huifu_nor.png);top:50%;left:0;margin-top:-8px;}
363
364
.rightconBox .conItem.conItemG .madiaHead{width: 120px; height: 120px;border:1px solid #E5E5E5;margin:0 auto 10px;background-position:center;background-size:cover;}
365
.rightconBox .conItem.conItemG .madiaHead.useHead{background-image:url(../images/default-photo.jpg);border-radius: 50%;}
366
.rightconBox .conItem.conItemG .madiaHead.cmpHead{background-image:url(../images/default-icon.jpg);}
367
.rightconBox .conItem.conItemG .h2Font{font-size:16px;color:#666;line-height:26px;}
368
.rightconBox .conItem.conItemG .attenSpan{position: relative;display:inline-block;background: #ff9900;cursor:pointer;padding:9px 25px;padding-left:42px;color:#fff;font-size:16px;margin:20px auto 0;}
369
.rightconBox .conItem.conItemG .attenSpan:before{position:absolute;content:url(../images/g_article_icon_jia_nor.png);top:50%;left:20px;margin-top:-8px;}
370
371
/*文章列表*/
372
.itemListBolck .searchAbout{position: relative;}
373
.itemListBolck .searchAbout .searchSpan{position:absolute;top:50%;margin-top:-9px;right:18px;display:inline-block;width:18px;height:18px;background: url(../images/g_article_icon_sousuo_nor.png);}
374
.itemListBolck .frmcontype{width:100%;border-radius: 20px;padding-left:20px;background: #fff;}
375
.itemListBolck .issueSpanBlock{text-align: right;}
376
.itemListBolck .issueSpan{position:relative;display:inline-block;background:#e03b43;color:#fff;font-size:18px;cursor:pointer;padding:8px 25px 7px;padding-left:50px;border-radius: 20px 0 0 20px;}
377
.itemListBolck .issueSpan:before{position:absolute;content:url(../images/g_article_icon_fanbu_nor.png);top:50%;left:26px;margin-top:-12px;}
378
.itemListBolck .itemListCon .form-result>ul>li{padding:20px;cursor:pointer;}
379
.itemListBolck .itemListCon .form-result>ul>li:after{content: "";position: absolute;left: 0;right: 0;bottom: 0;height: 2px;background: #f4f6f8;}
380
.itemListBolck .itemListCon .form-result>ul>li:hover{background:#EEEEEE;}
381
.itemListBolck .itemListCon .form-result{margin:30px 0;}
382
.itemListBolck .itemListCon .madiaHead{width:120px;height:80px;}
383
.itemListBolck .itemListCon .madiaInfo{padding-left:140px;}
384
.itemListBolck .itemListCon .madiaInfo>ul>li{float: left;margin-left:20px;}
385
.itemListBolck .itemListCon .madiaInfo>ul>li:first-child{margin-left:0;}
386
.itemListBolck .itemListCon .madiaInfo{min-height: 80px;padding-top:15px;}
387
.itemListCon.form-item ul .h1Font{font-size:18px;}
388
.itemListCon .draftLable{font-size:16px; color:#e03b43;line-height: 30px;}
389
.itemListCon .form-result>ul>li .madiaEdit>li{float: left;margin-right: 28px;}
390
.itemListCon .form-result>ul>li .madiaEdit .editThis{display:inline-block;width:72px;height:46px;background:url(../images/g_article_button_xiugai_hig.png);background-size:cover;cursor:pointer;}
391
.itemListCon .form-result>ul>li .madiaEdit .deteleThis2{display:inline-block;width:46px;height:46px;background:url(../images/g_article_button_shanchu_hig.png);background-size:cover;cursor:pointer;}
392
.itemListCon .form-result>ul>li .madiaEdit{display:none;overflow:hidden;position:absolute;top:50%;margin-top:-23px;right:0;}
393
.itemListCon .form-result>ul>li:hover .madiaEdit{display: block;}
394
395
.itemListCon li.draftList .madiaInfo{padding-top:0;}

+ 3 - 3
js/scrollfix.js

@ -57,12 +57,12 @@
57 57
			function resetScroll() {
58 58
				setUnfixed();
59 59
				selfTop = obj.offset().top; //对象距离顶部高度
60
				selfLeft = obj.offset().left; //对象距离左边宽度
60
				selfLeft = obj.offset().left + 30; //对象距离左边宽度
61 61
				outerHeight = obj.outerHeight(); //对象高度
62 62
				outerHeight = parseFloat(outerHeight) + parseFloat(obj.css('marginBottom').replace(/auto/, 0));
63 63
				outerWidth = obj.outerWidth(); //对象外宽度
64
//				objWidth = obj.width();
65
				objWidth = obj.outerWidth(true);
64
				//objWidth = obj.width();
65
				objWidth = obj.outerWidth(true)+60;
66 66
				var documentHeight = $(document).height(); //文档高度
67 67
				var startTop = $(opts.startTop), //开始浮动固定对象
68 68
					startBottom = $(opts.startBottom),