MinerMan2022

Suer thing. Please see below. //.gallery-fullscreen-slideshow[data-transition="fade"] .gallery-fullscreen-slideshow-item[data-active="true"] .gallery-fullscreen-slideshow-item-src { transition: opacity 1400ms ease-in-out !important; -webkit-transition: opacity 1400ms ease-in-out !important; -ms-transition: opacity 1400ms ease-in-out !important; -moz-transition: opacity 1400ms ease-in-out !important; -o-transition: opacity 1400ms ease-in-out !important; } [id*="img-hover"] { width: 100% !important; background-repeat: no-repeat; background-size: cover !important; background-position: center top; } /*Poster Image Hover Effect */ .gallery-grid:hover .image-overlay { background: blue !important; opacity: 0.8; transition: 2s; } .gallery-grid .image-overlay { opacity: 0; transition: 2s; } /*Image Replacement Mobile*/ @media screen and (min-width: 641px) { #block-yui_3_17_2_1_1663703993306_10826 { display: none; } } @media screen and (max-width: 641px) { #block-yui_3_17_2_1_1663703993306_8469, #block-0c68a2fea174830212ac { display: none; } } #yui_3_17_2_1_1664293275526_856 { color: #71acb6 !important; } /*Overlay Menu*/ .heaver-nav { background: #71acb6 !important; } .header-title-logo a { color: white; } /*Awards & Rec Blocks Replacement Mobile*/ @media screen and (min-width: 641px) { #block-yui_3_17_2_1_1664382186561_3699 { display: none; } } @media screen and (max-width: 641px) { #block-yui_3_17_2_1_1664298812838_201675, #block-yui_3_17_2_1_1664298812838_206454 { display: none; } } body#collection-632a043689cd704b54cf7f13 .gallery-grid-wrapper { display: flex; justify-content: center; } body#collection-632a043689cd704b54cf7f13 .gallery-grid-item-wrapper { width: 400px; height: auto; } .image-block-wrapper { border-radius: 0px !important; } /*Post Image Correction Border radius*/ .summary-thumbnail { border-radius: 0px !important; } /*Bottom Navigation Image Correction Border radius*/ .sqs-block-image-figure { border-radius: 0px !important; } /*Bottom Navigation Text Color Correction*/ .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title-h3 { font-color: #71acb6 !important; } h1 { font-family: "Proxima Nova" !important; } h2 { font-family: "Proxima Nova" !important; } h3 { font-family: "Proxima Nova" !important; } h4 { font-family: "Proxima Nova" !important; } p { font-family: "Adobe Garamound Pro" !important; } .summary-title { font-family: "Proxima Nova" !important; } .gallery-caption-content { font-family: "Proxima Nova" !important; color: #3f676d; } .sqm-links-tabs .tabs-title h2.sm-active span:after { content: ""; width: 30px; height: 8px; background: url(https://static1.squarespace.com/static/627a07de3945684c806adb72/t/633c7d9b3084aa238280bc0b/1664908699263/teal-arrow-right-hover.png) no-repeat; background-size: contain; position: absolute; top: 14px; right: 10px; } .sqmuse-burger-menu.show-burger.menu .header-title-logo img { filter: none !important; } .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title h3 { color: #71acb6 !important; } .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title-wrapper + .image-subtitle-wrapper .image-subtitle h4 { color: #3f676d; } .sqm-image-boxes .image-card-wrapper:after { content: ""; width: 30px; height: 8px; background: url(https://static1.squarespace.com/static/627a07de3945684c806adb72/t/633c7d9b3084aa238280bc0b/1664908699263/teal-arrow-right-hover.png) no-repeat; background-size: contain; position: absolute; bottom: 35px; transform: translateX(-50%); } .sqm-image-boxes .sqs-block-image:hover .image-card-wrapper:after { filter: invert(100%); } .view-list .image-wrapper { border-radius: 0px !important; } .header-title-logo img { filter: none !important; } .sqmuse-burger-menu .header-nav { background: #f7f7f7 !important; } body { background-color: #f7f7f7 !important; } .sqmuse-burger-menu .sm-burger-menu-email { font-family: "proxima-nova" !important; font-weight: 600px !important; } .header-menu-nav-item, .header-nav-wrapper a { font-family: "proxima-nova" !important; color: #3f676d !important; font-weight: 600px !important; } .sqm-cases-section.page-section > .content-wrapper { border-bottom: none !important; } .sqmuse-burger-menu .burger-close { left: unset !important; } .sqm-image-boxes .sqs-block-image:hover .design-layout-poster .image-subtitle h4, .sqm-image-boxes .sqs-block-image:hover .design-layout-poster .image-title h3 { color: #fff !important; } .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title h3 { color: #71acb6 !important; } .sqm-links-tabs .sqs-col-7 { background: rgba(229,224,217,.7)!important; padding: 25px 10px!important; box-sizing:border-box; z-index: 3; } .sqm-links-tabs .tabs-title h2 { color: #3f676d !important; } .sqs-block-image .image-block-outer-wrapper.image-block-v2 .image-overlay { background-color: rgba(229,224,217,.95)!important; border-right-style: solid !important; border-left-style: solid !important; border-width: 1px !important; border-color: #3f676d !important; } // Tuan Phan Code @media screen and (min-width:768px) { body#collection-632a043689cd704b54cf7f13 .gallery-grid-wrapper { display: flex; justify-content: center; body#collection-632a043689cd704b54cf7f13 .gallery-grid-item-wrapper{ width: 400px; height: auto; } } } //Hide Hamburger Menu @media screen and (min-width:641px) { a#desktopMenu { visibility: hidden !important; } } .sqm-image-boxes .sqs-layout:after { content: ""; width: 100%; height: 0px !important; background: #000; position: absolute; bottom: 95px; left: 0; } .gallery-grid-item img { object-fit: cover!important; }

