Skip to content

Instantly share code, notes, and snippets.

View ae-elaine-axis's full-sized avatar

ae-elaine-axis

View GitHub Profile
@ae-elaine-axis
ae-elaine-axis / Ecwid CSS
Created January 30, 2019 05:57
Text instead of zero prices
/* change 0 price to Free on product page */
.ecwid-productBrowser-ProductPage .product-details__product-price[content="0"] .details-product-price__value{
display: none;
}
.ecwid-productBrowser-ProductPage .product-details__product-price[content="0"]:after {
content: "Free";
}
/* change 0 price to Free on product grid */
@ae-elaine-axis
ae-elaine-axis / Ecwid CSS
Created January 4, 2019 13:53
Move the Related Products section to the right
.ec-size .ec-store .grid__wrap .grid__products {
justify-content: flex-end;
}
.ec-size .ec-store .ec-related-products__title {
text-align: right;
}
/* Or this alternative code */
@ae-elaine-axis
ae-elaine-axis / gist:ac7572e54cc2e72a8619d766bd9634c6
Created December 4, 2018 05:39
Show full image in gallery in mobile view
html#ecwid_html body#ecwid_body .ec-size:not(.ec-size--s) .ec-store .details-gallery__thumb, html#ecwid_html body#ecwid_body .ec-size:not(.ec-size--s) .ec-store .details-gallery__thumb .details-gallery__thumb-img {
min-width: 100%;
background-size: contain;
max-width: 100%;
}
@ae-elaine-axis
ae-elaine-axis / Ecwid CSS
Created November 9, 2018 08:30
Thicker radio buttons
код, который делает толще кружок на radio buttons в опциях:
.ec-size .ec-store .form-control__radio-view::after {
border: 3px solid #acbcc9;
}
ec-size .ec-store .form-control__radio-view-inner {
top: 3px;
left: 3px;
width: calc(100% - 6px);
@ae-elaine-axis
ae-elaine-axis / gist:e0396a32a6065a38995c0a69760f471b
Created November 5, 2018 06:42
Discount Coupons - unfolded field
.ec-size .ec-store .ec-cart-coupon:not(.ec-cart-coupon--applied) .ec-cart-coupon__button--apply {
display: block;
}
.ec-size .ec-store .ec-cart-coupon .ec-cart-coupon__wrap {
display: flex;
align-items: center;
height: auto;
}
@ae-elaine-axis
ae-elaine-axis / gist:b8fc4393a75dc68f4b4ab0e96fa32c86
Created October 11, 2018 14:15
Preloader/placeholder for Single Product widget
/* add to the site's theme and use another gif image if you wish */
html#ecwid_html body#ecwid_body .ecwid.ecwid-SingleProduct-v2.ecwid-SingleProduct-v2-bordered:not(.loaded) {
content: "";
margin: auto;
display: block;
height: 100px;
width:100px;
background-image: url(https://media.giphy.com/media/xUA7b8HnXheyI13tiU/giphy.gif);
background-position: center center;
background-repeat: no-repeat;
@ae-elaine-axis
ae-elaine-axis / gist:ec85e0cd5d6b4230a43f504f971317aa
Created September 28, 2018 11:40
Mobile: one column instead of 2
.ec-size .ec-store .grid__products[data-cols="2"] .grid-product:nth-child(n+1),
.ec-size .ec-store .grid__categories--advanced[data-cols="1"] .grid-category:nth-child(n+1) {
width: 100%;
}
@ae-elaine-axis
ae-elaine-axis / Ecwid CSS
Created September 14, 2018 08:10
Search panel on Starter Site (unfolded and on top)
.search-panel {
display: block !important;}
.search-panel .text-field {
position: fixed !important;
top: 0px !important;
left: 0px !important;
}
@ae-elaine-axis
ae-elaine-axis / Ecwid CSS
Created September 7, 2018 13:12
To show images in the mobile gallery in the same proportion
```
html#ecwid_html body#ecwid_body .ec-size:not(.ec-size--s) .ec-store .details-gallery__thumb, html#ecwid_html body#ecwid_body .ec-size:not(.ec-size--s) .ec-store .details-gallery__thumb .details-gallery__thumb-img {
max-width: 100%;
background-size: contain;
}
```
/* или, наоборот, расширить первую */
@ae-elaine-axis
ae-elaine-axis / Ecwid CSS Flex
Created May 29, 2018 11:43
Featured products above categories
.ec-size .ec-store .ec-grid { display: flex; flex-direction: column; }
.ec-size .ec-store .ec-grid .grid__categories { order: 4; }
.ec-size .ec-store .ec-grid .ec-page-title { order: 1; }
.ec-size .ec-store .ec-grid .grid__sort { order: 2; }
.ec-size .ec-store .ec-grid .grid__products { order: 3; }
.ec-size .ec-store .ec-grid .grid__list { order: 5; }