KatJarv

Hello, I've edited the page specific code for the Services page on this website. It all looks fine, but now the hamburger icon isn't clickable on mobile only. Any fix for this? www.atelieroleana.com/services This is the code I used: <style> .header-title-logo img { visibility: hidden; } .header-title-logo a { background-image: url(https://static1.squarespace.com/static/66450cd729042a460dc77564/t/66c8a41425fe5a501d52d437/1724425236241/AO+logo.png); background-size: cover; background-repeat: no-repeat; background-position: center center !important; } </style> <style> /* hide current image */ body.header--menu-open .header-title-logo img { visibility: hidden; } /* set new image on burger menu click */ body.header--menu-open .header-title-logo a { background-image: url(https://static1.squarespace.com/static/66450cd729042a460dc77564/t/66562062e0f15e62c166712b/1716920419436/Ao_new+white.png); background-size: cover; background-repeat: no-repeat; } </style> <style> .header-display-mobile { .header-title-logo { margin-left: 47px; } } </style> <style> /* header color */ /* navigation items */ header#header div.header-nav-item>a { color: #EFEDE8 !important; }

Hello, I would like to change the header on my portfolio page, as well as the project pages associated with the portfolio, but not on the other pages of my website. Does anyone know the code to make this header background a solid color (#EFEDE8) rather than gradient, make all navigation text and the hamburger the color #423C2B, and change the logo image (I have uploaded the image in site files in custom css)? https://atelieroleana.com/portfolio-2/victorian TIA

The fourth item in the Portfolio, on the bottom right. It currently is labelled "Name of Project - Coming Soon" on hover.

Hello, I'd like to make the fourth item in this portfolio grid unclickable. I've tried a few pieces of code that disable the link, but also disable hover. I'd like to have hover remain, but not click the project until the case study is ready. https://atelieroleana.com/portfolio-2

That worked to fix the Services page, but then made all of the other pages off centred. I only need this fix for the Services page. Should I put it in the page header code injection instead?

Hi, I've edited CSS and page header code injection (specific to this page) for a few things, one being to change the background colour of the header and the logo image for that page. It looks fine on desktop, but now in mobile, the logo is off centred (see attached). Any idea how to centre the logo in mobile, as well make it slightly bigger? Kathlyn https://www.atelieroleana.com/services

@Ziggy That worked!! Thank you!

Hi, I'm hoping to remove the faint square background on the slideshow banner arrows. I've tried this code, it worked at first, but is no longer working: /* Slideshow banner arrows */ .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-icon-background { background-color: transparent; } Any ideas? https://www.atelieroleana.com/home-2

@tuanphan It looks find when the desktop is wide (like your screenshot above), and in mobile, but in between (around 1100px), it's off centred. See below screenshots. It's easier to see when you open the menu overlay.

Hi @tuanphan! Thanks, this worked, but now the logo is centred on mobile but slightly off centred when it's on desktop but narrowed (See screenshots). Is there a fix for this? Website: atelieroleana.squarespace.com Password: ao

Hello, I have built a website with split screen navigation, but I find if I make my desktop narrower at all the navigation items begin to stack/overlap. As a solution, I hoped to force mobile nav earlier than 787 px (1100 px). It seems to be working, but when I do so, the logo is quite off centre (photo attached). Anyone know how to fix this? Website: atelieroleana.squarespace.com Password: ao Code I am currently using: @media screen and (max-width:1100px) { /* hide navigation */ .header-nav { display: none; } /* Hide header button */ .header-actions { display: none; } /* show burger */ .header-burger { display: flex; } /* Show overlay mobile menu */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } }

Hi all, Can anyone tell me why this gallery isn't lining up evenly? Everywhere else on the website it is. Any fixes for this? TIA! Also, this website is still 7.0

Hi! Me again! This carousel gallery section has been such a hang up on this website. I am looking to increase the height of the gallery on desktop and mobile. As you can see below, the section takes up about half the screen size... I'd like the whole section to be taller, taking up most of the screen on desktop as well as on mobile. Every time I try to change code to do this, it increases the size of the section but not the images within it. website: https://alyssawright.squarespace.com/home-1 password: hello Thanks in advance 🙂

Hi Tuanphan, thank you for that. That code didn't really accomplish what I was hoping. I still want all of the slides to be the same height. I changed the crop settings and I'm getting closer. But now I'd just like to close the gap between the portrait orientation photos and the photos next to it (rather than having the white gap) . https://alyssawright.squarespace.com/ password: hello

Hi! I am working on a photographer's website. She has a banner at the top of her page that is a carousel gallery block, rotating through her work. I've set image crop to 3:2 because I want the photos to stretch to fit the entire block, but I'd love to be able to have a rotation of landscape and portrait photos (3:2, or 2:3, depending on the photo) all set to fit the same height. Does anyone know the code to make this happen? Website: https://alyssawright.squarespace.com/ password: hello