-
Posts
19 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by gracemoore
-
Code Blocks/Embed Code Block: Preview in Safe Mode Issue
gracemoore replied to kavsquires's topic in Customize with code
Hey @digitalink, yes managed to sort it! After aaaages trying to find a solution on Squarespace forum I came across this post which expressed the same problem. @Ziggy shared the below solution which worked for me... Try adding this to your Custom CSS, hoping it will hide the embed warning message and should allow you to shrink the block so you don't have to leave it overlapping the text block: html.squarespace-damask .sqs-blockStatus { display: none !important; } Hope it works for you too!- 15 replies
-
- code-injection
- code
-
(and 2 more)
Tagged with:
-
Code Blocks/Embed Code Block: Preview in Safe Mode Issue
gracemoore replied to kavsquires's topic in Customize with code
I have embedded a ConvertKit Form via a code block (Fluid Engine), however there appears to be a large area of extra space below the code block that I cannot get rid of (see attached screenshot). I have tried CSS to no avail and cannot drag the area/rows up any further than it currently is. Any ideas how I can remove this extra space below the embedded form? Link to page: https://www.gracemooreyoga.com/mentorship Any help is much appreciated ๐- 15 replies
-
- code-injection
- code
-
(and 2 more)
Tagged with:
-
Scroll down arrow not centred on mobile
gracemoore replied to gracemoore's topic in Customize with code
Yes - I fixed it, thankyou! -
Site URL: https://www.gracemooreyoga.com/new-home Page Password: ADMIN I am using code (see below) to add the scroll down arrow as displayed in the image, however on mobile devices the code is not quite centred. How can I get the arrow to be displayed exactly in the centre of the page on mobile? The code I am using is: <div class="scroll-down"></div> <style> .scroll-down { position: absolute; left: 50%; bottom: 10px; display: block; text-align: center; font-size: 20px; z-index: 100; text-decoration: none; text-shadow: 0; width: 20px; height: 20px; border-bottom: 1px solid white; border-right: 1px solid white; z-index: 9; left: 50%; -webkit-transform: translate(-50%, 0%) rotate(45deg); -moz-transform: translate(-50%, 0%) rotate(45deg); transform: translate(-50%, 0%) rotate(45deg); -webkit-animation: fade_move_down 2s ease-in-out infinite; -moz-animation: fade_move_down 2s ease-in-out infinite; animation: fade_move_down 2s ease-in-out infinite; } /*animated scroll arrow animation*/ @-webkit-keyframes fade_move_down { 0% { -webkit-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @-moz-keyframes fade_move_down { 0% { -moz-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -moz-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @keyframes fade_move_down { 0% { transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { transform:translate(0,10px) rotate(45deg); opacity: 0; } } </style> Any help would be greatly appreciated! TIA ๐
-
Amazing! Thank you so much ๐
-
Site URL: https://www.nicolacoulson.com/dream-big-baby-masterclass I'm using code to add the countdown timer displayed on this page. As you can see in the images, on desktop it is all displayed on one single line. However, on mobile the countdown splits across two lines. I am struggling to figure out how I can edit or amend the code to make the font smaller on mobile devices so that it is displayed on a single line. Any solutions or ideas? Here's the code that I'm using... <style> #countDownTimer{ color:#fff; display:inline-block; text-align:center; font-size:2rem} #countDownTimer .text{ font-weight: bold; display:inline-block; color:#fff; font-size:5rem; margin-bottom: -60px!important } #countDownTimer>div{ background:#BD5396; display:inline-block} #countDownTimer div>span{ margin-top:-40px!important; padding:30px; display:inline-block } </style> <script> // Set the date we're counting down to let countDownDate = new Date("february 28, 2022 23:59:59").getTime();// Update the count down every 1 second let x = setInterval(function() {// Get today's date and time let now = new Date().getTime();// Find the distance between now and the count down date let countDifference = countDownDate - now; let days = Math.floor(countDifference / (1000 * 60 * 60 * 24)); let hours = Math.floor((countDifference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); let minutes = Math.floor((countDifference % (1000 * 60 * 60)) / (1000 * 60)); let seconds = Math.floor((countDifference % (1000 * 60)) / 1000); document.getElementById("countDownTimer").innerHTML = "<div><span class='text'>" + days + "</span><div>Days</div></div><div><span class='text'>" + hours + "</span><div>Hours</div></div><div><span class='text'>" + minutes + "</span><div >Minutes</div></div><div><span class='text'>" + seconds + "</span><div>Seconds</div></div>"; if (countDifference < 0) { clearInterval(x); document.getElementById("countDownTimer").innerHTML = "<div><span class='text'>EXPIRED</span></div>"; } }, 1000); </script> TIA!
-
CSS to remove Facebook Icon from header navigation
gracemoore replied to gracemoore's topic in Customize with code
thatโs great - thanks so much! -
Site URL: http://www.gracemooreyoga.com What css can I use that will hide my Facebook icon from my navigation on mobile device (I only want Instagram to show here)? I have managed to hide it on desktop but it's still showing on mobile. TIA!
-
Site URL: https://www.gracemooreyoga.com/ I am trying to hide the arrows either side of the carousel (as shown on the attached image) but only on desktop and tablet devices, I want them to remain on mobile devices. Is there a CSS snippet that I can use to do this? Link to the page: https://www.gracemooreyoga.com/ Many thanks in advance! Grace
-
Remove the underlink from a link in the footer only
gracemoore replied to edmhawkins's topic in Customize with code
Thank you SO much for this! I have been trying so hard to figure out why this code was no longer working :-)