WolfFrancis

Here is the key: /*targets menu text font*/ .header-menu-nav-item a { font-size: 24px; font-family: Futura } /*targets menu containters*/ .header-menu-nav-item a { position: relative; bottom: 20vh; display: block; margin: 1.4vw 5vw; transition: opacity 250ms cubic-bezier(.4,0,.2,1); }

I have found that this part of the code is making the hamburger links not work. Specifically changing the line height or margins breaks it: /*targets menu text items*/ .header-menu-nav-item a { font-size: 24px; line-height: 0; margin: 3.5vh 10vw; font-family: Futura } How can I customize the the menu text but not break the links?

I got the shopping cart back, but now I the top level link within the hamburger is not working on desktop. Have you ever seen anything like that @tuanphan? For example, if you click (on desktop) The hamburger, then foundation, the "about" link does not work. This seems to be the case throughout the menu. Any ideas? Here's the code I have running now: @font-face { font-family: SmileComix; src: url(https://static1.squarespace.com/static/638e4a86cbe97808c985de4e/t/63e1552aac02ac126cd4adef/1675711786366/Smilecomix.ttf); } h1 { font-family: SmileComix; font-size: 25pt; font-weight: 400; /*for dropshadow on h1 the third px number is blur*/ text-shadow: 2px 1px 0px black; } /* Force burger on desktop */ .header-burger { display: flex !important; order: 2 !important; padding-left: 100 !important; } .header--menu-open .header-menu { opacity: 1 !important; visibility: visible !important } .header-nav { visibility: hidden !important } .header-actions-action{ margin-right: 35px !important; } @media screen and (min-width:768px) { .header-menu { left:unset; width: 100% } } /*targets menu text items*/ .header-menu-nav-item a { font-size: 24px; line-height: 0; margin: 3.5vh 10vw; font-family: Futura } /*Targets the gallery TEXT*/ .gallery-section .gallery-caption p { letter-spacing: 0.01em !important; line-height: 1.2em !important; font-weight: 800 !important; font-size: .75em !important; } /*adjusts the space below gallery captions*/ .gallery-slideshow-wrapper { margin-bottom: 70px !important; } /*targets the name of the month on the event calendar*/ .yui3-squarespacecalendar .compact-layout .yui3-calendar-header h1 { font-family: 'Futura'!important; font-weight: 700!important; text-shadow: none!important; } .yui3-squarespacecalendar .yui3-calendar-header h1 { font-family: 'Futura'!important; font-weight: 700!important; text-shadow: none!important; } /*targets the name of the event on the event calendar pop out*/ .yui3-squarespacecalendar .flyoutitem-title { font-family: 'Futura'!important; font-weight: 700!important; text-shadow: none!important; } /*targets event title on the event detail page*/ .eventitem-title { font-family: 'futura-pt'!important; font-weitght: 700!important; text-shadow: none!important; } /*targets event title on the main event page*/ .eventlist-title .eventlist-title-link { font-family: 'futura-pt'!important; font-weitght: 800!important; text-shadow: none!important; }

@tuanphan Thanks! The only problem I see now is that the shopping cart is gone, and I'm not quite sure how to get it back. Here's what I am running now: /* Force burger on desktop */ .header-burger { display: flex !important; order: 2 !important; padding-left: 100 !important; } .header--menu-open .header-menu { opacity: 1 !important; visibility: visible !important } .header-nav,.header-actions { visibility: hidden !important } @media screen and (min-width:768px) { .header-menu { left:unset; width: 100% } } /*targets menu text items*/ .header-menu-nav-item a { font-size: 24px; line-height: 0; margin: 3.5vh 10vw; font-family: Futura }

@tuanphan I removed the part of the CSS that was making the mobile menu appear NOT full screen as a temporary fix. But now suddenly many of the nav links are simply unresponsive. I am really not sure what is going on on now. Do you have any ideas? .header--menu-open .header-menu {opacity: 1; visibility: visible;width: 255; margin-left: 20vw;box-shadow: -5px 5px 15px #000}

Sorry, I thought that was included in the post. It's songbirdsfoundation.org

So I have some custom CSS on our site to force the mobile menu on desktop, which seems to be working great. We've just noticed today, however, that when a user clicks into a dropdown, the first layer of the menu shoots off to the left. This is pictured in the secondary.png image attached. I realize that because I have made the head menu smaller than full screen this is effecting the situation, but I am hoping to have both layers of the menu visible. I hope that is clear. I am not sure how to word it. I can't seem to figure out what to target to bring the first layer of the menu back on to our menu background. Does anyone have any ideas? Thanks in advance for any ideas. Site URL: songbirdsfoundation.org Here is the custom code I have running right now: @media screen and (max-width: 5000px) { /* Display burger icon at all widths and align right */ .header .header-burger { display: flex; order: 2 !important; padding-left: 100 !important; } /* Make burger menu visible at all widths */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } /* Hide primary navigation menu */ .header .header-title-nav-wrapper .header-nav { display: none; } /*makes mobile menu NOT full screen*/ .header--menu-open .header-menu { opacity: 1; visibility: visible; width: 255; margin-left: 20vw; box-shadow: -5px 5px 15px #000} /* Moves cart to left and keeps space away from burger*/ .header-actions--right .header-actions-action { margin: 0 0 0 -5.799999999999997vw; }} /*targets menu text items*/ .header-menu-nav-item a { font-size: 24px; line-height: 0; margin: 3.5vh 10vw; font-family: Futura } UPDATE: Now a bunch of my nav links are just unresponsive 😞 I'm not sure what has changed.

Hello! I see in the documentation that we can limit a search block to a specific blog or collection, but I'd really like it to search the current page only. I am open to other solutions as well. The use case: I am listing about 100 songs and artists for sheet music. We are using an accordion block differentiated by genre to make the list a little more user friendly. Screenshots attached. This works fine for browsing. Alphabetizing will help too, but I'd love to have a search function for situations where students are trying to straight to a particular sheet music without having to click through the accordion. Very open to ideas!