Right now, if someone selects "Referral" the new field "Referral Name or Company Name" displays. We would like the "Referral Name or Company Name" to be able to be re-hidden - if the user decides to select FB/Insta/or Google instead. If you click referral the field displays as it should, but if I select FB/Insta/or Google after clicking Referral the "Referral name or Company Name" stays visible. Let me know if you have any other questions. Thank you.

Hi @tuanphan we are trying to execute something similar on our site. We were able to create the conditional form to where if someone selects "Referral" a new field populates underneath that field but I am having a hard time trying to figure out how to hide that field if someone decides to select another option like Facebook, Instagram, or Google? Is this possible in Squarespace to rehide a field? Below is the site URL and password for your reference. We appreciate your expertise on this. Thank you! https://fiji-c1-jul.squarespace.com/contact password: DoveLove2022!

Sure thing. Please see below. //.gallery-fullscreen-slideshow[data-transition="fade"] .gallery-fullscreen-slideshow-item[data-active="true"] .gallery-fullscreen-slideshow-item-src { transition: opacity 1400ms ease-in-out !important; -webkit-transition: opacity 1400ms ease-in-out !important; -ms-transition: opacity 1400ms ease-in-out !important; -moz-transition: opacity 1400ms ease-in-out !important; -o-transition: opacity 1400ms ease-in-out !important; } [id*="img-hover"] { width: 100% !important; background-repeat: no-repeat; background-size: cover !important; background-position: center top; } /*Poster Image Hover Effect */ .gallery-grid:hover .image-overlay { background: blue !important; opacity: 0.8; transition: 2s; } .gallery-grid .image-overlay { opacity: 0; transition: 2s; } /*Image Replacement Mobile*/ @media screen and (min-width: 641px) { #block-yui_3_17_2_1_1663703993306_10826 { display: none; } } @media screen and (max-width: 641px) { #block-yui_3_17_2_1_1663703993306_8469, #block-0c68a2fea174830212ac { display: none; } } #yui_3_17_2_1_1664293275526_856 { color: #71acb6 !important; } /*Overlay Menu*/ .heaver-nav { background: #71acb6 !important; } .header-title-logo a { color: white; } /*Awards & Rec Blocks Replacement Mobile*/ @media screen and (min-width: 641px) { #block-yui_3_17_2_1_1664382186561_3699 { display: none; } } @media screen and (max-width: 641px) { #block-yui_3_17_2_1_1664298812838_201675, #block-yui_3_17_2_1_1664298812838_206454 { display: none; } } body#collection-632a043689cd704b54cf7f13 .gallery-grid-wrapper { display: flex; justify-content: center; } body#collection-632a043689cd704b54cf7f13 .gallery-grid-item-wrapper { width: 400px; height: auto; } .image-block-wrapper { border-radius: 0px !important; } /*Post Image Correction Border radius*/ .summary-thumbnail { border-radius: 0px !important; } /*Bottom Navigation Image Correction Border radius*/ .sqs-block-image-figure { border-radius: 0px !important; } /*Bottom Navigation Text Color Correction*/ .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title-h3 { font-color: #71acb6 !important; } h1 { font-family: "Proxima Nova" !important; } h2 { font-family: "Proxima Nova" !important; } h3 { font-family: "Proxima Nova" !important; } h4 { font-family: "Proxima Nova" !important; } p { font-family: "Adobe Garamound Pro" !important; } .summary-title { font-family: "Proxima Nova" !important; } .gallery-caption-content { font-family: "Proxima Nova" !important; color: #3f676d; } .sqm-links-tabs .tabs-title h2.sm-active span:after { content: ""; width: 30px; height: 8px; background: url(https://static1.squarespace.com/static/627a07de3945684c806adb72/t/633c7d9b3084aa238280bc0b/1664908699263/teal-arrow-right-hover.png) no-repeat; background-size: contain; position: absolute; top: 14px; right: 10px; } .sqmuse-burger-menu.show-burger.menu .header-title-logo img { filter: none !important; } .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title h3 { color: #71acb6 !important; } .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title-wrapper + .image-subtitle-wrapper .image-subtitle h4 { color: #3f676d; } .sqm-image-boxes .image-card-wrapper:after { content: ""; width: 30px; height: 8px; background: url(https://static1.squarespace.com/static/627a07de3945684c806adb72/t/633c7d9b3084aa238280bc0b/1664908699263/teal-arrow-right-hover.png) no-repeat; background-size: contain; position: absolute; bottom: 35px; transform: translateX(-50%); } .sqm-image-boxes .sqs-block-image:hover .image-card-wrapper:after { filter: invert(100%); } .view-list .image-wrapper { border-radius: 0px !important; } .header-title-logo img { filter: none !important; } .sqmuse-burger-menu .header-nav { background: #f7f7f7 !important; } body { background-color: #f7f7f7 !important; } .sqmuse-burger-menu .sm-burger-menu-email { font-family: "proxima-nova" !important; font-weight: 600px !important; } .header-menu-nav-item, .header-nav-wrapper a { font-family: "proxima-nova" !important; color: #3f676d !important; font-weight: 600px !important; } .sqm-cases-section.page-section > .content-wrapper { border-bottom: none !important; } .sqmuse-burger-menu .burger-close { left: unset !important; } .sqm-image-boxes .sqs-block-image:hover .design-layout-poster .image-subtitle h4, .sqm-image-boxes .sqs-block-image:hover .design-layout-poster .image-title h3 { color: #fff !important; } .sqm-image-boxes .sqs-block-image .design-layout-poster .image-title h3 { color: #71acb6 !important; } .sqm-links-tabs .sqs-col-7 { background: rgba(229,224,217,.7)!important; padding: 25px 10px!important; box-sizing:border-box; z-index: 3; } .sqm-links-tabs .tabs-title h2 { color: #3f676d !important; } .sqs-block-image .image-block-outer-wrapper.image-block-v2 .image-overlay { border-right-style: solid !important; border-left-style: solid !important; border-width: 1px !important; border-color: #3f676d !important; } // Tuan Phan Code @media screen and (min-width:768px) { body#collection-632a043689cd704b54cf7f13 .gallery-grid-wrapper { display: flex; justify-content: center; body#collection-632a043689cd704b54cf7f13 .gallery-grid-item-wrapper{ width: 400px; height: auto; } } } //Hide Hamburger Menu @media screen and (min-width:641px) { a#desktopMenu { visibility: hidden !important; } } .sqm-image-boxes .sqs-layout:after { content: ""; width: 100%; height: 0px !important; background: #000; position: absolute; bottom: 95px; left: 0; }

