nwatkins

@tuanphan The intro sentence on my landing page usually changes color as you hover over it but is broken with the new code, my profile picture on the landing page changes from black and white to color when you hover over it but doesn't when there is the new code and then the arrows that are below those elements doesn't work either

@tuanphan It works buts it breaks a lot of other elements on my page. Any thoughts?

@tuanphan Can you help me with this? I haven't been able to figure it out yet. Thanks!

Site URL: https://www.nickwatkinsdesign.com/ Hi! I was wondering if anyone knew how to change the slideOut animation to a fade out animation? Here's my code below. <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script> <div class="splash-wrapper"> <lottie-player src="https://assets10.lottiefiles.com/packages/lf20_obzpck27.json" background="transparent" speed="1" style="width: 400px; height: 400;" loop autoplay> </lottie-player> </div> <style> .splash-wrapper{ position: fixed; z-index: 9999; background-color: #ffffff; height: 100vh; width: 100vw; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; animation-name: slideOut; animation-fill-mode: forwards; animation-duration: 3s; animation-delay: 1s; } @keyframes slideOut{ from{margin-left: 0vw;} to{margin-left: -100vw;} } </style>

@tuanphan Hi! Nope, would love some help.

@tuanphan Can you help with this at all? Would really appreciate it!

Site URL: https://www.nickwatkinsdesign.com/ Hi! I'm trying to change my loading screen animation from the sliding out to the left to a fading animation. I have changed the "animation-name" to fadeout but it stills slides to the left. Can someone help me? <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script> <div class="splash-wrapper"> <lottie-player src="https://assets10.lottiefiles.com/packages/lf20_obzpck27.json" background="transparent" speed="1" style="width: 400px; height: 400;" loop autoplay> </lottie-player> </div> <style> .splash-wrapper{ position: fixed; z-index: 9999; background-color: #ffffff; height: 100vh; width: 100vw; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; animation-name: slideOut; animation-fill-mode: forwards; animation-duration: 3s; animation-delay: 1s; } @keyframes slideOut{ from{margin-left: 0vw;} to{margin-left: -100vw;} } </style> Thanks!

Some or all of the corners are getting cut off a little bit, it's not a smooth corner. Here's a photo below: See how the top part of the rounded corner has a little edge to it? Let me know if theres a way to fix that, thanks!

@tuanphan Can you please help me with my site? My image is partially getting cut off on the radius. Here's my code: #block-yui_3_17_2_1_1630454751537_9796 img{ border-radius: 10% !important; } Here's the page: https://www.nickwatkinsdesign.com/contact

Worked! Thank you!

@iamdavehart Where would I input the javascript? I want to change a /work/uiux-mockups to link to my other portfolio with a /uiux-mockups. So I'm guessing the code would be this below but don't know where to insert my javascript code block. Thanks! <script> let link = document.querySelector(".grid-item[href='/work/uiux-mockups']"); if (link) { link.setAttribute("href","/uiux-mockups"); } </script>

Site URL: https://www.nickwatkinsdesign.com/ Hi! I just viewed my site on mobile and realized that my profile image in the home page is broken and hides behind my different projects and then my resume on the resume page is all warped and stretched. Can someone please help me fix these things? Thank you!

Site URL: https://www.nickwatkinsdesign.com/ Hi! I was wondering if anyone knew how to only apply my loading page to the initial opening of my website? I want it to act more as a welcome or cover page just a loading page that appears every time you go back to the main home page. Let me know, thanks! Url: https://www.nickwatkinsdesign.com/

Site URL: https://www.nickwatkinsdesign.com/ Hi! I was wondering if anyone knew how to only apply my loading page to the initial opening of my website? I want it to act more as a welcome or cover page just a loading page that appears every time you go back to the main home page. Let me know, thanks! Url: https://www.nickwatkinsdesign.com/

Hi! Is there a way to apply this code to separate image blocks? I don't like the formatting of the gallery that squarespace provides for what I am trying to do and want to apply this lightbox technique to images by themselves on a page. Also what is the RGBA code to make the box fully white? Mine comes up gray. Thanks!