Jump to content

moonlitdesign

Circle Member
  • Posts

    106
  • Joined

  • Last visited

Everything posted by moonlitdesign

  1. Hey @Nick_SquareKicker I can't seem to get the mobile horizontal scroll working on my site whatsoever! it is leaving a large blank gap underneath the section and not completing the full scroll of the section. any help would be amazing! thanks! www.moonlitdesign.uk/design-services
  2. Hey! i don't know why this has stopped working as it was fine this morning. i had an overlapping image but now the section below is showing above / on top of the image. i've tried z-index but no luck. here's current code: @media screen and (min-width:768px) { #block-dcd7158a35cf1cf082ed { transform:translateY(50%); z-index:9999!important;} } www.moonlitdesign.uk/design-services
  3. thanks! this in theory works, but makes the menu when open from another page even more messed up. im not sure why it is appearing differently from different pages! crazy.
  4. thank you so much for trying ! i managed to contact the creator with what you said and their reply was this: "There's an arrow down in the top right corner of the CSS panel. You click it and you get among the options "View Compiled CSS". Alternatively you can just add .css at the end of the CodePen link. Just don't forget to remove the #btn--yp styles, which are strictly for the YouTube link (linking back to this video from CodePen)." if that helps?
  5. thank you for your time!! i'm wanting to use it as part of a loading screen - not sure where to put the code for that 🙂
  6. Hey i'm trying to add this pre loading animation to my site from code pen, but am not having any luck. https://codepen.io/thebabydino/pen/GRqKwqX is this possible? thank you
  7. yeah i managed to solve the issue, however have a few other issues! - the counters show in different alignment when you open the menu from different pages. meaning it touches the borders when it shouldn't. opening the menu from the homepage is the correct look of how the numbers should be. - and the sub / secondary drop down nav menu should not have counters. i tried to add: :not(.header-menu-nav-item .header-menu-nav-folder) to my menu page number code but didn't work! - the close icon is also not centred in the circle border
  8. i've managed to get a circle border, but the close icon is in the wrong place. it needs nudging into the center of the circle / left. updated code: /* burger */ .burger-inner>div { width: 50% !important; } .burger-inner>div { left: 0 !important; right: 0 !important; } .burger-box {border:1px solid #1d1d1d; border-radius:50%; }
  9. Hi there, im looking to add a circle border around the burger menu icon but having difficulty. the code im trying is: /* burger */ .burger-inner>div { width: 50% !important; } .burger-inner>div { left: unset !important; right: 0 !important; } .burger {border:1px solid #1d1d1d; border-radius:50%; } www.moonlitdesign.uk/home-old
  10. Hey @tuanphan i paid for a plugin 🙂 I do however need help to disable the menu counter on the sub navigation, and make sure the menu counter is in the same position (a little higher than the page menu links) when the menu is opened from all pages. currently, when you open the menu from the homepage, the counters are in line with the menu links, and when you open the menu from any other page, the counters are showing much higher! any thoughts would be so appreciated thank you www.moonlitdesign.uk/home-old
  11. THANK YOU ! that worked perfectly. is there a way to increase the size of the gap between them so they are full width? @tuanphan
  12. hi there, my mobile menu is showing centered only from the homepage. it should be left aligned always! www.moonlitdesign.uk/home-old
  13. @jnmillre did you manage to write the code? would be super incredible! thank you https://moonlitdesign.uk/home-old
  14. Could you please share your code for this effect, this is exactly what im after!!! thank you @Lauren_C https://moonlitdesign.uk/home-old @tuanphan
  15. hey there, my blog summary item is showing up a background on live mobile testing, when it should be transparent. is there a way to fix this please, nothing i've tried is working!
  16. hi there, i'd like to replace the mobile carousel arrows with (PREV) and (NEXT) just like on desktop version, and be able to control the space inbetween the middle of them, any help would be fab thank you! www.moonlitdesign.uk/home-old
  17. is there a way to do this for the mobile arrows too? its working on desktop for me but not mobile ! I tried this code: @media screen and (max-width:767px) { .mobile-arrows { display: none !important;} .desktop-arrows { display:block!important;} .user-items-list-carousel__arrow-container { width:450px!important; margin: auto!important; } } but looks awful! they aren't showing centred, or the correct colour on mobile #1d1d1d - They have a blue link colour. - i need a way to be able to adjust the space in the middle between the 'arrows' so it doesn't affect the visibility of the quote. www.moonlitdesign.uk/home-old @tuanphan thank you!
  18. www.moonlitdesign.uk/design-services Hey, looking to add a border to this arch image shape container, but nothing seems to be working!
  19. @tuanphan This is an incredible start thank you so much! I changed the width to '0' to make it completely vanish! there's still the issue that it starts to disappear straight away, rather than about 600 scroll down the page, like this code: <script> $(window).scroll(function(){ var scroll = $(window).scrollTop(); if(scroll > 700){ $('header#header').addClass('scrollNav'); } else{ $('header#header').removeClass('scrollNav'); } }); </script> <style> - is there a way to add a scroll time like this for the big MOONLIT image too ? - is there also a way to add a left direction to the 'shrink' animation? so it looks like its disappearing into the corner and being replaced with the new logo 😄 thank you!
  20. I'm also looking for this, all the codes i've tried seem to be outdated and are not working! www.moonlitdesign.uk/design-services
  21. yes please that would be great! the text needs to not show up as a link though, so no underline or hand pointer if thats okay! also, could the transition of the image appearing be smoother? thank you so much!!
  22. Hi there, i've got my nav logo how i want it, now i need to complete the illusion with the large logo image. i need to shrink the 'MOONLIT' image down into the left corner on scroll, on the same time/slightly before the nav logo appears. i'm using this @tuanphan code in page > settings >advanced >header: <script> $(window).scroll(function(){ var scroll = $(window).scrollTop(); if(scroll > 700){ $('header#header').addClass('scrollNav'); } else{ $('header#header').removeClass('scrollNav'); } }); </script> <style> header#header img { opacity: 0; transition: all 0.3s; } .scrollNav img { opacity: 1 !important; transition: all 0.3s; } </style> along with CSS > website tools: //hide logo until scroll// .homepage .header-title-logo, .homepage .header-mobile-logo a { opacity: 0; position: relative; top: -10vh; transition: all .75s; } .homepage .shrink .header-title-logo, .homepage .shrink .header-mobile-logo a { opacity: 1; position: relative; top: 0; }
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.