Thank you @tuanphan I hid the burger menu but now I'm unsure on how to bring the navigation items back for a traditional global menu. Would you be able to help us with this?

Thank you!

Hi @tuanphan sorry I did not explain clearly. The line in the middle of the boxes (highlighted in pink box below) Thank you.

Hi @tuanphan here is the screenshot. Thank you.

Hi @tuanphan we are trying to hide a border on our site that is located on the about and service pages at the bottom. Screenshot below. I've tried to inspect the element but I can't seem to locate it. Would you be able to take a look for us? Thank you! URL: https://martini-i3-may.squarespace.com/about Password: DoveLove2022!

Hi @tuanphan we are trying to hide the hamburger menu on our site as well and would like a traditional navigation to show if possible. I've added the code mentioned above but the hamburger menu is still displaying. Do you know what we can add to help remove it? Let us know. Thank you! Site URL: https://martini-i3-may.squarespace.com/our-team Password: DoveLove2022!

Hi @tuanphan I tried your code above as well and got the same result. On mobile the gallery is still cut off. Am I miss understanding something? Let me know. Thank you!

I was actually able to figure this out. Thank you. 🙂

Hi @tuanphan I added the code but the mobile view is still not displaying correctly. See screenshot below.

Correct. @tuanphan the color of the logo and the background of the menu.

