Home Explore Help
Register Sign In
gyfl
/
xyzshop
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: 81930b72f3
Branches Tags
xyzshop
/
circle
/
templates
/
default
/
css
/
ubb.css

ubb.css 16 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224 
  1. @charset "utf-8";
    2. 

  2. /* ================================ */
    3. 

  3. /* 圈子用ubb标签插入样式定义 		    */
    4. 

  4. /* Author:			Hulihutu		*/
    5. 

  5. /* Copyright:		www.shopnc.com	*/
    6. 

  6. /* Create Date:		Mar-31-2013		*/
    7. 

  7. /* Retrofit Date:	Apr-09-2013		*/
    8. 

  8. /* ================================ */
    9. 

  9. 

  10. /*==============================================*/
    11. 

  11. /* UBB工具条按钮图标样式							*/
    12. 

  12. /* templates/default/layout/group.php 模板适用	*/
    13. 

  13. /*==============================================*/
    14. 

  14. .ubb-bar { height: 24px; padding: 8px 0; border-bottom: solid 1px #D4DEE3;}
    15. 

  15. .ubb-bar a.font-family, .ubb-bar a.font-size { line-height: 16px; background: url(../images/quickthread_ubb.gif) no-repeat scroll 100% 0; height: 16px; border-style: solid; border-width: 1px; border-color: #848484 #E0E0E0 #E0E0E0 #848484; text-indent: 0; padding: 3px 24px 3px 8px; margin-left: 8px;}
    16. 

  16. .ubb-bar a:hover.font-family, .ubb-bar a:hover.font-size { background-position: 100% -23px;}
    17. 

  17. .ubb-bar a.font-family { width: 50px;}
    18. 

  18. .ubb-bar a.font-size { width: 30px;}
    19. 

  19. .ubb-bar a { line-height: 16px; float: left; padding: 3px 5px; position: relative; z-index: 2;}
    20. 

  20. .ubb-bar a:hover { text-decoration: none; color: #333; background-color: #F1F4F5; border-radius: 2px;}
    21. 

  21. .ubb-bar a i { background: url(../images/quickthread_ubb.gif) no-repeat scroll; vertical-align: middle; display: inline-block; width: 16px; height: 16px; margin-right: 2px; }
    22. 

  22. .ubb-bar a i.font-b { background-position: -2px -50px;}
    23. 

  23. .ubb-bar a i.font-i { background-position: -22px -50px;}
    24. 

  24. .ubb-bar a i.font-u { background-position: -42px -50px;}
    25. 

  25. .ubb-bar a i.font-color { background-position: -62px -50px;}
    26. 

  26. .ubb-bar a i.url { background-position: -82px -50px;}
    27. 

  27. .ubb-bar a i.upload-img { background-position: -102px -50px;}
    28. 

  28. .ubb-bar a i.url-img { background-position: -122px -50px;}
    29. 

  29. .ubb-bar a i.flash { background-position: -230px -50px;}
    30. 

  30. .ubb-bar a i.url-goods { background-position: -142px -50px;}
    31. 

  31. .ubb-bar a i.smilier { background-position: -162px -50px;}
    32. 

  32. .ubb-bar a i.high { background-position: -210px -50px;}
    33. 

  33. .ubb-bar span.line { background: url(../images/quickthread_ubb.gif) no-repeat scroll -190px -50px; width: 1px; height: 16px; float: left; margin: 2px 10px;}
    34. 

  34. .ubb-bar .high-reply { color: #528CC6; float: right; margin-right: 6px;}
    35. 

  35. /*鼠标触及显示选择类型样式*/
    36. 

  36. .ubb-layer { background-color: #FFF; display: none; border: solid 1px #D6DFE3; position: absolute; z-index: 1; top: 22px; box-shadow: 2px 2px 1px rgba(204,204,204, 0.25);}
    37. 

  37. .ubb-layer .arrow { background: url(../images/circle_pics.png) no-repeat scroll -60px -10px; width: 11px; height: 6px; position: absolute; z-index: 1; top: -6px;}
    38. 

  38. .ubb-bar a.font-family:hover .font-family-layer, 
    39. 

  39. .ubb-bar a.font-size:hover .font-size-layer, 
    40. 

  40. .ubb-bar a.font-color-handle:hover .font-color-layer, 
    41. 

  41. .ubb-bar a.smilier-handle:hover .smilier-layer { display: block}
    42. 

  42. 

  43. /*字体选择*/
    44. 

  44. .font-family-layer { padding: 4px; left: -1px;}
    45. 

  45. .font-family-layer .arrow { left: 20px;}
    46. 

  46. .font-family-layer span { font-size: 12px; line-height: 16px; display: block; clear: both; padding: 3px 16px 3px 8px; border-top: solid 1px #D6DFE3; cursor: pointer; }
    47. 

  47. .font-family-layer span:hover { background-color: #F1F4F5;}
    48. 

  48. span.ff01 { font-family: "microsoft yahei"; border:none;}
    49. 

  49. span.ff02 { font-family: "宋体";}
    50. 

  50. span.ff03 { font-family: "黑体";}
    51. 

  51. span.ff04 { font-family: Arial;}
    52. 

  52. span.ff05 { font-family: Verdana;}
    53. 

  53. span.ff06 { font-family: Helvetica;}
    54. 

  54. span.ff07 { font-family: Tahoma;}
    55. 

  55. 

  56. /*字体大小*/
    57. 

  57. .font-size-layer { padding: 4px; left: -1px;}
    58. 

  58. .font-size-layer .arrow { left: 20px;}
    59. 

  59. .font-size-layer span { display: block; clear: both; padding: 3px 16px 3px 8px; border-top: solid 1px #D6DFE3; cursor: pointer; }
    60. 

  60. .font-size-layer span:hover { background-color: #F1F4F5;}
    61. 

  61. span.s12 { font-size: 12px; line-height: 16px; border:none;}
    62. 

  62. span.s14 { font-size: 14px; line-height: 18px;}
    63. 

  63. span.s16 { font-size: 16px; line-height: 20px;}
    64. 

  64. span.s18 { font-size: 18px; line-height: 22px;}
    65. 

  65. span.s20 { font-size: 20px; line-height: 24px;}
    66. 

  66. span.s22 { font-size: 22px; line-height: 26px;}
    67. 

  67. span.s24 { font-size: 24px; line-height: 28px;}
    68. 

  68. 

  69. /*字体颜色*/
    70. 

  70. .font-color-layer { width: 128px; padding: 2px; left: -50px;}
    71. 

  71. .font-color-layer .arrow { left: 55px;}
    72. 

  72. .font-color-layer span { font-size: 0; line-height: 0; display: inline-block; width: 12px; height: 12px; margin: 2px; cursor: pointer;}
    73. 

  73. span.c-000000 { background-color: #000000;}
    74. 

  74. span.c-A0522D { background-color: #A0522D;}
    75. 

  75. span.c-556B2F { background-color: #556B2F;}
    76. 

  76. span.c-006400 { background-color: #006400;}
    77. 

  77. span.c-483D8B { background-color: #483D8B;}
    78. 

  78. span.c-000080 { background-color: #000080;}
    79. 

  79. span.c-4B0082 { background-color: #4B0082;}
    80. 

  80. span.c-2F4F4F { background-color: #2F4F4F;}
    81. 

  81. span.c-8B0000 { background-color: #8B0000;}
    82. 

  82. span.c-FF8C00 { background-color: #FF8C00;}
    83. 

  83. span.c-808000 { background-color: #808000;}
    84. 

  84. span.c-008000 { background-color: #008000;}
    85. 

  85. span.c-008080 { background-color: #008080;}
    86. 

  86. span.c-0000FF { background-color: #0000FF;}
    87. 

  87. span.c-708090 { background-color: #708090;}
    88. 

  88. span.c-696969 { background-color: #696969;}
    89. 

  89. span.c-FF0000 { background-color: #FF0000;}
    90. 

  90. span.c-F4A460 { background-color: #F4A460;}
    91. 

  91. span.c-9ACD32 { background-color: #9ACD32;}
    92. 

  92. span.c-2E8B57 { background-color: #2E8B57;}
    93. 

  93. span.c-48D1CC { background-color: #48D1CC;}
    94. 

  94. span.c-4169E1 { background-color: #4169E1;}
    95. 

  95. span.c-800080 { background-color: #800080;}
    96. 

  96. span.c-808080 { background-color: #808080;}
    97. 

  97. span.c-FF00FF { background-color: #FF00FF;}
    98. 

  98. span.c-FFA500 { background-color: #FFA500;}
    99. 

  99. span.c-FFFF00 { background-color: #FFFF00;}
    100. 

  100. span.c-00FF00 { background-color: #00FF00;}
    101. 

  101. span.c-00FFFF { background-color: #00FFFF;}
    102. 

  102. span.c-00BFFF { background-color: #00BFFF;}
    103. 

  103. span.c-9932CC { background-color: #9932CC;}
    104. 

  104. span.c-C0C0C0 { background-color: #C0C0C0;}
    105. 

  105. span.c-FFC0CB { background-color: #FFC0CB;}
    106. 

  106. span.c-F5DEB3 { background-color: #F5DEB3;}
    107. 

  107. span.c-FFFACD { background-color: #FFFACD;}
    108. 

  108. span.c-98FB98 { background-color: #98FB98;}
    109. 

  109. span.c-AFEEEE { background-color: #AFEEEE;}
    110. 

  110. span.c-ADD8E6 { background-color: #ADD8E6;}
    111. 

  111. span.c-DDA0DD { background-color: #DDA0DD;}
    112. 

  112. 

  113. /*附件上传*/
    114. 

  114. .upload-btn { width: 78px; height: 22px; float: left; position: relative; z-index: 1;}
    115. 

  115. .upload-btn:hover { color: #333; background-color: #F1F4F5; border-radius: 2px;}
    116. 

  116. .upload-btn span { width: 78px; height: 22px; position: absolute; left: 0; top: 0; z-index: 1;}
    117. 

  117. .upload-btn span i.upload-img { background: url(../images/quickthread_ubb.gif) no-repeat scroll -102px -50px; width: 16px; height: 16px; margin: 4px 5px 2px 5px; float: left; }
    118. 

  118. .upload-btn span .upload-button { line-height: 22px; float: left;}
    119. 

  119. .upload-file { width:78px; height: 22px; opacity:0; filter: alpha(opacity=0); position: absolute; z-index: 9; top:0; left:0;}
    120. 

  120. 

  121. 

  122. /*链接*/
    123. 

  123. .url-layer, #xs .url-layer { background-color: #FFF; display: block; width: 200px; padding: 2px 10px; left: -50px;}
    124. 

  124. .url-layer, #xs .url-layer { background-color: #FFF; display: block; width: 200px; padding: 2px 10px; left: -50px;}
    125. 

  125. .url-layer .arrow { left: 72px;}
    126. 

  126. .url-layer label { line-height: 24px;}
    127. 

  127. .url-layer .button { background-color: #F7F7F7; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F7F7F7', endColorstr='#E7E7E7'); background-image: -webkit-gradient( linear, left top, left bottom, from(#F7F7F7), to(#E7E7E7)) ; background-image: -moz-linear-gradient(top, #F7F7F7, #E7E7E7); width: 60px; height: 24px; margin: 6px 0; border: solid 1px #D8D8D8; cursor: pointer; }
    128. 

  128. 

  129. /*视频*/
    130. 

  130. .flash-layer, #xs .flash-layer { background-color: #FFF; display: block; width: 200px; padding: 2px 10px; left: -50px;}
    131. 

  131. .flash-layer, #xs .flash-layer { background-color: #FFF; display: block; width: 200px; padding: 2px 10px; left: -50px;}
    132. 

  132. .flash-layer .arrow { left: 72px;}
    133. 

  133. .flash-layer label { line-height: 24px;}
    134. 

  134. .flash-layer .button { background-color: #F7F7F7; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F7F7F7', endColorstr='#E7E7E7'); background-image: -webkit-gradient( linear, left top, left bottom, from(#F7F7F7), to(#E7E7E7)) ; background-image: -moz-linear-gradient(top, #F7F7F7, #E7E7E7); width: 60px; height: 24px; margin: 6px 0; border: solid 1px #D8D8D8; cursor: pointer; }
    135. 

  135. 

  136. 

  137. /*表情*/
    138. 

  138. .smilier-layer, #xs .smilier-layer { background-color: #FFF; width: 260px; padding: 2px; left: -50px;}
    139. 

  139. .smilier-layer .arrow { left: 72px;}
    140. 

  140. .smilier-layer span { font-size: 0; line-height: 0; display: inline-block; width: 16px; height: 16px; padding: 2px; border: solid 1px #FFF; cursor: pointer;}
    141. 

  141. .smilier-layer span:hover { border-color: #D4DEE3;}
    142. 

  142. 

  143. /*==========================================================*/
    144. 

  144. /* 弹出窗口插入图片、商品等样式									*/
    145. 

  145. /* templates/default/layout/group.choose_goods.php          */
    146. 

  146. /* templates/default/layout/group.choose_image.php 模板适用	*/
    147. 

  147. /*==========================================================*/
    148. 

  148. .choose-goods, .choose-image { padding: 0; margin: 0; border: 0;}
    149. 

  149. 

  150. /*插入切换卡导航*/
    151. 

  151. .choose-goods .tabs-nav, .choose-image .tabs-nav { background: #FFF url(../images/border-line.gif) repeat-x center bottom; padding-left: 10px; margin: 10px 0 0 0; overflow: hidden;}
    152. 

  152. .choose-goods .tabs-nav li, .choose-image .tabs-nav li { float:left;}
    153. 

  153. .choose-goods .tabs-nav li a, .choose-image .tabs-nav li a { line-height: 20px; background-color: #F7F7F7; float: left; padding: 2px 8px; margin-left: 2px; border: solid #E7E7E7 1px; cursor: pointer;}
    154. 

  154. .choose-goods .tabs-nav li:hover a:hover, .choose-image .tabs-nav li:hover a:hover { text-decoration: none; color: #333;}
    155. 

  155. .choose-goods .tabs-nav li.tabs-selected a, .choose-image .tabs-nav li.tabs-selected a { font-weight: 600; color: #333; background-color: #FFF; margin-bottom: -1px; border-bottom-color: #FFF; }
    156. 

  156. 

  157. /*插入切换卡内容*/
    158. 

  158. .choose-goods .tabs-panel, .choose-image .tabs-panel { border: none;}
    159. 

  159. .choose-goods .tabs-panel li, .goods-gallery .list li { position: relative; z-index:1; }
    160. 

  160. .choose-goods .tabs-panel li a, .goods-gallery .list li a { text-align: center; vertical-align: middle; display: table-cell; border: solid 2px #FFF; overflow: hidden; }
    161. 

  161. .choose-goods .tabs-panel li a:hover, .goods-gallery .list li a:hover { border-color: #F2F2F2;}
    162. 

  162. .choose-goods .tabs-panel li a.selected, .goods-gallery .list li a.selected { border-color: #68C082;}
    163. 

  163. .choose-goods .tabs-panel li a { width: 90px; height: 90px;}
    164. 

  164. .choose-goods .tabs-panel li img { max-width: 90px; max-height: 90px; margin-top:expression(90-this.height/2);  *margin-top:expression(45-this.height/2);}
    165. 

  165. .choose-goods .tabs-panel li img, .goods-gallery .list li img { opacity: 0.65;}
    166. 

  166. .choose-goods .tabs-panel li:hover img, .goods-gallery .list li:hover img, .choose-goods .tabs-panel li a.selected img, .goods-gallery .list li a.selected img  { opacity: 1;}
    167. 

  167. 

  168. .choose-goods .tabs-panel li a p.extra, .goods-gallery .list li a p.extra { font-weight: 600; line-height: 24px; color: #FFF; filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#BF44AA5D', endColorstr='#BF44AA5D');background:rgba(68,170,93,0.75); text-align: center; position: absolute; visibility: hidden; z-index: 9; bottom: 2px; left:2px; text-shadow: 1px 1px 0 rgba(0,102,51,0.65); }
    169. 

  169. .choose-goods .tabs-panel li a p.extra { width: 90px; }
    170. 

  170. .goods-gallery .list li a p.extra { width: 60px;}
    171. 

  171. .choose-goods .tabs-panel li a.selected p.extra, .goods-gallery .list li a.selected p.extra { visibility: visible;}
    172. 

  172. 

  173. 

  174. 

  175. 

  176. /*已选择的商品*/
    177. 

  177. .choose-goods dl.selected-goods { clear: both; background-color: #F7F7F7; padding: 10px 0; overflow: hidden;}
    178. 

  178. .choose-goods dl.selected-goods dt { font-size: 14px; font-weight: 600; line-height: 20px; color: #17997A; float: left; padding: 7px 12px;}
    179. 

  179. .choose-goods dl.selected-goods dd { background-color: #FFF; width: 30px; height: 30px; float: left; padding: 1px; margin-right: 5px; border: dotted 1px #E7E7E7; position: relative; z-index: 1; cursor: pointer;}
    180. 

  180. 

  181. .choose-goods dl.selected-goods dd:hover { border-style: solid; border-color: #FF2626;}
    182. 

  182. .choose-goods dl.selected-goods dd em { background: url(../images/circle_pics.png) no-repeat scroll -240px 0; width: 7px; height: 7px; position: absolute; z-index: 1; top: 0; right:0; visibility: hidden; }
    183. 

  183. .choose-goods dl.selected-goods dd:hover em { visibility: visible;}
    184. 

  184. .choose-goods dl.selected-goods dd p{ text-align: center; vertical-align: middle; display: table-cell; width: 30px; height: 30px; overflow: hidden; }
    185. 

  185. .choose-goods dl.selected-goods dd img { max-width: 30px; max-height: 30px; margin-top: expression(30-this.height/2); *margin-top: expression(15-this.height/2);}
    186. 

  186. 

  187. /*已购收藏商品为空*/
    188. 

  188. .choose-goods .tabs-panel .norecord { font-size: 14px; line-height: 32px; text-align: center; display: block; margin: 50px 0;}
    189. 

  189. 

  190. /*插入网络图片*/
    191. 

  191. .choose-image .url-image, .goods-gallery { padding: 15px 15px 0 15px;}
    192. 

  192. .goods-api { padding: 15px;}
    193. 

  193. .choose-image .url-image label, .goods-api label { font-size: 12px; font-weight: 600; line-height: 16px; }
    194. 

  194. .choose-image .url-image label i, .goods-gallery .nav i, .goods-api label i { background: transparent url("../images/quickthread_ubb.gif") no-repeat scroll -122px -50px; vertical-align: middle; display: inline-block; width: 16px; height: 16px; margin-right: 2px;}
    195. 

  195. .goods-api label i { background-position: -142px -50px;}
    196. 

  196. .choose-image .url-image .text, .goods-api .text{ margin-top: 8px;}
    197. 

  197. .goods-api p a { font-size: 14px; line-height: 28px; color: #FFF; background-color: #CCC; text-align: center; vertical-align: bottom; display: inline-block; width: 48px; height: 28px; border: solid 1px #BBB; border-radius: 2px; text-shadow: 1px 1px 0 rgba(0,0,0,0.1);}
    198. 

  198. .goods-api p a:hover { text-decoration: none; background-color: #BBB; border-color: #AAA;}
    199. 

  199. 

  200. /*插入相册图片*/
    201. 

  201. .choose-image .goods-gallery .nav { font-weight: 600; padding-bottom: 8px; border-bottom: solid 1px #F7F7F7;}
    202. 

  202. .choose-image .goods-gallery .list { padding-bottom: 12px; margin-top: 10px; overflow: hidden;}
    203. 

  203. .choose-image .goods-gallery .list li { width: 64px; height: 64px; float: left; margin: 0 5px; }
    204. 

  204. .choose-image .goods-gallery .list li a { width: 60px; height: 60px;}
    205. 

  205. .choose-image .goods-gallery .list li img { max-width: 60px; max-height: 60px; margin-top:expression(100-this.height/2);}
    206. 

  206. 

  207. /*翻页样式*/
    208. 

  208. .ubb-pagination { clear: both; margin: 0 auto;  border-bottom:  solid 1px #F7F7F7;}
    209. 

  209. .ubb-pagination ul { text-align: center; padding: 0 0 10px 0; margin: 0;}
    210. 

  210. .ubb-pagination ul li { display: inline-block; list-style-type: none;}
    211. 

  211. .ubb-pagination ul li { *display: inline;}
    212. 

  212. .ubb-pagination li span { font-size: 12px; line-height: 20px; color: #777; background-color: #FFF; list-style-type: none; display: inline; height: 20px; float: left; padding: 0px 5px; margin: 0px 1px; border:solid 1px #EEE; }
    213. 

  213. .ubb-pagination li a span , .ubb-pagination li a:visited span { color: #74BF90; text-decoration: none; cursor:pointer;}
    214. 

  214. .ubb-pagination li a:hover span, .ubb-pagination li a:active span{ color: #DB7C1E; background-color: #AFD9EE; border-color: #74BF90; cursor:pointer;}
    215. 

  215. .ubb-pagination li span.currentpage { color: #FFF; font-weight: 600;  background-color: #44AA5D; border-color: #44AA5D;}
    216. 

  216. 

  217. /*提交操作*/
    218. 

  218. .handle-bar { clear: both; padding: 12px 18px; overflow: hidden;}
    219. 

  219. .handle-bar .button { font-size: 14px; font-weight: 600; line-height: 20px; color: #FFFFFF; background-color: #7DCC95; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7DCC95', endColorstr='#67BF81'); background-image: -webkit-gradient( linear, left top, left bottom, from(#7DCC95), to(#67BF81)) ; background-image: -moz-linear-gradient(top, #7DCC95, #67BF81); height: 20px; padding: 2px 10px; border: 1px solid #74BF90; cursor: pointer; box-shadow: 1px 1px 0 rgba(153,153,153,0.25); }
    220. 

  220. .handle-bar .button:hover { text-decoration: none; color: #FFF; background-color: #67BF81; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#67BF81', endColorstr='#7DCC95'); background-image: -webkit-gradient( linear, left top, left bottom, from(#67BF81), to(#7DCC95)) ; background-image: -moz-linear-gradient(top, #67BF81, #7DCC95); box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);}
    221. 

  221. 

  222. 

  223. 

  224.