You are here

commerce_add_to_cart_confirmation.css in Commerce add to cart confirmation 1.x

Same filename and directory in other branches
  1. 7 css/commerce_add_to_cart_confirmation.css
/**
 * Add to cart popin.
 */

.messages.messages--commerce-add-to-cart-confirmation {
  display: none;
}

/* Generic dialog theme */

.ui-corner-all.commerce-add-to-cart-confirmation {
  border: none;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

.ui-corner-all.commerce-add-to-cart-confirmation,
.ui-corner-top.commerce-add-to-cart-confirmation,
.ui-corner-left.commerce-add-to-cart-confirmation,
.ui-corner-tl.commerce-add-to-cart-confirmation {
  border-top-left-radius: 10px;
  -webkit-border-top-left-radius: 10px;
  -moz-border-top-left-radius: 10px;
}

.ui-corner-all.commerce-add-to-cart-confirmation,
.ui-corner-top.commerce-add-to-cart-confirmation,
.ui-corner-right.commerce-add-to-cart-confirmation,
.ui-corner-tr.commerce-add-to-cart-confirmation {
  border-top-right-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-top-right-radius: 10px;
}
.ui-corner-all.commerce-add-to-cart-confirmation,
.ui-corner-bottom.commerce-add-to-cart-confirmation,
.ui-corner-left.commerce-add-to-cart-confirmation,
.ui-corner-bl.commerce-add-to-cart-confirmation {
  border-bottom-left-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-bottom-left-radius: 10px;
}
.ui-corner-all.commerce-add-to-cart-confirmation,
.ui-corner-bottom.commerce-add-to-cart-confirmation,
.ui-corner-right.commerce-add-to-cart-confirmation,
.ui-corner-br.commerce-add-to-cart-confirmation {
  border-bottom-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-bottom-right-radius: 10px;
}

div.ui-dialog.commerce-add-to-cart-confirmation .ui-widget-header.ui-corner-all {
  box-shadow: none;
  background: none;
  padding-bottom: 19px;
}

/*buttons*/

div.ui-dialog.commerce-add-to-cart-confirmation button.button {
  padding: 10px 68px;
  border: solid 1px #37669d;
  background: white;
  border-radius: 45px;
  color: #37669d;
  font-weight: bold;
  outline: none;
}

div.ui-dialog.commerce-add-to-cart-confirmation button.button:hover {
  background: #005ba2;
  color: #fff;
}

div.ui-dialog.commerce-add-to-cart-confirmation button.button:nth-child(2) {
  background: #005ba2;
  color: #fff;
}

div.ui-dialog.commerce-add-to-cart-confirmation button.button:nth-child(2):hover {
  background: #ffffff;
  color: #37669d;
}

div.ui-dialog.commerce-add-to-cart-confirmation .ui-dialog-titlebar {
  color: #444;
  border: none;
  border-bottom: 1px solid #ccc;
}

div.ui-dialog.commerce-add-to-cart-confirmation .add-to-cart-confirmation.title {
  font-weight: bold;
}

.commerce-add-to-cart-confirmation .views-field-type {
  float: left;
  margin-right: 10px;
}

div.ui-dialog.commerce-add-to-cart-confirmation {
  padding-top: 38px;
  padding-left: 40px;
  padding-right: 51px;
}

div.ui-dialog.commerce-add-to-cart-confirmation .ui-dialog .ui-dialog-titlebarm,
div.ui-dialog.commerce-add-to-cart-confirmation .ui-dialog .ui-dialog-content {
  padding-left: 0;
}

/* Close button */
div.ui-dialog.commerce-add-to-cart-confirmation button.ui-dialog-titlebar-close {
  background: url("../images/btn_add-to-cart-close.png") no-repeat 0 0;
  width: 26px;
  height: 26px;
  border: none;
  margin-top: -30px;
  margin-right: -30px;
}

/* Product display */
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display {
  clear: both;
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content {
  padding: 15px;
  position: relative;
  width: 55%;
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .content .field-name-field-images {
  position: relative;
  width: 130px;
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .content .field-name-field-images img {
  border: #d7d7d7 solid 1px;
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .commerce-product-sku .commerce-product-sku-label,
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field .views-label,
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field .field-label {
  color: #878380;
  float: left; /* LTR */
  font-size: 12px;
  font-weight: bold;
  padding-right: 5px; /* LTR */
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field {
  clear: both;
  margin: 0;
  text-align: left; /* LTR */
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field .field-label {
  display: inline;
  float: left; /* LTR */
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .views-field-commerce-total {
  clear: both;
  font-size: 20px;
  margin-top: 25px;
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .views-field-commerce-total .views-label {
  float: left; /* LTR */
  padding-right: 5px; /* LTR */
}
div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .views-field-commerce-total .field-content {
  color: #2698f2;
  display: inline;
  float: right; /* LTR */
}

.commerce-add-to-cart-confirmation .messages {
  margin: 6px 0;
}

.commerce-add-to-cart-confirmation .views-row {
  position: relative;
}

.commerce-add-to-cart-confirmation .views-row .views-field-total-price__number {
  position: absolute;
  right: 37px;
  top: 15px;
  font-size: 16px;
}

File

css/commerce_add_to_cart_confirmation.css
View source
  1. /**
  2. * Add to cart popin.
  3. */
  4. .messages.messages--commerce-add-to-cart-confirmation {
  5. display: none;
  6. }
  7. /* Generic dialog theme */
  8. .ui-corner-all.commerce-add-to-cart-confirmation {
  9. border: none;
  10. box-shadow: 0 0 10px rgba(0,0,0,0.5);
  11. }
  12. .ui-corner-all.commerce-add-to-cart-confirmation,
  13. .ui-corner-top.commerce-add-to-cart-confirmation,
  14. .ui-corner-left.commerce-add-to-cart-confirmation,
  15. .ui-corner-tl.commerce-add-to-cart-confirmation {
  16. border-top-left-radius: 10px;
  17. -webkit-border-top-left-radius: 10px;
  18. -moz-border-top-left-radius: 10px;
  19. }
  20. .ui-corner-all.commerce-add-to-cart-confirmation,
  21. .ui-corner-top.commerce-add-to-cart-confirmation,
  22. .ui-corner-right.commerce-add-to-cart-confirmation,
  23. .ui-corner-tr.commerce-add-to-cart-confirmation {
  24. border-top-right-radius: 10px;
  25. -webkit-border-top-right-radius: 10px;
  26. -moz-border-top-right-radius: 10px;
  27. }
  28. .ui-corner-all.commerce-add-to-cart-confirmation,
  29. .ui-corner-bottom.commerce-add-to-cart-confirmation,
  30. .ui-corner-left.commerce-add-to-cart-confirmation,
  31. .ui-corner-bl.commerce-add-to-cart-confirmation {
  32. border-bottom-left-radius: 10px;
  33. -webkit-border-bottom-left-radius: 10px;
  34. -moz-border-bottom-left-radius: 10px;
  35. }
  36. .ui-corner-all.commerce-add-to-cart-confirmation,
  37. .ui-corner-bottom.commerce-add-to-cart-confirmation,
  38. .ui-corner-right.commerce-add-to-cart-confirmation,
  39. .ui-corner-br.commerce-add-to-cart-confirmation {
  40. border-bottom-right-radius: 10px;
  41. -webkit-border-bottom-right-radius: 10px;
  42. -moz-border-bottom-right-radius: 10px;
  43. }
  44. div.ui-dialog.commerce-add-to-cart-confirmation .ui-widget-header.ui-corner-all {
  45. box-shadow: none;
  46. background: none;
  47. padding-bottom: 19px;
  48. }
  49. /*buttons*/
  50. div.ui-dialog.commerce-add-to-cart-confirmation button.button {
  51. padding: 10px 68px;
  52. border: solid 1px #37669d;
  53. background: white;
  54. border-radius: 45px;
  55. color: #37669d;
  56. font-weight: bold;
  57. outline: none;
  58. }
  59. div.ui-dialog.commerce-add-to-cart-confirmation button.button:hover {
  60. background: #005ba2;
  61. color: #fff;
  62. }
  63. div.ui-dialog.commerce-add-to-cart-confirmation button.button:nth-child(2) {
  64. background: #005ba2;
  65. color: #fff;
  66. }
  67. div.ui-dialog.commerce-add-to-cart-confirmation button.button:nth-child(2):hover {
  68. background: #ffffff;
  69. color: #37669d;
  70. }
  71. div.ui-dialog.commerce-add-to-cart-confirmation .ui-dialog-titlebar {
  72. color: #444;
  73. border: none;
  74. border-bottom: 1px solid #ccc;
  75. }
  76. div.ui-dialog.commerce-add-to-cart-confirmation .add-to-cart-confirmation.title {
  77. font-weight: bold;
  78. }
  79. .commerce-add-to-cart-confirmation .views-field-type {
  80. float: left;
  81. margin-right: 10px;
  82. }
  83. div.ui-dialog.commerce-add-to-cart-confirmation {
  84. padding-top: 38px;
  85. padding-left: 40px;
  86. padding-right: 51px;
  87. }
  88. div.ui-dialog.commerce-add-to-cart-confirmation .ui-dialog .ui-dialog-titlebarm,
  89. div.ui-dialog.commerce-add-to-cart-confirmation .ui-dialog .ui-dialog-content {
  90. padding-left: 0;
  91. }
  92. /* Close button */
  93. div.ui-dialog.commerce-add-to-cart-confirmation button.ui-dialog-titlebar-close {
  94. background: url("../images/btn_add-to-cart-close.png") no-repeat 0 0;
  95. width: 26px;
  96. height: 26px;
  97. border: none;
  98. margin-top: -30px;
  99. margin-right: -30px;
  100. }
  101. /* Product display */
  102. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display {
  103. clear: both;
  104. }
  105. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content {
  106. padding: 15px;
  107. position: relative;
  108. width: 55%;
  109. }
  110. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .content .field-name-field-images {
  111. position: relative;
  112. width: 130px;
  113. }
  114. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .content .field-name-field-images img {
  115. border: #d7d7d7 solid 1px;
  116. }
  117. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .commerce-product-sku .commerce-product-sku-label,
  118. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field .views-label,
  119. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field .field-label {
  120. color: #878380;
  121. float: left; /* LTR */
  122. font-size: 12px;
  123. font-weight: bold;
  124. padding-right: 5px; /* LTR */
  125. }
  126. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field {
  127. clear: both;
  128. margin: 0;
  129. text-align: left; /* LTR */
  130. }
  131. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .field .field-label {
  132. display: inline;
  133. float: left; /* LTR */
  134. }
  135. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .views-field-commerce-total {
  136. clear: both;
  137. font-size: 20px;
  138. margin-top: 25px;
  139. }
  140. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .views-field-commerce-total .views-label {
  141. float: left; /* LTR */
  142. padding-right: 5px; /* LTR */
  143. }
  144. div.commerce-add-to-cart-confirmation .view-confirm-message-product-display .view-content .views-field-commerce-total .field-content {
  145. color: #2698f2;
  146. display: inline;
  147. float: right; /* LTR */
  148. }
  149. .commerce-add-to-cart-confirmation .messages {
  150. margin: 6px 0;
  151. }
  152. .commerce-add-to-cart-confirmation .views-row {
  153. position: relative;
  154. }
  155. .commerce-add-to-cart-confirmation .views-row .views-field-total-price__number {
  156. position: absolute;
  157. right: 37px;
  158. top: 15px;
  159. font-size: 16px;
  160. }