暫無描述

xshop-woocommerce.css 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420
  1. /*Woocommerce style*/
  2. del {
  3. color: #ee0b0b !important;
  4. }
  5. .woocommerce ul.products li.product,
  6. .woocommerce-page ul.products li.product {
  7. box-shadow: 0px 3px 40px rgba(0,0,0,0.20);
  8. padding: 10px 10px 20px;
  9. text-align: center;
  10. }
  11. .woocommerce #respond input#submit,
  12. .woocommerce a.button,
  13. .woocommerce button.button,
  14. .woocommerce input.button,
  15. .woocommerce #respond input#submit.alt,
  16. .woocommerce a.button.alt,
  17. button.button,
  18. .entry-content table thead th,
  19. .woocommerce button.button.alt,
  20. .woocommerce input.button.alt{
  21. vertical-align: middle;
  22. background:#ba7d5c;
  23. color: #fff;
  24. transition: 0.5s;
  25. }
  26. .woocommerce .star-rating span{
  27. color:#ba7d5c;
  28. }
  29. .woocommerce h2{
  30. margin-bottom: 1rem;
  31. font-size: 26px;
  32. }
  33. .woocommerce h2.widget-title {
  34. font-size: 18px;
  35. margin-bottom: 1rem;
  36. }
  37. .widget .woocommerce-product-search button[type=submit] {
  38. width: 97%;
  39. margin-top: 5px;
  40. }
  41. .woocommerce ul.product_list_widget li img {
  42. width: 50px;
  43. }
  44. .woocommerce .page-title {
  45. padding: 1.5rem;
  46. box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  47. margin-bottom: 3rem;
  48. text-align: center;
  49. }
  50. .woocommerce #respond input#submit:hover,
  51. .woocommerce a.button:hover,
  52. .woocommerce button.butto:hover,
  53. a.added_to_cart.wc-forward,
  54. .woocommerce #respond input#submit.alt:hover,
  55. .woocommerce a.button.alt:hover,
  56. button.button:hover,
  57. .woocommerce button.button.alt:hover,
  58. .woocommerce input.button.alt:hover {
  59. background:#464646;
  60. color: #fff;
  61. }
  62. a.added_to_cart.wc-forward{
  63. margin: 0;
  64. line-height: 1;
  65. cursor: pointer;
  66. position: relative;
  67. text-decoration: none;
  68. overflow: visible;
  69. padding: .618em 1em;
  70. font-weight: 700;
  71. border-radius: 3px;
  72. left: auto;
  73. color: #fff;
  74. background-color: #464646;
  75. border: 0;
  76. display: inline-block;
  77. background-image: none;
  78. box-shadow: none;
  79. text-shadow: none;
  80. }
  81. select {
  82. border: 1px solid #ccc;
  83. box-shadow: 0px 3px 40px rgba(0,0,0,0.20);
  84. padding: 3px;
  85. border-radius: 0;
  86. }
  87. .xfront-shop h1.page-title {
  88. display: none;
  89. }
  90. .woocommerce ul.products li.product a {
  91. display: block;
  92. }
  93. .woocommerce ul.products li.product a img{
  94. border: 1px solid #ededed;
  95. }
  96. .xfront-shop .site-content .widget-area {
  97. margin-top: 50px;
  98. }
  99. a.add_to_cart_button.added {
  100. display: none;
  101. }
  102. a.added_to_cart.wc-forward{
  103. margin-top: 1em;
  104. }
  105. .woocommerce tbody, .woocommerce thead, .woocommerce tfoot{
  106. display: table-header-group;
  107. }
  108. .woocommerce .col2-set .col-1,
  109. .woocommerce-page .col2-set .col-1,
  110. .woocommerce .col2-set .col-2,
  111. .woocommerce-page .col2-set .col-2 {
  112. display: block;
  113. max-width: inherit;
  114. }
  115. .woocommerce-billing-fields .form-row,
  116. .woocommerce-shipping-fields .form-row,
  117. .woocommerce form .form-row {
  118. display: block;
  119. }
  120. .woocommerce .col2-set .col-1,
  121. .woocommerce-page .col2-set .col-1,
  122. .woocommerce .col2-set .col-2,
  123. .woocommerce-page .col2-set .col-2 {
  124. max-width: unset;
  125. }
  126. input[type=checkbox]{
  127. vertical-align: bottom;
  128. }
  129. .woocommerce ul.order_details {
  130. border: 1px solid #ededed;
  131. padding: 10px 20px;
  132. }
  133. nav.woocommerce-MyAccount-navigation ul {
  134. margin: 0;
  135. padding: 0;
  136. list-style: none;
  137. }
  138. nav.woocommerce-MyAccount-navigation ul li a {
  139. border: 1px solid #ededed;
  140. display: block;
  141. padding: 10px;
  142. }
  143. nav.woocommerce-MyAccount-navigation ul li a:hover {
  144. background: #ededed;
  145. }
  146. .woocommerce-Address {
  147. border: 1px solid #ededed;
  148. padding: 10px;
  149. }
  150. .woocommerce form.login, .woocommerce form.register{
  151. max-width: 500px
  152. }
  153. .woocommerce-notice {
  154. background: #ededed;
  155. padding: 10px;
  156. border-left: 3px solid #ccc;
  157. font-weight: 700;
  158. }
  159. .woocommerce-notice.woocommerce-notice--success {
  160. padding: 10px;
  161. border-left: 4px solid green;
  162. }
  163. .xshoping-cart {
  164. z-index: 9999999;
  165. position: relative;
  166. }
  167. .xshoping-bag {
  168. position: fixed;
  169. right: 95px;
  170. bottom: 10px;
  171. background: #fff;
  172. padding: 10px;
  173. border-radius: 5px;
  174. -webkit-box-shadow: 0px 3px 40px rgba(0,0,0,0.20);
  175. box-shadow: 0px 3px 40px rgba(0,0,0,0.20);
  176. -webkit-transition: all 0.4s ease 0s;
  177. -o-transition: all 0.4s ease 0s;
  178. transition: all 0.4s ease 0s;
  179. cursor: pointer;
  180. min-width: 55px;
  181. text-align: center;
  182. min-height: 50px;
  183. }
  184. .xshoping-bag:hover{
  185. background-color:#ededed;
  186. }
  187. .modal-backdrop{
  188. z-index: 999999;
  189. }
  190. .xshoping-cart .modal{
  191. z-index: 999999999;
  192. top:10%;
  193. bottom: -10%;
  194. }
  195. span.count.cart-contents {
  196. position: absolute;
  197. top: -10px;
  198. background: #77A464;
  199. padding: 5px;
  200. border-radius: 50%;
  201. width: 35px;
  202. height: 35px;
  203. line-height: 24px;
  204. color: #fff;
  205. font-size: 14px;
  206. -webkit-box-shadow: 0px 3px 40px rgba(0,0,0,0.20);
  207. box-shadow: 0px 3px 40px rgba(0,0,0,0.20);
  208. }
  209. li.woocommerce-mini-cart-item.mini_cart_item {
  210. border-bottom: 1px solid #ededed;
  211. }
  212. a.btn.btn-secondary.text-light {
  213. color: #fff !important;
  214. }
  215. .cart_totals h2 {
  216. font-size: 24px;
  217. }
  218. .woocommerce table.shop_attributes th {
  219. background: inherit;
  220. }
  221. .woocommerce table.shop_attributes td {
  222. padding-left: 10px;
  223. }
  224. .woocommerce table.shop_attributes {
  225. border-left: 1px solid #ccc;
  226. }
  227. ol.flex-control-nav.flex-control-thumbs {
  228. background: #ededed;
  229. padding: 10px !important;
  230. border-top: 1px solid #ccc;
  231. }
  232. .woocommerce span.onsale {
  233. padding: 0.1em;
  234. font-weight: 400;
  235. }
  236. .pswp__caption__center {
  237. text-align: center;
  238. }
  239. .woocommerce div.product div.images .flex-control-thumbs li img {
  240. border-radius: 50px;
  241. width: 80%;
  242. max-width: 75px;
  243. border: 1px solid #222;
  244. }
  245. .woocommerce div.product .woocommerce-tabs .panel {
  246. margin: 0 0 2em;
  247. padding: 5px 15px;
  248. }
  249. .xshop-single-product {
  250. box-shadow: 0 0.2rem 2.8rem rgb(36 36 36 / 10%);
  251. margin-top: 0;
  252. padding: 15px;
  253. display: block;
  254. overflow: hidden;
  255. margin-bottom: 2em;
  256. }
  257. .woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content {
  258. border-radius: 1em;
  259. background-color: #ccc;
  260. border: 1px solid #ccc;
  261. box-shadow: 0 0.2rem 2.8rem rgba(36,36,36,.1);
  262. }
  263. .woocommerce-tabs.wc-tabs-wrapper {
  264. box-shadow: 0 0.2rem 2.8rem rgba(36,36,36,.1);
  265. }
  266. .woocommerce-product-gallery {
  267. border-right: 1px solid #ededed;
  268. }
  269. .woocommerce div.product .woocommerce-tabs ul.tabs {
  270. padding-left: 5px;
  271. }
  272. .woocommerce ul.products li.product .star-rating {
  273. display: block;
  274. margin: 0 auto 5px;
  275. }
  276. .woocommerce-checkout.woocommerce-page .content-area,
  277. .woocommerce-cart.woocommerce-page .content-area,
  278. .no-shop-widget .content-area {
  279. width: 100%;
  280. margin: 0;
  281. }
  282. .woocommerce-checkout.woocommerce-page aside.widget-area,
  283. .woocommerce-cart.woocommerce-page aside.widget-area {
  284. display: none;
  285. }
  286. .wc_payment_methods .woocommerce-info:before {
  287. left: -14px;
  288. top: 10px;
  289. }
  290. .woocommerce #content table.cart td.actions .input-text,
  291. .woocommerce table.cart td.actions .input-text,
  292. .woocommerce-page #content table.cart td.actions .input-text,
  293. .woocommerce-page table.cart td.actions .input-text{
  294. min-width: 120px;
  295. }
  296. .theme-green .woocommerce #respond input#submit.alt,
  297. .theme-green .woocommerce a.button.alt,
  298. .theme-green button.button,
  299. .theme-green .widget_price_filter .ui-slider .ui-slider-handle,
  300. .theme-green .widget_price_filter .ui-slider .ui-slider-range,
  301. .theme-green .woocommerce .widget_price_filter .ui-slider .ui-slider-handle,
  302. .theme-green .entry-content table thead th,
  303. .theme-green .woocommerce button.button.alt,
  304. .theme-green .woocommerce input.button.alt{
  305. background-color: #1B5E20 !important;
  306. color:#fff !important;
  307. }
  308. .theme-blue .woocommerce #respond input#submit.alt,
  309. .theme-blue .woocommerce a.button.alt,
  310. .theme-blue button.button,
  311. .theme-blue .widget_price_filter .ui-slider .ui-slider-handle,
  312. .theme-blue .widget_price_filter .ui-slider .ui-slider-range,
  313. .theme-blue .entry-content table thead th,
  314. .theme-blue .woocommerce button.button.alt,
  315. .theme-blue .woocommerce input.button.alt{
  316. background-color: #2196F3 !important;
  317. color:#fff !important;
  318. }
  319. .theme-indigo .woocommerce #respond input#submit.alt,
  320. .theme-indigo .woocommerce a.button.alt,
  321. .theme-indigo button.button,
  322. .theme-indigo .widget_price_filter .ui-slider .ui-slider-handle,
  323. .theme-indigo .widget_price_filter .ui-slider .ui-slider-range,
  324. .theme-indigo .entry-content table thead th,
  325. .theme-indigo .woocommerce button.button.alt,
  326. .theme-indigo .woocommerce input.button.alt{
  327. background-color: #9575CD !important;
  328. color:#fff !important;
  329. }
  330. .theme-brown .woocommerce #respond input#submit.alt,
  331. .theme-brown .woocommerce a.button.alt,
  332. .theme-brown button.button,
  333. .theme-brown .widget_price_filter .ui-slider .ui-slider-handle,
  334. .theme-brown .widget_price_filter .ui-slider .ui-slider-range,
  335. .theme-brown .entry-content table thead th,
  336. .theme-brown .woocommerce button.button.alt,
  337. .theme-brown .woocommerce input.button.alt{
  338. background-color: #3E2723 !important;
  339. color:#fff !important;
  340. }
  341. .theme-bluegrey .woocommerce #respond input#submit.alt,
  342. .theme-bluegrey .woocommerce a.button.alt,
  343. .theme-bluegrey button.button,
  344. .theme-bluegrey .widget_price_filter .ui-slider .ui-slider-handle,
  345. .theme-bluegrey .widget_price_filter .ui-slider .ui-slider-range,
  346. .theme-bluegrey .entry-content table thead th,
  347. .theme-bluegrey .woocommerce button.button.alt,
  348. .theme-bluegrey .woocommerce input.button.alt{
  349. background-color: #607D8B !important;
  350. color:#fff !important;
  351. }
  352. .quantity input[type=number] {
  353. min-height: 40px;
  354. }
  355. /*Pagination style*/
  356. .woocommerce nav.woocommerce-pagination ul,
  357. .woocommerce nav.woocommerce-pagination ul li {
  358. border: none;
  359. }
  360. .woocommerce nav.woocommerce-pagination ul li {
  361. box-shadow: 0px 0.5rem 1rem rgba(0,0,0,.15)!important;
  362. margin-right: 5px;
  363. }
  364. .woocommerce nav.woocommerce-pagination ul li a:focus,
  365. .woocommerce nav.woocommerce-pagination ul li a:hover,
  366. .woocommerce nav.woocommerce-pagination ul li span.current{
  367. background: #ba7d5c;
  368. color: #fff;
  369. }
  370. @media only screen and (min-width: 768px) and (max-width: 991px) {
  371. .woocommerce .products ul,
  372. .woocommerce ul.products {
  373. margin: 0 0 1em;
  374. padding: 0;
  375. list-style: none outside;
  376. clear: both;
  377. display: flex;
  378. flex-flow: row wrap;
  379. }
  380. .woocommerce ul.products li.product,
  381. .woocommerce-page ul.products li.product {
  382. float: left;
  383. margin: 0 3% 2.992em 0;
  384. padding: 15px 0;
  385. position: relative;
  386. width: 47%;
  387. margin-left: 0;
  388. }
  389. }
  390. @media only screen and (max-width: 767px) {
  391. .xshoping-bag {
  392. position: fixed;
  393. left: 2px;
  394. right: inherit;
  395. bottom: 10px;
  396. padding: 10px;
  397. min-width: 30px;
  398. min-height: 30px;
  399. }
  400. span.count.cart-contents {
  401. top: -10px;
  402. padding: 5px;
  403. width: 20px;
  404. height: 20px;
  405. line-height: 11px;
  406. font-size: 14px;
  407. }
  408. }