Home Explore Help
Register Sign In
root
/
bab-icon
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: 7a609d95e9
Branches Tags
bab-icon
/
public
/
table_admin
/
js
/
plugins
/
layer
/
layim
/
layim.css

layim.css 11 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158 
  1. /*
    2. 

  2. 

  3.  @Name: layim WebIM 1.0.0
    4. 

  4.  @Author：贤心（子涵修改）
    5. 

  5.  @Date: 2014-04-25
    6. 

  6.  @Blog: http://sentsin.com
    7. 

  7. 

  8.  */
    9. 

  9. body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,input,button,textarea,p,blockquote,th,td,form{margin:0; padding:0;}
    10. 

  10. input,button,textarea,select,optgroup,option{font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit; outline: 0;}
    11. 

  11. li{list-style:none;}
    12. 

  12. .xxim_icon, .xxim_main i, .layim_chatbox i{position:absolute;}
    13. 

  13. .loading{background:url(loading.gif) no-repeat center center;}
    14. 

  14. .layim_chatbox a, .layim_chatbox a:hover{color:#343434; text-decoration:none; }
    15. 

  15. .layim_zero{position:absolute; width:0; height:0; border-style:dashed; border-color:transparent; overflow:hidden;}
    16. 

  16. 

  17. .xxim_main{position:fixed; right:1px; bottom:1px; width:230px; border:1px solid #BEBEBE; background-color:#fff; font-size:12px; box-shadow: 0 0 10px rgba(0,0,0,.2); z-index:99999999}
    18. 

  18. .layim_chatbox textarea{resize:none;}
    19. 

  19. .xxim_main em, .xxim_main i, .layim_chatbox em, .layim_chatbox i{font-style:normal; font-weight:400;}
    20. 

  20. .xxim_main h5{font-size:100%; font-weight:400;}
    21. 

  21. 

  22. /* 搜索栏 */
    23. 

  23. .xxim_search{position:relative; padding-left:40px; height:40px; border-bottom:1px solid #DCDCDC; background-color:#fff;}
    24. 

  24. .xxim_search i{left:10px; top:12px; width:16px; height:16px;font-size: 16px;color:#999;}
    25. 

  25. .xxim_search input{border:none; background:none; width: 180px; margin-top:10px; line-height:20px;}
    26. 

  26. .xxim_search span{display:none; position:absolute; right:10px; top:10px; height:18px; line-height:18px;width:18px;text-align: center;background-color:#AFAFAF; color:#fff; cursor:pointer; border-radius:2px; font-size:12px; font-weight:900;}
    27. 

  27. .xxim_search span:hover{background-color:#FCBE00;}
    28. 

  28. 

  29. /* 主面板tab */
    30. 

  30. .xxim_tabs{height:45px; border-bottom:1px solid #DBDBDB; background-color:#F4F4F4; font-size:0;}
    31. 

  31. .xxim_tabs span{position:relative; display:inline-block; *display:inline; *zoom:1; vertical-align:top; width:76px; height:45px; border-right:1px solid #DBDBDB; cursor:pointer; font-size:12px;}
    32. 

  32. .xxim_tabs span i{top:12px; left:50%; width:20px; margin-left:-10px; height:20px;font-size:20px;color:#ccc;}
    33. 

  33. .xxim_tabs .xxim_tabnow{height:46px; background-color:#fff;}
    34. 

  34. .xxim_tabs .xxim_tabnow i{color:#1ab394;}
    35. 

  35. .xxim_tabs .xxim_latechat{border-right:none;}
    36. 

  36. .xxim_tabs .xxim_tabfriend i{width:14px; margin-left:-7px;}
    37. 

  37. 

  38. /* 主面板列表 */
    39. 

  39. .xxim_list{display:none; height:350px; padding:5px 0; overflow:hidden;}
    40. 

  40. .xxim_list:hover{ overflow-y:auto;}
    41. 

  41. .xxim_list h5{position:relative; padding-left:32px; height:26px; line-height:26px; cursor:pointer; color:#000; font-size:0;}
    42. 

  42. .xxim_list h5 span{display:inline-block; *display:inline; *zoom:1; vertical-align:top; max-width:140px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; font-size:12px;}
    43. 

  43. .xxim_list h5 i{left:15px; top:8px; width:10px; height:10px;font-size:10px;color:#666;}
    44. 

  44. .xxim_list h5 *{font-size:12px;}
    45. 

  45. .xxim_list .xxim_chatlist{display:none;}
    46. 

  46. .xxim_list .xxim_liston h5 i{width:8px; height:7px;}
    47. 

  47. .xxim_list .xxim_liston .xxim_chatlist{display:block;}
    48. 

  48. .xxim_chatlist {}
    49. 

  49. .xxim_chatlist li{position:relative; height:40px; line-height:30px; padding:5px 10px; font-size:0; cursor:pointer;}
    50. 

  50. .xxim_chatlist li:hover{background-color:#F2F4F8}
    51. 

  51. .xxim_chatlist li *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; font-size:12px;}
    52. 

  52. .xxim_chatlist li span{padding-left:10px; max-width:120px;  overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
    53. 

  53. .xxim_chatlist li img{width:30px; height:30px;}
    54. 

  54. .xxim_chatlist li .xxim_time{position:absolute; right:10px; color:#999;}
    55. 

  55. .xxim_list .xxim_errormsg{text-align:center; margin:50px 0; color:#999;}
    56. 

  56. .xxim_searchmain{position:absolute; width:230px; height:491px; left:0; top:41px; z-index:10; background-color:#fff;}
    57. 

  57. 

  58. /* 主面板底部 */
    59. 

  59. .xxim_bottom{height:34px; border-top:1px solid #D0DCF3; background-color:#F2F4F8;}
    60. 

  60. .xxim_expend{border-left:1px solid #D0DCF3; border-bottom:1px solid #D0DCF3;}
    61. 

  61. .xxim_bottom li{position:relative; width:50px; height:32px; line-height:32px; float:left; border-right:1px solid #D0DCF3;  cursor:pointer;}
    62. 

  62. .xxim_bottom li i{ top:9px;}
    63. 

  63. .xxim_bottom .xxim_hide{border-right:none;}
    64. 

  64. .xxim_bottom .xxim_online{width:72px; padding-left:35px;}
    65. 

  65. .xxim_online i{left:13px; width:14px; height:14px;font-size:14px;color:#FFA00A;}
    66. 

  66. .xxim_setonline{display:none; position:absolute; left:-79px; bottom:-1px;  border:1px solid #DCDCDC; background-color:#fff;}
    67. 

  67. .xxim_setonline span{position:relative; display:block; width:32px;width: 77px; padding:0 10px 0 35px;}
    68. 

  68. .xxim_setonline span:hover{background-color:#F2F4F8;}
    69. 

  69. .xxim_offline .xxim_nowstate, .xxim_setoffline i{color:#999;}
    70. 

  70. .xxim_mymsg i{left:18px; width:14px; height:14px;font-size: 14px;}
    71. 

  71. .xxim_mymsg a{position:absolute; left:0; top:0; width:50px; height:32px;}
    72. 

  72. .xxim_seter i{left:18px; width:14px; height:14px;font-size: 14px;}
    73. 

  73. .xxim_hide i{left:18px; width:14px; height:14px;font-size: 14px;}
    74. 

  74. .xxim_show i{}
    75. 

  75. .xxim_bottom .xxim_on{position:absolute; left:-17px; top:50%; width:16px;text-align: center;color:#999;line-height: 97px; height:97px; margin-top:-49px;border:solid 1px #BEBEBE;border-right: none; background:#F2F4F8;}
    76. 

  76. .xxim_bottom .xxim_off{}
    77. 

  77. 

  78. /* 聊天窗口 */
    79. 

  79. .layim_chatbox{width:620px; border:1px solid #BEBEBE; background-color:#fff; font-size:12px; box-shadow: 0 0 10px rgba(0,0,0,.2);}
    80. 

  80. .layim_chatbox h6{position:relative; height:40px; border-bottom:1px solid #D9D9D9; background-color:#FCFDFA}
    81. 

  81. .layim_move{position:absolute; height:40px; width: 620px; z-index:0;}
    82. 

  82. .layim_face{position:absolute; bottom:-1px; left:10px; width:64px; height:64px;padding:1px;background: #fff; border:1px solid #ccc;}
    83. 

  83. .layim_face img{width:60px; height:60px;}
    84. 

  84. .layim_names{position:absolute; left:90px; max-width:300px; line-height:40px; color:#000; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; font-size:14px;}
    85. 

  85. .layim_rightbtn{position:absolute; right:15px; top:12px; font-size:20px;}
    86. 

  86. .layim_rightbtn i{position:relative; width:16px; height:16px; display:inline-block; *display:inline; *zoom:1; vertical-align:top; cursor:pointer; transition: all .3s;text-align: center;line-height: 16px;}
    87. 

  87. .layim_rightbtn .layim_close{background: #FFA00A;color:#fff;}
    88. 

  88. .layim_rightbtn .layim_close:hover{-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);}
    89. 

  89. .layim_rightbtn .layer_setmin{margin-right:5px;color:#999;font-size:14px;font-weight: 700;}
    90. 

  90. .layim_chat, .layim_chatmore,.layim_groups{height:450px; overflow:hidden;}
    91. 

  91. .layim_chatmore{display:none; float:left; width:135px; border-right:1px solid #BEBEBE; background-color:#F2F2F2}
    92. 

  92. .layim_chatlist li, .layim_groups li{position:relative; height:30px; line-height:30px; padding:0 10px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; cursor:pointer;}
    93. 

  93. .layim_chatlist li{padding:0 20px 0 10px;}
    94. 

  94. .layim_chatlist li:hover{background-color:#E3E3E3;}
    95. 

  95. .layim_chatlist li span{display:inline-block; *display:inline; *zoom:1; vertical-align:top; width:90px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
    96. 

  96. .layim_chatlist li em{display:none; position:absolute; top:6px; right:10px; height:18px; line-height:18px;width:18px;text-align: center;font-size:14px;font-weight:900; border-radius:3px;}
    97. 

  97. .layim_chatlist li em:hover{background-color: #FCBE00; color:#fff;}
    98. 

  98. .layim_chatlist .layim_chatnow,.layim_chatlist .layim_chatnow:hover{/*border-top:1px solid #D9D9D9; border-bottom:1px solid #D9D9D9;*/ background-color:#fff;}
    99. 

  99. .layim_chat{}
    100. 

  100. .layim_chatarea{height:280px;}
    101. 

  101. .layim_chatview{display:none; height:280px; overflow:hidden;}
    102. 

  102. .layim_chatmore:hover, .layim_groups:hover, .layim_chatview:hover{overflow-y:auto;}
    103. 

  103. .layim_chatview li{margin-bottom:10px; clear:both; *zoom:1;}
    104. 

  104. .layim_chatview li:after{content:'\20'; clear:both; *zoom:1; display:block; height:0;}
    105. 

  105. 

  106. .layim_chatthis{display:block;}
    107. 

  107. .layim_chatuser{float:left; padding:15px; font-size:0;}
    108. 

  108. .layim_chatuser *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; line-height:30px; font-size:12px; padding-right:10px;}
    109. 

  109. .layim_chatuser img{width:30px; height:30px;padding-right: 0;margin-right: 15px;}
    110. 

  110. .layim_chatuser .layim_chatname{max-width:230px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
    111. 

  111. .layim_chatuser .layim_chattime{color:#999; padding-left:10px;}
    112. 

  112. .layim_chatsay{position:relative; float:left; margin:0 15px; padding:10px; line-height:20px; background-color:#F3F3F3; border-radius:3px; clear:both;}
    113. 

  113. .layim_chatsay .layim_zero{left:5px; top:-8px; border-width:8px; border-right-style:solid; border-right-color:#F3F3F3;}
    114. 

  114. .layim_chateme .layim_chatuser{float:right;}
    115. 

  115. .layim_chateme .layim_chatuser *{padding-right:0; padding-left:10px;}
    116. 

  116. .layim_chateme .layim_chatuser img{margin-left:15px;padding-left: 0;}
    117. 

  117. .layim_chateme .layim_chatsay .layim_zero{left:auto; right:10px;}
    118. 

  118. .layim_chateme .layim_chatuser .layim_chattime{padding-left:0; padding-right:10px;}
    119. 

  119. .layim_chateme .layim_chatsay{float:right; background-color:#EBFBE3}
    120. 

  120. .layim_chateme .layim_zero{border-right-color:#EBFBE3;}
    121. 

  121. .layim_groups{display:none; float:right; width:130px; border-left:1px solid #D9D9D9; background-color:#fff;}
    122. 

  122. .layim_groups ul{display:none;}
    123. 

  123. .layim_groups ul.layim_groupthis{display:block;}
    124. 

  124. .layim_groups li *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; margin-right:10px;}
    125. 

  125. .layim_groups li img{width:20px; height:20px; margin-top:5px;}
    126. 

  126. .layim_groups li span{max-width:80px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
    127. 

  127. .layim_groups li:hover{background-color:#F3F3F3;}
    128. 

  128. .layim_groups .layim_errors{text-align:center; color:#999;}
    129. 

  129. .layim_tool{position:relative; height:35px; line-height:35px; padding-left:10px; background-color:#F3F3F3;}
    130. 

  130. .layim_tool i{position:relative; top:10px; display:inline-block; *display:inline; *zoom:1; vertical-align:top; width:16px; height:16px; margin-right:10px; cursor:pointer;font-size:16px;color:#999;font-weight: 700;}
    131. 

  131. .layim_tool i:hover{color:#FFA00A;}
    132. 

  132. .layim_tool .layim_seechatlog{position:absolute; right:15px;}
    133. 

  133. .layim_tool .layim_seechatlog i{}
    134. 

  134. .layim_write{display:block; border:none; width:98%; height:90px; line-height:20px; margin:5px auto 0;}
    135. 

  135. .layim_send{position:relative; height:40px; background-color:#F3F3F3;}
    136. 

  136. .layim_sendbtn{position:absolute; height:26px; line-height:26px; right:10px; top:8px; padding:0 40px 0 20px; background-color:#FFA00A; color:#fff; border-radius:3px; cursor:pointer;}
    137. 

  137. .layim_enter{position:absolute; right:0; border-left:1px solid #FFB94F; width:24px; height:26px;}
    138. 

  138. .layim_enter:hover{background-color:#E68A00; border-radius:0 3px 3px 0;}
    139. 

  139. .layim_enter .layim_zero{left:7px; top:11px; border-width:5px; border-top-style:solid; border-top-color:#FFE0B3;}
    140. 

  140. .layim_sendtype{display:none; position:absolute; right:10px; bottom:37px; border:1px solid #D9D9D9; background-color:#fff; text-align:left;}
    141. 

  141. .layim_sendtype span{display:block; line-height:24px; padding:0 10px 0 25px; cursor:pointer;}
    142. 

  142. .layim_sendtype span:hover{background-color:#F3F3F3;}
    143. 

  143. .layim_sendtype span i{left:5px;}
    144. 

  144. 

  145. .layim_min{display:none; position:absolute; left:-190px; bottom:-1px; width:160px; height:32px; line-height:32px; padding:0 10px; overflow:hidden; text-overflow: ellipsis; white-space:nowrap; border:1px solid #ccc; box-shadow: 0 0 5px rgba(0,0,75,.2); background-color:#FCFDFA; cursor:pointer;}
    146. 

  146. 

  147. 

  148. 

  149. 

  150. 

  151. 

  152. 

  153. 

  154. 

  155. 

  156. 

  157. 

  158.