Hi @tuanphan we are having a similar issue as mentioned above. We were able to add the code below to the site but it affected all of the image galleries, rather than just the one on the "Our Team" page which is the one we want it affect (We noticed this on mobile only - The desktop view is displaying correctly though.) Can you also help us to make sure the mobile view displays everyone correctly as well? Right now they are running off the page on the mobile view. body#collection-632a043689cd704b54cf7f13 .gallery-grid-wrapper { display: flex; justify-content: center; body#collection-632a043689cd704b54cf7f13 .gallery-grid-item-wrapper{ width: 400px; height: auto; } URL: https://martini-i3-may.squarespace.com/our-team Password: DoveLove2022! Thank you!

Hi @tuanphan we are experiencing a similar issue where we've tried adding custom css and the changes are taking. We'd like the overlay menu to be teal (#71ACB6) instead of cream and for the logo hover to be white instead of orange. Would you be able to take a look for us? Let us know what you think. Thank you! URL: https://martini-i3-may.squarespace.com/services Password: DoveLove2022!

Hi @tuanphan just following up on this. Thank you!

Hi @tuanphan with the new code the logo is jumping whenever you go to a new page. We would just like the logo to be at the top and everything else on the page to display under it. Is there a way to add padding to the bottom of the logo? I tried changing "padding-top" to "padding-bottom" in the code you provided but its not working. Let us know. Thank you!

Hi @tuanphan we would like the logo to have plenty of padding at the bottom of it. We would prefer it not overlap anything. Let me know if you have any other questions. Thank you.

Hi @tuanphan one last thing we noticed is the padding under the logo is still not coming through on mobile. Please see the screenshot below. Any way to adjust this? Let us know. Thank you for your help again. That worked perfectly. Thank you so much @tuanphan. 🙂

That worked perfectly. Thank you so much @tuanphan. 🙂

Sure thing @tuanphan. Sorry about that. The code as been added back in. I just noticed the logo on the home page is not centered anymore. Can you take a look at this? Thank you.

I tried that but it didn't work. Any other suggestions? @tuanphan

Hi @tuanphan after I implemented the code above the margin for the bottom of the logo is allowing things to creep up on top of it especially on mobile. I tried adding margin to just the bottom and removing the margin: 0; !important code but nothing happened. Is there another for me to add some space to give this room to breathe? Let me know. Thank you so much!

That worked perfectly! Thank you so much 🙂