Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

TOMweb

Member
  • Content Count

    50
  • Joined

  • Last visited

  1. Site URL: https://endive-denim-89ds.squarespace.com/hotels pw: 1404-Hello Hi all! On the "/hotels" page, the images look great on desktop, but the portrait images take too much space on mobile compared to the landscape images. I would like to force all image blocks to look like squares on mobile. Do y'all have any idea on how to do that? Best
  2. Hi all! I am working on a dark mode version of my website. I am trying to change the first section background image of the landing page to another image when the viewer uses dark mode, but can't manage to make it work. Here is what I tried so far: @media (prefers-color-scheme: dark) { [data-section-id="5feca0a7dc82f97fd38e575d"] .section-background img { visibility: hidden; } /* set new image */ [data-section-id="5feca0a7dc82f97fd38e575d"] .section-background { background-image: url(https://static1.squarespace.com/static/5f0cd7575142de45f1d531a7/t/5feca8261d1415656f7995
  3. Anyone interested in giving a shot at this? I'm still looking for help please
  4. Hey @NiceDay Create a gif with your logo file (.SVG) using Lottie for example, like below: - go to https://lottiefiles.com/svg-to-lottie - upload your SVG and export it as a JSON file. - go to https://lottiefiles.com/lottie-to-gif - upload your JSON file and use one of the animations provided. Export as a GIF. Then, make sure you upload This GIF via Design > Custom CSS > Manage Your Files, and get the URL. Then, go to Settings > Advanced > Code Injection > Footer Field and paste the code below. Make sure you put in your own gif URL at the botto
  5. Add to Design > Custom CSS @media screen and (max-width:767px) { div#page-section-YOURSECTIONID>.row>.col>.row>.col { width: 50% !important; float: left !important; } } πŸ™‚
  6. Site URL: https://endive-denim-89ds.squarespace.com/resorts pw: 1404-Hello Hi community, I have made a wall of images on my page that looks great on desktop, but feels way too long on mobile. I would like to display two images per row (kind of like an instagram page) for mobile screens only. I have tried with the code below that targets the section only, but it doesn't put the images side by side... Any help is appreciated. Thank you ! @media screen and (max-width:767px) { div#page-section-5fd63cbbc4373837b905ef57>.row { display: float; justify-content: space-be
  7. Okay, thank you so much for your help so far, it worked so well!
  8. @bangank36 Any idea how to smoothly de-shrink this section when we scroll back up? Many thanks for your help.
  9. Awesome, I can work with that!!! Thank you! πŸ™ ☺️ One last thing... Is there a way to ease the transition when we scroll back up? It just "pops" bigger now.
  10. Thank you @bangank36! is there a way to shrink the section height as well? I have now a huge gap between the image and the next section block...
  11. Site URL: https://endive-denim-89ds.squarespace.com/hotel-de-syeres https://endive-denim-89ds.squarespace.com/hotel-de-syeres pw: 1404-Hello Hello, I would like to know if it's possible to resize the first section background on scroll for mobiles? The image takes 100% viewport height on page load, but it crops a lot of the picture. The user should be able to view the full picture when he/she scrolls. Can it shrink on scroll to something like 20vh? Please advise, Many thanks!
  12. @tuanphan Yes I do, please! Thank you πŸ™‚
Γ—
Γ—
  • Create New...