Main topic: Adjusting Dawn theme “Image with text” sizing and layout, ensuring desktop/mobile compatibility, and exploring a wishlist icon on collection items.
Image resizing: Implemented CSS scaling (transform: scale) targeting specific section selectors to reduce image size. User confirmed results looked good.
Mobile compatibility: Added media queries—desktop scales images; mobile uses object-fit: contain to prevent cropping. A white background for the media area was applied; both views validated via screenshots.
Logo on mobile: Increased logo size by scaling .header__heading within a mobile media query; user confirmed success.
Section styling: Suggested a right-side border using a CSS linear-gradient background; user instead reordered sections and was satisfied with the layout.
Wishlist icon on collection items: User wants a heart icon; helper noted app-level support is needed for full functionality. CSS could place an icon visually but wouldn’t integrate with the app’s features; user uses “Swishlist” and will contact the app developer.
Notes: Multiple screenshots illustrate issues and outcomes. CSS and media queries (rules that apply by screen size), transform (scale images), and object-fit (controls image fit) are central.
Status: Design changes resolved; wishlist enhancement pending app support.
If you want this
here the code
#shopify-section-template--21636163502354__7d276f64-0f8b-4d45-9869-7de5bb75cdf6 .image-with-text__media {
background: white!important;
}
#shopify-section-template--21636163502354__7d276f64-0f8b-4d45-9869-7de5bb75cdf6 .image-with-text__media img {
transform: scale(0.7)!important
}